Implement removal of context menu items

apps/remix-ide/src/app/panels/file-panel.js

@@ -60,6 +60,7 @@ module.exports = class Filepanel extends ViewPlugin {
     this.gitHandle = new GitHandle()
     this.hardhatHandle = new HardhatHandle()
     this.registeredMenuItems = []
+    this.removedMenuItems = []
     this.request = {}
     this.workspaces = []
     this.initialWorkspace = null
@@ -89,6 +90,7 @@ module.exports = class Filepanel extends ViewPlugin {
         request={this.request}
         workspaces={this.workspaces}
         registeredMenuItems={this.registeredMenuItems}
+        removedMenuItems={this.removedMenuItems}
         initialWorkspace={this.initialWorkspace}
       />
       , this.el)
@@ -106,12 +108,17 @@ module.exports = class Filepanel extends ViewPlugin {
       return o.id === item.id & o.name === item.name
     }).length) throw new Error(`Action ${item.name} already exists on ${item.id}`)
     this.registeredMenuItems = [...this.registeredMenuItems, item]
+    this.removedMenuItems = this.removedMenuItems.filter(id => item.id !== id)
     this.renderComponent()
   }
 
   removePluginActions (plugin) {
     this.registeredMenuItems = this.registeredMenuItems.filter((item) => {
-      return item.id !== plugin.name || item.sticky === true
+      if (item.id !== plugin.name || item.sticky === true) return true
+      else {
+        this.removedMenuItems.push(item.id)
+        return false
+      }
     })
     this.renderComponent()
   }
@@ -198,7 +205,6 @@ module.exports = class Filepanel extends ViewPlugin {
         }
       })
     })
-
   }
 
   async createNewFile () {

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

@@ -17,52 +17,8 @@ import './css/file-explorer.css'
 
 const queryParams = new QueryParams()
 
-const initialActions = [{
-  id: 'newFile',
-  name: 'New File',
-  type: ['folder'],
-  path: [],
-  extension: [],
-  pattern: []
-}, {
-  id: 'newFolder',
-  name: 'New Folder',
-  type: ['folder'],
-  path: [],
-  extension: [],
-  pattern: []
-}, {
-  id: 'rename',
-  name: 'Rename',
-  type: ['file', 'folder'],
-  path: [],
-  extension: [],
-  pattern: []
-}, {
-  id: 'delete',
-  name: 'Delete',
-  type: ['file', 'folder'],
-  path: [],
-  extension: [],
-  pattern: []
-}, {
-  id: 'pushChangesToGist',
-  name: 'Push changes to gist',
-  type: [],
-  path: [],
-  extension: [],
-  pattern: ['^browser/gists/([0-9]|[a-z])*$']
-}, {
-  id: 'run',
-  name: 'Run',
-  type: [],
-  path: [],
-  extension: ['.js'],
-  pattern: []
-}]
-
 export const FileExplorer = (props: FileExplorerProps) => {
-  const { name, registry, plugin, focusRoot, contextMenuItems, displayInput, externalUploads } = props
+  const { name, registry, plugin, focusRoot, contextMenuItems, displayInput, externalUploads, removedContextMenuItems } = props
   const [state, setState] = useState({
     focusElement: [{
       key: '',
@@ -248,6 +204,12 @@ export const FileExplorer = (props: FileExplorerProps) => {
     }
   }, [contextMenuItems])
 
+  useEffect(() => {
+    if (removedContextMenuItems) {
+      removeMenuItems(removedContextMenuItems)
+    }
+  }, [removedContextMenuItems])
+
   useEffect(() => {
     if (displayInput) {
       handleNewFileInput()

libs/remix-ui/file-explorer/src/lib/types/index.ts

@@ -9,8 +9,9 @@ export interface FileExplorerProps {
     plugin: any,
     focusRoot: boolean,
     contextMenuItems: MenuItems,
+    removedContextMenuItems: string[],
     displayInput?: boolean,
-    externalUploads?: EventTarget & HTMLInputElement
+    externalUploads?: EventTarget & HTMLInputElement,
 }
 
 export interface File {