Add functionality for renaming folders instant sync Google Drive

sumomomomomo · sumomomomomo · commit 8bd5a461c364 · 2024-04-04T02:35:55.000+08:00
diff --git a/src/commons/fileSystem/FileSystemActions.ts b/src/commons/fileSystem/FileSystemActions.ts
@@ -13,7 +13,8 @@ import {
   SET_PERSISTENCE_FILE_LAST_EDIT_BY_PATH, 
   UPDATE_PERSISTENCE_FILE_PATH_AND_NAME_BY_PATH,
   UPDATE_LAST_EDITED_FILE_PATH,
-  UPDATE_REFRESH_FILE_VIEW_KEY } from './FileSystemTypes';
+  UPDATE_REFRESH_FILE_VIEW_KEY, 
+  UPDATE_PERSISTENCE_FOLDER_PATH_AND_NAME_BY_PATH} from './FileSystemTypes';
 
 export const setInBrowserFileSystem = createAction(
   SET_IN_BROWSER_FILE_SYSTEM,
@@ -50,6 +51,11 @@ export const updatePersistenceFilePathAndNameByPath = createAction(
   (oldPath: string, newPath: string, newFileName: string) => ({ payload: {oldPath, newPath, newFileName}})
 );
 
+export const updatePersistenceFolderPathAndNameByPath = createAction(
+  UPDATE_PERSISTENCE_FOLDER_PATH_AND_NAME_BY_PATH,
+  (oldPath: string, newPath: string, oldFolderName: string, newFolderName: string) => ({ payload: {oldPath, newPath, oldFolderName, newFolderName}})
+);
+
 export const deleteAllPersistenceFiles = createAction(
   DELETE_ALL_PERSISTENCE_FILES,
   () => ({ payload: {} })
diff --git a/src/commons/fileSystem/FileSystemReducer.ts b/src/commons/fileSystem/FileSystemReducer.ts
@@ -14,6 +14,7 @@ import {
   updateLastEditedFilePath,
   updateRefreshFileViewKey,
   updatePersistenceFilePathAndNameByPath,
+  updatePersistenceFolderPathAndNameByPath,
   } from './FileSystemActions';
 import { FileSystemState } from './FileSystemTypes';
 
@@ -98,6 +99,43 @@ export const FileSystemReducer: Reducer<FileSystemState, SourceActionType> = cre
       filesState[persistenceFileFindIndex] = newPersistenceFile;
       state.persistenceFileArray = filesState;
     })
