feat: support to set the default context menu in folderTree (#363)

DTStack · Aug 25, 2021 · bbb3021 · bbb3021
1 parent 02da8bb
commit bbb3021
Show file tree

Hide file tree

Showing 2 changed files with 62 additions and 5 deletions.
diff --git a/src/controller/explorer/folderTree.tsx b/src/controller/explorer/folderTree.tsx
@@ -5,9 +5,7 @@ import { Controller } from 'mo/react/controller';
 import { ITreeNodeItemProps } from 'mo/components/tree';
 import { IMenuItemProps } from 'mo/components/menu';
 import {
-    BASE_CONTEXT_MENU,
     ROOT_FOLDER_CONTEXT_MENU,
-    FILE_CONTEXT_MENU,
     NEW_FILE_COMMAND_ID,
     NEW_FOLDER_COMMAND_ID,
     RENAME_COMMAND_ID,
@@ -47,18 +45,21 @@ export class FolderTreeController
         const menus: IMenuItemProps[] = cloneDeep(
             this.folderTreeService.getState().folderTree?.contextMenu || []
         );
+
+        const fileContextMenu = this.folderTreeService.getFileContextMenu();
+        const folderContextMenu = this.folderTreeService.getFolderContextMenu();
         switch (treeNode.fileType) {
             case FileTypes.File: {
-                menus.unshift(...FILE_CONTEXT_MENU);
+                menus.unshift(...fileContextMenu);
                 break;
             }
             case FileTypes.Folder: {
-                menus.unshift(...BASE_CONTEXT_MENU);
+                menus.unshift(...folderContextMenu);
                 break;
             }
             case FileTypes.RootFolder: {
                 // In general, root folder have no contextMenu, because it can't be clicked
-                return BASE_CONTEXT_MENU.concat(
+                return folderContextMenu.concat(
                     ROOT_FOLDER_CONTEXT_MENU
                 ) as IMenuItemProps[];
             }

diff --git a/src/services/workbench/explorer/folderTreeService.ts b/src/services/workbench/explorer/folderTreeService.ts
@@ -9,6 +9,8 @@ import {
     IFolderTree,
     IFolderTreeModel,
     IFolderTreeSubItem,
+    BASE_CONTEXT_MENU,
+    FILE_CONTEXT_MENU,
 } from 'mo/model/workbench/explorer/folderTree';
 import { TreeViewUtil } from '../../helper';
 import { ITreeNodeItemProps } from 'mo/components/tree';
@@ -38,6 +40,14 @@ export interface IFolderTreeService extends Component<IFolderTree> {
      * @param id
      */
     get(id: number): ITreeNodeItemProps | null;
+    /**
+     * Get the context menus for file
+     */
+    getFileContextMenu: () => IMenuItemProps[];
+    /**
+     * Get the context menus for folder
+     */
+    getFolderContextMenu: () => IMenuItemProps[];
     /**
      * Active specific node,
      * or unactive any node in folder tree
@@ -49,6 +59,15 @@ export interface IFolderTreeService extends Component<IFolderTree> {
      * @param entry
      */
     setEntry(entry: React.ReactNode): void;
+    /**
+     * Set the context menus for file
+     * @param menus
+     */
+    setFileContextMenu: (menus: IMenuItemProps[]) => void;
+    /**
+     * Set the context menus for folder
+     */
+    setFolderContextMenu: (menus: IMenuItemProps[]) => void;
     /**
      * Listen to event about clicking rename button
      * @param callback
@@ -89,6 +108,16 @@ export interface IFolderTreeService extends Component<IFolderTree> {
      * @param callback
      */
     onCreate(callback: (type: FileType, nodeId?: number) => void): void;
+    /**
+     * Listen to the click event about the context menu except for built-in menus
+     * @param callback
+     */
+    onContextMenu(
+        callback: (
+            treeNode: ITreeNodeItemProps,
+            contextMenu: IMenuItemProps
+        ) => void
+    ): void;
 }
 
 @singleton()
@@ -97,13 +126,31 @@ export class FolderTreeService
     implements IFolderTreeService {
     protected state: IFolderTree;
     private readonly explorerService: IExplorerService;
+    private fileContextMenu: IMenuItemProps[] = FILE_CONTEXT_MENU;
+    private folderContextMenu: IMenuItemProps[] = BASE_CONTEXT_MENU;
 
     constructor() {
         super();
         this.state = container.resolve(IFolderTreeModel);
         this.explorerService = container.resolve(ExplorerService);
     }
 
+    public getFileContextMenu() {
+        return this.fileContextMenu;
+    }
+
+    public setFileContextMenu(menus: IMenuItemProps[]) {
+        this.fileContextMenu = menus;
+    }
+
+    public getFolderContextMenu() {
+        return this.folderContextMenu;
+    }
+
+    public setFolderContextMenu(menus: IMenuItemProps[]) {
+        this.folderContextMenu = menus;
+    }
+
     /**
      * Returns the node of root folder in folderTree
      */
@@ -276,4 +323,13 @@ export class FolderTreeService
     public onCreate = (callback: (type: FileType, nodeId?: number) => void) => {
         this.subscribe(FolderTreeEvent.onCreate, callback);
     };
+
+    public onContextMenu = (
+        callback: (
+            treeNode: ITreeNodeItemProps,
+            contextMenu: IMenuItemProps
+        ) => void
+    ) => {
+        this.subscribe(FolderTreeEvent.onContextMenuClick, callback);
+    };
 }