add section file context menu

libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx

@@ -72,12 +72,15 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) =>
   }
 
   const menu = () => {
+    let group = 0
     return actions.filter(item => filterItem(item)).map((item, index) => {
+      const className = `remixui_liitem ${group !== item.group ? 'border-top': ''}`
+      group = item.group
       if(item.name === "Upload File"){
         return <li
         id={`menuitem${item.name.toLowerCase()}`}
         key={index}
-        className='remixui_liitem'
+        className={className}
         onClick={()=>{
           _paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'uploadFile'])
           setShowFileExplorer(true)
@@ -89,7 +92,7 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) =>
         return <li
         id={`menuitem${item.name.toLowerCase()}`}
         key={index}
-        className='remixui_liitem'
+        className={className}
         onClick={()=>{
           _paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'uploadFile'])
           setShowFileExplorer(true)
@@ -99,7 +102,7 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) =>
       return <li
         id={`menuitem${item.name.toLowerCase()}`}
         key={index}
-        className='remixui_liitem'
+        className={className}
         onClick={(e) => {
           e.stopPropagation()
           switch (item.name) {

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

@@ -76,7 +76,8 @@ export function Workspace () {
         extension: [],
         pattern: [],
         multiselect: false,
-        label: ''
+        label: '',
+        group: 4
       }])
     } else {
       removeMenuItems([{
@@ -87,7 +88,8 @@ export function Workspace () {
         extension: [],
         pattern: [],
         multiselect: false,
-        label: ''
+        label: '',
+        group: 4
       }])
     }
   }, [canPaste])

libs/remix-ui/workspace/src/lib/types/index.ts

@@ -5,7 +5,7 @@ import { fileDecoration } from '@remix-ui/file-decorators'
 import { RemixAppManager } from 'libs/remix-ui/plugin-manager/src/types'
 import { ViewPlugin } from '@remixproject/engine-web'
 
-export type action = { name: string, type?: Array<'folder' | 'gist' | 'file' | 'workspace'>, path?: string[], extension?: string[], pattern?: string[], id: string, multiselect: boolean, label: string, sticky?: boolean }
+export type action = { name: string, type?: Array<'folder' | 'gist' | 'file' | 'workspace'>, path?: string[], extension?: string[], pattern?: string[], id: string, multiselect: boolean, label: string, sticky?: boolean, group: number }
 export interface JSONStandardInput {
   language: "Solidity";
   settings?: any,
@@ -176,7 +176,8 @@ export interface WorkSpaceState {
       extension?: string[]
       pattern?: string[]
       multiselect: boolean
-      label: string
+      label: string,
+      group: number
     }[]
     focusContext: FileFocusContextType
     focusEdit: {

libs/remix-ui/workspace/src/lib/utils/index.ts

@@ -5,96 +5,112 @@ export const contextMenuActions: MenuItems = [{
   name: 'New File',
   type: ['folder', 'gist', 'workspace'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 0
 }, {
   id: 'newFolder',
   name: 'New Folder',
   type: ['folder', 'gist', 'workspace'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 0
 }, {
   id: 'rename',
   name: 'Rename',
   type: ['file', 'folder'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 0
 }, {
   id: 'delete',
   name: 'Delete',
   type: ['file', 'folder', 'gist'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 0
+},{
+  id: 'deleteAll',
+  name: 'Delete All',
+  type: ['folder', 'file'],
+  multiselect: true,
+  label: '',
+  group: 0
 },{
   id: 'download',
   name: 'Download',
   type: ['file', 'folder', 'workspace'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 1
 }, {
   id: 'run',
   name: 'Run',
   extension: ['.js', '.ts'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 2
 },{
   id: 'pushChangesToGist',
   name: 'Push changes to gist',
   type: ['gist'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 3
 }, {
   id: 'publishFolderToGist',
   name: 'Publish folder to gist',
   type: ['folder'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 3
 }, {
   id: 'publishFileToGist',
   name: 'Publish file to gist',
   type: ['file'],
   multiselect: false,
-  label: ''
-}, {
-  id: 'copy',
-  name: 'Copy',
-  type: ['folder', 'file'],
-  multiselect: false,
-  label: ''
-}, {
-  id: 'copyFileName',
-  name: 'Copy name',
-  type: ['file'],
-  multiselect: false,
-  label: ''
-}, {
-  id: 'copyFilePath',
-  name: 'Copy path',
-  type: ['file'],
-  multiselect: false,
-  label: ''
-}, {
-  id: 'deleteAll',
-  name: 'Delete All',
-  type: ['folder', 'file'],
-  multiselect: true,
-  label: ''
+  label: '',
+  group: 3
 }, {
   id: 'uploadFile',
   name: 'Load a Local File',
   type: ['folder', 'gist', 'workspace'],
   multiselect: false,
-  label: 'Load a Local File'
+  label: 'Load a Local File',
+  group: 3
 }, {
   id: 'publishToGist',
   name: 'Push changes to gist',
   type: ['folder', 'gist'],
   multiselect: false,
-  label: 'Publish all to Gist'
+  label: 'Publish all to Gist',
+  group: 3
 },
 {
   id: 'publishWorkspace',
   name: 'Publish Workspace to Gist',
   type: ['workspace'],
   multiselect: false,
-  label: ''
+  label: '',
+  group: 3
+}, {
+  id: 'copy',
+  name: 'Copy',
+  type: ['folder', 'file'],
+  multiselect: false,
+  label: '',
+  group: 4
+}, {
+  id: 'copyFileName',
+  name: 'Copy name',
+  type: ['file'],
+  multiselect: false,
+  label: '',
+  group: 4
+}, {
+  id: 'copyFilePath',
+  name: 'Copy path',
+  type: ['file'],
+  multiselect: false,
+  label: '',
+  group: 4
 }]