From 3925c1eedd35e7333b4a49e7dce0f5f9ff7ac395 Mon Sep 17 00:00:00 2001 From: yann300 Date: Wed, 31 May 2023 12:29:24 +0200 Subject: [PATCH 1/6] add section file context menu --- .../components/file-explorer-context-menu.tsx | 9 +- .../workspace/src/lib/remix-ui-workspace.tsx | 6 +- .../remix-ui/workspace/src/lib/types/index.ts | 5 +- .../remix-ui/workspace/src/lib/utils/index.ts | 88 +++++++++++-------- 4 files changed, 65 insertions(+), 43 deletions(-) diff --git a/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx b/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx index 825d66667d..dc268ef6ef 100644 --- a/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx +++ b/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
  • { _paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'uploadFile']) setShowFileExplorer(true) @@ -89,7 +92,7 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) => return
  • { _paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'uploadFile']) setShowFileExplorer(true) @@ -99,7 +102,7 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) => return
  • { e.stopPropagation() switch (item.name) { diff --git a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx index 648206b32b..a64ddb8979 100644 --- a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx +++ b/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]) diff --git a/libs/remix-ui/workspace/src/lib/types/index.ts b/libs/remix-ui/workspace/src/lib/types/index.ts index 7247800715..5ded4df7d4 100644 --- a/libs/remix-ui/workspace/src/lib/types/index.ts +++ b/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: { diff --git a/libs/remix-ui/workspace/src/lib/utils/index.ts b/libs/remix-ui/workspace/src/lib/utils/index.ts index f908451d19..fa04c244f1 100644 --- a/libs/remix-ui/workspace/src/lib/utils/index.ts +++ b/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: '' + label: '', + group: 3 }, { - id: 'deleteAll', - name: 'Delete All', - type: ['folder', 'file'], - multiselect: true, - label: '' -},{ 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 }] \ No newline at end of file From 8be8eb9f475bcf606f3a281fc43fef9da1d0afae Mon Sep 17 00:00:00 2001 From: yann300 Date: Wed, 31 May 2023 12:53:42 +0200 Subject: [PATCH 2/6] fix test --- apps/remix-ide-e2e/src/tests/remixd.test.ts | 2 +- apps/remix-ide-e2e/src/tests/solidityImport.test.ts | 5 +++-- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/apps/remix-ide-e2e/src/tests/remixd.test.ts b/apps/remix-ide-e2e/src/tests/remixd.test.ts index 1d9493016d..a1a617f645 100644 --- a/apps/remix-ide-e2e/src/tests/remixd.test.ts +++ b/apps/remix-ide-e2e/src/tests/remixd.test.ts @@ -104,7 +104,7 @@ module.exports = { }) .addFile('test_import_node_modules_with_github_import.sol', sources[4]['test_import_node_modules_with_github_import.sol']) .clickLaunchIcon('solidity') - .setSolidityCompilerVersion('soljson-v0.8.0+commit.c7dfd78e.js') // open-zeppelin moved to pragma ^0.8.0 + .setSolidityCompilerVersion('soljson-v0.8.19+commit.7dd6d404.js') // open-zeppelin moved to pragma ^0.8.0 .testContracts('test_import_node_modules_with_github_import.sol', sources[4]['test_import_node_modules_with_github_import.sol'], ['ERC20', 'test11']) }, 'Static Analysis run with remixd #group3': '' + function (browser) { diff --git a/apps/remix-ide-e2e/src/tests/solidityImport.test.ts b/apps/remix-ide-e2e/src/tests/solidityImport.test.ts index 115119e996..79bddb5ed5 100644 --- a/apps/remix-ide-e2e/src/tests/solidityImport.test.ts +++ b/apps/remix-ide-e2e/src/tests/solidityImport.test.ts @@ -38,7 +38,7 @@ module.exports = { 'Test GitHub Import - from master branch #group1': function (browser: NightwatchBrowser) { browser - .setSolidityCompilerVersion('soljson-v0.8.0+commit.c7dfd78e.js') // open-zeppelin moved to pragma ^0.8.0 (master branch) + .setSolidityCompilerVersion('soljson-v0.8.19+commit.7dd6d404.js') // open-zeppelin moved to pragma ^0.8.19 (master branch) .addFile('Untitled4.sol', sources[3]['Untitled4.sol']) .clickLaunchIcon('filePanel') .verifyContracts(['test7', 'ERC20'], { wait: 10000 }) @@ -54,7 +54,7 @@ module.exports = { 'Test GitHub Import - no branch specified #group2': function (browser: NightwatchBrowser) { browser - .setSolidityCompilerVersion('soljson-v0.8.0+commit.c7dfd78e.js') // open-zeppelin moved to pragma ^0.8.0 (master branch) + .setSolidityCompilerVersion('soljson-v0.8.19+commit.7dd6d404.js') // open-zeppelin moved to pragma ^0.8.19 (master branch) .clickLaunchIcon('filePanel') .click('li[data-id="treeViewLitreeViewItemREADME.txt"') .addFile('Untitled6.sol', sources[5]['Untitled6.sol']) @@ -64,6 +64,7 @@ module.exports = { 'Test GitHub Import - raw URL #group4': function (browser: NightwatchBrowser) { browser + .setSolidityCompilerVersion('soljson-v0.8.19+commit.7dd6d404.js') // open-zeppelin moved to pragma ^0.8.0 (master branch) .clickLaunchIcon('filePanel') .click('li[data-id="treeViewLitreeViewItemREADME.txt"') .addFile('Untitled7.sol', sources[6]['Untitled7.sol']) From 3268c74d8ce1a006a44e756916a960626eeee501 Mon Sep 17 00:00:00 2001 From: yann300 Date: Wed, 31 May 2023 13:59:41 +0200 Subject: [PATCH 3/6] dynamically sort items --- apps/remix-ide/src/app/panels/file-panel.js | 9 +++ apps/remix-ide/src/app/tabs/compile-tab.js | 3 +- apps/remix-ide/src/remixAppManager.js | 12 ++-- .../components/file-explorer-context-menu.tsx | 18 ++++-- .../remix-ui/workspace/src/lib/utils/index.ts | 58 +++++++++---------- 5 files changed, 61 insertions(+), 39 deletions(-) diff --git a/apps/remix-ide/src/app/panels/file-panel.js b/apps/remix-ide/src/app/panels/file-panel.js index ccd9e4cec7..b391daf5bd 100644 --- a/apps/remix-ide/src/app/panels/file-panel.js +++ b/apps/remix-ide/src/app/panels/file-panel.js @@ -66,6 +66,15 @@ module.exports = class Filepanel extends ViewPlugin { /** * @param item { id: string, name: string, type?: string[], path?: string[], extension?: string[], pattern?: string[] } + * typically: + * group 0 for file manipulations + * group 1 for download operations + * group 2 for running operations (script for instance) + * group 3 for publishing operations (gist) + * group 4 for copying operations + * group 5 for solidity file operations (flatten for instance) + * group 6 for compiling operations + * group 7 for generating resource files (UML, documentation, ...) * @param callback (...args) => void */ registerContextMenuItem (item) { diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index d7fdc499e9..8531f2ead2 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -123,7 +123,8 @@ class CompileTab extends CompilerApiMixin(ViewPlugin) { // implements ICompilerA type: [], extension: ['.sol'], path: [], - pattern: [] + pattern: [], + group: 6 }) }) try { diff --git a/apps/remix-ide/src/remixAppManager.js b/apps/remix-ide/src/remixAppManager.js index 66f2b92bc3..73e4c755c0 100644 --- a/apps/remix-ide/src/remixAppManager.js +++ b/apps/remix-ide/src/remixAppManager.js @@ -192,7 +192,8 @@ export class RemixAppManager extends PluginManager { extension: ['.sol'], path: [], pattern: [], - sticky: true + sticky: true, + group: 5 }) await this.call('filePanel', 'registerContextMenuItem', { id: 'nahmii-compiler', @@ -202,7 +203,8 @@ export class RemixAppManager extends PluginManager { extension: ['.sol'], path: [], pattern: [], - sticky: true + sticky: true, + group: 6 }) await this.call('filePanel', 'registerContextMenuItem', { id: 'solidityumlgen', @@ -212,7 +214,8 @@ export class RemixAppManager extends PluginManager { extension: ['.sol'], path: [], pattern: [], - sticky: true + sticky: true, + group: 7 }) await this.call('filePanel', 'registerContextMenuItem', { id: 'doc-gen', @@ -222,7 +225,8 @@ export class RemixAppManager extends PluginManager { extension: ['.sol'], path: [], pattern: [], - sticky: true + sticky: true, + group: 7 }) } } diff --git a/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx b/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx index dc268ef6ef..b1554a0a89 100644 --- a/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx +++ b/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx @@ -73,13 +73,21 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) => const menu = () => { let group = 0 - return actions.filter(item => filterItem(item)).map((item, index) => { + const groupedActions = actions.filter(item => filterItem(item)).reduce((acc, item) => { + if (item.group === undefined || item.group === null) item.group = 99 + if (!acc[item.group]) acc[item.group] = [] + acc[item.group].push(item) + return acc; + }, []) + console.log(groupedActions) + return groupedActions.map((groupItem, groupIndex) => groupItem.map((item, index) => { + const key = groupIndex*index const className = `remixui_liitem ${group !== item.group ? 'border-top': ''}` group = item.group if(item.name === "Upload File"){ return
  • { _paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'uploadFile']) @@ -91,7 +99,7 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) => if(item.name === "Load a Local File"){ return
  • { _paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'uploadFile']) @@ -101,7 +109,7 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) => } return
  • { e.stopPropagation() @@ -173,7 +181,7 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) => } hideContextMenu() }}>{intl.formatMessage({id: `filePanel.${item.id}`, defaultMessage: item.label || item.name})}
  • - }) + })) } return ( diff --git a/libs/remix-ui/workspace/src/lib/utils/index.ts b/libs/remix-ui/workspace/src/lib/utils/index.ts index fa04c244f1..9069e827e0 100644 --- a/libs/remix-ui/workspace/src/lib/utils/index.ts +++ b/libs/remix-ui/workspace/src/lib/utils/index.ts @@ -35,55 +35,76 @@ export const contextMenuActions: MenuItems = [{ multiselect: true, label: '', group: 0 -},{ +}, { + id: 'copy', + name: 'Copy', + type: ['folder', 'file'], + multiselect: false, + label: '', + group: 1 +}, { + id: 'copyFileName', + name: 'Copy name', + type: ['file'], + multiselect: false, + label: '', + group: 1 +}, { + id: 'copyFilePath', + name: 'Copy path', + type: ['file'], + multiselect: false, + label: '', + group: 1 +}, { id: 'download', name: 'Download', type: ['file', 'folder', 'workspace'], multiselect: false, label: '', - group: 1 + group: 2 }, { id: 'run', name: 'Run', extension: ['.js', '.ts'], multiselect: false, label: '', - group: 2 + group: 3 },{ id: 'pushChangesToGist', name: 'Push changes to gist', type: ['gist'], multiselect: false, label: '', - group: 3 + group: 4 }, { id: 'publishFolderToGist', name: 'Publish folder to gist', type: ['folder'], multiselect: false, label: '', - group: 3 + group: 4 }, { id: 'publishFileToGist', name: 'Publish file to gist', type: ['file'], multiselect: false, label: '', - group: 3 + group: 4 }, { id: 'uploadFile', name: 'Load a Local File', type: ['folder', 'gist', 'workspace'], multiselect: false, label: 'Load a Local File', - group: 3 + group: 4 }, { id: 'publishToGist', name: 'Push changes to gist', type: ['folder', 'gist'], multiselect: false, label: 'Publish all to Gist', - group: 3 + group: 4 }, { id: 'publishWorkspace', @@ -91,26 +112,5 @@ export const contextMenuActions: MenuItems = [{ type: ['workspace'], multiselect: false, 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 }] \ No newline at end of file From 9915d980f794cd8d10e44a4df6f2ac9ad03d9f83 Mon Sep 17 00:00:00 2001 From: yann300 Date: Wed, 31 May 2023 14:36:53 +0200 Subject: [PATCH 4/6] fix key --- .../src/lib/components/file-explorer-context-menu.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx b/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx index b1554a0a89..d4b209c98d 100644 --- a/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx +++ b/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx @@ -80,8 +80,9 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) => return acc; }, []) console.log(groupedActions) + let key = -1 return groupedActions.map((groupItem, groupIndex) => groupItem.map((item, index) => { - const key = groupIndex*index + key++ const className = `remixui_liitem ${group !== item.group ? 'border-top': ''}` group = item.group if(item.name === "Upload File"){ From 88657471c14aba5c1ad081c9e0f5e12edb7f00d6 Mon Sep 17 00:00:00 2001 From: yann300 Date: Wed, 31 May 2023 14:37:08 +0200 Subject: [PATCH 5/6] remove log --- .../workspace/src/lib/components/file-explorer-context-menu.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx b/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx index d4b209c98d..b5e748a81d 100644 --- a/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx +++ b/libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx @@ -79,7 +79,6 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) => acc[item.group].push(item) return acc; }, []) - console.log(groupedActions) let key = -1 return groupedActions.map((groupItem, groupIndex) => groupItem.map((item, index) => { key++ From 4d6c49a347ffd67191ba4a1b4838dfd8a4bad21e Mon Sep 17 00:00:00 2001 From: yann300 Date: Wed, 31 May 2023 15:40:19 +0200 Subject: [PATCH 6/6] fix test --- apps/remix-ide-e2e/src/tests/plugin_api.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/remix-ide-e2e/src/tests/plugin_api.ts b/apps/remix-ide-e2e/src/tests/plugin_api.ts index 333a81fe1e..79cc466c76 100644 --- a/apps/remix-ide-e2e/src/tests/plugin_api.ts +++ b/apps/remix-ide-e2e/src/tests/plugin_api.ts @@ -217,7 +217,7 @@ module.exports = { .rightClickCustom('[data-id="treeViewLitreeViewItemcontracts/1_Storage.sol"]').useXpath().waitForElementVisible('//*[@id="menuitemtestcommand"]').click('//*[@id="menuitemtestcommand"]', async () => { // @ts-ignore browser.click('//*[@data-id="verticalIconsKindlocalPlugin"]').frame(0, async () => { - await clickAndCheckLog(browser, null, { id: 'localPlugin', name: 'testCommand', label: 'testCommand', type: [], extension: ['.sol'], path: ['contracts/1_Storage.sol'], pattern: [] }, null, null) + await clickAndCheckLog(browser, null, { id: 'localPlugin', name: 'testCommand', label: 'testCommand', type: [], extension: ['.sol'], path: ['contracts/1_Storage.sol'], pattern: [], group: 99 }, null, null) }) }) })