From a87fe56d530a6fe73c8452321e034291170267e3 Mon Sep 17 00:00:00 2001
From: John Doe <antpalmolive@gmail.com>
Date: Wed, 25 Mar 2026 22:33:07 -0400
Subject: [PATCH] fix: clear collections in setScene and apply cloned
 collections in test button

- setScene now clears collections to avoid stale references
- Test clone button applies cloned collections after setScene

Co-authored-by: factory-droid[bot] <138933559+factory-droid[bot]@users.noreply.github.com>
---
 packages/core/src/store/use-scene.ts          |  1 +
 .../sidebar/panels/settings-panel/index.tsx   | 32 +++++++++++++++++--
 2 files changed, 31 insertions(+), 2 deletions(-)

diff --git a/packages/core/src/store/use-scene.ts b/packages/core/src/store/use-scene.ts
index e3773a59..2810db32 100644
--- a/packages/core/src/store/use-scene.ts
+++ b/packages/core/src/store/use-scene.ts
@@ -136,6 +136,7 @@ const useScene: UseSceneStore = create<SceneState>()(
           nodes: patchedNodes,
           rootNodeIds,
           dirtyNodes: new Set<AnyNodeId>(),
+          collections: {},
         })
         // Mark all nodes as dirty to trigger re-validation
         Object.values(patchedNodes).forEach((node) => {
diff --git a/packages/editor/src/components/ui/sidebar/panels/settings-panel/index.tsx b/packages/editor/src/components/ui/sidebar/panels/settings-panel/index.tsx
index 60151896..59cb8e16 100644
--- a/packages/editor/src/components/ui/sidebar/panels/settings-panel/index.tsx
+++ b/packages/editor/src/components/ui/sidebar/panels/settings-panel/index.tsx
@@ -1,7 +1,7 @@
-import { emitter, useScene } from '@pascal-app/core'
+import { cloneSceneGraph, emitter, useScene } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
 import { TreeView, VisualJson } from '@visual-json/react'
-import { Camera, Download, Save, Trash2, Upload } from 'lucide-react'
+import { Camera, Copy, Download, Save, Trash2, Upload } from 'lucide-react'
 import {
   type KeyboardEvent,
   type SyntheticEvent,
@@ -250,6 +250,29 @@ export function SettingsPanel({
     setPhase('site')
   }
 
+  const handleTestClone = () => {
+    const collections = useScene.getState().collections
+    const sceneGraph = { nodes, rootNodeIds, ...(collections && { collections }) }
+    const cloned = cloneSceneGraph(sceneGraph)
+
+    // Show before/after comparison
+    const oldIds = Object.keys(nodes).slice(0, 5)
+    const newIds = Object.keys(cloned.nodes).slice(0, 5)
+    const comparison = oldIds.map((oldId, i) => `${oldId} → ${newIds[i]}`).join('\n')
+
+    // Apply cloned scene (setScene clears collections, so apply them after)
+    setScene(cloned.nodes, cloned.rootNodeIds)
+    if (cloned.collections) {
+      useScene.setState({ collections: cloned.collections })
+    }
+    resetSelection()
+    setPhase('site')
+
+    alert(
+      `Scene cloned successfully!\n\nNode count: ${Object.keys(nodes).length} → ${Object.keys(cloned.nodes).length}\n\nSample ID mapping:\n${comparison}\n\nCheck the Scene Graph explorer to verify new IDs.`
+    )
+  }
+
   const handleGenerateThumbnail = () => {
     if (!projectId) return
     setIsGeneratingThumbnail(true)
@@ -358,6 +381,11 @@ export function SettingsPanel({
           Load Build
         </Button>
 
+        <Button className="w-full justify-start gap-2" onClick={handleTestClone} variant="outline">
+          <Copy className="size-4" />
+          Test Clone Scene
+        </Button>
+
         <input
           accept="application/json"
           className="hidden"