@notebook-intelligence/notebook-intelligence 2.4.2 → 2.6.0

package/src/index.ts

@@ -9,7 +9,7 @@ import {
 import { IDocumentManager } from '@jupyterlab/docmanager';
 import { DocumentWidget, IDocumentWidget } from '@jupyterlab/docregistry';
 
-import { Dialog, ICommandPalette } from '@jupyterlab/apputils';
+import { Dialog, ICommandPalette, MainAreaWidget } from '@jupyterlab/apputils';
 import { IMainMenu } from '@jupyterlab/mainmenu';
 
 import { IEditorLanguageRegistry } from '@jupyterlab/codemirror';
@@ -44,7 +44,7 @@ import { IStatusBar } from '@jupyterlab/statusbar';
 
 import {
   ChatSidebar,
-  ConfigurationDialogBody,
+  FormInputDialogBody,
   GitHubCopilotLoginDialogBody,
   GitHubCopilotStatusBarItem,
   InlinePromptWidget,
@@ -65,6 +65,7 @@ import {
 } from './tokens';
 import sparklesSvgstr from '../style/icons/sparkles.svg';
 import copilotSvgstr from '../style/icons/copilot.svg';
+import sparklesWarningSvgstr from '../style/icons/sparkles-warning.svg';
 
 import {
   applyCodeToSelectionInEditor,
@@ -81,6 +82,7 @@ import {
 import { UUID } from '@lumino/coreutils';
 
 import * as path from 'path';
+import { SettingsPanel } from './components/settings-panel';
 
 namespace CommandIDs {
   export const chatuserInput = 'notebook-intelligence:chat-user-input';
@@ -126,6 +128,8 @@ namespace CommandIDs {
     'notebook-intelligence:set-current-file-content';
   export const openMCPConfigEditor =
     'notebook-intelligence:open-mcp-config-editor';
+  export const showFormInputDialog =
+    'notebook-intelligence:show-form-input-dialog';
 }
 
 const DOCUMENT_WATCH_INTERVAL = 1000;
@@ -140,6 +144,10 @@ const sparkleIcon = new LabIcon({
   svgstr: sparklesSvgstr
 });
 
+const sparkleWarningIcon = new LabIcon({
+  name: 'notebook-intelligence:sparkles-warning-icon',
+  svgstr: sparklesWarningSvgstr
+});
 const emptyNotebookContent: any = {
   cells: [],
   metadata: {},
@@ -711,7 +719,7 @@ const plugin: JupyterFrontEndPlugin<INotebookIntelligence> = {
     panel.id = 'notebook-intelligence-tab';
     panel.title.caption = 'Notebook Intelligence';
     const sidebarIcon = new LabIcon({
-      name: 'ui-components:palette',
+      name: 'notebook-intelligence:sidebar-icon',
       svgstr: sparklesSvgstr
     });
     panel.title.icon = sidebarIcon;
@@ -739,6 +747,26 @@ const plugin: JupyterFrontEndPlugin<INotebookIntelligence> = {
     app.shell.add(panel, 'left', { rank: 1000 });
     app.shell.activateById(panel.id);
 
+    const updateSidebarIcon = () => {
+      if (NBIAPI.getChatEnabled()) {
+        panel.title.icon = sidebarIcon;
+      } else {
+        panel.title.icon = sparkleWarningIcon;
+      }
+    };
+
+    NBIAPI.githubLoginStatusChanged.connect((_, args) => {
+      updateSidebarIcon();
+    });
+
+    NBIAPI.configChanged.connect((_, args) => {
+      updateSidebarIcon();
+    });
+
+    setTimeout(() => {
+      updateSidebarIcon();
+    }, 2000);
+
     app.commands.addCommand(CommandIDs.chatuserInput, {
       execute: args => {
         NBIAPI.sendChatUserInput(args.id as string, args.data);
@@ -820,6 +848,39 @@ const plugin: JupyterFrontEndPlugin<INotebookIntelligence> = {
       }
     });
 
+    app.commands.addCommand(CommandIDs.showFormInputDialog, {
+      execute: async args => {
+        const title = args.title as string;
+        const fields = args.fields;
+
+        return new Promise<any>((resolve, reject) => {
+          let dialog: Dialog<unknown> | null = null;
+          const dialogBody = new FormInputDialogBody({
+            fields: fields,
+            onDone: (formData: any) => {
+              dialog.dispose();
+              resolve(formData);
+            }
+          });
+          dialog = new Dialog({
+            title: title,
+            hasClose: true,
+            body: dialogBody,
+            buttons: []
+          });
+
+          dialog
+            .launch()
+            .then((result: any) => {
+              reject();
+            })
+            .catch(() => {
+              reject(new Error('Failed to show form input dialog'));
+            });
+        });
+      }
+    });
+
     app.commands.addCommand(CommandIDs.createNewNotebookFromPython, {
       execute: async args => {
         let pythonKernelSpec = null;
@@ -1229,31 +1290,36 @@ const plugin: JupyterFrontEndPlugin<INotebookIntelligence> = {
       }
     });
 
+    const createNewSettingsWidget = () => {
+      const settingsPanel = new SettingsPanel({
+        onSave: () => {
+          NBIAPI.fetchCapabilities();
+        },
+        onEditMCPConfigClicked: () => {
+          app.commands.execute('notebook-intelligence:open-mcp-config-editor');
+        }
+      });
+
+      const widget = new MainAreaWidget({ content: settingsPanel });
+      widget.id = 'nbi-settings';
+      widget.title.label = 'NBI Settings';
+      widget.title.closable = true;
+
+      return widget;
+    };
+
+    let settingsWidget = createNewSettingsWidget();
+
     app.commands.addCommand(CommandIDs.openConfigurationDialog, {
       label: 'Notebook Intelligence Settings',
       execute: args => {
-        let dialog: Dialog<unknown> | null = null;
-        const dialogBody = new ConfigurationDialogBody({
-          onSave: () => {
-            dialog?.dispose();
-            NBIAPI.fetchCapabilities();
-          },
-          onEditMCPConfigClicked: () => {
-            dialog?.dispose();
-            app.commands.execute(
-              'notebook-intelligence:open-mcp-config-editor'
-            );
-          }
-        });
-        dialog = new Dialog({
-          title: 'Notebook Intelligence Settings',
-          hasClose: true,
-          body: dialogBody,
-          buttons: []
-        });
-        dialog.node.classList.add('config-dialog-container');
-
-        dialog.launch();
+        if (settingsWidget.isDisposed) {
+          settingsWidget = createNewSettingsWidget();
+        }
+        if (!settingsWidget.isAttached) {
+          app.shell.add(settingsWidget, 'main');
+        }
+        app.shell.activateById(settingsWidget.id);
       }
     });
 
@@ -1496,6 +1562,8 @@ const plugin: JupyterFrontEndPlugin<INotebookIntelligence> = {
         existingCode,
         prefix: prefix,
         suffix: suffix,
+        language: ActiveDocumentWatcher.activeDocumentInfo.language,
+        filename: ActiveDocumentWatcher.activeDocumentInfo.filePath,
         onRequestSubmitted: (prompt: string) => {
           userPrompt = prompt;
           generatedContent = '';

package/src/tokens.ts

@@ -32,7 +32,8 @@ export enum BackendMessageType {
   StreamMessage = 'stream-message',
   StreamEnd = 'stream-end',
   RunUICommand = 'run-ui-command',
-  GitHubCopilotLoginStatusChange = 'github-copilot-login-status-change'
+  GitHubCopilotLoginStatusChange = 'github-copilot-login-status-change',
+  MCPServerStatusChange = 'mcp-server-status-change'
 }
 
 export enum ResponseStreamDataType {
@@ -52,6 +53,18 @@ export enum ContextType {
   CurrentFile = 'current-file'
 }
 
+export enum MCPServerStatus {
+  NotConnected = 'not-connected',
+  Connecting = 'connecting',
+  Disconnecting = 'disconnecting',
+  FailedToConnect = 'failed-to-connect',
+  Connected = 'connected',
+  UpdatingToolList = 'updating-tool-list',
+  UpdatedToolList = 'updated-tool-list',
+  UpdatingPromptList = 'updating-prompt-list',
+  UpdatedPromptList = 'updated-prompt-list'
+}
+
 export interface IContextItem {
   type: ContextType;
   content: string;

package/style/base.css

@@ -355,7 +355,7 @@ pre:has(.code-block-header) {
   border: 1px solid var(--jp-border-color1);
   flex-direction: column;
   position: absolute;
-  bottom: 98px;
+  bottom: 80px;
   left: 4px;
   gap: 2px;
   /* stylelint-disable */
@@ -602,7 +602,6 @@ body[data-jp-theme-light='false'] .inline-popover {
   display: flex;
   flex-direction: column;
   overflow-y: auto;
-  padding: 10px 0;
   gap: 15px;
 }
 
@@ -829,3 +828,105 @@ svg.access-token-warning {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
+.nbi-settings-panel {
+  display: flex;
+  height: 100%;
+}
+
+.nbi-settings-panel-tabs {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding: 10px;
+  width: 150px;
+  background-color: var(--jp-layout-color2);
+}
+
+.nbi-settings-panel-tab {
+  cursor: pointer;
+  padding: 10px;
+  border-radius: 4px;
+}
+
+.nbi-settings-panel-tab:hover {
+  background-color: var(--jp-layout-color1);
+}
+
+.nbi-settings-panel-tab.active {
+  background-color: var(--jp-layout-color1);
+  font-weight: bold;
+}
+
+.nbi-settings-panel-tab-content {
+  flex-grow: 1;
+  padding: 20px;
+}
+
+.pill-item {
+  cursor: pointer;
+  background-color: var(--jp-layout-color1);
+  display: inline-block;
+  padding: 2px 6px;
+  margin: 2px 4px;
+  border-radius: 4px;
+}
+
+.pill-item:hover {
+  cursor: pointer;
+  background-color: var(--jp-layout-color2);
+}
+
+.pill-item.checked {
+  background-color: var(--jp-layout-color3);
+}
+
+.server-status-indicator {
+  width: 10px;
+  height: 10px;
+  margin: 2px;
+  border-radius: 50%;
+  background-color: var(--jp-brand-color0);
+}
+
+.server-status-indicator.connected,
+.server-status-indicator.updated-tool-list,
+.server-status-indicator.updated-prompt-list {
+  background-color: var(--jp-success-color1);
+}
+
+.server-status-indicator.connecting,
+.server-status-indicator.disconnecting,
+.server-status-indicator.updating-tool-list,
+.server-status-indicator.updating-prompt-list {
+  background-color: var(--jp-warn-color1);
+}
+
+.server-status-indicator.not-connected,
+.server-status-indicator.failed-to-connect {
+  background-color: var(--jp-error-color1);
+}
+
+.form-input-dialog-body {
+  width: 500px;
+}
+
+.form-input-dialog-body-content-fields {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.form-input-dialog-body-content-field {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+.form-input-dialog-body-content-field-label {
+  width: 50%;
+}
+
+.form-input-dialog-body-content-field-input {
+  width: 50%;
+}

package/style/icons/sparkles-warning.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="var(--jp-inverse-layout-color3)"><path d="M 5.398 10.807 C 5.574 10.931 5.785 10.998 6 10.997 C 6.216 10.998 6.427 10.93 6.602 10.804 C 6.78 10.674 6.915 10.494 6.989 10.286 L 7.436 8.913 C 7.551 8.569 7.744 8.256 8 7.999 C 8.257 7.743 8.569 7.549 8.913 7.434 L 10.304 6.983 C 10.456 6.929 10.594 6.84 10.706 6.724 C 10.817 6.608 10.901 6.467 10.949 6.313 C 10.998 6.159 11.01 5.996 10.985 5.837 C 10.96 5.677 10.898 5.526 10.804 5.394 C 10.67 5.208 10.479 5.071 10.26 5.003 L 8.885 4.556 C 8.541 4.442 8.228 4.249 7.971 3.993 C 7.714 3.736 7.52 3.424 7.405 3.079 L 6.953 1.691 C 6.881 1.489 6.748 1.314 6.571 1.191 C 6.439 1.098 6.286 1.036 6.125 1.012 C 5.965 0.987 5.801 1.001 5.646 1.051 C 5.492 1.101 5.351 1.187 5.236 1.301 C 5.12 1.415 5.033 1.555 4.98 1.708 L 4.523 3.108 C 4.409 3.443 4.22 3.748 3.97 3.999 C 3.721 4.25 3.418 4.441 3.083 4.557 L 1.692 5.005 C 1.541 5.06 1.404 5.149 1.292 5.265 C 1.18 5.381 1.097 5.521 1.048 5.675 C 1 5.829 0.988 5.992 1.013 6.151 C 1.038 6.31 1.099 6.462 1.192 6.593 C 1.32 6.773 1.501 6.908 1.709 6.979 L 3.083 7.424 C 3.524 7.571 3.91 7.845 4.193 8.212 C 4.356 8.423 4.481 8.66 4.564 8.912 L 5.016 10.303 C 5.088 10.507 5.222 10.683 5.398 10.807 Z M 11.535 14.849 C 11.671 14.946 11.834 14.997 12 14.997 C 12.165 14.997 12.326 14.946 12.461 14.851 C 12.601 14.753 12.706 14.613 12.761 14.451 L 13.009 13.689 C 13.063 13.531 13.152 13.387 13.269 13.268 C 13.387 13.15 13.531 13.061 13.689 13.009 L 14.461 12.757 C 14.619 12.703 14.756 12.6 14.852 12.464 C 14.926 12.361 14.974 12.242 14.992 12.117 C 15.011 11.992 14.999 11.865 14.959 11.745 C 14.918 11.625 14.85 11.516 14.76 11.428 C 14.669 11.34 14.559 11.274 14.438 11.236 L 13.674 10.987 C 13.516 10.935 13.372 10.846 13.254 10.729 C 13.136 10.611 13.047 10.467 12.994 10.309 L 12.742 9.536 C 12.689 9.379 12.586 9.242 12.449 9.146 C 12.347 9.073 12.23 9.025 12.106 9.006 C 11.982 8.987 11.855 8.998 11.736 9.037 C 11.616 9.076 11.508 9.142 11.419 9.231 C 11.33 9.319 11.264 9.427 11.224 9.546 L 10.977 10.308 C 10.925 10.466 10.838 10.61 10.721 10.728 C 10.607 10.845 10.467 10.934 10.312 10.987 L 9.539 11.239 C 9.38 11.293 9.242 11.396 9.145 11.533 C 9.047 11.669 8.995 11.833 8.996 12.001 C 8.997 12.169 9.051 12.333 9.15 12.468 C 9.249 12.604 9.388 12.705 9.547 12.757 L 10.31 13.004 C 10.469 13.058 10.614 13.147 10.732 13.265 C 10.851 13.384 10.939 13.528 10.99 13.687 L 11.243 14.461 C 11.298 14.618 11.4 14.753 11.535 14.849 Z"/>
+<g class="layer">
+<circle cx="12" cy="4" fill="#FF0000" r="4" stroke="#FFFFFF" stroke-width="0"/>
+</g>
+</svg>