Add workspace name to tabs

apps/remix-ide-e2e/src/tests/defaultLayout.test.ts

@@ -63,7 +63,7 @@ module.exports = {
       .waitForElementVisible('div[data-id="filePanelFileExplorerTree"]')
       .click('[data-id="treeViewLitreeViewItemcontracts"]')
       .openFile('contracts/3_Ballot.sol')
-      .assert.containsText('div[title="contracts/3_Ballot.sol"]', '3_Ballot.sol')
+      .assert.containsText('div[title="default_workspace/contracts/3_Ballot.sol"]', '3_Ballot.sol')
       .click('span[class^=dropdownCaret]')
       .click('#homeItem')
       .assert.containsText('div[title="home"]', 'Home')

apps/remix-ide-e2e/src/tests/gist.test.ts

@@ -120,8 +120,8 @@ module.exports = {
       .setValue('*[data-id="modalDialogCustomPromptText"]', testData.validGistId)
       .modalFooterOKClick()
       .openFile(`${testData.validGistId}/ApplicationRegistry`)
-      .waitForElementVisible(`div[title='${testData.validGistId}/ApplicationRegistry']`)
-      .assert.containsText(`div[title='${testData.validGistId}/ApplicationRegistry'] > span`, 'ApplicationRegistry')
+      .waitForElementVisible(`div[title='default_workspace/${testData.validGistId}/ApplicationRegistry']`)
+      .assert.containsText(`div[title='default_workspace/${testData.validGistId}/ApplicationRegistry'] > span`, 'ApplicationRegistry')
       .end()
   },
 

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

@@ -610,6 +610,15 @@ class FileManager extends Plugin {
       if (callback) callback(error)
     })
   }
+
+  currentWorkspace () {
+    if (this.mode !== 'localhost') {
+      const file = this.currentFile() || ''
+      const provider = this.fileProviderOf(file)
+
+      return provider.workspace
+    }
+  }
 }
 
 module.exports = FileManager

apps/remix-ide/src/app/panels/tab-proxy.js

@@ -38,40 +38,81 @@ export class TabProxy extends Plugin {
     })
 
     fileManager.events.on('fileRemoved', (name) => {
-      this.removeTab(name)
+      const workspace = this.fileManager.currentWorkspace()
+
+      workspace ? this.removeTab(workspace + '/' + name) : this.removeTab(this.fileManager.mode + '/' + name)
     })
 
     fileManager.events.on('fileClosed', (name) => {
-      this.removeTab(name)
+      const workspace = this.fileManager.currentWorkspace()
+
+      workspace ? this.removeTab(workspace + '/' + name) : this.removeTab(this.fileManager.mode + '/' + name)
     })
 
     fileManager.events.on('currentFileChanged', (file) => {
-      if (this._handlers[file]) {
-        this._view.filetabs.activateTab(file)
-        return
+      const workspace = this.fileManager.currentWorkspace()
+
+      if (workspace) {
+        const workspacePath = workspace + '/' + file
+
+        if (this._handlers[workspacePath]) {
+          this._view.filetabs.activateTab(workspacePath)
+          return
+        }
+        this.addTab(workspacePath, '', () => {
+          this.fileManager.open(file)
+          this.event.emit('openFile', file)
+        },
+        () => {
+          this.fileManager.closeFile(file)
+          this.event.emit('closeFile', file)
+        })
+      } else {
+        const path = this.fileManager.mode + '/' + file
+
+        if (this._handlers[path]) {
+          this._view.filetabs.activateTab(path)
+          return
+        }
+        this.addTab(path, '', () => {
+          this.fileManager.open(file)
+          this.event.emit('openFile', file)
+        },
+        () => {
+          this.fileManager.closeFile(file)
+          this.event.emit('closeFile', file)
+        })
       }
-      this.addTab(file, '', () => {
-        this.fileManager.open(file)
-        this.event.emit('openFile', file)
-      },
-      () => {
-        this.fileManager.closeFile(file)
-        this.event.emit('closeFile', file)
-      })
     })
 
     fileManager.events.on('fileRenamed', (oldName, newName, isFolder) => {
-      if (isFolder) {
-        for (const tab of this.loadedTabs) {
-          if (tab.name.indexOf(oldName + '/') === 0) {
-            const newTabName = newName + tab.name.slice(oldName.length, tab.name.length)
-            this.renameTab(tab.name, newTabName)
+      const workspace = this.fileManager.currentWorkspace()
+
+      if (workspace) {
+        if (isFolder) {
+          for (const tab of this.loadedTabs) {
+            if (tab.name.indexOf(workspace + '/' + oldName + '/') === 0) {
+              const newTabName = workspace + '/' + newName + tab.name.slice(workspace + '/' + oldName.length, tab.name.length)
+              this.renameTab(tab.name, newTabName)
+            }
+          }
+          return
+        }
+        // should change the tab title too
+        this.renameTab(workspace + '/' + oldName, workspace + '/' + newName)
+      } else {
+        if (isFolder) {
+          for (const tab of this.loadedTabs) {
+            if (tab.name.indexOf(this.fileManager.mode + '/' + oldName + '/') === 0) {
+              const newTabName = this.fileManager.mode + '/' + newName + tab.name.slice(this.fileManager.mode + '/' + oldName.length, tab.name.length)
+              this.renameTab(tab.name, newTabName)
+            }
           }
+          return
         }
-        return
+        // should change the tab title too
+        this.renameTab(this.fileManager.mode + '/' + oldName, workspace + '/' + newName)
       }
-      // should change the tab title too
-      this.renameTab(oldName, newName)
     })
 
     appManager.event.on('activate', ({ name, location, displayName, icon }) => {