Tweaked FileBrowserContentPanel to allow better setting of nesting directory

packages/client-core/src/admin/components/Project/ProjectFilesDrawer.tsx

@@ -66,6 +66,7 @@ const ProjectFilesDrawer = ({ open, selectedProject, onClose }: Props) => {
               disableDnD
               selectedFile={selectedProject.name}
               onSelectionChanged={onSelectionChanged}
+              nestingDirectory={selectedProject.name}
             />
           </Box>
           <Box sx={{ flexGrow: 1 }}>

packages/client-core/src/admin/components/Recordings/RecordingsDrawer.tsx

@@ -73,6 +73,7 @@ const RecordingFilesDrawer = ({ open, onClose, selectedRecordingId }: Props) =>
                   selectedFile={selectedRecordingId}
                   onSelectionChanged={onSelectionChanged}
                   folderName="recordings"
+                  nestingDirectory={selectedRecordingId}
                 />
               )}
             </Box>

packages/editor/src/components/assets/FileBrowserContentPanel.tsx

@@ -119,6 +119,7 @@ type FileBrowserContentPanelProps = {
   disableDnD?: boolean
   selectedFile?: string
   folderName?: string
+  nestingDirectory?: string
 }
 
 type DnDFileType = {
@@ -153,7 +154,7 @@ const FileBrowserContentPanel: React.FC<FileBrowserContentPanelProps> = (props)
 
   const originalPath = `/${props.folderName || 'projects'}/${props.selectedFile ? props.selectedFile + '/' : ''}`
   const selectedDirectory = useHookstate(originalPath)
-  const nestingDirectory = useHookstate('projects')
+  const nestingDirectory = useHookstate(props.nestingDirectory || 'projects')
   const fileProperties = useHookstate<FileType | null>(null)
   const isLoading = useHookstate(true)
 
@@ -196,10 +197,6 @@ const FileBrowserContentPanel: React.FC<FileBrowserContentPanelProps> = (props)
     refreshDirectory()
   }, [selectedDirectory, activeScene])
 
-  useEffect(() => {
-    FileBrowserService.getNestingDirectory().then((directory) => nestingDirectory.set(directory))
-  }, [])
-
   const refreshDirectory = async () => {
     await FileBrowserService.fetchFiles(selectedDirectory.value, page)
   }
@@ -359,17 +356,13 @@ const FileBrowserContentPanel: React.FC<FileBrowserContentPanelProps> = (props)
       }
       changeDirectoryByPath(newPath)
     }
+    let breadcrumbDirectoryFiles = selectedDirectory.value.slice(1, -1).split('/')
 
-    let nestingDirectoryFiles = nestingDirectory.value.split('/')
-    let breadcrumbDirectoryFiles = selectedDirectory.value
-      .slice(1, -1)
-      .split('/')
-      .filter((file, idx) => {
-        if (idx < nestingDirectoryFiles.length && file === nestingDirectoryFiles[idx]) {
-          return false
-        }
-        return true
-      })
+    const nestedIndex = breadcrumbDirectoryFiles.indexOf(nestingDirectory.value)
+
+    breadcrumbDirectoryFiles = breadcrumbDirectoryFiles.filter((file, idx) => {
+      return idx >= nestedIndex
+    })
 
     return (
       <Breadcrumbs