Handle new file rename/move API

resources/scripts/api/server/files/renameFiles.ts

@@ -1,16 +1,13 @@
 import http from '@/api/http';
 
 interface Data {
-    renameFrom: string;
+    to: string;
-    renameTo: string;
+    from: string;
 }
 
 export default (uuid: string, directory: string, files: Data[]): Promise<void> => {
     return new Promise((resolve, reject) => {
-        http.put(`/api/client/servers/${uuid}/files/rename`, {
+        http.put(`/api/client/servers/${uuid}/files/rename`, { root: directory, files })
-            root: directory,
-            files: files.map(f => ({ from: f.renameFrom, to: f.renameTo })),
-        })
             .then(() => resolve())
             .catch(reject);
     });

resources/scripts/components/server/files/FileDropdownMenu.tsx

@@ -117,7 +117,7 @@ export default ({ file }: { file: FileObject }) => {
                 <div css={tw`p-3 hover:text-white`} onClick={onClick}>
                     <FontAwesomeIcon icon={faEllipsisH}/>
                     <RenameFileModal
-                        file={file}
+                        files={[ file.name ]}
                         visible={!!modal}
                         useMoveTerminology={modal === 'move'}
                         onDismissed={() => setModal(null)}

resources/scripts/components/server/files/RenameFileModal.tsx

@@ -5,7 +5,6 @@ import Field from '@/components/elements/Field';
 import { join } from 'path';
 import renameFiles from '@/api/server/files/renameFiles';
 import { ServerContext } from '@/state/server';
-import { FileObject } from '@/api/server/files/loadDirectory';
 import tw from 'twin.macro';
 import Button from '@/components/elements/Button';
 import useServer from '@/plugins/useServer';
@@ -16,9 +15,9 @@ interface FormikValues {
     name: string;
 }
 
-type Props = RequiredModalProps & { file: FileObject; useMoveTerminology?: boolean };
+type Props = RequiredModalProps & { files: string[]; useMoveTerminology?: boolean };
 
-export default ({ file, useMoveTerminology, ...props }: Props) => {
+export default ({ files, useMoveTerminology, ...props }: Props) => {
     const { uuid } = useServer();
     const { mutate } = useFileManagerSwr();
     const { clearFlashes, clearAndAddHttpError } = useFlash();
@@ -28,18 +27,24 @@ export default ({ file, useMoveTerminology, ...props }: Props) => {
         clearFlashes('files');
 
         const len = name.split('/').length;
-        if (!useMoveTerminology && len === 1) {
+        if (files.length === 1) {
-            // Rename the file within this directory.
+            if (!useMoveTerminology && len === 1) {
-            mutate(files => files.map(f => f.uuid === file.uuid ? { ...f, name } : f), false);
+                // Rename the file within this directory.
-        } else if ((useMoveTerminology || len > 1) && file.uuid.length) {
+                mutate(data => data.map(f => f.name === files[0] ? { ...f, name } : f), false);
-            // Remove the file from this directory since they moved it elsewhere.
+            } else if ((useMoveTerminology || len > 1)) {
-            mutate(files => files.filter(f => f.uuid !== file.uuid), false);
+                // Remove the file from this directory since they moved it elsewhere.
+                mutate(data => data.filter(f => f.name !== files[0]), false);
+            }
         }
 
-        const renameFrom = join(directory, file.name);
+        let data;
-        const renameTo = join(directory, name);
+        if (useMoveTerminology && files.length > 1) {
+            data = files.map(f => ({ from: f, to: join(name, f) }));
+        } else {
+            data = files.map(f => ({ from: f, to: name }));
+        }
 
-        renameFiles(uuid, directory, [ { renameFrom, renameTo } ])
+        renameFiles(uuid, directory, data)
             .then(() => props.onDismissed())
             .catch(error => {
                 mutate();
@@ -49,7 +54,7 @@ export default ({ file, useMoveTerminology, ...props }: Props) => {
     };
 
     return (
-        <Formik onSubmit={submit} initialValues={{ name: file.name }}>
+        <Formik onSubmit={submit} initialValues={{ name: files.length > 1 ? '' : (files[0] || '') }}>
             {({ isSubmitting, values }) => (
                 <Modal {...props} dismissable={!isSubmitting} showSpinnerOverlay={isSubmitting}>
                     <Form css={tw`m-0`}>