refactor(core): remove hidden check from getNodes & getEdges

This commit is contained in:
braks
2024-06-05 10:03:44 +02:00
committed by Braks
parent 5e9db1c87f
commit cc0b8b69a3
2 changed files with 17 additions and 37 deletions

View File

@@ -7,8 +7,16 @@ import { useVueFlow } from '../../composables'
import { ErrorCode, VueFlowError } from '../../utils'
import { useNodesInitialized } from '../../composables/useNodesInitialized'
const { nodes, nodesDraggable, nodesFocusable, elementsSelectable, nodesConnectable, getNodeTypes, updateNodeDimensions, emits } =
useVueFlow()
const {
getNodes,
nodesDraggable,
nodesFocusable,
elementsSelectable,
nodesConnectable,
getNodeTypes,
updateNodeDimensions,
emits,
} = useVueFlow()
const nodesInitialized = useNodesInitialized()
@@ -23,7 +31,7 @@ watch(
(initialized) => {
if (initialized) {
nextTick(() => {
emits.nodesInitialized(nodes.value)
emits.nodesInitialized(getNodes.value)
})
}
},
@@ -101,7 +109,7 @@ export default {
<div class="vue-flow__nodes vue-flow__container">
<template v-if="resizeObserver">
<NodeWrapper
v-for="node of nodes"
v-for="node of getNodes"
:id="node.id"
:key="node.id"
:resize-observer="resizeObserver"

View File

@@ -1,7 +1,7 @@
import type { ComputedRef } from 'vue'
import { computed } from 'vue'
import type { ComputedGetters, GraphEdge, GraphNode, State } from '../types'
import { ErrorCode, VueFlowError, getNodesInside, isEdgeVisible } from '../utils'
import { getNodesInside, isEdgeVisible } from '../utils'
import { defaultEdgeTypes, defaultNodeTypes } from '../utils/defaultNodesEdges'
export function useGetters(state: State, nodeIds: ComputedRef<string[]>, edgeIds: ComputedRef<string[]>): ComputedGetters {
@@ -58,17 +58,9 @@ export function useGetters(state: State, nodeIds: ComputedRef<string[]>, edgeIds
})
const getNodes: ComputedGetters['getNodes'] = computed(() => {
const nodes: GraphNode[] = []
for (const node of state.nodes) {
if (!node.hidden) {
nodes.push(node)
}
}
if (state.onlyRenderVisibleElements) {
return getNodesInside(
nodes,
state.nodes,
{
x: 0,
y: 0,
@@ -80,34 +72,14 @@ export function useGetters(state: State, nodeIds: ComputedRef<string[]>, edgeIds
)
}
return nodes
return state.nodes
})
const edgeVisible = (e: GraphEdge, source?: GraphNode, target?: GraphNode) => {
source = source ?? getNode.value(e.source)
target = target ?? getNode.value(e.target)
if (!source || !target) {
state.hooks.error.trigger(new VueFlowError(ErrorCode.EDGE_ORPHANED, e.id))
return
}
return !e.hidden && !target.hidden && !source.hidden
}
const getEdges: ComputedGetters['getEdges'] = computed(() => {
const edges: GraphEdge[] = []
for (const edge of state.edges) {
if (edgeVisible(edge)) {
edges.push(edge)
}
}
if (state.onlyRenderVisibleElements) {
const visibleEdges: GraphEdge[] = []
for (const edge of edges) {
for (const edge of state.edges) {
const source = getNode.value(edge.source)!
const target = getNode.value(edge.target)!
@@ -131,7 +103,7 @@ export function useGetters(state: State, nodeIds: ComputedRef<string[]>, edgeIds
return visibleEdges
}
return edges
return state.edges
})
const getElements: ComputedGetters['getElements'] = computed(() => [...getNodes.value, ...getEdges.value])