@notebook-intelligence/notebook-intelligence 1.3.1 → 1.3.3

package/README.md

@@ -45,19 +45,21 @@ for the frontend extension.
 
 ### Remembering GitHub Copilot login
 
-Notebook Intelligence uses system keyring to store the GitHub access tokens. If your stored access token fails to login (due to expiration or other reasons), you will be prompted to relogin on the UI. If you run into issues with this feature, check the Jupyter server logs and the [keyring package](https://github.com/jaraco/keyring) documentation.
+Notebook Intelligence can remember your GitHub Copilot login so that you don't need to re-login after a JupyterLab or system restart. Please be aware of the security implications of using this feature.
 
-To let Notebook Intelligence remember your GitHub access token after you logged in:
+> [!CAUTION]
+> If you configure NBI to remember your GitHub Copilot login, it will encrypt the token and store into a data file at `~/.jupyter/nbi-data.json`. You should never share this file with others as they can access your tokens.
+> Even though the token is encrypted, it is done so by using a default password and that's why it can be decrypted by others. In order to prevent that you can specify a custom password using the environment variable `NBI_GH_ACCESS_TOKEN_PASSWORD`.
 
 ```bash
-jupyter lab --NotebookIntelligence.github_access_token=remember
+NBI_GH_ACCESS_TOKEN_PASSWORD=my_custom_password
 ```
 
-Once you set it to remember, it will continue to remember even if you skip `--NotebookIntelligence.github_access_token` at following launches. In order to forget the GitHub access token stored:
+To let Notebook Intelligence remember your GitHub access token, go to Notebook Intelligence Settings dialog and check the option `Remember my GitHub Copilot access token` as shown below.
 
-```bash
-jupyter lab --NotebookIntelligence.github_access_token=forget
-```
+<img src="media/remember-gh-access-token.png" alt="Remember access token" width=500 />
+
+If your stored access token fails to login (due to expiration or other reasons), you will be prompted to relogin on the UI.
 
 ### Configuration files
 

package/lib/api.d.ts

@@ -17,6 +17,7 @@ export declare class NBIConfig {
     get chatModel(): any;
     get inlineCompletionModel(): any;
     get usingGitHubCopilotModel(): boolean;
+    get storeGitHubAccessToken(): boolean;
     capabilities: any;
     chatParticipants: IChatParticipant[];
     changed: Signal<this, void>;

package/lib/api.js

@@ -39,6 +39,9 @@ export class NBIConfig {
         return (this.chatModel.provider === GITHUB_COPILOT_PROVIDER_ID ||
             this.inlineCompletionModel.provider === GITHUB_COPILOT_PROVIDER_ID);
     }
+    get storeGitHubAccessToken() {
+        return this.capabilities.store_github_access_token === true;
+    }
 }
 class NBIAPI {
     static async initialize() {

package/lib/chat-sidebar.js

@@ -9,7 +9,7 @@ import { MarkdownRenderer } from './markdown-renderer';
 import copySvgstr from '../style/icons/copy.svg';
 import copilotSvgstr from '../style/icons/copilot.svg';
 import copilotWarningSvgstr from '../style/icons/copilot-warning.svg';
-import { VscSend, VscStopCircle, VscEye, VscEyeClosed, VscTriangleRight, VscTriangleDown } from 'react-icons/vsc';
+import { VscSend, VscStopCircle, VscEye, VscEyeClosed, VscTriangleRight, VscTriangleDown, VscWarning } from 'react-icons/vsc';
 import { extractLLMGeneratedCode, isDarkTheme } from './utils';
 const OPENAI_COMPATIBLE_CHAT_MODEL_ID = 'openai-compatible-chat-model';
 const LITELLM_COMPATIBLE_CHAT_MODEL_ID = 'litellm-compatible-chat-model';
@@ -151,9 +151,11 @@ function ChatResponse(props) {
     };
     const markFormConfirmed = (contentId) => {
         answeredForms.set(contentId, 'confirmed');
+        setRenderCount(prev => prev + 1);
     };
     const markFormCanceled = (contentId) => {
         answeredForms.set(contentId, 'canceled');
+        setRenderCount(prev => prev + 1);
     };
     const runCommand = (commandId, args) => {
         props.getApp().commands.execute(commandId, args);
@@ -272,7 +274,7 @@ function ChatResponse(props) {
                             React.createElement("a", { href: item.content.uri, target: "_blank" }, item.content.title)));
                     case ResponseStreamDataType.Progress:
                         // show only if no more message available
-                        return index === groupedContents.length - 1 ? (React.createElement("div", { key: `key-${index}` },
+                        return index === groupedContents.length - 1 ? (React.createElement("div", { className: "chat-response-progress", key: `key-${index}` },
                             "\u2713 ",
                             item.content)) : null;
                     case ResponseStreamDataType.Confirmation:
@@ -1121,7 +1123,7 @@ function ConfigurationDialogBodyComponent(props) {
     const [chatModels, setChatModels] = useState([]);
     const [inlineCompletionModels, setInlineCompletionModels] = useState([]);
     const handleSaveClick = async () => {
-        await NBIAPI.setConfig({
+        const config = {
             chat_model: {
                 provider: chatModelProvider,
                 model: chatModel,
@@ -1132,7 +1134,12 @@ function ConfigurationDialogBodyComponent(props) {
                 model: inlineCompletionModel,
                 properties: inlineCompletionModelProperties
             }
-        });
+        };
+        if (chatModelProvider === 'github-copilot' ||
+            inlineCompletionModelProvider === 'github-copilot') {
+            config.store_github_access_token = storeGitHubAccessToken;
+        }
+        await NBIAPI.setConfig(config);
         props.onSave();
     };
     const handleRefreshOllamaModelListClick = async () => {
@@ -1145,6 +1152,7 @@ function ConfigurationDialogBodyComponent(props) {
     const [chatModelProperties, setChatModelProperties] = useState([]);
     const [inlineCompletionModelProperties, setInlineCompletionModelProperties] = useState([]);
     const [inlineCompletionModel, setInlineCompletionModel] = useState(nbiConfig.inlineCompletionModel.model);
+    const [storeGitHubAccessToken, setStoreGitHubAccessToken] = useState(nbiConfig.storeGitHubAccessToken);
     const updateModelOptionsForProvider = (providerId, modelType) => {
         if (modelType === 'chat') {
             setChatModelProvider(providerId);
@@ -1273,7 +1281,23 @@ function ConfigurationDialogBodyComponent(props) {
                                 property.name,
                                 " ",
                                 property.optional ? '(optional)' : ''),
-                            React.createElement("input", { name: "inline-completion-model-id-input", placeholder: property.description, className: "jp-mod-styled", spellCheck: false, value: property.value, onChange: event => onModelPropertyChange('inline-completion', property.id, event.target.value) }))))))))),
+                            React.createElement("input", { name: "inline-completion-model-id-input", placeholder: property.description, className: "jp-mod-styled", spellCheck: false, value: property.value, onChange: event => onModelPropertyChange('inline-completion', property.id, event.target.value) })))))))),
+            (chatModelProvider === 'github-copilot' ||
+                inlineCompletionModelProvider === 'github-copilot') && (React.createElement("div", { className: "model-config-section" },
+                React.createElement("div", { className: "model-config-section-header access-token-config-header" },
+                    "GitHub Copilot login",
+                    ' ',
+                    React.createElement("a", { href: "https://github.com/notebook-intelligence/notebook-intelligence/blob/main/README.md#remembering-github-copilot-login", target: "_blank" },
+                        ' ',
+                        React.createElement(VscWarning, { className: "access-token-warning", title: "Click to learn more about security implications" }))),
+                React.createElement("div", { className: "model-config-section-body" },
+                    React.createElement("div", { className: "model-config-section-row" },
+                        React.createElement("div", { className: "model-config-section-column" },
+                            React.createElement("label", null,
+                                React.createElement("input", { type: "checkbox", checked: storeGitHubAccessToken, onChange: event => {
+                                        setStoreGitHubAccessToken(event.target.checked);
+                                    } }),
+                                "Remember my GitHub Copilot access token"))))))),
         React.createElement("div", { className: "config-dialog-footer" },
             React.createElement("button", { className: "jp-Dialog-button jp-mod-accept jp-mod-styled", onClick: handleSaveClick },
                 React.createElement("div", { className: "jp-Dialog-buttonLabel" }, "Save")))));

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@notebook-intelligence/notebook-intelligence",
-    "version": "1.3.1",
+    "version": "1.3.3",
     "description": "AI coding assistant for JupyterLab",
     "keywords": [
         "AI",

package/src/api.ts

@@ -56,6 +56,10 @@ export class NBIConfig {
     );
   }
 
