cli-jaw 2.17.63 → 2.17.64

package/public/manager/src/components/context-menu/context-menu.css

@@ -0,0 +1,111 @@
+.jaw-context-menu {
+    position: fixed;
+    box-sizing: border-box;
+    /* Above floating composer menus (1000), below the panel resize overlay. */
+    z-index: 1100;
+    min-width: 200px;
+    max-width: min(320px, calc(100vw - 16px));
+    max-height: calc(100vh - 16px);
+    overflow-y: auto;
+    padding: 5px;
+    border: 1px solid var(--border-subtle);
+    border-radius: 10px;
+    background: var(--bg-elevated);
+    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.32);
+    font-family: var(--font-sans);
+    font-size: 13px;
+}
+.jaw-context-menu-item {
+    all: unset;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    gap: 9px;
+    width: 100%;
+    padding: 6px 9px;
+    border-radius: 6px;
+    color: var(--text-primary);
+    line-height: 1.25;
+    cursor: default;
+}
+.jaw-context-menu-item:hover:not(:disabled),
+.jaw-context-menu-item:focus-visible {
+    background: var(--row-bg-hover);
+}
+.jaw-context-menu-item:disabled {
+    color: var(--text-dim);
+    opacity: 0.45;
+}
+.jaw-context-menu-item.is-danger { color: var(--danger, #e5484d); }
+.jaw-context-menu-icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 16px;
+    height: 16px;
+    flex: none;
+    color: var(--text-secondary);
+}
+.jaw-context-menu-item.is-danger .jaw-context-menu-icon { color: inherit; }
+.jaw-context-menu-label {
+    flex: 1;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+.jaw-context-menu-shortcut {
+    flex: none;
+    margin-left: 16px;
+    color: var(--text-dim);
+    font: inherit;
+    font-size: 12px;
+}
+.jaw-context-menu-separator {
+    height: 1px;
+    margin: 5px 4px;
+    background: var(--border-subtle);
+}
+
+/* Icon buttons that appear at the edge of a hovered/focused row, pairing with
+   a right-click ContextMenu. The hover selector works because :hover also
+   matches ancestors of the element under the pointer. */
+.jaw-row-hover-actions {
+    display: inline-flex;
+    gap: 2px;
+    align-items: center;
+    opacity: 0;
+    pointer-events: none;
+}
+.jaw-row-hover-actions:focus-within,
+*:hover > .jaw-row-hover-actions,
+*:focus-within > .jaw-row-hover-actions {
+    opacity: 1;
+    pointer-events: auto;
+}
+@media (hover: none) {
+    .jaw-row-hover-actions {
+        opacity: 1;
+        pointer-events: auto;
+    }
+}
+.jaw-row-icon-btn {
+    all: unset;
+    box-sizing: border-box;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 22px;
+    height: 22px;
+    border-radius: 5px;
+    color: var(--text-secondary);
+    cursor: pointer;
+}
+.jaw-row-icon-btn:hover:not(:disabled),
+.jaw-row-icon-btn:focus-visible {
+    background: var(--row-bg-hover);
+    color: var(--text-primary);
+}
+.jaw-row-icon-btn:disabled {
+    opacity: 0.4;
+}

package/public/manager/src/components/context-menu/icons.tsx

@@ -0,0 +1,48 @@
+/* 16px stroke glyphs shared by context menus and row hover actions. */
+const base = {
+    viewBox: '0 0 16 16', width: 15, height: 15, fill: 'none', stroke: 'currentColor', strokeWidth: 1.4,
+    strokeLinecap: 'round', strokeLinejoin: 'round', 'aria-hidden': true, focusable: false,
+} as const;
+
+export function PencilGlyph() {
+    return <svg {...base}><path d="M10.8 2.7a1.6 1.6 0 0 1 2.3 2.3L5.6 12.5l-3 .8.8-3Z" /></svg>;
+}
+export function PinGlyph() {
+    return <svg {...base}><path d="M9.7 2.3 13.7 6.3M10.6 3.2 6.9 6.1l-2.5-.3-1 1 5.8 5.8 1-1-.3-2.5 2.9-3.7M5.9 10.1 2.5 13.5" /></svg>;
+}
+export function ArchiveGlyph() {
+    return <svg {...base}><rect x="2.3" y="3" width="11.4" height="3" rx="0.8" /><path d="M3.3 6v6.2a.8.8 0 0 0 .8.8h7.8a.8.8 0 0 0 .8-.8V6M6.5 8.8h3" /></svg>;
+}
+export function EyeGlyph() {
+    return <svg {...base}><path d="M1.8 8S4 3.8 8 3.8 14.2 8 14.2 8 12 12.2 8 12.2 1.8 8 1.8 8Z" /><circle cx="8" cy="8" r="1.8" /></svg>;
+}
+export function TrashGlyph() {
+    return <svg {...base}><path d="M2.8 4.3h10.4M6.3 4.3V3h3.4v1.3M4 4.3l.6 8.4a.8.8 0 0 0 .8.8h5.2a.8.8 0 0 0 .8-.8l.6-8.4" /></svg>;
+}
+export function CopyGlyph() {
+    return <svg {...base}><rect x="5.3" y="5.3" width="8" height="8" rx="1.2" /><path d="M10.7 5.3V3.5a.8.8 0 0 0-.8-.8H3.5a.8.8 0 0 0-.8.8v6.4a.8.8 0 0 0 .8.8h1.8" /></svg>;
+}
+export function FolderGlyph() {
+    return <svg {...base}><path d="M2.3 4.3a1 1 0 0 1 1-1h3l1.4 1.5h5a1 1 0 0 1 1 1v6.4a1 1 0 0 1-1 1H3.3a1 1 0 0 1-1-1Z" /></svg>;
+}
+export function ExternalGlyph() {
+    return <svg {...base}><path d="M6 3H3.5a.8.8 0 0 0-.8.8v8.7a.8.8 0 0 0 .8.8h8.7a.8.8 0 0 0 .8-.8V10M9 2.7h4.3V7M13.3 2.7 7.5 8.5" /></svg>;
+}
+export function PlayGlyph() {
+    return <svg {...base}><path d="M4.5 3v10l8-5Z" /></svg>;
+}
+export function StopGlyph() {
+    return <svg {...base}><rect x="3.5" y="3.5" width="9" height="9" rx="1.4" /></svg>;
+}
+export function RestartGlyph() {
+    return <svg {...base}><path d="M13 8a5 5 0 1 1-1.5-3.6M13 2.5v3h-3" /></svg>;
+}
+export function CheckGlyph() {
+    return <svg {...base}><path d="M3 8.8l3.2 3.2L13 5.2" /></svg>;
+}
+export function SpeakerGlyph() {
+    return <svg {...base}><path d="M8.7 3.2 5.3 6H3v4h2.3l3.4 2.8Z" /><path d="M11 6a3 3 0 0 1 0 4M12.9 4a5.4 5.4 0 0 1 0 8" /></svg>;
+}
+export function DocGlyph() {
+    return <svg {...base}><path d="M4.3 2.5H9l2.7 2.7v8.3H4.3Z" /><path d="M9 2.5v2.7h2.7M6.2 8.6h3.6M6.2 10.8h2.6" /></svg>;
+}

package/public/manager/src/folder-panel/FolderContextMenu.tsx

@@ -1,3 +1,7 @@
+import { useMemo } from 'react';
+import { ContextMenu, type ContextMenuEntry, type ContextMenuState } from '../components/context-menu/ContextMenu';
+import { CopyGlyph, DocGlyph, FolderGlyph, PencilGlyph, RestartGlyph } from '../components/context-menu/icons';
+import { currentClientPlatform, isMacLikePlatform } from '../client-platform';
 import type { FolderPanelEntry } from './folder-sources';
 
 type FolderContextMenuProps = {
@@ -7,6 +11,7 @@ type FolderContextMenuProps = {
     canReveal: boolean;
     canRefresh: boolean;
     canMutate: boolean;
+    onClose: () => void;
     onCopyPath: () => void;
     onCopyRelativePath: () => void;
     onReveal: () => void;
@@ -17,23 +22,44 @@ type FolderContextMenuProps = {
 };
 
 export function FolderContextMenu(props: FolderContextMenuProps) {
+    const mac = isMacLikePlatform();
+    // ContextMenu's positioning effect keys on `state` identity — keep it stable.
+    const menuState = useMemo<ContextMenuState>(() => ({ x: props.x, y: props.y }), [props.x, props.y]);
+    const entries: ContextMenuEntry[] = [
+        { id: 'copy-path', label: 'Copy Path', icon: <CopyGlyph />, shortcut: mac ? '⇧⌘C' : 'Ctrl+Shift+C', onSelect: props.onCopyPath },
+        { id: 'copy-relative-path', label: 'Copy Relative Path', icon: <CopyGlyph />, shortcut: mac ? '⌘C' : 'Ctrl+C', onSelect: props.onCopyRelativePath },
+        { kind: 'separator', id: 'sep-reveal' },
+        {
+            id: 'reveal',
+            label: props.entry.kind === 'directory' ? 'Open Folder' : revealLabel(mac),
+            icon: <FolderGlyph />,
+            shortcut: mac ? '⌥⌘R' : 'Ctrl+Alt+R',
+            disabled: !props.canReveal,
+            onSelect: props.onReveal,
+        },
+        { kind: 'separator', id: 'sep-create' },
+        { id: 'new-file', label: 'New File', icon: <DocGlyph />, disabled: !props.canMutate, onSelect: props.onCreateFile },
+        { id: 'new-folder', label: 'New Folder', icon: <FolderGlyph />, disabled: !props.canMutate, onSelect: props.onCreateFolder },
+        { kind: 'separator', id: 'sep-rename' },
+        { id: 'rename', label: 'Rename', icon: <PencilGlyph />, disabled: !props.canMutate, onSelect: props.onRename },
+    ];
+    if (props.canRefresh) {
+        entries.push(
+            { kind: 'separator', id: 'sep-refresh' },
+            { id: 'refresh', label: 'Refresh', icon: <RestartGlyph />, onSelect: props.onRefresh },
+        );
+    }
     return (
-        <div
-            className="folder-context-menu"
-            role="menu"
-            style={{ left: props.x, top: props.y }}
-            onPointerDown={event => event.stopPropagation()}
-            onKeyDown={event => event.stopPropagation()}
-        >
-            <button type="button" role="menuitem" onClick={props.onCopyPath}>Copy Path</button>
-            <button type="button" role="menuitem" onClick={props.onCopyRelativePath}>Copy Relative Path</button>
-            <button type="button" role="menuitem" disabled={!props.canReveal} onClick={props.onReveal}>
-                {props.entry.kind === 'directory' ? 'Open Folder' : 'Reveal in Finder'}
-            </button>
-            <button type="button" role="menuitem" disabled={!props.canMutate} onClick={props.onCreateFile}>New File</button>
-            <button type="button" role="menuitem" disabled={!props.canMutate} onClick={props.onCreateFolder}>New Folder</button>
-            <button type="button" role="menuitem" disabled={!props.canMutate} onClick={props.onRename}>Rename</button>
-            {props.canRefresh && <button type="button" role="menuitem" onClick={props.onRefresh}>Refresh</button>}
-        </div>
+        <ContextMenu
+            state={menuState}
+            entries={entries}
+            label={`Folder actions for ${props.entry.name}`}
+            onClose={props.onClose}
+        />
     );
 }
+
+function revealLabel(mac: boolean): string {
+    if (mac) return 'Reveal in Finder';
+    return /win/i.test(currentClientPlatform()) ? 'Show in Explorer' : 'Show in File Manager';
+}

package/public/manager/src/folder-panel/FolderPanel.tsx

@@ -56,6 +56,7 @@ export function FolderPanel(props: FolderPanelProps) {
     const [actionStatus, setActionStatus] = useState<string | null>(null);
     const [gitRefreshToken, setGitRefreshToken] = useState(0);
     const treeRef = useRef<HTMLDivElement | null>(null);
+    const wasContextMenuOpen = useRef(false);
     const restoredRootLoadRef = useRef<string | null>(null);
     const { folderChordActive, startFolderChord, cancelFolderChord } = useFolderChord();
     const onPreviewFile = props.onPreviewFile;
@@ -403,12 +404,18 @@ export function FolderPanel(props: FolderPanelProps) {
     }, [cancelFolderChord, copyEntryPath, copySelectedPath, expanded, folderChordActive, folderSelection, revealEntryPath, revealSelectedPath, selectEntry, startFolderChord, toggleEntryExpansion]);
 
     useEffect(() => {
+        const menuOpen = folderContextMenu.contextMenu !== null;
+        const menuJustClosed = wasContextMenuOpen.current && !menuOpen;
+        wasContextMenuOpen.current = menuOpen;
+        if (menuOpen) return;
+        if (menuJustClosed && document.activeElement !== document.body
+            && !document.activeElement?.matches('.folder-entry-btn[data-folder-path]')) return;
         const focusedPath = folderSelection.selection.focusedPath;
         if (!focusedPath) return;
         const buttons = treeRef.current?.querySelectorAll<HTMLButtonElement>('.folder-entry-btn[data-folder-path]');
         const nextButton = Array.from(buttons ?? []).find(button => button.dataset['folderPath'] === focusedPath);
         nextButton?.focus();
-    }, [folderSelection.selection.focusedPath]);
+    }, [folderSelection.selection.focusedPath, folderContextMenu.contextMenu]);
 
     return (
         <div className="folder-panel">
@@ -498,6 +505,7 @@ export function FolderPanel(props: FolderPanelProps) {
                     if (skipMoveConfirmChecked) setSkipInternalMoveConfirm(true);
                     void executeMove(pendingMove);
                 }}
+                onContextMenuClose={folderContextMenu.closeContextMenu}
                 onCopyContextPath={() => { folderContextMenu.closeContextMenu(); void copySelectedPath('absolute'); }}
                 onCopyContextRelativePath={() => { folderContextMenu.closeContextMenu(); void copySelectedPath('relative'); }}
                 onRevealContextPath={() => { folderContextMenu.closeContextMenu(); void revealSelectedPath(); }}

package/public/manager/src/folder-panel/FolderPanelOverlays.tsx

@@ -13,6 +13,7 @@ type FolderPanelOverlaysProps = {
     onSkipMoveConfirmCheckedChange: (checked: boolean) => void;
     onCancelMove: () => void;
     onConfirmMove: () => void;
+    onContextMenuClose: () => void;
     onCopyContextPath: () => void;
     onCopyContextRelativePath: () => void;
     onRevealContextPath: () => void;
@@ -44,6 +45,7 @@ export function FolderPanelOverlays(props: FolderPanelOverlaysProps) {
                     canReveal={props.canReveal}
                     canRefresh={props.canRefresh}
                     canMutate={props.canMutate}
+                    onClose={props.onContextMenuClose}
                     onCopyPath={props.onCopyContextPath}
                     onCopyRelativePath={props.onCopyContextRelativePath}
                     onReveal={props.onRevealContextPath}

package/public/manager/src/folder-panel/FolderTreeRows.tsx

@@ -155,7 +155,12 @@ export function FolderTreeRows(props: FolderTreeRowsProps) {
                                 onKeyDown={(event) => props.handleEntryKeyDown(event, entry)}
                                 onContextMenu={(event) => {
                                     event.preventDefault();
-                                    props.openContextMenu(entry, event.clientX, event.clientY);
+                                    if (event.clientX !== 0 || event.clientY !== 0) {
+                                        props.openContextMenu(entry, event.clientX, event.clientY);
+                                        return;
+                                    }
+                                    const rect = event.currentTarget.getBoundingClientRect();
+                                    props.openContextMenu(entry, rect.left + 8, rect.bottom);
                                 }}
                                 onClick={(event) => props.selectEntry(entry, { range: event.shiftKey, toggle: isPlatformToggleClick(event), preview: false })}
                                 onDoubleClick={() => {

package/public/manager/src/folder-panel/folder-panel.css

@@ -649,39 +649,6 @@
     justify-content: flex-end;
     gap: 6px;
 }
-.folder-context-menu {
-    position: fixed;
-    z-index: 80;
-    min-width: 156px;
-    max-width: min(240px, calc(100vw - 16px));
-    padding: 4px;
-    border: 1px solid var(--border-subtle);
-    border-radius: 5px;
-    background: var(--bg-elevated);
-    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.26);
-}
-.folder-context-menu button {
-    all: unset;
-    box-sizing: border-box;
-    display: block;
-    width: 100%;
-    padding: 5px 8px;
-    border-radius: 3px;
-    color: var(--text-base);
-    font-size: 12px;
-    line-height: 1.2;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-.folder-context-menu button:hover:not(:disabled),
-.folder-context-menu button:focus-visible {
-    background: var(--bg-hover);
-}
-.folder-context-menu button:disabled {
-    color: var(--text-dim);
-    opacity: 0.45;
-}
 .folder-empty {
     padding: 12px;
     color: var(--text-dim);

package/public/manager/src/folder-panel/use-folder-context-menu.ts

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useState } from 'react';
+import { useCallback, useState } from 'react';
 import type { FolderPanelEntry } from './folder-panel-types';
 
 export type FolderContextMenuState = {
@@ -12,6 +12,11 @@ type UseFolderContextMenuInput = {
     selectOnlyPath: (path: string) => void;
 };
 
+/**
+ * Owns which folder entry the context menu targets. Dismissal (outside
+ * pointerdown, Escape, blur, scroll) and focus restore live in the shared
+ * ContextMenu component.
+ */
 export function useFolderContextMenu(input: UseFolderContextMenuInput) {
     const [contextMenu, setContextMenu] = useState<FolderContextMenuState | null>(null);
     const closeContextMenu = useCallback(() => setContextMenu(null), []);
@@ -20,24 +25,6 @@ export function useFolderContextMenu(input: UseFolderContextMenuInput) {
         setContextMenu({ entry, x, y });
     }, [input]);
 
-    useEffect(() => {
-        if (!contextMenu) return;
-        const closeOnEscape = (event: KeyboardEvent) => {
-            if (event.key === 'Escape') setContextMenu(null);
-        };
-        const closeOnFrameFocus = () => {
-            if (document.activeElement instanceof HTMLIFrameElement) setContextMenu(null);
-        };
-        window.addEventListener('pointerdown', closeContextMenu);
-        window.addEventListener('keydown', closeOnEscape);
-        window.addEventListener('blur', closeOnFrameFocus);
-        return () => {
-            window.removeEventListener('pointerdown', closeContextMenu);
-            window.removeEventListener('keydown', closeOnEscape);
-            window.removeEventListener('blur', closeOnFrameFocus);
-        };
-    }, [closeContextMenu, contextMenu]);
-
     return {
         contextMenu,
         closeContextMenu,

package/public/manager/src/hooks/useDashboardRegistry.ts

@@ -1,6 +1,8 @@
-import { useCallback, useState } from 'react';
+import { useCallback, useRef, useState } from 'react';
 import { fetchRegistry, patchDashboardRegistry } from '../api';
+import { publishInvalidation } from '../sync/invalidation-bus';
 import type {
+    DashboardInstance,
     DashboardRegistry,
     DashboardRegistryLoadResult,
     DashboardRegistryPatch,
@@ -53,3 +55,24 @@ export function useDashboardRegistry(): DashboardRegistryState {
 
     return { registry, status, saving, error, apply: applyResult, refresh, save };
 }
+
+type FavoriteToggleDeps = {
+    save: (patch: DashboardRegistryPatch) => Promise<DashboardRegistryLoadResult | null>;
+    reload: () => Promise<void>;
+};
+
+export function useFavoriteToggle({ save, reload }: FavoriteToggleDeps): (instance: DashboardInstance) => void {
+    const pending = useRef(new Set<number>());
+    return useCallback((instance: DashboardInstance) => {
+        const port = instance.port;
+        if (pending.current.has(port)) return;
+        pending.current.add(port);
+        void save({ instances: { [String(port)]: { favorite: !instance.favorite } } })
+            .then(async result => {
+                if (!result) return;
+                await reload();
+                publishInvalidation({ topics: ['instances'], reason: 'instance:favorite-toggled', source: 'ui', sourceId: 'app' });
+            })
+            .finally(() => pending.current.delete(port));
+    }, [save, reload]);
+}

package/public/manager/src/jaw-ceo/JawCeoConsolePanels.tsx

@@ -1,4 +1,6 @@
-import { useCallback, useMemo, type ReactElement } from 'react';
+import { useCallback, useMemo, useState, type ReactElement, type KeyboardEvent as ReactKeyboardEvent, type MouseEvent as ReactMouseEvent } from 'react';
+import { ContextMenu, useContextMenu, type ContextMenuEntry } from '../components/context-menu/ContextMenu';
+import { CheckGlyph, DocGlyph, ExternalGlyph, PlayGlyph, SpeakerGlyph } from '../components/context-menu/icons';
 import type { JawCeoController } from './useJawCeo';
 import type { JawCeoVoiceController } from './useJawCeoVoice';
 import type { JawCeoAuditRecord, JawCeoCompletion, JawCeoResponseMode, JawCeoWatch } from './types';
@@ -184,6 +186,30 @@ function ActivityIcon(props: { tone: ActivityTone }) {
     );
 }
 
+function resultMenuEntries(
+    completion: JawCeoCompletion,
+    props: {
+        model: JawCeoConsoleModel;
+        ceo: JawCeoController;
+        voice: JawCeoVoiceController;
+        onOpenWorker: (port: number, messageId?: number) => void;
+    },
+): ContextMenuEntry[] {
+    return [
+        { id: 'open', label: `Open worker :${completion.port}`, icon: <ExternalGlyph />, onSelect: () => props.onOpenWorker(completion.port, completion.messageId) },
+        { kind: 'separator', id: 'sep-result-actions' },
+        { id: 'summary', label: 'Summarize result', icon: <DocGlyph />, onSelect: () => void props.model.summarize(completion) },
+        { id: 'continue', label: 'Continue', icon: <PlayGlyph />, onSelect: () => void props.model.continueCompletion(completion) },
+        { id: 'speak', label: 'Speak result', icon: <SpeakerGlyph />, onSelect: () => void props.voice.speakCompletion(completion) },
+        { kind: 'separator', id: 'sep-result-ack' },
+        { id: 'ack', label: 'Acknowledge', icon: <CheckGlyph />, onSelect: () => void props.ceo.ackCompletion(completion.completionKey) },
+    ];
+}
+
+function isContextMenuKey(event: ReactKeyboardEvent<HTMLElement>): boolean {
+    return event.key === 'ContextMenu' || (event.shiftKey && event.key === 'F10');
+}
+
 function ActivityGroup(props: {
     entries: ActivityEntry[];
     model: JawCeoConsoleModel;
@@ -191,6 +217,15 @@ function ActivityGroup(props: {
     voice: JawCeoVoiceController;
     onOpenWorker: (port: number, messageId?: number) => void;
 }) {
+    const menu = useContextMenu();
+    const [menuCompletion, setMenuCompletion] = useState<JawCeoCompletion | null>(null);
+    const openResultMenu = useCallback(
+        (event: ReactMouseEvent<HTMLElement> | ReactKeyboardEvent<HTMLElement>, completion: JawCeoCompletion) => {
+            setMenuCompletion(completion);
+            menu.openAt(event);
+        },
+        [menu],
+    );
     return (
         <section className="jaw-ceo-activity-shell" aria-label="CEO activity">
             <span className="jaw-ceo-activity-avatar" aria-hidden="true">CEO</span>
@@ -202,8 +237,16 @@ function ActivityGroup(props: {
                 <div className="jaw-ceo-activity-list">
                     {props.entries.map(entry => {
                         const tone = activityTone(entry);
+                        const completion = entry.kind === 'result' ? entry.completion : null;
                         return (
-                            <article key={entry.id} className={`jaw-ceo-activity-row tone-${tone}${activityIsError(entry) ? ' is-error' : ''}`}>
+                            <article
+                                key={entry.id}
+                                className={`jaw-ceo-activity-row tone-${tone}${activityIsError(entry) ? ' is-error' : ''}`}
+                                tabIndex={completion ? 0 : undefined}
+                                aria-label={completion ? `${activityTitle(entry)}: worker :${completion.port} result. Shift+F10 for actions` : undefined}
+                                onContextMenu={completion ? event => openResultMenu(event, completion) : undefined}
+                                onKeyDown={completion ? event => { if (isContextMenuKey(event)) openResultMenu(event, completion); } : undefined}
+                            >
                                 <span className="jaw-ceo-activity-dot" aria-hidden="true" />
                                 <span className="jaw-ceo-activity-icon"><ActivityIcon tone={tone} /></span>
                                 <span className="jaw-ceo-activity-badge">{tone}</span>
@@ -212,13 +255,26 @@ function ActivityGroup(props: {
                                     <p>{activityPreview(entry)}</p>
                                     <small>{formatTime(activityTime(entry))}</small>
                                 </div>
-                                {entry.kind === 'result' ? (
-                                    <div className="jaw-ceo-activity-actions">
-                                        <button type="button" onClick={() => props.onOpenWorker(entry.completion.port, entry.completion.messageId)}>Open</button>
-                                        <button type="button" onClick={() => void props.model.summarize(entry.completion)}>Summary</button>
-                                        <button type="button" onClick={() => void props.model.continueCompletion(entry.completion)}>Continue</button>
-                                        <button type="button" onClick={() => void props.voice.speakCompletion(entry.completion)}>Speak</button>
-                                        <button type="button" onClick={() => void props.ceo.ackCompletion(entry.completion.completionKey)}>Ack</button>
+                                {completion ? (
+                                    <div className="jaw-ceo-activity-actions jaw-row-hover-actions">
+                                        <button
+                                            type="button"
+                                            className="jaw-row-icon-btn"
+                                            title={`Open worker :${completion.port}`}
+                                            aria-label={`Open worker :${completion.port}`}
+                                            onClick={() => props.onOpenWorker(completion.port, completion.messageId)}
+                                        >
+                                            <ExternalGlyph />
+                                        </button>
+                                        <button
+                                            type="button"
+                                            className="jaw-row-icon-btn"
+                                            title="Acknowledge result"
+                                            aria-label={`Acknowledge worker :${completion.port} result`}
+                                            onClick={() => void props.ceo.ackCompletion(completion.completionKey)}
+                                        >
+                                            <CheckGlyph />
+                                        </button>
                                     </div>
                                 ) : <span className="jaw-ceo-trace-chip">Trace</span>}
                             </article>
@@ -226,6 +282,12 @@ function ActivityGroup(props: {
                     })}
                 </div>
             </details>
+            <ContextMenu
+                state={menu.state}
+                entries={menuCompletion ? resultMenuEntries(menuCompletion, props) : []}
+                label={menuCompletion ? `Worker :${menuCompletion.port} result` : 'Worker result'}
+                onClose={menu.close}
+            />
         </section>
     );
 }

package/public/manager/src/jaw-ceo/jaw-ceo-console.css

@@ -304,6 +304,10 @@
     align-items: start;
     padding: 4px 0;
 }
+.jaw-ceo-activity-row:focus-visible {
+    outline: var(--focus-ring);
+    outline-offset: 2px;
+}
 .jaw-ceo-activity-icon {
     width: 22px;
     height: 22px;
@@ -362,8 +366,7 @@
     text-overflow: ellipsis;
     white-space: nowrap;
 }
-.jaw-ceo-trace-chip,
-.jaw-ceo-activity-actions button {
+.jaw-ceo-trace-chip {
     min-height: 24px;
     padding: 3px 7px;
     border: 1px solid var(--ceo-line);
@@ -372,17 +375,12 @@
     color: var(--ceo-ink);
     font-size: 10.5px;
     font-weight: 800;
-}
-.jaw-ceo-trace-chip {
     display: inline-flex;
     align-items: center;
     justify-content: center;
 }
 .jaw-ceo-activity-actions {
-    display: flex;
-    flex-wrap: wrap;
     justify-content: flex-end;
-    gap: 5px;
 }
 .jaw-ceo-empty-state {
     min-height: 260px;

package/public/manager/src/main.tsx

@@ -4,6 +4,7 @@ import './manager-tokens.css';
 import './styles.css';
 import './manager-layout.css';
 import './manager-components.css';
+import './components/context-menu/context-menu.css';
 import './manager-emerging.css';
 import './manager-persistence.css';
 import './manager-profiles.css';
@@ -37,6 +38,7 @@ import './jaw-ceo/jaw-ceo.css';
 import './jaw-ceo/jaw-ceo-console.css';
 import './jaw-ceo/jaw-ceo-virtual.css';
 import './panels/panels.css';
+import './manager-desktop-titlebar.css';
 
 const root = document.getElementById('manager-root');
 if (!root) throw new Error('manager-root not found');

package/public/manager/src/manager-components.css

@@ -674,23 +674,6 @@ button.instance-group-header[aria-expanded="false"] .instance-group-chevron {
     font-weight: 400;
     line-height: 1.4;
 }
-.instance-label-edit-button {
-    position: absolute;
-    top: 7px;
-    right: 8px;
-    width: 22px;
-    min-width: 22px;
-    height: 22px;
-    min-height: 22px;
-    padding: 0;
-    border-radius: 6px;
-    color: var(--text-secondary);
-    font-size: 13px;
-    line-height: 1;
-}
-.instance-label-edit-button:hover {
-    color: var(--text-primary);
-}
 .instance-label-edit-form {
     display: grid;
     grid-template-columns: minmax(0, 1fr) auto auto;
@@ -718,22 +701,6 @@ button.instance-group-header[aria-expanded="false"] .instance-group-chevron {
     color: var(--status-error);
     font-size: 11px;
 }
-.instance-actions {
-    display: grid;
-    grid-auto-flow: column;
-    grid-auto-columns: minmax(0, 1fr);
-    gap: 6px;
-}
-.instance-actions button {
-    min-width: 0;
-    padding-inline: 6px;
-    font-size: 12px;
-    white-space: nowrap;
-}
-.instance-actions .action-start {
-    border-color: color-mix(in srgb, var(--status-running) 40%, var(--border-subtle));
-    color: var(--status-running);
-}
 .detail-panel {
     height: 100%;
     min-width: 0;
@@ -1303,5 +1270,5 @@ button.instance-group-header[aria-expanded="false"] .instance-group-chevron {
 
 @media (max-width: 639px) {
     .command-center .command-title { display: none; }
-    .command-center .command-actions :is(.desktop-open-button, .desktop-status-badge, .command-palette-trigger) { display: none; }
+    .command-center .command-actions :is(.desktop-open-button, .desktop-status-badge) { display: none; }
 }