Merge branch '492-console-wide-account' of github.com:eth-cscs/firecrest-ui into 492-console-wide-account

Author: theely

app/modules/filesystem/components/dialogs/DownloadDialog.tsx

@@ -22,6 +22,7 @@ import { postLocalTransferDownload } from '~/apis/filesystem-api'
 interface DownloadDialogProps {
   system: string
   file: File
+  accountName: string
   currentPath?: string
   open: boolean
   onClose: () => void
@@ -30,6 +31,7 @@ interface DownloadDialogProps {
 const DownloadDialog: React.FC<DownloadDialogProps> = ({
   system,
   file,
+  accountName,
   currentPath = undefined,
   open,
   onClose,
@@ -40,7 +42,7 @@ const DownloadDialog: React.FC<DownloadDialogProps> = ({
   const [downloadError, setDownloadError] = useState<string | null>(null)
   const [loading, setLoading] = useState<boolean>(false)
   const [formValues, setFormValues] = useState({
-    account: '',
+    account: accountName,
   })
 
   useEffect(() => {
@@ -105,8 +107,10 @@ const DownloadDialog: React.FC<DownloadDialogProps> = ({
                   <input
                     type='text'
                     name='account'
+                    value={formValues.account}
                     onChange={(e) => setFormValues({ ...formValues, account: e.target.value })}
-                    className='flex-1 border-gray-300 focus:border-blue-300 focus:ring-blue-300 rounded-md border py-2 px-3 shadow-sm sm:text-sm focus:outline-none'
+                    disabled
+                    className='flex-1 border-gray-300 focus:border-blue-300 focus:ring-blue-300 rounded-md border py-2 px-3 shadow-sm sm:text-sm focus:outline-none disabled:bg-gray-100 disabled:text-gray-500 disabled:cursor-not-allowed'
                   />
                 </div>
               )}

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)
@@ -148,6 +154,7 @@ const FileItem: React.FC<FileItemProps> = ({ file, currentPath, fileSystem, syst
           system={system.name}
           file={file}
           currentPath={currentPath}
+          accountName={accountName}
           open={downloadkDialogOpen}
           onClose={() => setDownloadDialogOpen(false)}
         />
@@ -303,9 +310,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 +330,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 +507,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 +561,7 @@ interface FileSystemSelectionData {
   system: System
   systems: System[]
   username: string
+  accountName: string
 }
 
 const FileSystemSelection: React.FC<FileSystemSelectionData> = ({
@@ -548,11 +570,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 +641,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 +680,7 @@ const FileListTable: React.FC<FileListTableProps> = ({
                 currentPath={currentPath}
                 fileSystem={fileSystem}
                 system={system}
+                accountName={accountName}
               />
             ) : (
               <FileItem
@@ -663,6 +689,7 @@ const FileListTable: React.FC<FileListTableProps> = ({
                 currentPath={currentPath}
                 fileSystem={fileSystem}
                 system={system}
+                accountName={accountName}
               />
             ),
           )}
@@ -687,7 +714,7 @@ const FileTransferInfo: React.FC<any> = ({ file, uploadLimit }) => {
 }
 
 // TODO: Code refactoring and improvements (remove duplication, create ad-hoc components, ...)
-const FileUpload: React.FC<any> = ({ system, currentPath, fileUploadLimit }) => {
+const FileUpload: React.FC<any> = ({ system, currentPath, fileUploadLimit, accountName }) => {
   const [uploading, setUploading] = useState(false)
   const [fileToUploadSelected, setFileToUploadSelected] = useState<any | null>(null)
   const [fileTransferUploadResult, setFileTransferUploadResult] = useState<any | null>(null)
@@ -696,7 +723,7 @@ const FileUpload: React.FC<any> = ({ system, currentPath, fileUploadLimit }) =>
   const [uploadError, setUploadError] = useState<HttpErrorResponse | null>(null)
   const singleDraggableFileUploadRef = useRef<any>(null)
   const [formValues, setFormValues] = useState({
-    account: '',
+    account: accountName,
   })
 
   const isFileSizeOk = (file: any) => {
@@ -805,8 +832,9 @@ const FileUpload: React.FC<any> = ({ system, currentPath, fileUploadLimit }) =>
             type='text'
             name='account'
             value={formValues.account}
+            disabled
             onChange={(e) => setFormValues({ ...formValues, account: e.target.value })}
-            className='border-gray-300 focus:border-blue-300 focus:ring-blue-300 mt-1 block w-full rounded-md border py-2 px-3 shadow-sm sm:text-sm focus:outline-none'
+            className='border-gray-300 focus:border-blue-300 focus:ring-blue-300 mt-1 block w-full rounded-md border py-2 px-3 shadow-sm sm:text-sm focus:outline-none disabled:bg-gray-100 disabled:text-gray-500 disabled:cursor-not-allowed'
           />
           {/* {showInputValidation({
                   fieldName: 'name',
@@ -895,6 +923,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,19 +942,22 @@ 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
                 system={system}
                 currentPath={currentPath}
                 setLocalError={setLocalError}
                 fileUploadLimit={fileUploadLimit}
+                accountName={accountName}
               />
             )}
 
@@ -937,6 +970,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

app/modules/status/helpers/system-helper.ts

@@ -9,14 +9,54 @@ import _ from 'lodash'
 // types
 import { FileSystemDataType, FileSystem, System } from '~/types/api-status'
 
+type ResolvedFileSystem = {
+  fileSystem: FileSystem
+  path: string
+}
+
+export const getFileSystemByTargetPath = (
+  system: System,
+  targetPath: string | null | undefined,
+  username: string,
+): ResolvedFileSystem => {
+  if (!system) {
+    throw new Error('Filesystem(s) configuration error: system is missing')
+  }
+
+  // If no target path, resolve from default
+  if (targetPath == null || _.isEmpty(targetPath)) {
+    const fileSystem = getDefaultFileSystemFromSystem(system)
+
+    if (!fileSystem) {
+      throw new Error('Filesystem(s) configuration error: no default filesystem')
+    }
+
+    let path = fileSystem.path
+
+    if (fileSystem.defaultWorkDir) {
+      path = `${fileSystem.path}/${username}`
+    }
+
+    return { fileSystem, path }
+  }
+
+  // If target path is provided, search in the system
+  const fileSystem = searchFileSystemByPath(system.fileSystems, targetPath, false)
+
+  if (!fileSystem) {
+    throw new Error(`Filesystem(s) configuration error: no filesystem for path "${targetPath}"`)
+  }
+
+  return { fileSystem, path: targetPath }
+}
+
 export const searchSystemByName = (systems: System[], name: string, defaultValue: any = null) => {
   const system = systems.find((system: System) => {
     return system.name == name
   })
   return system || defaultValue
 }
 
-
 export const searchFileSystemByPath = (
   fileSystems: FileSystem[],
   path: string,
@@ -47,14 +87,14 @@ export const getDefaultFileSystemFromSystem = (system: System | null) => {
   if (system === null) {
     return null
   }
-  if (system.fileSystems.length == 0){
+  if (system.fileSystems.length == 0) {
     return null
   }
   const fileSystem = system.fileSystems.find((fileSystem: FileSystem) => {
     return fileSystem.defaultWorkDir == true
   })
-  if (fileSystem === null){
-     return system.fileSystems[0]
+  if (fileSystem === null) {
+    return system.fileSystems[0]
   }
   return fileSystem
 }