switch to localhost

apps/remix-ide/src/app/files/remixDProvider.js

@@ -57,7 +57,7 @@ module.exports = class RemixDProvider extends FileProvider {
   }
 
   preInit () {
-    this.event.emit('loading')
+    this.event.emit('loadingLocalhost')
   }
 
   init (cb) {
@@ -177,9 +177,7 @@ module.exports = class RemixDProvider extends FileProvider {
   }
 
   resolveDirectory (path, callback) {
-    var self = this
     if (path[0] === '/') path = path.substring(1)
-    if (!path) return callback(null, { [self.type]: { } })
     const unprefixedpath = this.removePrefix(path)
 
     if (!this._isReady) return callback && callback('provider not ready')

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

@@ -304,37 +304,29 @@ const listenOnEvents = (provider) => {
     await executeEvent('rootFolderChanged', path)
   })
 
-  provider.event.on('disconnected', () => {
-    dispatch(setMode('browser'))
-  })
-  // provider.event.on('connected', () => {
-  //         props.plugin.fileManager.setMode('localhost')
-  // setState(prevState => {
-  //   return { ...prevState, hideRemixdExplorer: false, loadingLocalhost: false }
-  // })
-  // })
-
   // provider.event.on('disconnected', () => {
-  //         // If 'connect to localhost' is clicked from home tab, mode is not 'localhost'
-  // if (props.fileManager.mode === 'localhost') {
-  // await setWorkspace(NO_WORKSPACE)
-  // props.plugin.fileManager.setMode('browser')
-  // setState(prevState => {
-  //   return { ...prevState, hideRemixdExplorer: true, loadingLocalhost: false }
-  // })
-  // } else {
-  //   // Hide spinner in file explorer
-  //   setState(prevState => {
-  //     return { ...prevState, loadingLocalhost: false }
-  //   })
-  // }
+  //   dispatch(setMode('browser'))
   // })
 
-  // provider.event.on('loading', () => {
-  //         setState(prevState => {
-  //   return { ...prevState, loadingLocalhost: true }
-  // })
-  // })
+  provider.event.on('connected', async () => {
+    fetchWorkspaceDirectory('/')(dispatch)
+    // setState(prevState => {
+    //   return { ...prevState, hideRemixdExplorer: false, loadingLocalhost: false }
+    // })
+  })
+
+  provider.event.on('disconnected', async () => {
+    const workspaceProvider = plugin.fileProviders.workspace
+
+    await switchToWorkspace(workspaceProvider.workspace)(dispatch)
+  })
+
+  provider.event.on('loadingLocalhost', async () => {
+    await switchToWorkspace(LOCALHOST)(dispatch)
+    // setState(prevState => {
+    //   return { ...prevState, loadingLocalhost: true }
+    // })
+  })
 
   provider.event.on('fileExternallyChanged', async (path: string, file: { content: string }) => {
     const config = plugin.registry.get('config').api
@@ -458,6 +450,7 @@ export const createWorkspace = (workspaceName: string) => (dispatch: React.Dispa
   promise.then(async () => {
     await plugin.fileManager.closeAllFiles()
     dispatch(createWorkspaceSuccess(workspaceName))
+    switchToWorkspace(workspaceName)(dispatch)
   }).catch((error) => {
     dispatch(createWorkspaceError({ error }))
   })
@@ -486,21 +479,21 @@ export const fetchWorkspaceDirectory = (path: string) => (dispatch: React.Dispat
 export const switchToWorkspace = (name: string) => async (dispatch: React.Dispatch<any>) => {
   await plugin.fileManager.closeAllFiles()
   if (name === LOCALHOST) {
-    plugin.fileProviders.workspace.clearWorkspace()
+    plugin.fileManager.setMode('localhost')
     const isActive = await plugin.call('manager', 'isActive', 'remixd')
 
-    if (!isActive) plugin.call('manager', 'activatePlugin', 'remixd')
-    plugin.fileManager.setMode('localhost')
+    if (!isActive) await plugin.call('manager', 'activatePlugin', 'remixd')
     dispatch(setMode('localhost'))
     plugin.emit('setWorkspace', { name: LOCALHOST, isLocalhost: true })
   } else if (name === NO_WORKSPACE) {
     plugin.fileProviders.workspace.clearWorkspace()
   } else {
+    plugin.fileManager.setMode('browser')
     const isActive = await plugin.call('manager', 'isActive', 'remixd')
 
     if (isActive) plugin.call('manager', 'deactivatePlugin', 'remixd')
     await plugin.fileProviders.workspace.setWorkspace(name)
-    plugin.fileManager.setMode('browser')
+
     dispatch(setMode('browser'))
     dispatch(setCurrentWorkspace(name))
     plugin.emit('setWorkspace', { name, isLocalhost: false })

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

@@ -187,6 +187,13 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
           isRequesting: false,
           isSuccessful: true,
           error: null
+        },
+        localhost: {
+          ...state.localhost,
+          files: state.mode === 'localhost' ? fetchWorkspaceDirectoryContent(state, payload) : state.localhost.files,
+          isRequesting: false,
+          isSuccessful: true,
+          error: null
         }
       }
     }
@@ -422,7 +429,7 @@ const fileRemoved = (state: BrowserState, path: string): { [x: string]: Record<s
 }
 
 // IDEA: Modify function to remove blank input field without fetching content
-const fetchDirectoryContent = (state: BrowserState, payload: { fileTree, path: string, type?: 'file' | 'folder' }, deletePath?: string) => {
+const fetchDirectoryContent = (state: BrowserState, payload: { fileTree, path: string, type?: 'file' | 'folder' }, deletePath?: string): { [x: string]: Record<string, File> } => {
   if (!payload.fileTree) return state.mode === 'browser' ? state.browser.files : state[state.mode].files
   if (state.mode === 'browser') {
     if (payload.path === state.browser.currentWorkspace) {
@@ -446,7 +453,7 @@ const fetchDirectoryContent = (state: BrowserState, payload: { fileTree, path: s
       return files
     }
   } else {
-    if (payload.path === state.mode) {
+    if (payload.path === state.mode || payload.path === '/') {
       let files = normalize(payload.fileTree, payload.path, payload.type)
 
       files = _.merge(files, state[state.mode].files[state.mode])

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

@@ -29,14 +29,11 @@ export function Workspace (props: WorkspaceProps) {
       setCurrentWorkspace(global.fs.browser.currentWorkspace)
       global.dispatchFetchWorkspaceDirectory(global.fs.browser.currentWorkspace)
     } else if (global.fs.mode === 'localhost') {
-      global.dispatchFetchWorkspaceDirectory('localhost')
+      // global.dispatchFetchWorkspaceDirectory('/')
+      setCurrentWorkspace(LOCALHOST)
     }
   }, [global.fs.browser.currentWorkspace, global.fs.localhost.sharedFolder, global.fs.mode])
 
-  useEffect(() => {
-    if (global.fs.mode === 'localhost') setCurrentWorkspace(LOCALHOST)
-  }, [global.fs.mode])
-
   props.plugin.resetNewFile = () => {
     setState(prevState => {
       return { ...prevState, displayNewFile: !state.displayNewFile }
@@ -217,7 +214,7 @@ export function Workspace (props: WorkspaceProps) {
         <div className='remixui_fileExplorerTree'>
           <div>
             <div className='pl-2 remixui_treeview' data-id='filePanelFileExplorerTree'>
-              { state.hideRemixdExplorer && currentWorkspace && currentWorkspace !== NO_WORKSPACE && currentWorkspace !== LOCALHOST &&
+              { global.fs.mode === 'browser' &&
                   <FileExplorer
                     name={currentWorkspace}
                     registry={props.plugin.registry}
@@ -237,7 +234,7 @@ export function Workspace (props: WorkspaceProps) {
             {
               state.loadingLocalhost ? <div className="text-center py-5"><i className="fas fa-spinner fa-pulse fa-2x"></i></div>
                 : <div className='pl-2 filesystemexplorer remixui_treeview'>
-                  { !state.hideRemixdExplorer &&
+                  { global.fs.mode === 'localhost' &&
                       <FileExplorer
                         name='localhost'
                         registry={props.plugin.registry}