fix: skeleton logic for react? going to move it from a string to obj.string

src/Router.tsx

@@ -63,6 +63,7 @@ const router = createRouter([
               <KclContextProvider>
                 <AppStateProvider>
                   <MachineManagerProvider>
+                    <SystemIOMachineLogicListener />
                     <Outlet />
                   </MachineManagerProvider>
                 </AppStateProvider>
@@ -144,7 +145,6 @@ const router = createRouter([
         path: PATHS.HOME,
         element: (
           <Auth>
-            <SystemIOMachineLogicListener />
             <Outlet />
             <Home />
             <CommandBar />

src/components/Providers/SystemIOProviderDesktop.tsx

@@ -5,18 +5,26 @@ import { useEffect } from 'react'
 import { useNavigate } from 'react-router-dom'
 import {
   NO_PROJECT_DIRECTORY,
+  SystemIOMachineEvents
 } from '@src/machines/systemIO/utils'
-export const useAuthState = () => useSelector(systemIOActor, (state) => state)
+export const useRequestedProjectName = () => useSelector(systemIOActor, (state) => state.context.requestedProjectName)
+export const useProjectDirectoryPath = () => useSelector(systemIOActor, (state) => state.context.projectDirectoryPath)
 
 
 export function SystemIOMachineLogicListener() {
-  const state = useAuthState()
+  const requestedProjectName = useRequestedProjectName()
+  const projectDirectoryPath = useProjectDirectoryPath()
+  const navigate = useNavigate()
   useEffect(() => {
-    /* const requestedPath = `${PATHS.FILE}/${encodeURIComponent(
-     *  requestedProjectName
+    // TODO: use a {requestedProjectName: string} to by pass this clear logic...
+    if (!requestedProjectName) {return}
+    let projectPathWithoutSpecificKCLFile =
+      projectDirectoryPath + window.electron.path.sep + requestedProjectName
+    const requestedPath = `${PATHS.FILE}/${encodeURIComponent(
+projectPathWithoutSpecificKCLFile
        )}`
-     *       navigate(requestedPath) */
-    console.log(state)
-  }, [state])
+    navigate(requestedPath)
+    systemIOActor.send({type:SystemIOMachineEvents.clearRequestedProjectName})
+  }, [requestedProjectName])
   return null
 }

src/machines/systemIO/systemIOMachine.ts

@@ -37,6 +37,9 @@ export const systemIOMachine = setup({
       | {
           type: SystemIOMachineEvents.openProject
           data: { requestedProjectName: string }
+      }
+      | {
+          type: SystemIOMachineEvents.clearRequestedProjectName
         },
   },
   actions: {
@@ -58,10 +61,15 @@ export const systemIOMachine = setup({
     [SystemIOMachineActions.setRequestedProjectName]: assign({
       requestedProjectName: ({ event }) => {
         assertEvent(event, SystemIOMachineEvents.openProject)
-        console.log('event', event.data.requestedProjectName)
         return event.data.requestedProjectName
       },
     }),
+    [SystemIOMachineActions.clearRequestedProjectName]: assign({
+      requestedProjectName: ({ event }) => {
+        assertEvent(event, SystemIOMachineEvents.clearRequestedProjectName)
+        return NO_PROJECT_DIRECTORY
+      },
+    }),
   },
   actors: {
     [SystemIOMachineActors.readFoldersFromProjectDirectory]: fromPromise(
@@ -115,6 +123,12 @@ export const systemIOMachine = setup({
       },
     },
     [SystemIOMachineStates.openingProject] : {
+      on: {
+        [SystemIOMachineEvents.clearRequestedProjectName]: {
+          target: SystemIOMachineStates.idle,
+          actions: [SystemIOMachineActions.clearRequestedProjectName],
+        },
+      }
     }
   },
 })

src/machines/systemIO/utils.ts

@@ -20,12 +20,14 @@ export enum SystemIOMachineEvents {
     'read folders from project directory',
   setProjectDirectoryPath = 'set project directory path',
   openProject = 'open project',
+  clearRequestedProjectName = 'clear requested project name',
 }
 
 export enum SystemIOMachineActions {
   setFolders = 'set folders',
   setProjectDirectoryPath = 'set project directory path',
   setRequestedProjectName = 'set requested project name',
+  clearRequestedProjectName = 'clear requested project name'
 }
 
 export const NO_PROJECT_DIRECTORY = ''