From 5242c5e596d60b315f7278b9e0725ed0b0c5a0b4 Mon Sep 17 00:00:00 2001
From: Camiel van Schoonhoven <camiel.vanschoonhoven@shopify.com>
Date: Tue, 7 Oct 2025 16:04:03 -0700
Subject: [PATCH] Provide Node Manager

---
 src/providers/ComponentSpecProvider.tsx | 21 ++++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/src/providers/ComponentSpecProvider.tsx b/src/providers/ComponentSpecProvider.tsx
index 8048c1e30..02682662a 100644
--- a/src/providers/ComponentSpecProvider.tsx
+++ b/src/providers/ComponentSpecProvider.tsx
@@ -1,6 +1,14 @@
-import { type ReactNode, useCallback, useMemo, useRef, useState } from "react";
+import {
+  type ReactNode,
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 
 import { type UndoRedo, useUndoRedo } from "@/hooks/useUndoRedo";
+import { NodeManager } from "@/nodeManager";
 import { loadPipelineByName } from "@/services/pipelineService";
 import { USER_PIPELINES_LIST_NAME } from "@/utils/constants";
 import { prepareComponentRefForEditor } from "@/utils/prepareComponentRefForEditor";
@@ -56,6 +64,8 @@ interface ComponentSpecContextType {
   navigateBack: () => void;
   navigateToPath: (targetPath: string[]) => void;
   canNavigateBack: boolean;
+
+  nodeManager: NodeManager;
 }
 
 const ComponentSpecContext = createRequiredContext<ComponentSpecContextType>(
@@ -71,6 +81,7 @@ export const ComponentSpecProvider = ({
   readOnly?: boolean;
   children: ReactNode;
 }) => {
+  const [nodeManager] = useState(() => new NodeManager());
   const [componentSpec, setComponentSpec] = useState<ComponentSpec>(
     spec ?? EMPTY_GRAPH_COMPONENT_SPEC,
   );
@@ -214,6 +225,10 @@ export const ComponentSpecProvider = ({
 
   const canNavigateBack = currentSubgraphPath.length > 1;
 
+  useEffect(() => {
+    nodeManager.syncWithComponentSpec(componentSpec);
+  }, [componentSpec, nodeManager]);
+
   const value = useMemo(
     () => ({
       componentSpec,
@@ -237,6 +252,8 @@ export const ComponentSpecProvider = ({
       navigateBack,
       navigateToPath,
       canNavigateBack,
+
+      nodeManager,
     }),
     [
       componentSpec,
@@ -260,6 +277,8 @@ export const ComponentSpecProvider = ({
       navigateBack,
       navigateToPath,
       canNavigateBack,
+
+      nodeManager,
     ],
   );