jupyterlab_claude_code_extension 1.1.27 → 1.1.31

package/lib/icons.d.ts

@@ -5,5 +5,4 @@ export declare const refreshIcon: LabIcon;
 export declare const removeIcon: LabIcon;
 export declare const shieldIcon: LabIcon;
 export declare const addIcon: LabIcon;
-export declare const addShieldIcon: LabIcon;
 export declare const filterIcon: LabIcon;

package/lib/icons.js

@@ -58,19 +58,6 @@ export const addIcon = new LabIcon({
     name: 'jupyterlab_claude_code_extension:add',
     svgstr: addSvgStr
 });
-// Plus with a small solid shield in the lower-right corner - the
-// skip-permissions variant of the "new session" button, echoing the
-// shield used on the context menu's "Resume (Skip Permissions)".
-const addShieldSvgStr = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16">
-  <g class="jp-icon3" fill="#616161">
-    <path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" transform="translate(-2,-2) scale(0.83)"/>
-    <path d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4z" transform="translate(13,12) scale(0.46)"/>
-  </g>
-</svg>`;
-export const addShieldIcon = new LabIcon({
-    name: 'jupyterlab_claude_code_extension:add-shield',
-    svgstr: addShieldSvgStr
-});
 // Funnel copied verbatim from @jupyterlab/ui-components'
 // `search/filter.svg` - the same image the file browser's filter
 // toggle uses. The `class="jp-icon3"` lets JupyterLab's theme drive

package/lib/widget.d.ts

@@ -107,6 +107,7 @@ export declare class ClaudeCodeSessionsWidget extends Widget {
     private _expanded;
     private _commands;
     private _contextMenu;
+    private _newSessionMenu;
     private _activeSession;
     private _activeRowEl;
     private _pollHandle;

package/lib/widget.js

@@ -3,7 +3,7 @@ import { folderIcon, terminalIcon } from '@jupyterlab/ui-components';
 import { CommandRegistry } from '@lumino/commands';
 import { Menu, Widget } from '@lumino/widgets';
 import { requestAPI } from './request';
-import { addIcon, addShieldIcon, claudeIcon, filterIcon, refreshIcon, removeIcon, shieldIcon, starFilledIcon } from './icons';
+import { addIcon, claudeIcon, filterIcon, refreshIcon, removeIcon, shieldIcon, starFilledIcon } from './icons';
 const POLL_INTERVAL_MS = 30000;
 const DEFAULT_RECENT_LIMIT = 10;
 const EXPANDED_STORAGE_KEY = 'jupyterlab_claude_code_extension:expanded';
@@ -144,15 +144,12 @@ export class ClaudeCodeSessionsWidget extends Widget {
         newBtn.className = 'jp-ClaudeSessionsPanel-iconButton';
         newBtn.title = 'New Claude session in the current folder';
         addIcon.element({ container: newBtn });
-        newBtn.addEventListener('click', () => void this._newSession(false));
+        newBtn.addEventListener('click', () => {
+            // Drop the menu just below the button, left-aligned with it.
+            const rect = newBtn.getBoundingClientRect();
+            this._newSessionMenu.open(rect.left, rect.bottom);
+        });
         header.appendChild(newBtn);
-        const newSkipBtn = document.createElement('button');
-        newSkipBtn.className = 'jp-ClaudeSessionsPanel-iconButton';
-        newSkipBtn.title =
-            'New Claude session in the current folder (Skip Permissions)';
-        addShieldIcon.element({ container: newSkipBtn });
-        newSkipBtn.addEventListener('click', () => void this._newSession(true));
-        header.appendChild(newSkipBtn);
         const filterBtn = document.createElement('button');
         filterBtn.className = 'jp-ClaudeSessionsPanel-iconButton';
         filterBtn.title = 'Filter sessions';
@@ -1024,6 +1021,25 @@ export class ClaudeCodeSessionsWidget extends Widget {
                 }
             }
         });
+        this._commands.addCommand('claude-code-sessions:new-session', {
+            label: 'New Claude Session',
+            execute: () => void this._newSession(false)
+        });
+        this._commands.addCommand('claude-code-sessions:new-session-dangerous', {
+            label: 'New Claude Session (Skip Permissions)',
+            icon: shieldIcon,
+            execute: () => void this._newSession(true)
+        });
+        // Dropdown for the header's plus button - same command registry and
+        // styling as the row context menu.
+        this._newSessionMenu = new Menu({ commands: this._commands });
+        this._newSessionMenu.addClass('jp-ClaudeSessionsContextMenu');
+        this._newSessionMenu.addItem({
+            command: 'claude-code-sessions:new-session'
+        });
+        this._newSessionMenu.addItem({
+            command: 'claude-code-sessions:new-session-dangerous'
+        });
         this._contextMenu = new Menu({ commands: this._commands });
         this._contextMenu.addClass('jp-ClaudeSessionsContextMenu');
         this._contextMenu.addItem({ command: 'claude-code-sessions:resume' });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "jupyterlab_claude_code_extension",
-    "version": "1.1.27",
+    "version": "1.1.31",
     "description": "Browse, resume, and manage your Claude Code CLI sessions from a JupyterLab side panel. One click reactivates the right terminal - no duplicate tabs, live remote-control indicator, and favourites for the projects you keep coming back to.",
     "keywords": [
         "jupyter",

package/src/icons.ts

@@ -71,21 +71,6 @@ export const addIcon = new LabIcon({
   svgstr: addSvgStr
 });
 
-// Plus with a small solid shield in the lower-right corner - the
-// skip-permissions variant of the "new session" button, echoing the
-// shield used on the context menu's "Resume (Skip Permissions)".
-const addShieldSvgStr = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16">
-  <g class="jp-icon3" fill="#616161">
-    <path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" transform="translate(-2,-2) scale(0.83)"/>
-    <path d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4z" transform="translate(13,12) scale(0.46)"/>
-  </g>
-</svg>`;
-
-export const addShieldIcon = new LabIcon({
-  name: 'jupyterlab_claude_code_extension:add-shield',
-  svgstr: addShieldSvgStr
-});
-
 // Funnel copied verbatim from @jupyterlab/ui-components'
 // `search/filter.svg` - the same image the file browser's filter
 // toggle uses. The `class="jp-icon3"` lets JupyterLab's theme drive