+    .addCase(updatePersistenceFolderPathAndNameByPath, (state, action) => {
+      const filesState = state['persistenceFileArray'];
+      const persistenceFileFindIndex = filesState.findIndex(e => e.path === action.payload.oldPath);
+      if (persistenceFileFindIndex === -1) {
+        return;
+      }
+      // get current level of folder
+      const regexResult = /^(.*[\\\/])?(\.*.*?)(\.[^.]+?|)$/.exec(action.payload.newPath)!;
+
+      const currFolderSplit: string[] = regexResult[0].slice(1).split("/");
+      const currFolderIndex = currFolderSplit.length - 1;
+
+      // /fold1/ becomes ["fold1"]
+      // /fold1/fold2/ becomes ["fold1", "fold2"]
+      // If in top level folder, becomes [""]
+
+      console.log(regexResult, currFolderSplit, "a1");
+
+      // update all files that are its children
+      state.persistenceFileArray = filesState.filter(e => e.path).map((e => {
+        const r = /^(.*[\\\/])?(\.*.*?)(\.[^.]+?|)$/.exec(e.path!)!;
+        const currParentFolders = r[0].slice(1).split("/");
+        console.log("currParentFolders", currParentFolders, "folderLevel", currFolderIndex);
+        if (currParentFolders.length <= currFolderIndex) {
+          return e; // not a child of folder
+        }
+        if (currParentFolders[currFolderIndex] !== action.payload.oldFolderName) {
+          return e; // not a child of folder
+        }
+        // only children remain
+        currParentFolders[currFolderIndex] = action.payload.newFolderName;
+        currParentFolders[0] = "/" + currParentFolders[0];
+        const newPath = currParentFolders.join("/");
+        console.log("from", e.path, "to", newPath);
+        return {...e, path: newPath};
+      }));
+    })
     .addCase(setPersistenceFileLastEditByPath, (state, action) => {
       const filesState = state['persistenceFileArray'];
       const persistenceFileFindIndex = filesState.findIndex(e => e.path === action.payload.path);
diff --git a/src/commons/fileSystem/FileSystemTypes.ts b/src/commons/fileSystem/FileSystemTypes.ts
@@ -9,6 +9,7 @@ export const DELETE_PERSISTENCE_FILE = 'DELETE_PERSISTENCE_FILE';
 export const DELETE_ALL_GITHUB_SAVE_INFO = 'DELETE_ALL_GITHUB_SAVE_INFO';
 export const DELETE_ALL_PERSISTENCE_FILES = 'DELETE_ALL_PERSISTENCE_FILES';
 export const UPDATE_PERSISTENCE_FILE_PATH_AND_NAME_BY_PATH = 'UPDATE_PERSISTENCE_FILE_PATH_AND_NAME_BY_PATH';
+export const UPDATE_PERSISTENCE_FOLDER_PATH_AND_NAME_BY_PATH = 'UPDATE_PERSISTENCE_FOLDER_PATH_AND_NAME_BY_PATH';
 export const SET_PERSISTENCE_FILE_LAST_EDIT_BY_PATH = 'SET_PERSISTENCE_FILE_LAST_EDIT_BY_PATH';
 export const UPDATE_LAST_EDITED_FILE_PATH = 'UPDATE_LAST_EDITED_FILE_PATH';
 export const UPDATE_REFRESH_FILE_VIEW_KEY = 'UPDATE_REFRESH_FILE_VIEW_KEY';
diff --git a/src/commons/sagas/PersistenceSaga.tsx b/src/commons/sagas/PersistenceSaga.tsx
@@ -36,6 +36,7 @@ import {
 import { AsyncReturnType } from '../utils/TypeHelper';
 import { safeTakeEvery as takeEvery, safeTakeLatest as takeLatest } from './SafeEffects';
 import { WORKSPACE_BASE_PATHS } from 'src/pages/fileSystem/createInBrowserFileSystem';
+import { EditorTabState } from '../workspace/WorkspaceTypes';
 
 const DISCOVERY_DOCS = ['https://www.googleapis.com/discovery/v1/apis/drive/v3/rest'];
 const SCOPES =
@@ -195,7 +196,7 @@ export function* persistenceSaga(): SagaIterator {
         // TODO find a file to open instead of deleting all active tabs?
         // TODO without modifying WorkspaceReducer in one function this would cause errors - called by onChange of Playground.tsx?
         // TODO change behaviour of WorkspaceReducer to not create program.js every time folder mode changes with 0 tabs existing?
-        yield call(store.dispatch, actions.updateRefreshFileViewKey()); // refreshes folder view TODO super jank?
+        yield call(store.dispatch, actions.updateRefreshFileViewKey());
 
         yield call(showSuccessMessage, `Loaded folder ${name}.`, 1000);
 
@@ -553,25 +554,32 @@ export function* persistenceSaga(): SagaIterator {
     PERSISTENCE_SAVE_FILE,
     function* ({ payload: { id, name } }: ReturnType<typeof actions.persistenceSaveFile>) {
       let toastKey: string | undefined;
+
+      const [currFolderObject] = yield select( // TODO resolve type here?
+      (state: OverallState) => [
+        state.playground.persistenceFile
+      ]
+      );
+
+      yield call(ensureInitialisedAndAuthorised);
+
+      const [activeEditorTabIndex, editorTabs, chapter, variant, external] = yield select(
+        (state: OverallState) => [
+          state.workspaces.playground.activeEditorTabIndex,
+          state.workspaces.playground.editorTabs,
+          state.workspaces.playground.context.chapter,
+          state.workspaces.playground.context.variant,
+          state.workspaces.playground.externalLibrary
+        ]
+      );
+
       try {
         toastKey = yield call(showMessage, {
           message: `Saving as ${name}...`,
           timeout: 0,
           intent: Intent.PRIMARY
         });
 
-        yield call(ensureInitialisedAndAuthorised);
-
-        const [activeEditorTabIndex, editorTabs, chapter, variant, external] = yield select(
-          (state: OverallState) => [
-            state.workspaces.playground.activeEditorTabIndex,
-            state.workspaces.playground.editorTabs,
-            state.workspaces.playground.context.chapter,
-            state.workspaces.playground.context.variant,
-            state.workspaces.playground.externalLibrary
-          ]
-        );
-
         if (activeEditorTabIndex === null) {
           throw new Error('No active editor tab found.');
         }
@@ -582,6 +590,20 @@ export function* persistenceSaga(): SagaIterator {
           variant,
           external
         };
+        if ((currFolderObject as PersistenceFile).isFolder) {
+          yield call(console.log, "folder opened! updating pers specially");
+          const persistenceFileArray: PersistenceFile[] = yield select((state: OverallState) => state.fileSystem.persistenceFileArray);
+          const currPersistenceFile = persistenceFileArray.find(e => e.path === (editorTabs[activeEditorTabIndex] as EditorTabState).filePath);
+          if (!currPersistenceFile) {
+            throw new Error('Persistence file not found');
+          }
+          yield call(updateFile, currPersistenceFile.id, currPersistenceFile.name, MIME_SOURCE, code, config);
+          currPersistenceFile.lastSaved = new Date();
+          yield put(actions.addPersistenceFile(currPersistenceFile));
+          yield call(showSuccessMessage, `${name} successfully saved to Google Drive.`, 1000);
+          return;
+        } 
+
         yield call(updateFile, id, name, MIME_SOURCE, code, config);
         yield put(actions.playgroundUpdatePersistenceFile({ id, name, lastSaved: new Date() }));
         yield call(showSuccessMessage, `${name} successfully saved to Google Drive.`, 1000);
@@ -599,12 +621,12 @@ export function* persistenceSaga(): SagaIterator {
   yield takeEvery(
     PERSISTENCE_CREATE_FILE,
     function* ({ payload }: ReturnType<typeof actions.persistenceCreateFile>) {
+      yield call(store.dispatch, actions.disableFileSystemContextMenus());
+
       const newFilePath = payload;
       yield call(console.log, "create file ", newFilePath);
 
-      // const persistenceFileArray: PersistenceFile[] = yield select((state: OverallState) => state.fileSystem.persistenceFileArray);
-      
-      // look for parent folder persistenceFile
+      // look for parent folder persistenceFile TODO modify action so name is supplied?
       const regexResult = /^(.*[\\\/])?(\.*.*?)(\.[^.]+?|)$/.exec(newFilePath);
       const parentFolderPath = regexResult ? regexResult[1].slice(0, -1) : undefined;
       if (!parentFolderPath) {
@@ -638,6 +660,8 @@ export function* persistenceSaga(): SagaIterator {
       };
       const newFilePersistenceFile: PersistenceFile = yield call(createFile, newFileName, parentFolderId, MIME_SOURCE, '', config);
       yield put(actions.addPersistenceFile({ ...newFilePersistenceFile, lastSaved: new Date(), path: newFilePath }));
+      yield call(store.dispatch, actions.enableFileSystemContextMenus());
+      yield call(store.dispatch, actions.updateRefreshFileViewKey());
       yield call(
         showSuccessMessage,
         `${newFileName} successfully saved to Google Drive.`,
@@ -649,13 +673,15 @@ export function* persistenceSaga(): SagaIterator {
   yield takeEvery(
     PERSISTENCE_CREATE_FOLDER,
     function* ({ payload }: ReturnType<typeof actions.persistenceCreateFolder>) {
+      yield call(store.dispatch, actions.disableFileSystemContextMenus());
+
       const newFolderPath = payload;
       yield call(console.log, "create folder ", newFolderPath);
 
       
       // const persistenceFileArray: PersistenceFile[] = yield select((state: OverallState) => state.fileSystem.persistenceFileArray);
       
-      // look for parent folder persistenceFile
+      // look for parent folder persistenceFile TODO modify action so name is supplied?
       const regexResult = /^(.*[\\\/])?(\.*.*?)(\.[^.]+?|)$/.exec(newFolderPath);
       const parentFolderPath = regexResult ? regexResult[1].slice(0, -1) : undefined;
       if (!parentFolderPath) {
@@ -677,6 +703,8 @@ export function* persistenceSaga(): SagaIterator {
 
       const newFolderId: string = yield call(createFolderAndReturnId, parentFolderId, newFolderName);
       yield put(actions.addPersistenceFile({ lastSaved: new Date(), path: newFolderPath, id: newFolderId, name: newFolderName, parentId: parentFolderId }));
+      yield call(store.dispatch, actions.enableFileSystemContextMenus());
+      yield call(store.dispatch, actions.updateRefreshFileViewKey());
       yield call(
         showSuccessMessage,
         `Folder ${newFolderName} successfully saved to Google Drive.`,
@@ -688,6 +716,8 @@ export function* persistenceSaga(): SagaIterator {
   yield takeEvery(
     PERSISTENCE_DELETE_FILE,
     function* ({ payload }: ReturnType<typeof actions.persistenceDeleteFile>) {
+      yield call(store.dispatch, actions.disableFileSystemContextMenus());
+
       const filePath = payload;
       yield call(console.log, "delete file ", filePath);
 
@@ -698,8 +728,10 @@ export function* persistenceSaga(): SagaIterator {
         yield call(console.log, "cannot find pers file for ", filePath);
         return;
       }
-      yield call(deleteFileOrFolder, persistenceFile.id); // assume this succeeds all the time
+      yield call(deleteFileOrFolder, persistenceFile.id); // assume this succeeds all the time? TODO
       yield put(actions.deletePersistenceFile(persistenceFile));
+      yield call(store.dispatch, actions.enableFileSystemContextMenus());
+      yield call(store.dispatch, actions.updateRefreshFileViewKey());
       yield call(
         showSuccessMessage,
         `${persistenceFile.name} successfully deleted from Google Drive.`,
@@ -711,6 +743,8 @@ export function* persistenceSaga(): SagaIterator {
   yield takeEvery(
     PERSISTENCE_DELETE_FOLDER,
     function* ({ payload }: ReturnType<typeof actions.persistenceDeleteFolder>) {
+      yield call(store.dispatch, actions.disableFileSystemContextMenus());
+
       const folderPath = payload;
       yield call(console.log, "delete folder ", folderPath);
 
@@ -721,8 +755,10 @@ export function* persistenceSaga(): SagaIterator {
         yield call(console.log, "cannot find pers file for ", folderPath);
         return;
       }
-      yield call(deleteFileOrFolder, persistenceFile.id); // assume this succeeds all the time
+      yield call(deleteFileOrFolder, persistenceFile.id); // assume this succeeds all the time? TODO
       yield put(actions.deletePersistenceFile(persistenceFile));
+      yield call(store.dispatch, actions.enableFileSystemContextMenus());
+      yield call(store.dispatch, actions.updateRefreshFileViewKey());
       yield call(
         showSuccessMessage,
         `Folder ${persistenceFile.name} successfully deleted from Google Drive.`,
@@ -734,6 +770,8 @@ export function* persistenceSaga(): SagaIterator {
   yield takeEvery(
     PERSISTENCE_RENAME_FILE,
     function* ({ payload : {oldFilePath, newFilePath} }: ReturnType<typeof actions.persistenceRenameFile>) {
+      yield call(store.dispatch, actions.disableFileSystemContextMenus());
+
       yield call(console.log, "rename file ", oldFilePath, " to ", newFilePath);
 
       // look for file
@@ -744,7 +782,7 @@ export function* persistenceSaga(): SagaIterator {
         return;
       }
 
-      // new name
+      // new name TODO: modify action so name is supplied?
       const regexResult = /^(.*[\\\/])?(\.*.*?)(\.[^.]+?|)$/.exec(newFilePath);
       if (!regexResult) {
         yield call(console.log, "regex fail ", newFilePath);
@@ -757,6 +795,8 @@ export function* persistenceSaga(): SagaIterator {
 
       // handle pers file
       yield put(actions.updatePersistenceFilePathAndNameByPath(oldFilePath, newFilePath, newFileName));
+      yield call(store.dispatch, actions.enableFileSystemContextMenus());
+      yield call(store.dispatch, actions.updateRefreshFileViewKey());
       yield call(
         showSuccessMessage,
         `${newFileName} successfully renamed in Google Drive.`,
@@ -768,7 +808,46 @@ export function* persistenceSaga(): SagaIterator {
   yield takeEvery(
     PERSISTENCE_RENAME_FOLDER,
     function* ({ payload : {oldFolderPath, newFolderPath} }: ReturnType<typeof actions.persistenceRenameFolder>) {
+      yield call(store.dispatch, actions.disableFileSystemContextMenus());
+
       yield call(console.log, "rename folder ", oldFolderPath, " to ", newFolderPath);
+
+      // look for folder
+      const persistenceFileArray: PersistenceFile[] = yield select((state: OverallState) => state.fileSystem.persistenceFileArray);
+      const persistenceFile = persistenceFileArray.find(e => e.path === oldFolderPath);
+      if (!persistenceFile) {
+        yield call(console.log, "cannot find pers file for ", oldFolderPath);
+        return;
+      }
+
+      // new name TODO: modify action so name is supplied?
+      const regexResult = /^(.*[\\\/])?(\.*.*?)(\.[^.]+?|)$/.exec(newFolderPath);
+      if (!regexResult) {
+        yield call(console.log, "regex fail ", newFolderPath);
+        return;
+      }
+      const newFolderName = regexResult[2] + regexResult[3];
+
+      // old name TODO: modify action so name is supplied?
+      const regexResult2 = /^(.*[\\\/])?(\.*.*?)(\.[^.]+?|)$/.exec(oldFolderPath);
+      if (!regexResult2) {
+        yield call(console.log, "regex fail ", oldFolderPath);
+        return;
+      }
+      const oldFolderName = regexResult2[2] + regexResult2[3];
+
+      // call gapi 
+      yield call(renameFileOrFolder, persistenceFile.id, newFolderName);
+
+      // handle pers file
+      yield put(actions.updatePersistenceFolderPathAndNameByPath(oldFolderPath, newFolderPath, oldFolderName, newFolderName));
+      yield call(store.dispatch, actions.enableFileSystemContextMenus());
+      yield call(store.dispatch, actions.updateRefreshFileViewKey());
+      yield call(
+        showSuccessMessage,
+        `Folder ${newFolderName} successfully renamed in Google Drive.`,
+        1000
+      );
     }
   );
 }
