Fixed remixd errors and added createDir api to remixd plugin

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

@@ -63,10 +63,10 @@ class FileProvider {
     })
   }
 
-  exists (path, cb) {
+  exists (path) {
     // todo check the type (directory/file) as well #2386
     // currently it is not possible to have a file and folder with same path
-    return cb(null, this._exists(path))
+    return this._exists(path)
   }
 
   _exists (path) {

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

@@ -115,6 +115,13 @@ module.exports = class RemixDProvider {
     })
   }
 
+  async createDir (path, cb) {
+    if (!this._isReady) return cb && cb('provider not ready')
+    const unprefixedpath = this.removePrefix(path)
+
+    return this._appManager.call('remixd', 'createDir', { path: unprefixedpath })
+  }
+
   isReadOnly (path) {
     return this._readOnlyMode || this._readOnlyFiles[path] === 1
   }

apps/remix-ide/src/app/files/remixd-handle.js

@@ -22,7 +22,7 @@ const profile = {
   name: 'remixd',
   displayName: 'RemixD',
   url: 'ws://127.0.0.1:65520',
-  methods: ['folderIsReadOnly', 'resolveDirectory', 'get', 'exists', 'isFile', 'set', 'rename', 'remove', 'isDirectory', 'list'],
+  methods: ['folderIsReadOnly', 'resolveDirectory', 'get', 'exists', 'isFile', 'set', 'rename', 'remove', 'isDirectory', 'list', 'createDir'],
   events: [],
   description: 'Using Remixd daemon, allow to access file system',
   kind: 'other',

libs/remix-ui/file-explorer/src/lib/file-explorer.tsx

@@ -157,7 +157,7 @@ export const FileExplorer = (props: FileExplorerProps) => {
   }, [state.files])
 
   const resolveDirectory = async (folderPath, dir: File[]): Promise<File[]> => {
-    if (extractParentFromKey(state.focusEdit.element) === name) {
+    if ((extractParentFromKey(state.focusEdit.element) === name) && (dir.findIndex(({ path }) => path === state.focusEdit.element) === -1)) {
       dir = state.focusEdit.type === 'file' ? [...dir, {
         path: state.focusEdit.element,
         name: '',
@@ -171,6 +171,7 @@ export const FileExplorer = (props: FileExplorerProps) => {
     dir = await Promise.all(dir.map(async (file) => {
       if (file.path === folderPath) {
         if ((extractParentFromKey(state.focusEdit.element) === folderPath) && state.focusEdit.isNew) {
+          if (file.child && (file.child.findIndex(({ path }) => path === state.focusEdit.element) === -1)) {
             file.child = state.focusEdit.type === 'file' ? [...await fetchDirectoryContent(folderPath), {
               path: state.focusEdit.element,
               name: '',
@@ -183,6 +184,9 @@ export const FileExplorer = (props: FileExplorerProps) => {
           } else {
             file.child = await fetchDirectoryContent(folderPath)
           }
+        } else {
+          file.child = await fetchDirectoryContent(folderPath)
+        }
         return file
       } else if (file.child) {
         file.child = await resolveDirectory(folderPath, file.child)
@@ -268,13 +272,15 @@ export const FileExplorer = (props: FileExplorerProps) => {
   const createNewFolder = async (newFolderPath: string) => {
     const fileManager = state.fileManager
     const dirName = newFolderPath + '/'
-    const exists = fileManager.exists(dirName)
 
-    if (exists) return
     try {
+      const exists = await fileManager.exists(dirName)
+
+      if (exists) return
       await fileManager.mkdir(dirName)
       // addFolder(parentFolder, newFolderPath)
     } catch (e) {
+      console.log('error: ', e)
       toast('Failed to create folder: ' + newFolderPath)
     }
   }
@@ -305,7 +311,7 @@ export const FileExplorer = (props: FileExplorerProps) => {
   const renamePath = async (oldPath: string, newPath: string) => {
     try {
       const fileManager = state.fileManager
-      const exists = fileManager.exists(newPath)
+      const exists = await fileManager.exists(newPath)
 
       if (exists) {
         modal('Rename File Failed', 'File name already exists', {
@@ -338,24 +344,6 @@ export const FileExplorer = (props: FileExplorerProps) => {
     })
   }
 
-  const replacePath = (oldPath: string, newPath: string, files: File[]): File[] => {
-    return files.map(file => {
-      if (file.path === oldPath) {
-        return {
-          ...file,
-          path: newPath,
-          name: extractNameFromKey(newPath)
-        }
-      } else if (file.child) {
-        file.child = replacePath(oldPath, newPath, file.child)
-
-        return file
-      } else {
-        return file
-      }
-    })
-  }
-
   const fileAdded = async (filePath: string) => {
     const pathArr = filePath.split('/')
     const expandPath = pathArr.map((path, index) => {
@@ -413,11 +401,11 @@ export const FileExplorer = (props: FileExplorerProps) => {
     })
   }
 
-  const fileRenamed = (oldName, newName) => {
-    const files = replacePath(oldName, newName, state.files)
+  const fileRenamed = async () => {
+    const files = await fetchDirectoryContent(props.name)
 
     setState(prevState => {
-      return { ...prevState, files }
+      return { ...prevState, files, expandPath: [...prevState.expandPath] }
     })
   }
 

libs/remixd/src/services/remixdClient.ts

@@ -7,7 +7,7 @@ import * as fs from 'fs-extra'
 import * as isbinaryfile from 'isbinaryfile'
 
 export class RemixdClient extends PluginClient {
-  methods: ['folderIsReadOnly', 'resolveDirectory', 'get', 'exists', 'isFile', 'set', 'list', 'isDirectory']
+  methods: ['folderIsReadOnly', 'resolveDirectory', 'get', 'exists', 'isFile', 'set', 'list', 'isDirectory', 'createDir']
   trackDownStreamUpdate: TrackDownStreamUpdate = {}
   websocket: WS
   currentSharedFolder: string
@@ -127,6 +127,30 @@ export class RemixdClient extends PluginClient {
     }
   }
 
+  createDir (args: SharedFolderArgs): Promise<void> {
+    try {
+      return new Promise((resolve, reject) => {
+        if (this.readOnly) reject(new Error('Cannot create folder: read-only mode selected'))
+        const path = utils.absolutePath(args.path, this.currentSharedFolder)
+        const exists = fs.existsSync(path)
+
+        if (exists && !isRealPath(path)) reject(new Error(''))
+        this.trackDownStreamUpdate[path] = path
+        fs.mkdirp(path).then(() => {
+          let splitPath = args.path.split('/')
+
+          splitPath = splitPath.filter(dir => dir)
+          const dir = '/' + splitPath.join('/')
+
+          this.emit('folderAdded', dir)
+          resolve()
+        }).catch((e: Error) => reject(e))
+      })
+    } catch (error) {
+      throw new Error(error)
+    }
+  }
+
   rename (args: SharedFolderArgs): Promise<boolean> {
     try {
       return new Promise((resolve, reject) => {