File manager navigation fixes

Author: Francesco Pagnamenta

app/modules/filesystem/components/views/FileListView.tsx

@@ -26,8 +26,8 @@ import {
   buildFileSystemSelection,
   buildFileSystemSelectionPath,
   splitFileSystemSelection,
-  buildFileSystemNavigationPath,
   buildBreadcrumbNavigation,
+  buildFileSystemNavigationPath,
 } from '~/modules/filesystem/helpers/filesystem-helper'
 import { formatDateTime } from '~/helpers/date-helper'
 import { FileTableSortableColumn } from '~/helpers/ui-table-helper'
@@ -62,7 +62,6 @@ import LoadingButton from '~/components/buttons/LoadingButton'
 import SimplePanel from '~/components/panels/SimplePanel'
 // views
 import SimpleView, { SimpleViewSize } from '~/components/views/SimpleView'
-import { showInputValidation } from '~/components/forms/validations/ValidationForm'
 
 const copyToClipboard = (file: File, fileSystem: FileSystem) => {
   const path = `${fileSystem.path}/${file.name}`
@@ -74,9 +73,16 @@ interface FileItemProps {
   currentPath: string
   fileSystem: FileSystem
   system: System
+  accountName: string
 }
 
-const FileItem: React.FC<FileItemProps> = ({ file, currentPath, fileSystem, system }) => {
+const FileItem: React.FC<FileItemProps> = ({
+  file,
+  currentPath,
+  fileSystem,
+  system,
+  accountName,
+}) => {
   const [changeOwnershipDialogOpen, setChangeOwnershipDialogOpen] = useState(false)
   const [changePermissionDialogDialogOpen, setChangePermissionDialogDialogOpen] = useState(false)
   const [checksumDialogOpen, setChecksumDialogOpen] = useState(false)
@@ -303,9 +309,16 @@ interface DirectoryItemProps {
   currentPath: string
   fileSystem: FileSystem
   system: System
+  accountName: string
 }
 
-const DirectoryItem: React.FC<DirectoryItemProps> = ({ file, currentPath, fileSystem, system }) => {
+const DirectoryItem: React.FC<DirectoryItemProps> = ({
+  file,
+  currentPath,
+  fileSystem,
+  system,
+  accountName,
+}) => {
   const [changeOwnershipDialogOpen, setChangeOwnershipDialogOpen] = useState(false)
   const [changePermissionDialogDialogOpen, setChangePermissionDialogDialogOpen] = useState(false)
   const [copyDialogOpen, setCopyDialogOpen] = useState(false)
@@ -316,7 +329,7 @@ const DirectoryItem: React.FC<DirectoryItemProps> = ({ file, currentPath, fileSy
   const [removeDialogOpen, setRemoveDialogOpen] = useState(false)
   const { name } = file
 
-  const navigationPath = buildFileSystemNavigationPath(system.name, currentPath, name)
+  const navigationPath = buildFileSystemNavigationPath(system.name, currentPath, accountName, name)
   return (
     <tr className='even:bg-blue-50'>
       <td className='px-4 py-3 font-medium'>
@@ -493,14 +506,21 @@ interface BreadcrumbNavigationProps {
   currentPath: string
   system: System
   fileSystem: FileSystem
+  accountName: string
 }
 
 const BreadcrumbNavigation: React.FC<BreadcrumbNavigationProps> = ({
   currentPath,
   system,
   fileSystem,
+  accountName,
 }) => {
-  const navigationData = buildBreadcrumbNavigation(currentPath, fileSystem.path, system.name)
+  const navigationData = buildBreadcrumbNavigation(
+    currentPath,
+    fileSystem.path,
+    system.name,
+    accountName,
+  )
   return (
     <>
       <nav className='flex rounded-md p-2 mb-4 border border-gray-200' aria-label='Breadcrumb'>
@@ -540,6 +560,7 @@ interface FileSystemSelectionData {
   system: System
   systems: System[]
   username: string
+  accountName: string
 }
 
 const FileSystemSelection: React.FC<FileSystemSelectionData> = ({
@@ -548,11 +569,12 @@ const FileSystemSelection: React.FC<FileSystemSelectionData> = ({
   system,
   systems,
   username,
+  accountName,
 }) => {
   const onChangeHandler = (event: any) => {
     const selectedValue = event.target.value
     const { systemName, fileSystemPath } = splitFileSystemSelection(selectedValue)
-    const newNavigationPath = buildFileSystemNavigationPath(systemName, fileSystemPath)
+    const newNavigationPath = buildFileSystemNavigationPath(systemName, fileSystemPath, accountName)
     window.location.href = newNavigationPath
   }
 
@@ -618,13 +640,15 @@ interface FileListTableProps {
   currentPath: string
   fileSystem: FileSystem
   system: System
+  accountName: string
 }
 
 const FileListTable: React.FC<FileListTableProps> = ({
   files,
   currentPath,
   fileSystem,
   system,
+  accountName,
 }) => {
   const [sortableColumns, setSortableColumns] = useState<FileTableSortableColumn[]>([])
   const [fileSystemList, setFileSystemList] = useState<any[]>([])
@@ -655,6 +679,7 @@ const FileListTable: React.FC<FileListTableProps> = ({
                 currentPath={currentPath}
                 fileSystem={fileSystem}
                 system={system}
+                accountName={accountName}
               />
             ) : (
               <FileItem
@@ -663,6 +688,7 @@ const FileListTable: React.FC<FileListTableProps> = ({
                 currentPath={currentPath}
                 fileSystem={fileSystem}
                 system={system}
+                accountName={accountName}
               />
             ),
           )}
@@ -895,6 +921,8 @@ const FileListView: React.FC<FileListViewProps> = ({
     </div>
   )
 
+  console.log('Account Name:', accountName)
+
   return (
     <SimpleView title='File Manager' size={SimpleViewSize.FULL}>
       <SimplePanel title={'Filesystem'} className='mb-[330px]' actionsButtons={actionsButtons}>
@@ -912,12 +940,14 @@ const FileListView: React.FC<FileListViewProps> = ({
                 system={system}
                 systems={systems}
                 username={username}
+                accountName={accountName}
               />
             </div>
             <BreadcrumbNavigation
               currentPath={currentPath}
               system={system}
               fileSystem={fileSystem}
+              accountName={accountName}
             />
             {remoteFsError == null && (
               <FileUpload
@@ -937,6 +967,7 @@ const FileListView: React.FC<FileListViewProps> = ({
                 currentPath={currentPath}
                 fileSystem={fileSystem}
                 system={system}
+                accountName={accountName}
               />
             )}
             {!fileList ||

app/modules/filesystem/helpers/filesystem-helper.ts

@@ -39,18 +39,20 @@ export const buildFileSystemSelectionPath = (fileSystem: FileSystem, username: s
 export const buildFileSystemNavigationPath = (
   systemName: string,
   currentPath: string,
+  accountName: string,
   additionalPath: string | null = null,
 ) => {
   if (additionalPath === null || _.isEmpty(additionalPath)) {
-    return `/filesystems/${systemName}/?targetPath=${currentPath}`
+    return `/filesystems/systems/${systemName}/accounts/${accountName}/?targetPath=${currentPath}`
   }
-  return `/filesystems/${systemName}/?targetPath=${currentPath}/${additionalPath}`
+  return `/filesystems/systems/${systemName}/accounts/${accountName}/?targetPath=${currentPath}/${additionalPath}`
 }
 
 export const buildBreadcrumbNavigation = (
   currentPath: string,
   fileSystemPath: string,
   systemName: string,
+  accountName: string,
 ) => {
   if (!currentPath || currentPath.trim() === '') {
     return []
@@ -64,7 +66,7 @@ export const buildBreadcrumbNavigation = (
       dirName: pathSegment,
       path: path,
       isBasePath: path === fileSystemPath,
-      navUrl: buildFileSystemNavigationPath(systemName, path),
+      navUrl: buildFileSystemNavigationPath(systemName, path, accountName),
     })
   })
   return navigationStructure