refactor(svelte): simplify nodes and edges store handling

2023-06-06 14:27:40 +02:00
parent e0ccc0f980
commit 002156ea33
22 changed files with 779 additions and 737 deletions
@@ -0,0 +1,71 @@
+import type { SvelteFlowStore } from '$lib/store/types';
+import type { EdgeTypes, NodeTypes } from '$lib/types';
+import type { CoordinateExtent } from '@xyflow/system';
+import type { Writable } from 'svelte/store';
+
+// this is helper function for updating the store
+// for props where we need to call a specific store action
+export function updateStore(
+  store: SvelteFlowStore,
+  {
+    nodeTypes,
+    edgeTypes,
+    minZoom,
+    maxZoom,
+    translateExtent
+  }: {
+    nodeTypes?: NodeTypes;
+    edgeTypes?: EdgeTypes;
+    minZoom?: number;
+    maxZoom?: number;
+    translateExtent?: CoordinateExtent;
+  }
+) {
+  if (nodeTypes !== undefined) {
+    store.setNodeTypes(nodeTypes);
+  }
+
+  if (edgeTypes !== undefined) {
+    store.setEdgeTypes(edgeTypes);
+  }
+
+  if (minZoom !== undefined) {
+    store.setMinZoom(minZoom);
+  }
+
+  if (maxZoom !== undefined) {
+    store.setMaxZoom(maxZoom);
+  }
+
+  if (translateExtent !== undefined) {
+    store.setTranslateExtent(translateExtent);
+  }
+}
+
+const getKeys = <T extends object>(obj: T) => Object.keys(obj) as Array<keyof T>;
+
+type UnwrapWritable<T> = T extends Writable<infer U> ? U : T;
+
+// @todo there must be a better way to define the types here..
+export type UpdatableStoreProps = {
+  flowId?: UnwrapWritable<SvelteFlowStore['flowId']>;
+  connectionLineType?: UnwrapWritable<SvelteFlowStore['connectionLineType']>;
+  connectionRadius?: UnwrapWritable<SvelteFlowStore['connectionRadius']>;
+  selectionMode?: UnwrapWritable<SvelteFlowStore['selectionMode']>;
+  snapGrid?: UnwrapWritable<SvelteFlowStore['snapGrid']>;
+  defaultMarkerColor?: UnwrapWritable<SvelteFlowStore['defaultMarkerColor']>;
+  nodesDraggable?: UnwrapWritable<SvelteFlowStore['nodesDraggable']>;
+  nodesConnectable?: UnwrapWritable<SvelteFlowStore['nodesConnectable']>;
+  elementsSelectable?: UnwrapWritable<SvelteFlowStore['elementsSelectable']>;
+  isValidConnection?: UnwrapWritable<SvelteFlowStore['isValidConnection']>;
+};
+
+export function updateStoreByKeys(store: SvelteFlowStore, keys: UpdatableStoreProps) {
+  getKeys(keys).forEach((prop) => {
+    const update = keys[prop];
+    if (update !== undefined) {
+      // @ts-ignore
+      store[prop].set(update);
+    }
+  });
+}