jupyterlab_claude_code_extension 1.2.12 → 1.2.17

package/lib/widget.d.ts

@@ -149,6 +149,7 @@ export declare class ClaudeCodeSessionsWidget extends Widget {
     private _commands;
     private _contextMenu;
     private _branchSubmenu;
+    private _branchSessionMenu;
     private _lastBranches;
     private _lastBranchesCurrent;
     private _newSessionMenu;

package/lib/widget.js

@@ -845,12 +845,14 @@ export class ClaudeCodeSessionsWidget extends Widget {
             starFilledIcon.element({ container: star });
             row.appendChild(star);
         }
-        if (session.file_mtime) {
-            const time = document.createElement('span');
-            time.className = 'jp-ClaudeSessionsPanel-rowTime';
-            time.textContent = this._formatRelativeTime(session.file_mtime);
-            row.appendChild(time);
-        }
+        // Always present (empty without an mtime) so the star column keeps
+        // the same anchor across every row in the panel.
+        const time = document.createElement('span');
+        time.className = 'jp-ClaudeSessionsPanel-rowTime';
+        time.textContent = session.file_mtime
+            ? this._formatRelativeTime(session.file_mtime)
+            : '';
+        row.appendChild(time);
         row.addEventListener('click', () => {
             if (removing) {
                 return;
@@ -1073,12 +1075,11 @@ export class ClaudeCodeSessionsWidget extends Widget {
             }
         });
         this._commands.addCommand('claude-code-sessions:branch-session', {
-            label: 'Branch Session...',
-            icon: branchIcon,
+            label: 'Normal',
             execute: () => void this._branchSession(false)
         });
         this._commands.addCommand('claude-code-sessions:branch-session-dangerous', {
-            label: 'Branch Session (Skip Permissions)...',
+            label: 'Skip Permissions',
             icon: shieldIcon,
             execute: () => void this._branchSession(true)
         });
@@ -1116,6 +1117,17 @@ export class ClaudeCodeSessionsWidget extends Widget {
         this._branchSubmenu = new Menu({ commands: this._commands });
         this._branchSubmenu.addClass('jp-ClaudeSessionsContextMenu');
         this._branchSubmenu.title.label = 'Switch and Manage Sessions';
+        // Submenu grouping the two branch-session launch modes.
+        this._branchSessionMenu = new Menu({ commands: this._commands });
+        this._branchSessionMenu.addClass('jp-ClaudeSessionsContextMenu');
+        this._branchSessionMenu.title.label = 'Branch Session';
+        this._branchSessionMenu.title.icon = branchIcon;
+        this._branchSessionMenu.addItem({
+            command: 'claude-code-sessions:branch-session'
+        });
+        this._branchSessionMenu.addItem({
+            command: 'claude-code-sessions:branch-session-dangerous'
+        });
         this._contextMenu = new Menu({ commands: this._commands });
         this._contextMenu.addClass('jp-ClaudeSessionsContextMenu');
         this._rebuildContextMenu(false);
@@ -1154,10 +1166,8 @@ export class ClaudeCodeSessionsWidget extends Widget {
             });
         }
         this._contextMenu.addItem({
-            command: 'claude-code-sessions:branch-session'
-        });
-        this._contextMenu.addItem({
-            command: 'claude-code-sessions:branch-session-dangerous'
+            type: 'submenu',
+            submenu: this._branchSessionMenu
         });
         this._contextMenu.addItem({
             command: 'claude-code-sessions:cleanup-parallel'

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "jupyterlab_claude_code_extension",
-    "version": "1.2.12",
+    "version": "1.2.17",
     "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/__tests__/jupyterlab_claude_code_extension.spec.ts

@@ -318,12 +318,22 @@ describe('launch spinner dismiss contract', () => {
       const rowTime = (css.match(
         /\.jp-ClaudeSessionsPanel-rowTime \{[\s\S]*?\}/
       ) ?? [''])[0];
-      expect(rowTime).toMatch(/width: 52px/);
+      expect(rowTime).toMatch(/width: 4em/);
+      expect(rowTime).toMatch(/white-space: nowrap/);
       expect(rowTime).toMatch(/text-align: right/);
       const branchTime = (css.match(
         /\.jp-ClaudeSessionsPanel-branchTime \{[\s\S]*?\}/
       ) ?? [''])[0];
-      expect(branchTime).toMatch(/width: 52px/);
+      expect(branchTime).toMatch(/width: 4em/);
+      expect(branchTime).toMatch(/white-space: nowrap/);
+      // Stars line up vertically across the entire panel: every row keeps
+      // the time slot (empty without an mtime) and every section reserves
+      // the scrollbar gutter.
+      expect(widgetSrc).toMatch(/time\.textContent = session\.file_mtime\s*\?/);
+      const list = (css.match(/\.jp-ClaudeSessionsPanel-list \{[\s\S]*?\}/) ?? [
+        ''
+      ])[0];
+      expect(list).toMatch(/scrollbar-gutter: stable/);
       expect(branchTime).toMatch(/text-align: right/);
     });
 
@@ -337,14 +347,20 @@ describe('launch spinner dismiss contract', () => {
       );
     });
 
-    it('branch session commands exist in normal and skip-permissions modes', () => {
+    it('branch session is a submenu with normal and skip-permissions entries', () => {
       expect(widgetSrc).toMatch(/claude-code-sessions:branch-session'/);
       expect(widgetSrc).toMatch(
         /claude-code-sessions:branch-session-dangerous/
       );
       expect(widgetSrc).toMatch(
-        /Branch Session \(Skip Permissions\)\.\.\.[\s\S]{0,80}?icon: shieldIcon/
+        /_branchSessionMenu\.title\.label = 'Branch Session'/
+      );
+      expect(widgetSrc).toMatch(
+        /label: 'Skip Permissions',\s*icon: shieldIcon/
       );
+      expect(widgetSrc).toMatch(/submenu: this\._branchSessionMenu/);
+      // No ellipsis on the branch-session labels.
+      expect(widgetSrc).not.toMatch(/Branch Session\.\.\./);
     });
 
     it('branch session asks for a name and launches a known fork id', () => {

package/src/widget.ts

@@ -996,12 +996,14 @@ export class ClaudeCodeSessionsWidget extends Widget {
       row.appendChild(star);
     }
 
-    if (session.file_mtime) {
-      const time = document.createElement('span');
-      time.className = 'jp-ClaudeSessionsPanel-rowTime';
-      time.textContent = this._formatRelativeTime(session.file_mtime);
-      row.appendChild(time);
-    }
+    // Always present (empty without an mtime) so the star column keeps
+    // the same anchor across every row in the panel.
+    const time = document.createElement('span');
+    time.className = 'jp-ClaudeSessionsPanel-rowTime';
+    time.textContent = session.file_mtime
+      ? this._formatRelativeTime(session.file_mtime)
+      : '';
+    row.appendChild(time);
 
     row.addEventListener('click', () => {
       if (removing) {
@@ -1252,13 +1254,12 @@ export class ClaudeCodeSessionsWidget extends Widget {
     });
 
     this._commands.addCommand('claude-code-sessions:branch-session', {
-      label: 'Branch Session...',
-      icon: branchIcon,
+      label: 'Normal',
       execute: () => void this._branchSession(false)
     });
 
     this._commands.addCommand('claude-code-sessions:branch-session-dangerous', {
-      label: 'Branch Session (Skip Permissions)...',
+      label: 'Skip Permissions',
       icon: shieldIcon,
       execute: () => void this._branchSession(true)
     });
@@ -1302,6 +1303,18 @@ export class ClaudeCodeSessionsWidget extends Widget {
     this._branchSubmenu.addClass('jp-ClaudeSessionsContextMenu');
     this._branchSubmenu.title.label = 'Switch and Manage Sessions';
 
+    // Submenu grouping the two branch-session launch modes.
+    this._branchSessionMenu = new Menu({ commands: this._commands });
+    this._branchSessionMenu.addClass('jp-ClaudeSessionsContextMenu');
+    this._branchSessionMenu.title.label = 'Branch Session';
+    this._branchSessionMenu.title.icon = branchIcon;
+    this._branchSessionMenu.addItem({
+      command: 'claude-code-sessions:branch-session'
+    });
+    this._branchSessionMenu.addItem({
+      command: 'claude-code-sessions:branch-session-dangerous'
+    });
+
     this._contextMenu = new Menu({ commands: this._commands });
     this._contextMenu.addClass('jp-ClaudeSessionsContextMenu');
     this._rebuildContextMenu(false);
@@ -1342,10 +1355,8 @@ export class ClaudeCodeSessionsWidget extends Widget {
       });
     }
     this._contextMenu.addItem({
-      command: 'claude-code-sessions:branch-session'
-    });
-    this._contextMenu.addItem({
-      command: 'claude-code-sessions:branch-session-dangerous'
+      type: 'submenu',
+      submenu: this._branchSessionMenu
     });
     this._contextMenu.addItem({
       command: 'claude-code-sessions:cleanup-parallel'
@@ -1803,6 +1814,7 @@ export class ClaudeCodeSessionsWidget extends Widget {
   private _commands!: CommandRegistry;
   private _contextMenu!: Menu;
   private _branchSubmenu!: Menu;
+  private _branchSessionMenu!: Menu;
   private _lastBranches: IBranch[] = [];
   private _lastBranchesCurrent = '';
   private _newSessionMenu!: Menu;

package/style/base.css

@@ -155,6 +155,10 @@
   flex: 1 1 auto;
   overflow-y: auto;
   min-height: 0;
+
+  /* Reserve the scrollbar gutter in every section so star/time columns
+     line up across the entire panel, scrollbar or not. */
+  scrollbar-gutter: stable;
 }
 
 .jp-ClaudeSessionsPanel-row {
@@ -382,7 +386,8 @@
 
 .jp-ClaudeSessionsPanel-branchTime {
   flex: none;
-  width: 52px;
+  width: 4em;
+  white-space: nowrap;
   text-align: right;
   color: var(--jp-ui-font-color2);
   font-size: var(--jp-ui-font-size0);
@@ -458,7 +463,8 @@
    column so values line up across rows; the star column sits before it. */
 .jp-ClaudeSessionsPanel-rowTime {
   flex: 0 0 auto;
-  width: 52px;
+  width: 4em;
+  white-space: nowrap;
   text-align: right;
   color: var(--jp-ui-font-color2);
   font-size: var(--jp-ui-font-size0);