feat: add icons to the menu items

Author: mariobuikhuizen

src/index.ts

@@ -11,7 +11,13 @@ import { INotebookTracker, NotebookActions } from "@jupyterlab/notebook";
 
 import { CommandRegistry } from '@lumino/commands';
 
-import { Menu } from '@lumino/widgets';
+import {
+  MenuSvg,
+  pythonIcon,
+  terminalIcon,
+  textEditorIcon,
+  folderIcon,
+} from '@jupyterlab/ui-components';
 
 import { listSnippets, Snippet, fetchSnippet } from "./snippets";
 
@@ -52,7 +58,7 @@ function toTree(snippets: Snippet[]) {
  * @param path The current path in the tree.
  */
 function createMenu(commands: CommandRegistry , tree: Tree, path: string[] = []) {
-  const menu = new Menu({ commands });
+  const menu = new MenuSvg({ commands });
   for (const [name, map] of tree.entries()) {
     const fullpath = path.concat(name);
     if (map.size === 0) {
@@ -63,6 +69,7 @@ function createMenu(commands: CommandRegistry , tree: Tree, path: string[] = [])
     } else {
       const submenu = createMenu(commands, map, path.concat(name));
       submenu.title.label = name;
+      submenu.title.icon = folderIcon;
       menu.addItem({type: 'submenu', submenu});
     }
   }
@@ -91,9 +98,16 @@ const extension: JupyterFrontEndPlugin<void> = {
     }
 
     commands.addCommand(CommandIDs.open, {
-      label: args => {
-        const label = args['label'] as string;
-        return PathExt.basename(label, PathExt.extname(label));
+      label: args => args['label'] as string,
+      icon: args => {
+        const ext = PathExt.extname(args['label'] as string);
+        if (ext === '.py') {
+          return pythonIcon;
+        }
+        if (ext === '.sh') {
+          return terminalIcon;
+        }
+        return textEditorIcon;
       },
       execute: async args => {
         const path = args['path'] as string[];