fileRemoved event listener

libs/remix-ui/workspace/src/lib/actions/workspace.ts

@@ -79,6 +79,13 @@ const folderAddedSuccess = (folderPath: string) => {
   }
 }
 
+const fileRemovedSuccess = (removePath: string) => {
+  return {
+    type: 'FILE_REMOVED_SUCCESS',
+    payload: removePath
+  }
+}
+
 const createWorkspaceTemplate = async (workspaceName: string, setDefaults = true, template: 'gist-template' | 'code-template' | 'default-template' = 'default-template') => {
   if (!workspaceName) throw new Error('workspace name cannot be empty')
   if (checkSpecialChars(workspaceName) || checkSlash(workspaceName)) throw new Error('special characters are not allowed')
@@ -191,7 +198,7 @@ const getWorkspaces = async (): Promise<string[]> | undefined => {
 
     return workspaces
   } catch (e) {
-    // modalDialogCustom.alert('Workspaces have not been created on your system. Please use "Migrate old filesystem to workspace" on the home page to transfer your files or start by creating a new workspace in the File Explorers.')
+    dispatch(displayNotification('Workspaces', 'Workspaces have not been created on your system. Please use "Migrate old filesystem to workspace" on the home page to transfer your files or start by creating a new workspace in the File Explorers.', 'OK', null, () => { dispatch(hideNotification()) }, null))
     console.log(e)
   }
 }
@@ -204,6 +211,10 @@ const listenOnEvents = (provider) => {
   provider.event.on('folderAdded', async (folderPath) => {
     await executeEvent('folderAdded', folderPath)
   })
+
+  provider.event.on('fileRemoved', async (removePath) => {
+    await executeEvent('fileRemoved', removePath)
+  })
 }
 
 export const initWorkspace = (filePanelPlugin) => async (reducerDispatch: React.Dispatch<any>) => {
@@ -234,10 +245,6 @@ export const initWorkspace = (filePanelPlugin) => async (reducerDispatch: React.
     }
 
     listenOnEvents(provider)
-
-    // provider.event.on('fileRemoved', async (removePath) => {
-    //   await executeEvent('fileRemoved', removePath)
-    // })
     // provider.event.on('fileRenamed', async (oldPath) => {
     //   await executeEvent('fileRenamed', oldPath)
     // })
@@ -323,19 +330,9 @@ const folderAdded = async (folderPath: string) => {
   await dispatch(folderAddedSuccess(folderPath))
 }
 
-// const folderAdded = async (folderPath: string) => {
+const fileRemoved = async (removePath: string) => {
-//   if (extractParentFromKey(folderPath) === '/.workspaces') return
+  await dispatch(fileRemovedSuccess(removePath))
-//   const path = extractParentFromKey(folderPath) || provider.workspace || provider.type || ''
+}
-//   const data = await fetchDirectoryContent(provider, path)
-
-//   await dispatch(folderAddedSuccess(path, data))
-// }
-
-// const fileRemoved = async (removePath: string) => {
-//   const path = extractParentFromKey(removePath) || provider.workspace || provider.type || ''
-
-//   await dispatch(fileRemovedSuccess(path, removePath))
-// }
 
 // const fileRenamed = async (oldPath: string) => {
 //   const path = extractParentFromKey(oldPath) || provider.workspace || provider.type || ''
@@ -376,15 +373,15 @@ const executeEvent = async (eventName: 'fileAdded' | 'folderAdded' | 'fileRemove
       }
       break
 
-    // case 'fileRemoved':
+    case 'fileRemoved':
-    //   await fileRemoved(path)
+      await fileRemoved(path)
-    //   delete pendingEvents[eventName + path]
+      delete pendingEvents[eventName + path]
-    //   if (queuedEvents.length) {
+      if (queuedEvents.length) {
-    //     const next = queuedEvents.pop()
+        const next = queuedEvents.pop()
 
-    //     await executeEvent(next.eventName, next.path)
+        await executeEvent(next.eventName, next.path)
-    //   }
+      }
-    //   break
+      break
 
     // case 'fileRenamed':
     //   await fileRenamed(path)

libs/remix-ui/workspace/src/lib/reducers/workspace.ts

@@ -101,7 +101,13 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
         ...state,
         browser: {
           ...state.browser,
-          isRequesting: true,
+          isRequesting: state.mode === 'browser',
+          isSuccessful: false,
+          error: null
+        },
+        localhost: {
+          ...state.localhost,
+          isRequesting: state.mode === 'localhost',
           isSuccessful: false,
           error: null
         }
@@ -115,7 +121,14 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
         ...state,
         browser: {
           ...state.browser,
-          files: fetchDirectoryContent(payload.files, payload.path),
+          files: state.mode === 'browser' ? fetchDirectoryContent(payload.files, payload.path) : state.browser.files,
+          isRequesting: false,
+          isSuccessful: true,
+          error: null
+        },
+        localhost: {
+          ...state.localhost,
+          files: state.mode === 'localhost' ? fetchDirectoryContent(payload.files, payload.path) : state.localhost.files,
           isRequesting: false,
           isSuccessful: true,
           error: null
@@ -130,7 +143,13 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
           ...state.browser,
           isRequesting: false,
           isSuccessful: false,
-          error: action.payload
+          error: state.mode === 'browser' ? action.payload : null
+        },
+        localhost: {
+          ...state.localhost,
+          isRequesting: false,
+          isSuccessful: false,
+          error: state.mode === 'localhost' ? action.payload : null
         }
       }
     }
