From 994dd9929c89efde261c2d7c01a9a21f97355242 Mon Sep 17 00:00:00 2001
From: Braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Mon, 13 Dec 2021 16:16:49 +0100
Subject: [PATCH] feat(flow): export applychanges utilities separately

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>
---
 src/composables/useElementsState.ts | 18 +++++++++++-------
 src/types/flow.ts                   |  2 +-
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/composables/useElementsState.ts b/src/composables/useElementsState.ts
index 5bc563de..13fe06ee 100644
--- a/src/composables/useElementsState.ts
+++ b/src/composables/useElementsState.ts
@@ -58,14 +58,19 @@ const updateEdge = (edge: GraphEdge, newConnection: Connection, edges: GraphEdge
   return edge
 }
 
-const applyNodeChanges = (changes: NodeChange[], nodes: GraphNode[]) => applyChanges(changes, nodes)
-const applyEdgeChanges = (changes: EdgeChange[], edges: GraphEdge[]) => applyChanges(changes, edges)
+export const applyEdgeChanges = (changes: EdgeChange[]) => {
+  const { store } = useVueFlow()
+  applyChanges(changes, store.edges)
+}
+export const applyNodeChanges = (changes: NodeChange[]) => {
+  const { store } = useVueFlow()
+  applyChanges(changes, store.nodes)
+}
 
 export const useEdgesState = ({ edges, applyDefault }: UseEdgesStateOptions = { applyDefault: true }): UseEdgesState => {
   const { store } = useVueFlow()
-  const applyEdges = (changes: EdgeChange[]) => applyEdgeChanges(changes, store.edges)
   if (edges && edges.length) store.setEdges(edges)
-  if (applyDefault) store.hooksOn.OnEdgesChange((e) => applyEdges(e))
+  if (applyDefault) store.hooksOn.OnEdgesChange(applyEdgeChanges)
   return {
     edges: store.edges,
     setEdges: store.setEdges,
@@ -95,10 +100,9 @@ export const useEdgesState = ({ edges, applyDefault }: UseEdgesStateOptions = {
 }
 
 export const useNodesState = ({ nodes, applyDefault }: UseNodesStateOptions = { applyDefault: true }): UseNodesState => {
-  const { id, store } = useVueFlow()
-  const applyNodes = (changes: NodeChange[]) => applyNodeChanges(changes, store.nodes)
+  const { store } = useVueFlow()
   if (nodes && nodes.length) store.setNodes(nodes)
-  if (applyDefault) store.hooksOn.OnNodesChange((e) => applyNodes(e))
+  if (applyDefault) store.hooksOn.OnNodesChange(applyNodeChanges)
 
   return {
     nodes: store.nodes,
diff --git a/src/types/flow.ts b/src/types/flow.ts
index 1d89da7d..82e6df14 100644
--- a/src/types/flow.ts
+++ b/src/types/flow.ts
@@ -4,7 +4,7 @@ import { GraphNode, CoordinateExtent, Node } from './node'
 import { Connection, ConnectionLineType, ConnectionMode } from './connection'
 import { KeyCode, PanOnScrollMode, UseZoomPanHelper } from './zoom'
 import { FlowActions, FlowStore } from './store'
-import { EdgeChange, FlowHooksOn, NodeChange } from './hooks'
+import { FlowHooksOn } from './hooks'
 
 export type FlowElement<N = any, E = any> = GraphNode<N> | GraphEdge<E>
 export type FlowElements<N = any, E = any> = FlowElement<N, E>[]