+  get storeGitHubAccessToken(): boolean {
+    return this.capabilities.store_github_access_token === true;
+  }
+
   capabilities: any = {};
   chatParticipants: IChatParticipant[] = [];
 

package/src/chat-sidebar.tsx

@@ -41,7 +41,8 @@ import {
   VscEye,
   VscEyeClosed,
   VscTriangleRight,
-  VscTriangleDown
+  VscTriangleDown,
+  VscWarning
 } from 'react-icons/vsc';
 import { extractLLMGeneratedCode, isDarkTheme } from './utils';
 
@@ -314,9 +315,11 @@ function ChatResponse(props: any) {
 
   const markFormConfirmed = (contentId: string) => {
     answeredForms.set(contentId, 'confirmed');
+    setRenderCount(prev => prev + 1);
   };
   const markFormCanceled = (contentId: string) => {
     answeredForms.set(contentId, 'canceled');
+    setRenderCount(prev => prev + 1);
   };
 
   const runCommand = (commandId: string, args: any) => {
@@ -517,7 +520,9 @@ function ChatResponse(props: any) {
             case ResponseStreamDataType.Progress:
               // show only if no more message available
               return index === groupedContents.length - 1 ? (
-                <div key={`key-${index}`}>&#x2713; {item.content}</div>
+                <div className="chat-response-progress" key={`key-${index}`}>
+                  &#x2713; {item.content}
+                </div>
               ) : null;
             case ResponseStreamDataType.Confirmation:
               return answeredForms.get(item.id) ===
@@ -1819,7 +1824,7 @@ function ConfigurationDialogBodyComponent(props: any) {
   const [inlineCompletionModels, setInlineCompletionModels] = useState([]);
 
   const handleSaveClick = async () => {
-    await NBIAPI.setConfig({
+    const config: any = {
       chat_model: {
         provider: chatModelProvider,
         model: chatModel,
@@ -1830,7 +1835,16 @@ function ConfigurationDialogBodyComponent(props: any) {
         model: inlineCompletionModel,
         properties: inlineCompletionModelProperties
       }
-    });
+    };
+
+    if (
+      chatModelProvider === 'github-copilot' ||
+      inlineCompletionModelProvider === 'github-copilot'
+    ) {
+      config.store_github_access_token = storeGitHubAccessToken;
+    }
+
+    await NBIAPI.setConfig(config);
 
     props.onSave();
   };
@@ -1852,6 +1866,9 @@ function ConfigurationDialogBodyComponent(props: any) {
   const [inlineCompletionModel, setInlineCompletionModel] = useState(
     nbiConfig.inlineCompletionModel.model
   );
+  const [storeGitHubAccessToken, setStoreGitHubAccessToken] = useState(
+    nbiConfig.storeGitHubAccessToken
+  );
 
   const updateModelOptionsForProvider = (
     providerId: string,
@@ -2157,6 +2174,41 @@ function ConfigurationDialogBodyComponent(props: any) {
             </div>
           </div>
         </div>
+
+        {(chatModelProvider === 'github-copilot' ||
+          inlineCompletionModelProvider === 'github-copilot') && (
+          <div className="model-config-section">
+            <div className="model-config-section-header access-token-config-header">
+              GitHub Copilot login{' '}
+              <a
+                href="https://github.com/notebook-intelligence/notebook-intelligence/blob/main/README.md#remembering-github-copilot-login"
+                target="_blank"
+              >
+                {' '}
+                <VscWarning
+                  className="access-token-warning"
+                  title="Click to learn more about security implications"
+                />
+              </a>
+            </div>
+            <div className="model-config-section-body">
+              <div className="model-config-section-row">
+                <div className="model-config-section-column">
+                  <label>
+                    <input
+                      type="checkbox"
+                      checked={storeGitHubAccessToken}
+                      onChange={event => {
+                        setStoreGitHubAccessToken(event.target.checked);
+                      }}
+                    />
+                    Remember my GitHub Copilot access token
+                  </label>
+                </div>
+              </div>
+            </div>
+          </div>
+        )}
       </div>
 
       <div className="config-dialog-footer">

package/style/base.css

@@ -275,6 +275,10 @@ pre:has(.code-block-header) {
   margin: 5px 0;
 }
 
+.chat-response-progress {
+  margin: 5px 0;
+}
+
 .chat-confirmation-form {
   border: 1px solid var(--jp-border-color1);
   padding: 5px;
@@ -610,3 +614,15 @@ body[data-jp-theme-light='false'] .inline-popover {
 .chat-reasoning-content.expanded .collapsed-icon {
   display: none;
 }
+
+.access-token-config-header {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
+svg.access-token-warning {
+  color: var(--jp-warn-color0);
+  width: 18px;
+  height: 18px;
+}