Re-get the openPanes from localStorage when navigating between projects (#3241)

* Re-get the openPanes from localStorage when navigating between projects

* fmt

src/components/ModelingMachineProvider.tsx

@@ -1,5 +1,5 @@
 import { useMachine } from '@xstate/react'
-import React, { createContext, useEffect, useRef } from 'react'
+import React, { createContext, useEffect, useMemo, useRef } from 'react'
 import {
   AnyStateMachine,
   ContextFrom,
@@ -8,7 +8,12 @@ import {
   StateFrom,
   assign,
 } from 'xstate'
-import { SetSelections, modelingMachine } from 'machines/modelingMachine'
+import {
+  SetSelections,
+  getPersistedContext,
+  modelingMachine,
+  modelingMachineDefaultContext,
+} from 'machines/modelingMachine'
 import { useSetupEngineManager } from 'hooks/useSetupEngineManager'
 import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import {
@@ -99,6 +104,7 @@ export const ModelingMachineProvider = ({
   } = useSettingsAuthContext()
   const token = auth?.context?.token
   const streamRef = useRef<HTMLDivElement>(null)
+  const persistedContext = useMemo(() => getPersistedContext(), [])
 
   let [searchParams] = useSearchParams()
   const pool = searchParams.get('pool')
@@ -121,6 +127,13 @@ export const ModelingMachineProvider = ({
   const [modelingState, modelingSend, modelingActor] = useMachine(
     modelingMachine,
     {
+      context: {
+        ...modelingMachineDefaultContext,
+        store: {
+          ...modelingMachineDefaultContext.store,
+          ...persistedContext,
+        },
+      },
       actions: {
         'disable copilot': () => {
           editorManager.setCopilotEnabled(false)

src/machines/modelingMachine.ts

@@ -255,10 +255,39 @@ interface PersistedModelingContext {
 type PersistedKeys = keyof PersistedModelingContext
 export const PersistedValues: PersistedKeys[] = ['openPanes']
 
-const persistedContext: Partial<PersistedModelingContext> = (typeof window !==
+export const getPersistedContext = (): Partial<PersistedModelingContext> => {
-  'undefined' &&
+  const c = (typeof window !== 'undefined' &&
-  JSON.parse(localStorage.getItem(PERSIST_MODELING_CONTEXT) || '{}')) || {
+    JSON.parse(localStorage.getItem(PERSIST_MODELING_CONTEXT) || '{}')) || {
-  openPanes: ['code'],
+    openPanes: ['code'],
+  }
+  return c
+}
+
+export const modelingMachineDefaultContext = {
+  tool: null as Models['SceneToolType_type'] | null,
+  selection: [] as string[],
+  selectionRanges: {
+    otherSelections: [],
+    codeBasedSelections: [],
+  } as Selections,
+  sketchDetails: {
+    sketchPathToNode: [],
+    zAxis: [0, 0, 1],
+    yAxis: [0, 1, 0],
+    origin: [0, 0, 0],
+  } as null | SketchDetails,
+  sketchPlaneId: '' as string,
+  sketchEnginePathId: '' as string,
+  moveDescs: [] as MoveDesc[],
+  mouseState: { type: 'idle' } as MouseState,
+  segmentOverlays: {} as SegmentOverlays,
+  segmentHoverMap: {} as { [pathToNodeString: string]: number },
+  store: {
+    buttonDownInStream: undefined,
+    didDragInStream: false,
+    streamDimensions: { streamWidth: 1280, streamHeight: 720 },
+    openPanes: getPersistedContext().openPanes || ['code'],
+  } as Store,
 }
 
 export const modelingMachine = createMachine(
@@ -270,32 +299,7 @@ export const modelingMachine = createMachine(
     predictableActionArguments: true,
     preserveActionOrder: true,
 
-    context: {
+    context: modelingMachineDefaultContext,
-      tool: null as Models['SceneToolType_type'] | null,
-      selection: [] as string[],
-      selectionRanges: {
-        otherSelections: [],
-        codeBasedSelections: [],
-      } as Selections,
-      sketchDetails: {
-        sketchPathToNode: [],
-        zAxis: [0, 0, 1],
-        yAxis: [0, 1, 0],
-        origin: [0, 0, 0],
-      } as null | SketchDetails,
-      sketchPlaneId: '' as string,
-      sketchEnginePathId: '' as string,
-      moveDescs: [] as MoveDesc[],
-      mouseState: { type: 'idle' } as MouseState,
-      segmentOverlays: {} as SegmentOverlays,
-      segmentHoverMap: {} as { [pathToNodeString: string]: number },
-      store: {
-        buttonDownInStream: undefined,
-        didDragInStream: false,
-        streamDimensions: { streamWidth: 1280, streamHeight: 720 },
-        openPanes: persistedContext.openPanes || ['code'],
-      } as Store,
-    },
 
     schema: {
       events: {} as ModelingMachineEvent,