package/src/widget.ts

@@ -16,7 +16,6 @@ import { Message } from '@lumino/messaging';
 import { requestAPI } from './request';
 import {
   addIcon,
-  addShieldIcon,
   claudeIcon,
   filterIcon,
   refreshIcon,
@@ -194,17 +193,13 @@ export class ClaudeCodeSessionsWidget extends Widget {
     newBtn.className = 'jp-ClaudeSessionsPanel-iconButton';
     newBtn.title = 'New Claude session in the current folder';
     addIcon.element({ container: newBtn });
-    newBtn.addEventListener('click', () => void this._newSession(false));
+    newBtn.addEventListener('click', () => {
+      // Drop the menu just below the button, left-aligned with it.
+      const rect = newBtn.getBoundingClientRect();
+      this._newSessionMenu.open(rect.left, rect.bottom);
+    });
     header.appendChild(newBtn);
 
-    const newSkipBtn = document.createElement('button');
-    newSkipBtn.className = 'jp-ClaudeSessionsPanel-iconButton';
-    newSkipBtn.title =
-      'New Claude session in the current folder (Skip Permissions)';
-    addShieldIcon.element({ container: newSkipBtn });
-    newSkipBtn.addEventListener('click', () => void this._newSession(true));
-    header.appendChild(newSkipBtn);
-
     const filterBtn = document.createElement('button');
     filterBtn.className = 'jp-ClaudeSessionsPanel-iconButton';
     filterBtn.title = 'Filter sessions';
@@ -1195,6 +1190,28 @@ export class ClaudeCodeSessionsWidget extends Widget {
       }
     });
 
+    this._commands.addCommand('claude-code-sessions:new-session', {
+      label: 'New Claude Session',
+      execute: () => void this._newSession(false)
+    });
+
+    this._commands.addCommand('claude-code-sessions:new-session-dangerous', {
+      label: 'New Claude Session (Skip Permissions)',
+      icon: shieldIcon,
+      execute: () => void this._newSession(true)
+    });
+
+    // Dropdown for the header's plus button - same command registry and
+    // styling as the row context menu.
+    this._newSessionMenu = new Menu({ commands: this._commands });
+    this._newSessionMenu.addClass('jp-ClaudeSessionsContextMenu');
+    this._newSessionMenu.addItem({
+      command: 'claude-code-sessions:new-session'
+    });
+    this._newSessionMenu.addItem({
+      command: 'claude-code-sessions:new-session-dangerous'
+    });
+
     this._contextMenu = new Menu({ commands: this._commands });
     this._contextMenu.addClass('jp-ClaudeSessionsContextMenu');
     this._contextMenu.addItem({ command: 'claude-code-sessions:resume' });
@@ -1258,6 +1275,7 @@ export class ClaudeCodeSessionsWidget extends Widget {
   private _expanded: Record<SectionKey, boolean> = loadExpanded();
   private _commands!: CommandRegistry;
   private _contextMenu!: Menu;
+  private _newSessionMenu!: Menu;
   private _activeSession: ISession | null = null;
   private _activeRowEl: HTMLElement | null = null;
   private _pollHandle: number | null = null;