@@ -165,13 +184,13 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
         ...state,
         browser: {
           ...state.browser,
-          files: fileAdded(state, payload),
+          files: state.mode === 'browser' ? fileAdded(state, payload) : state.browser.files,
-          expandPath: [...new Set([...state.browser.expandPath, payload])]
+          expandPath: state.mode === 'browser' ? [...new Set([...state.browser.expandPath, payload])] : state.browser.expandPath
         },
         localhost: {
           ...state.localhost,
-          files: fileAdded(state, payload),
+          files: state.mode === 'localhost' ? fileAdded(state, payload) : state.localhost.files,
-          expandPath: [...new Set([...state.localhost.expandPath, payload])]
+          expandPath: state.mode === 'localhost' ? [...new Set([...state.localhost.expandPath, payload])] : state.localhost.expandPath
         }
       }
     }
@@ -183,13 +202,31 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
         ...state,
         browser: {
           ...state.browser,
-          files: folderAdded(state, payload),
+          files: state.mode === 'browser' ? folderAdded(state, payload) : state.browser.files,
-          expandPath: [...new Set([...state.browser.expandPath, payload])]
+          expandPath: state.mode === 'browser' ? [...new Set([...state.browser.expandPath, payload])] : state.browser.expandPath
         },
         localhost: {
           ...state.localhost,
-          files: folderAdded(state, payload),
+          files: state.mode === 'localhost' ? folderAdded(state, payload) : state.localhost.files,
-          expandPath: [...new Set([...state.localhost.expandPath, payload])]
+          expandPath: state.mode === 'localhost' ? [...new Set([...state.localhost.expandPath, payload])] : state.localhost.expandPath
+        }
+      }
+    }
+
+    case 'FILE_REMOVED_SUCCESS': {
+      const payload = action.payload as string
+
+      return {
+        ...state,
+        browser: {
+          ...state.browser,
+          files: state.mode === 'browser' ? fileRemoved(state, payload) : state.browser.files,
+          expandPath: state.mode === 'browser' ? [...new Set([...state.browser.expandPath, payload])] : state.browser.expandPath
+        },
+        localhost: {
+          ...state.localhost,
+          files: state.mode === 'localhost' ? fileRemoved(state, payload) : state.localhost.files,
+          expandPath: state.mode === 'localhost' ? [...new Set([...state.localhost.expandPath, payload])] : state.localhost.expandPath
         }
       }
     }
@@ -270,6 +307,14 @@ const folderAdded = (state: BrowserState, path: string): { [x: string]: Record<s
   return files
 }
 
+const fileRemoved = (state: BrowserState, path: string): { [x: string]: Record<string, File> } => {
+  let files = state.mode === 'browser' ? state.browser.files : state.localhost.files
+  const _path = splitPath(state, path)
+
+  files = _.unset(files, _path)
+  return files
+}
+
 const splitPath = (state: BrowserState, path: string): string[] | string => {
   const root = state.mode === 'browser' ? state.browser.currentWorkspace : 'localhost'
 

libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx

@@ -29,7 +29,7 @@ export function Workspace (props: WorkspaceProps) {
   useEffect(() => {
     if (global.fs.browser.currentWorkspace) {
       setCurrentWorkspace(global.fs.browser.currentWorkspace)
-      // global.dispatchFetchDirectory(global.fs.browser.currentWorkspace)
+      global.dispatchFetchDirectory(global.fs.browser.currentWorkspace)
     }
   }, [global.fs.browser.currentWorkspace])