update resources

src/pages/file/edit/List.tsx

@@ -12,9 +12,10 @@ import UploadOutlined from '@ant-design/icons/lib/icons/UploadOutlined';
 import { Tooltip } from '@mui/material';
 import { useResourceFileStore } from '@kevisual/resources/pages/store/resource-file.ts';
 import { FileDrawerApp } from '@kevisual/resources/pages/file/draw/FileDrawer.tsx';
-import { RefreshCw, Upload } from 'lucide-react';
+import { Delete, FolderPlus, RefreshCw, Trash, Upload } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { UploadButton } from '@kevisual/resources/pages/upload/index.tsx';
+import { DialogDirectory, DialogDeleteDirectory } from '@kevisual/resources/pages/upload/DialogDirectory.tsx';
 export const CardPath = ({ children }: any) => {
   const userAppStore = useFileStore(
     useShallow((state) => {
@@ -26,6 +27,8 @@ export const CardPath = ({ children }: any) => {
       };
     }),
   );
+  const [dialogDirectory, setDialogDirectory] = useState(false);
+  const [dialogDeleteDirectory, setDialogDeleteDirectory] = useState(false);
   const paths = ['root', ...userAppStore.path.split('/').filter((item) => item)];
   const onDirectoryClick = (prefix: string) => {
     if (prefix === 'root') {
@@ -38,13 +41,14 @@ export const CardPath = ({ children }: any) => {
   };
   const { t } = useTranslation();
 
-  const [usrname, appKey, version] = paths;
+  const [_username, appKey, version, ...directory] = paths;
   const onUloadFinish = (res: any) => {
     console.log(res);
     userAppStore.getList();
   };
+  const directoryPath = directory.join('/');
   return (
-    <div className='border border-gray-200 rounded'>
+    <div className='border border-gray-200 rounded h-full overflow-hidden'>
       <div className='p-2'>
         <div className='flex flex-col'>
           <div className='flex justify-between'>
@@ -78,25 +82,81 @@ export const CardPath = ({ children }: any) => {
                   <RefreshCw />
                 </IconButton>
               </Tooltip>
+              {version && (
+                <>
+                  <Tooltip title={t('create_directory')} placement='bottom'>
+                    <IconButton color='primary' onClick={() => setDialogDirectory(true)}>
+                      <FolderPlus />
+                    </IconButton>
+                  </Tooltip>
+                  <DialogDirectory
+                    open={dialogDirectory}
+                    onClose={() => setDialogDirectory(false)}
+                    onSuccess={(newPrefix) => {
+                      const currentPath = appKey + '/' + version + '/' + newPrefix;
+                      onDirectoryClick(currentPath);
+                      setDialogDirectory(false);
+                    }}
+                    prefix={directoryPath}
+                    opts={{
+                      appKey,
+                      version,
+                    }}
+                  />
+                </>
+              )}
               {version && (
                 <>
                   <Tooltip title={t('uploadDirectory')} placement='bottom'>
                     <IconButton color='primary'>
-                      <UploadButton onlyIcon uploadDirectory icon={<Upload />} appKey={appKey} version={version} username={usrname} onUpload={onUloadFinish} />
+                      <UploadButton
+                        onlyIcon
+                        uploadDirectory
+                        icon={<Upload />}
+                        directory={directoryPath}
+                        appKey={appKey}
+                        version={version}
+                        onUpload={onUloadFinish}
+                      />
                     </IconButton>
                   </Tooltip>
                   <Tooltip title={t('upload')} placement='bottom'>
                     <IconButton color='primary'>
-                      <UploadButton onlyIcon appKey={appKey} version={version} username={usrname} onUpload={onUloadFinish} />
+                      <UploadButton onlyIcon appKey={appKey} version={version} directory={directoryPath} onUpload={onUloadFinish} />
                     </IconButton>
                   </Tooltip>
                 </>
               )}
+              {version && directoryPath && (
+                <>
+                  <Tooltip title={t('deleteDirectory')} placement='bottom'>
+                    <IconButton
+                      color='primary'
+                      onClick={() => {
+                        setDialogDeleteDirectory(true);
+                      }}>
+                      <Trash />
+                    </IconButton>
+                  </Tooltip>
+                  <DialogDeleteDirectory
+                    open={dialogDeleteDirectory}
+                    onClose={() => setDialogDeleteDirectory(false)}
+                    onSuccess={(prefix) => {
+                      const newPrefix = prefix.split('/').slice(0, -1).join('/');
+                      setDialogDeleteDirectory(false);
+                      onDirectoryClick(newPrefix);
+                    }}
+                    prefix={appKey + '/' + version + '/' + directoryPath}
+                  />
+                </>
+              )}
             </div>
           </div>
         </div>
       </div>
-      <div className=''>{children}</div>
+      <div className='scrollbar' style={{ height: 'calc(100% - 20px)' }}>
+        {children}
+      </div>
     </div>
   );
 };