Merge pull request #352 from XpressAI/fahreza/xircuits-help-items

✨ Xircuits Help Options

package.json

@@ -61,6 +61,7 @@
     "@jupyterlab/fileeditor": "4.0.9",
     "@jupyterlab/launcher": "^4.0.9",
     "@jupyterlab/logconsole": "^4.0.9",
+    "@jupyterlab/mainmenu": "^4.0.9",
     "@jupyterlab/services": "^7.0.0",
     "@jupyterlab/settingregistry": "^4.0.0",
     "@projectstorm/geometry": "^7.0.2",

src/commands/CommandIDs.tsx

@@ -35,5 +35,6 @@ export const commandIDs = {
   executeToOutputPanel: "Xircuit-output-panel:execute",
   createNewComponentLibrary: "Xircuit-editor:new-component-library",
   refreshComponentList: "xircuits-sidebar:refresh-component-list",
-  toggleDisplayNodesInLibrary: "xircuits-sidebar:toggle-display-nodes-in-library"
+  toggleDisplayNodesInLibrary: "xircuits-sidebar:toggle-display-nodes-in-library",
+  helpOpenResource: "xircuits-help:open-resource"
 };

src/helpers/HelpResources.tsx

@@ -0,0 +1,52 @@
+import { JupyterFrontEnd } from '@jupyterlab/application';
+import { IMainMenu } from '@jupyterlab/mainmenu';
+import { ITranslator } from '@jupyterlab/translation';
+import { xircuitsIcon } from '../ui-components/icons';
+import { commandIDs } from '../commands/CommandIDs';
+
+interface HelpResource {
+  text: string;
+  url: string;
+}
+
+export function addHelpResources(
+  app: JupyterFrontEnd,
+  mainMenu: IMainMenu,
+  translator: ITranslator
+): void {
+  const { commands } = app;
+  const trans = translator.load('xircuits');
+
+  const resources: HelpResource[] = [
+    {
+      text: trans.__('Xircuits Tutorials'),
+      url: 'https://xircuits.io/docs/category/tutorials'
+    },
+    {
+      text: trans.__('Xircuits Concepts'),
+      url: 'https://xircuits.io/docs/category/explanations'
+    },
+    {
+      text: trans.__('More Xircuits Documentation'),
+      url: 'https://xircuits.io/docs/main/'
+    },
+  ];
+
+  const xircuitsHelpGroup = [];
+
+  resources.forEach((resource, index) => {
+    const commandId = `${commandIDs.helpOpenResource}:${index}`;
+    commands.addCommand(commandId, {
+      label: resource.text,
+      icon: xircuitsIcon,
+      execute: () => {
+        window.open(resource.url);
+      }
+    });
+
+    xircuitsHelpGroup.push({ command: commandId });
+  });
+
+  // Add the Xircuits help group to the beginning of the Help menu
+  mainMenu.helpMenu.addGroup(xircuitsHelpGroup, -1);
+}

src/index.tsx

@@ -27,10 +27,12 @@ import { Token } from '@lumino/coreutils';
 import { DockLayout } from '@lumino/widgets';
 import { xircuitsIcon, componentLibIcon, changeFavicon, xircuitsFaviconLink } from './ui-components/icons';
 import { createInitXircuits } from './helpers/CanvasInitializer';
+import { addHelpResources } from './helpers/HelpResources';
 import type { CommandRegistry } from "@lumino/commands/src";
 import type { Signal } from "@lumino/signaling";
 import { commandIDs } from "./commands/CommandIDs";
 import { IEditorTracker } from '@jupyterlab/fileeditor';
+import { IMainMenu } from '@jupyterlab/mainmenu';
 
 const FACTORY = 'Xircuits editor';
 
@@ -57,8 +59,9 @@ const xircuits: JupyterFrontEndPlugin<void> = {
     ILayoutRestorer,
     IRenderMimeRegistry,
     IDocumentManager,
+    IMainMenu,
     ITranslator,
-    IEditorTracker
+    IEditorTracker,
   ],
   provides: IXircuitsDocTracker,
   activate: async (
@@ -68,6 +71,7 @@ const xircuits: JupyterFrontEndPlugin<void> = {
     restorer: ILayoutRestorer,
     rendermime: IRenderMimeRegistry,
     docmanager: IDocumentManager,
+    mainMenu?: IMainMenu,
     translator?: ITranslator,
     editorTracker?: IEditorTracker,
   ) => {
@@ -160,6 +164,8 @@ const xircuits: JupyterFrontEndPlugin<void> = {
     // Additional commands for chat actions
     addLibraryActionCommands(app, tracker, translator, widgetFactory);
 
+    // Additional main menu options for help resources
+    addHelpResources(app, mainMenu, translator);
 
     // Commands to emit WidgetFactory signals
     const emitSignal = (signal: Signal<unknown, unknown>) =>  (args: unknown) => signal.emit(args);