From 4ab0bdcc9150b4f8e126bb096b5f0fd870bedeed Mon Sep 17 00:00:00 2001
From: Alexander Brown <448862+DrJKL@users.noreply.github.com>
Date: Mon, 26 Jan 2026 00:22:50 -0800
Subject: [PATCH] refactor(GraphCanvas): Phase 3 - code organization fixes

- Consolidate two Vue node lifecycle reset watchers into one
- Remove duplicate useVueFeatureFlags() call
- Cache store references at top level instead of calling inside callbacks

Amp-Thread-ID: https://ampcode.com/threads/T-019bf963-9130-77df-bacc-7d4b1c5cae31
Co-authored-by: Amp <amp@ampcode.com>
---
 src/components/graph/GraphCanvas.vue | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

diff --git a/src/components/graph/GraphCanvas.vue b/src/components/graph/GraphCanvas.vue
index 53494bcea..b73dabdae 100644
--- a/src/components/graph/GraphCanvas.vue
+++ b/src/components/graph/GraphCanvas.vue
@@ -223,13 +223,13 @@ const handleVueNodeLifecycleReset = async () => {
   }
 }
 
-watch(() => canvasStore.currentGraph, handleVueNodeLifecycleReset)
+const workflowStore = useWorkflowStore()
 
 watch(
-  () => canvasStore.isInSubgraph,
-  async (newValue, oldValue) => {
-    if (oldValue && !newValue) {
-      useWorkflowStore().updateActiveGraph()
+  () => [canvasStore.currentGraph, canvasStore.isInSubgraph] as const,
+  async ([_graph, isInSubgraph], [_prevGraph, wasInSubgraph]) => {
+    if (wasInSubgraph && !isInSubgraph) {
+      workflowStore.updateActiveGraph()
     }
     await handleVueNodeLifecycleReset()
   }
@@ -332,7 +332,6 @@ watch(
     [executionStore.nodeLocationProgressStates, canvasStore.canvas] as const,
   ([nodeLocationProgressStates, canvas]) => {
     if (!canvas?.graph) return
-    const workflowStore = useWorkflowStore()
     for (const node of canvas.graph.nodes) {
       const nodeLocatorId = workflowStore.nodeIdToNodeLocatorId(node.id)
       const progressState = nodeLocationProgressStates[nodeLocatorId]
@@ -399,6 +398,7 @@ useEventListener(
 
 const comfyAppReady = ref(false)
 const workflowPersistence = useWorkflowPersistence()
+const commandStore = useCommandStore()
 const { flags } = useFeatureFlags()
 // Set up invite loader during setup phase so useRoute/useRouter work correctly
 const inviteUrlLoader = isCloud ? useInviteUrlLoader() : null
@@ -408,7 +408,6 @@ useNodeBadge()
 
 useGlobalLitegraph()
 useContextMenuTranslation()
-useVueFeatureFlags()
 useCopy()
 usePaste()
 useWorkflowAutoSave()
@@ -427,16 +426,16 @@ watch(
       newUserService().initializeIfNewUser(settingStore)
     ])
     if (runId !== localeWatcherRunId) return
-    await useCommandStore().execute('Comfy.RefreshNodeDefinitions')
+    await commandStore.execute('Comfy.RefreshNodeDefinitions')
     if (runId !== localeWatcherRunId) return
     await useWorkflowService().reloadCurrentWorkflow()
   }
 )
 useEventListener(
-  () => useCanvasStore().canvas?.canvas,
+  () => canvasStore.canvas?.canvas,
   'litegraph:set-graph',
   () => {
-    useWorkflowStore().updateActiveGraph()
+    workflowStore.updateActiveGraph()
   }
 )