refactor(react/svelte): use nodeLookup

This commit is contained in:
moklick
2023-11-14 15:52:48 +01:00
parent a147a20f6e
commit e798e94275
33 changed files with 166 additions and 127 deletions
@@ -56,15 +56,15 @@ export function getDerivedConnectionProps(
currentConnection,
store.connectionLineType,
store.connectionMode,
store.nodesLookup,
store.nodeLookup,
store.viewport
],
([connection, connectionLineType, connectionMode, nodesLookup, viewport]) => {
([connection, connectionLineType, connectionMode, nodeLookup, viewport]) => {
if (!connection.connectionStartHandle?.nodeId) {
return initConnectionProps;
}
const fromNode = nodesLookup.get(connection.connectionStartHandle?.nodeId);
const fromNode = nodeLookup.get(connection.connectionStartHandle?.nodeId);
const fromHandleBounds = fromNode?.[internalsSymbol]?.handleBounds;
const handleBoundsStrict =
fromHandleBounds?.[connection.connectionStartHandle.type || 'source'] || [];
+9 -9
View File
@@ -9,18 +9,18 @@ export function getEdgeTree(store: SvelteFlowStoreState) {
[
store.edges,
store.nodes,
store.nodesLookup,
store.nodeLookup,
store.onlyRenderVisibleElements,
store.viewport,
store.width,
store.height
],
([edges, , nodesLookup, onlyRenderVisibleElements, viewport, width, height]) => {
([edges, , nodeLookup, onlyRenderVisibleElements, viewport, width, height]) => {
const visibleEdges =
onlyRenderVisibleElements && width && height
? edges.filter((edge) => {
const sourceNode = nodesLookup.get(edge.source);
const targetNode = nodesLookup.get(edge.target);
const sourceNode = nodeLookup.get(edge.source);
const targetNode = nodeLookup.get(edge.target);
return (
sourceNode &&
@@ -41,11 +41,11 @@ export function getEdgeTree(store: SvelteFlowStoreState) {
);
return derived(
[visibleEdges, store.nodes, store.nodesLookup, store.connectionMode, store.onError],
([visibleEdges, , nodesLookup, connectionMode, onError]) => {
[visibleEdges, store.nodes, store.nodeLookup, store.connectionMode, store.onError],
([visibleEdges, , nodeLookup, connectionMode, onError]) => {
const layoutedEdges = visibleEdges.reduce<EdgeLayouted[]>((res, edge) => {
const sourceNode = nodesLookup.get(edge.source);
const targetNode = nodesLookup.get(edge.target);
const sourceNode = nodeLookup.get(edge.source);
const targetNode = nodeLookup.get(edge.target);
if (!sourceNode || !targetNode) {
return res;
@@ -71,7 +71,7 @@ export function getEdgeTree(store: SvelteFlowStoreState) {
return res;
}, []);
const groupedEdges = groupEdgesByZLevel<EdgeLayouted>(layoutedEdges, nodesLookup, false);
const groupedEdges = groupEdgesByZLevel<EdgeLayouted>(layoutedEdges, nodeLookup, false);
return groupedEdges;
}
+1 -1
View File
@@ -90,7 +90,7 @@ export function createStore({
const nextNodes = updateNodeDimensionsSystem(
updates,
get(store.nodes),
get(store.nodesLookup),
get(store.nodeLookup),
get(store.domNode),
get(store.nodeOrigin)
);
@@ -59,8 +59,8 @@ export const getInitialStore = ({
height?: number;
fitView?: boolean;
}) => {
const nodesLookup = new Map<string, Node>();
const nextNodes = updateNodes(nodes, nodesLookup, {
const nodeLookup = new Map<string, Node>();
const nextNodes = updateNodes(nodes, nodeLookup, {
nodeOrigin: [0, 0],
elevateNodesOnSelect: false
});
@@ -79,8 +79,8 @@ export const getInitialStore = ({
return {
flowId: writable<string | null>(null),
nodes: createNodesStore(nextNodes, nodesLookup),
nodesLookup: readable<Map<string, Node>>(nodesLookup),
nodes: createNodesStore(nextNodes, nodeLookup),
nodeLookup: readable<Map<string, Node>>(nodeLookup),
visibleNodes: readable<Node[]>([]),
edges: createEdgesStore(edges),
edgeTree: readable<GroupedEdges<EdgeLayouted>[]>([]),
+2 -2
View File
@@ -112,7 +112,7 @@ export type NodeStoreOptions = {
// The user only passes in relative positions, so we need to calculate the absolute positions based on the parent nodes.
export const createNodesStore = (
nodes: Node[],
nodesLookup: Map<string, Node>
nodeLookup: Map<string, Node>
): {
subscribe: (this: void, run: Subscriber<Node[]>) => Unsubscriber;
update: (this: void, updater: Updater<Node[]>) => void;
@@ -126,7 +126,7 @@ export const createNodesStore = (
let elevateNodesOnSelect = true;
const _set = (nds: Node[]): Node[] => {
const nextNodes = updateNodes(nds, nodesLookup, {
const nextNodes = updateNodes(nds, nodeLookup, {
elevateNodesOnSelect,
defaults
});