fix: more accurately recalculate focus stack

.changeset/breezy-lemons-deliver.md

@@ -0,0 +1,6 @@
+---
+"@hydrofoil/shaperone-playground": patch
+"@hydrofoil/shaperone-core": patch
+---
+
+Prevent breaking focus stack when resources are new pointers of same data

packages/core/models/forms/reducers/datasets.ts

@@ -67,15 +67,38 @@ export const setRootResource = formStateReducer(({ state, editors, multiEditors
     return
   }
 
-  draft.focusStack = [rootPointer]
   draft.resourceGraph = rootPointer.dataset
-  draft.focusNodes = {
-    [rootPointer.value]: initialiseFocusNode({
-      focusNode: rootPointer,
+
+  if (!state.focusStack.length || rootPointer.value !== draft.focusStack[0].value) {
+    draft.focusStack = [rootPointer]
+    draft.focusNodes = {
+      [rootPointer.value]: initialiseFocusNode({
+        focusNode: rootPointer,
+        editors,
+        multiEditors,
+        shapes: state.shapes,
+        shouldEnableEditorChoice: draft.shouldEnableEditorChoice,
+      }, state.focusNodes[rootPointer.value]),
+    }
+    return
+  }
+
+  const focusStack = []
+  const focusNodes: Record<string, FocusNodeState> = {}
+  for (const currentFocusNode of state.focusStack) {
+    const focusNode = rootPointer.node(currentFocusNode)
+    if (!focusNode.out().values) break
+
+    focusStack.push(focusNode)
+    focusNodes[focusNode.value] = initialiseFocusNode({
+      focusNode,
       editors,
       multiEditors,
       shapes: state.shapes,
       shouldEnableEditorChoice: draft.shouldEnableEditorChoice,
-    }, state.focusNodes[rootPointer.value]),
+    }, state.focusNodes[focusNode.value])
   }
+
+  draft.focusStack = focusStack
+  draft.focusNodes = focusNodes
 }))

packages/core/test/models/forms/reducers/datasets.test.ts

@@ -213,6 +213,25 @@ describe('core/models/forms/reducers/datasets', () => {
       expect(after).to.eq(before)
     })
 
+    it('does note replace stack if all resources exist in dataset', () => {
+      // given
+      const graph = cf({ dataset: $rdf.dataset() })
+      const { form, state: before } = testState()
+      const initialFoo = graph.node(ex.Foo)
+      const initialBar = graph.node(ex.Bar)
+      before.instances.get(form)!.focusStack = [initialFoo, initialBar]
+
+      // when
+      const newButSame = cf({ dataset: $rdf.dataset([...graph.dataset]) }).node(initialFoo)
+      const after = setRootResource(before, {
+        form,
+        rootPointer: newButSame,
+      })
+
+      // then
+      expect(after).to.eq(before)
+    })
+
     it('populates focus node state for root node', () => {
       // given
       const { form, state } = testState()

packages/wc/store.ts

@@ -29,11 +29,13 @@ export type Dispatch = StoreDispatch<typeof config>
 export type Store = ModelStore<Dispatch, State>
 
 export const store = (() => {
-  const store = createStore(config)
+  let debug = false
+  let store = createStore(config)
 
   return () => {
-    if (window.Shaperone?.DEBUG === true) {
-      return devtools(store)
+    if (window.Shaperone?.DEBUG === true && !debug) {
+      debug = true
+      store = devtools(store)
     }
 
     return store