@shepai/cli 1.124.0-pr396.2dd2ae6 → 1.124.0-pr402.06ada70

package/dist/src/presentation/web/components/features/control-center/use-control-center-state.js

@@ -102,11 +102,20 @@ export function useControlCenterState(initialNodes, initialEdges) {
         for (const { featureId, state, lifecycle } of resolveSseEventUpdates(newEvents)) {
             if (state !== undefined || lifecycle !== undefined) {
                 const nodeId = `feat-${featureId}`;
+                const existingNode = nodesRef.current.find((n) => n.id === nodeId);
+                const existingState = existingNode
+                    ? existingNode.data.state
+                    : undefined;
                 // Skip SSE updates for features in 'deleting' state — the optimistic
                 // delete state must not be overwritten by stale SSE events (e.g. agent
                 // cancellation emitting AgentFailed during the soft-delete window).
-                const existingNode = nodesRef.current.find((n) => n.id === nodeId);
-                if (existingNode && existingNode.data.state === 'deleting')
+                if (existingState === 'deleting')
+                    continue;
+                // Skip SSE error events during mutation cooldown — after approve/reject
+                // the agent may still report AgentFailed from the previous run before
+                // the resume kicks in. The optimistic 'running' state must not be
+                // overwritten by stale error events during this transition window.
+                if (state === 'error' && isMutating() && existingState === 'running')
                     continue;
                 updateFeature(nodeId, {
                     ...(state !== undefined && { state }),
@@ -114,7 +123,7 @@ export function useControlCenterState(initialNodes, initialEdges) {
                 });
             }
         }
-    }, [events, updateFeature]);
+    }, [events, updateFeature, isMutating]);
     // Listen for optimistic approval/rejection events from the drawer (fires before SSE arrives).
     // Uses beginMutation + endMutation to prevent stale poll/reconcile data from overwriting
     // the optimistic 'running' state during the transition window (avoids brief "Something went wrong" flash).

package/dist/src/presentation/web/components/features/settings/notification-settings-section.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notification-settings-section.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/settings/notification-settings-section.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAmBpF,MAAM,WAAW,gCAAgC;IAC/C,aAAa,EAAE,uBAAuB,CAAC;CACxC;AAED,wBAAgB,2BAA2B,CAAC,EAAE,aAAa,EAAE,EAAE,gCAAgC,2CAkJ9F"}
+{"version":3,"file":"notification-settings-section.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/settings/notification-settings-section.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAmBpF,MAAM,WAAW,gCAAgC;IAC/C,aAAa,EAAE,uBAAuB,CAAC;CACxC;AAED,wBAAgB,2BAA2B,CAAC,EAAE,aAAa,EAAE,EAAE,gCAAgC,2CAsH9F"}

package/dist/src/presentation/web/components/features/settings/notification-settings-section.js

@@ -25,8 +25,6 @@ const PR_EVENT_TOGGLES = [
 ];
 export function NotificationSettingsSection({ notifications }) {
     const [inApp, setInApp] = useState(notifications.inApp.enabled);
-    const [browser, setBrowser] = useState(notifications.browser.enabled);
-    const [desktop, setDesktop] = useState(notifications.desktop.enabled);
     const [events, setEvents] = useState({ ...notifications.events });
     const [isPending, startTransition] = useTransition();
     const [showSaved, setShowSaved] = useState(false);
@@ -51,20 +49,18 @@ export function NotificationSettingsSection({ notifications }) {
         return {
             notifications: {
                 inApp: { enabled: overrides.inApp ?? inApp },
-                browser: { enabled: overrides.browser ?? browser },
-                desktop: { enabled: overrides.desktop ?? desktop },
                 events: overrides.events ?? events,
             },
         };
     }
-    function handleChannelChange(channel, setter, value) {
-        setter(value);
-        save(buildFullPayload({ [channel]: value }));
+    function handleInAppChange(value) {
+        setInApp(value);
+        save(buildFullPayload({ inApp: value }));
     }
     function handleEventChange(key, value) {
         const newEvents = { ...events, [key]: value };
         setEvents(newEvents);
         save(buildFullPayload({ events: newEvents }));
     }
-    return (_jsxs(Card, { id: "notifications", className: "scroll-mt-6", "data-testid": "notification-settings-section", children: [_jsxs(CardHeader, { children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Bell, { className: "text-muted-foreground h-4 w-4" }), _jsx(CardTitle, { children: "Notifications" })] }), isPending ? _jsx("span", { className: "text-muted-foreground text-xs", children: "Saving..." }) : null, showSaved && !isPending ? (_jsxs("span", { className: "flex items-center gap-1 text-xs text-green-600", children: [_jsx(Check, { className: "h-3 w-3" }), "Saved"] })) : null] }), _jsx(CardDescription, { children: "Configure notification channels and event preferences" })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "space-y-3", children: [_jsx("h3", { className: "text-sm font-semibold", children: "Channels" }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { htmlFor: "notif-in-app", children: "In-App" }), _jsx(Switch, { id: "notif-in-app", "data-testid": "switch-in-app", checked: inApp, onCheckedChange: (v) => handleChannelChange('inApp', setInApp, v) })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { htmlFor: "notif-browser", children: "Browser" }), _jsx(Switch, { id: "notif-browser", "data-testid": "switch-browser", checked: browser, onCheckedChange: (v) => handleChannelChange('browser', setBrowser, v) })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { htmlFor: "notif-desktop", children: "Desktop" }), _jsx(Switch, { id: "notif-desktop", "data-testid": "switch-desktop", checked: desktop, onCheckedChange: (v) => handleChannelChange('desktop', setDesktop, v) })] })] }), _jsx(Separator, {}), _jsxs("div", { className: "space-y-3", children: [_jsx("h3", { className: "text-sm font-semibold", children: "Agent Events" }), AGENT_EVENT_TOGGLES.map(({ key, label }) => (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { htmlFor: `notif-event-${key}`, children: label }), _jsx(Switch, { id: `notif-event-${key}`, "data-testid": `switch-event-${key}`, checked: events[key], onCheckedChange: (v) => handleEventChange(key, v) })] }, key)))] }), _jsx(Separator, {}), _jsxs("div", { className: "space-y-3", children: [_jsx("h3", { className: "text-sm font-semibold", children: "PR Events" }), PR_EVENT_TOGGLES.map(({ key, label }) => (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { htmlFor: `notif-event-${key}`, children: label }), _jsx(Switch, { id: `notif-event-${key}`, "data-testid": `switch-event-${key}`, checked: events[key], onCheckedChange: (v) => handleEventChange(key, v) })] }, key)))] })] })] }));
+    return (_jsxs(Card, { id: "notifications", className: "scroll-mt-6", "data-testid": "notification-settings-section", children: [_jsxs(CardHeader, { children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Bell, { className: "text-muted-foreground h-4 w-4" }), _jsx(CardTitle, { children: "Notifications" })] }), isPending ? _jsx("span", { className: "text-muted-foreground text-xs", children: "Saving..." }) : null, showSaved && !isPending ? (_jsxs("span", { className: "flex items-center gap-1 text-xs text-green-600", children: [_jsx(Check, { className: "h-3 w-3" }), "Saved"] })) : null] }), _jsx(CardDescription, { children: "Configure notification channels and event preferences" })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "space-y-3", children: [_jsx("h3", { className: "text-sm font-semibold", children: "Channels" }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { htmlFor: "notif-in-app", children: "In-App" }), _jsx(Switch, { id: "notif-in-app", "data-testid": "switch-in-app", checked: inApp, onCheckedChange: handleInAppChange })] })] }), _jsx(Separator, {}), _jsxs("div", { className: "space-y-3", children: [_jsx("h3", { className: "text-sm font-semibold", children: "Agent Events" }), AGENT_EVENT_TOGGLES.map(({ key, label }) => (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { htmlFor: `notif-event-${key}`, children: label }), _jsx(Switch, { id: `notif-event-${key}`, "data-testid": `switch-event-${key}`, checked: events[key], onCheckedChange: (v) => handleEventChange(key, v) })] }, key)))] }), _jsx(Separator, {}), _jsxs("div", { className: "space-y-3", children: [_jsx("h3", { className: "text-sm font-semibold", children: "PR Events" }), PR_EVENT_TOGGLES.map(({ key, label }) => (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { htmlFor: `notif-event-${key}`, children: label }), _jsx(Switch, { id: `notif-event-${key}`, "data-testid": `switch-event-${key}`, checked: events[key], onCheckedChange: (v) => handleEventChange(key, v) })] }, key)))] })] })] }));
 }

package/dist/src/presentation/web/components/features/settings/notification-settings-section.stories.js

@@ -38,7 +38,7 @@ export const Default = {
     args: {
         notifications: {
             inApp: { enabled: true },
-            browser: { enabled: true },
+            browser: { enabled: false },
             desktop: { enabled: false },
             events: allEvents,
         },
@@ -48,8 +48,8 @@ export const AllEnabled = {
     args: {
         notifications: {
             inApp: { enabled: true },
-            browser: { enabled: true },
-            desktop: { enabled: true },
+            browser: { enabled: false },
+            desktop: { enabled: false },
             events: allEvents,
         },
     },

package/dist/src/presentation/web/components/features/settings/settings-page-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"settings-page-client.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/settings/settings-page-client.tsx"],"names":[],"mappings":"AA4CA,OAAO,KAAK,EACV,QAAQ,EAGT,MAAM,sCAAsC,CAAC;AAC9C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAgC/E,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAC1C;AA6QD,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,kBAAkB,GACnB,EAAE,uBAAuB,2CAyqCzB"}
+{"version":3,"file":"settings-page-client.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/settings/settings-page-client.tsx"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EACV,QAAQ,EAGT,MAAM,sCAAsC,CAAC;AAC9C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AA2B/E,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAC1C;AA6QD,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,kBAAkB,GACnB,EAAE,uBAAuB,2CAulCzB"}

package/dist/src/presentation/web/components/features/settings/settings-page-client.js

@@ -1,24 +1,17 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useTransition, useRef, useEffect, useCallback } from 'react';
-import { Eye, EyeOff, Check, Bot, Terminal, GitBranch, Activity, Bell, Flag, Database, Minus, Plus, ExternalLink, Settings2, Timer, } from 'lucide-react';
+import { Check, Bot, Terminal, GitBranch, Activity, Bell, Flag, Database, Minus, Plus, ExternalLink, Settings2, Timer, } from 'lucide-react';
 import { toast } from 'sonner';
 import { cn } from '../../../lib/utils.js';
 import { Label } from '../../ui/label.js';
-import { Input } from '../../ui/input.js';
-import { Button } from '../../ui/button.js';
 import { Switch } from '../../ui/switch.js';
-import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../ui/tooltip.js';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../ui/select.js';
 import { updateSettingsAction } from '../../../app/actions/update-settings.js';
-import { AgentAuthMethod, EditorType, TerminalType, } from '../../../../../../packages/core/src/domain/generated/output.js';
+import { EditorType, TerminalType } from '../../../../../../packages/core/src/domain/generated/output.js';
 import { getEditorTypeIcon } from '../../common/editor-type-icons.js';
 import { AgentModelPicker } from '../../features/settings/AgentModelPicker/index.js';
 import { TimeoutSlider } from '../../features/settings/timeout-slider.js';
-const AUTH_METHOD_OPTIONS = [
-    { value: AgentAuthMethod.Session, label: 'Session' },
-    { value: AgentAuthMethod.Token, label: 'Token' },
-];
 const EDITOR_OPTIONS = [
     { value: EditorType.VsCode, label: 'VS Code' },
     { value: EditorType.Cursor, label: 'Cursor' },
@@ -125,9 +118,6 @@ export function SettingsPageClient({ settings, shepHome, dbFileSize, availableTe
     const featureFlags = settings.featureFlags ?? { skills: false, envDeploy: false, debug: false };
     // Agent state
     const [agentType, setAgentType] = useState(settings.agent.type);
-    const authMethod = settings.agent.authMethod;
-    const [token, setToken] = useState(settings.agent.token ?? '');
-    const [showToken, setShowToken] = useState(false);
     // Environment state
     const [editor, setEditor] = useState(settings.environment.defaultEditor);
     const [shell, setShell] = useState(settings.environment.shellPreference);
@@ -167,8 +157,6 @@ export function SettingsPageClient({ settings, shepHome, dbFileSize, availableTe
     const [analyzeRepoTimeout, setAnalyzeRepoTimeout] = useState(String(Math.round((analyzeRepoConfig?.analyzeMs ?? 600_000) / 1000)));
     // Notification state
     const [inApp, setInApp] = useState(settings.notifications.inApp.enabled);
-    const [browser, setBrowser] = useState(settings.notifications.browser.enabled);
-    const [desktop, setDesktop] = useState(settings.notifications.desktop.enabled);
     const [events, setEvents] = useState({ ...settings.notifications.events });
     // Feature flags state
     const [flags, setFlags] = useState({ ...featureFlags });
@@ -208,15 +196,6 @@ export function SettingsPageClient({ settings, shepHome, dbFileSize, availableTe
         const n = parseInt(value, 10);
         return Number.isNaN(n) || n <= 0 ? undefined : n;
     }
-    // Agent helpers
-    function buildAgentPayload(overrides = {}) {
-        const merged = { type: agentType, authMethod, ...overrides };
-        const result = { type: merged.type, authMethod: merged.authMethod };
-        if (merged.authMethod === AgentAuthMethod.Token) {
-            result.token = overrides.token ?? token;
-        }
-        return { agent: result };
-    }
     function secondsToMs(val) {
         if (val === undefined)
             return undefined;
@@ -261,8 +240,6 @@ export function SettingsPageClient({ settings, shepHome, dbFileSize, availableTe
         return {
             notifications: {
                 inApp: { enabled: overrides.inApp ?? inApp },
-                browser: { enabled: overrides.browser ?? browser },
-                desktop: { enabled: overrides.desktop ?? desktop },
                 events: overrides.events ?? events,
             },
         };
@@ -301,11 +278,7 @@ export function SettingsPageClient({ settings, shepHome, dbFileSize, availableTe
                                 return (_jsxs("button", { type: "button", onClick: () => scrollToSection(s.id), className: cn('flex cursor-pointer items-center gap-1 rounded-md px-1.5 py-1 text-[11px] transition-all', isActive
                                         ? 'bg-accent text-foreground font-medium'
                                         : 'text-muted-foreground/60 hover:text-foreground hover:bg-accent/50'), children: [_jsx(SectionIcon, { className: "h-3 w-3" }), _jsx("span", { className: "hidden sm:inline", children: s.label })] }, s.id));
-                            }) })] }) }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { id: "section-agent", className: "grid scroll-mt-18 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsxs(SettingsSection, { icon: Bot, title: "Agent", description: "AI coding agent and authentication", testId: "agent-settings-section", children: [_jsx(SettingsRow, { label: "Agent & Model", description: "Provider and model for all operations", htmlFor: "agent-model-picker", children: _jsx(AgentModelPicker, { initialAgentType: agentType, initialModel: settings.models.default, mode: "settings", onAgentModelChange: (newAgent) => setAgentType(newAgent), className: "w-55" }) }), _jsx(SettingsRow, { label: "Authentication", description: "How the agent authenticates", htmlFor: "auth-method", children: _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("div", { children: _jsxs(Select, { value: authMethod, disabled: true, children: [_jsx(SelectTrigger, { id: "auth-method", "data-testid": "auth-method-select", className: "w-55 cursor-not-allowed text-xs opacity-60", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: AUTH_METHOD_OPTIONS.map((opt) => (_jsx(SelectItem, { value: opt.value, children: opt.label }, opt.value))) })] }) }) }), _jsx(TooltipContent, { children: "Coming soon" })] }) }) }), authMethod === AgentAuthMethod.Token && (_jsx(SettingsRow, { label: "API Token", htmlFor: "agent-token", children: _jsxs("div", { className: "relative w-45", children: [_jsx(Input, { id: "agent-token", "data-testid": "agent-token-input", type: showToken ? 'text' : 'password', value: token, onChange: (e) => setToken(e.target.value), onBlur: () => {
-                                                        if (token !== (settings.agent.token ?? '')) {
-                                                            save(buildAgentPayload({ token }));
-                                                        }
-                                                    }, placeholder: "Enter token", className: "pr-8" }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "absolute top-0 right-0 h-full px-2 hover:bg-transparent", onClick: () => setShowToken(!showToken), "data-testid": "toggle-token-visibility", "aria-label": showToken ? 'Hide token' : 'Show token', children: showToken ? _jsx(EyeOff, { className: "h-3 w-3" }) : _jsx(Eye, { className: "h-3 w-3" }) })] }) }))] }), _jsx(SectionHint, { links: [
+                            }) })] }) }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { id: "section-agent", className: "grid scroll-mt-18 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsx(SettingsSection, { icon: Bot, title: "Agent", description: "AI coding agent and authentication", testId: "agent-settings-section", children: _jsx(SettingsRow, { label: "Agent & Model", description: "Provider and model for all operations", htmlFor: "agent-model-picker", children: _jsx(AgentModelPicker, { initialAgentType: agentType, initialModel: settings.models.default, mode: "settings", onAgentModelChange: (newAgent) => setAgentType(newAgent), className: "w-55" }) }) }), _jsx(SectionHint, { links: [
                                     {
                                         label: 'Agent system',
                                         href: 'https://github.com/shep-ai/cli/blob/main/docs/architecture/agent-system.md',
@@ -443,12 +416,6 @@ export function SettingsPageClient({ settings, shepHome, dbFileSize, availableTe
                                             }, defaultSeconds: 600 }) })] }), _jsx(SectionHint, { children: "Each agent has independently configurable stage timeouts. When a stage exceeds its timeout, the agent is terminated. Longer timeouts are useful for complex implementations. Feature agent defaults to 30 minutes per stage. Analyze repository agent defaults to 10 minutes." })] }), _jsxs("div", { id: "section-notifications", className: "grid scroll-mt-18 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsxs(SettingsSection, { icon: Bell, title: "Notifications", description: "How and when you get notified", testId: "notification-settings-section", children: [_jsx(SubsectionLabel, { children: "Channels" }), _jsx(SwitchRow, { label: "In-app", description: "Notifications inside the Shep UI", id: "notif-in-app", testId: "switch-in-app", checked: inApp, onChange: (v) => {
                                             setInApp(v);
                                             save(buildNotificationPayload({ inApp: v }));
-                                        } }), _jsx(SwitchRow, { label: "Browser", description: "Push notifications via the browser", id: "notif-browser", testId: "switch-browser", checked: browser, onChange: (v) => {
-                                            setBrowser(v);
-                                            save(buildNotificationPayload({ browser: v }));
-                                        } }), _jsx(SwitchRow, { label: "Desktop", description: "Native OS notifications", id: "notif-desktop", testId: "switch-desktop", checked: desktop, onChange: (v) => {
-                                            setDesktop(v);
-                                            save(buildNotificationPayload({ desktop: v }));
                                         } }), _jsx(SubsectionLabel, { children: "Agent Events" }), _jsx(SwitchRow, { label: "Agent started", id: "notif-event-agentStarted", testId: "switch-event-agentStarted", checked: events.agentStarted, onChange: (v) => {
                                             const newEvents = { ...events, agentStarted: v };
                                             setEvents(newEvents);
@@ -485,12 +452,20 @@ export function SettingsPageClient({ settings, shepHome, dbFileSize, availableTe
                                             const newEvents = { ...events, prChecksFailed: v };
                                             setEvents(newEvents);
                                             save(buildNotificationPayload({ events: newEvents }));
+                                        } }), _jsx(SwitchRow, { label: "PR blocked", id: "notif-event-prBlocked", testId: "switch-event-prBlocked", checked: events.prBlocked, onChange: (v) => {
+                                            const newEvents = { ...events, prBlocked: v };
+                                            setEvents(newEvents);
+                                            save(buildNotificationPayload({ events: newEvents }));
+                                        } }), _jsx(SwitchRow, { label: "Merge review ready", id: "notif-event-mergeReviewReady", testId: "switch-event-mergeReviewReady", checked: events.mergeReviewReady, onChange: (v) => {
+                                            const newEvents = { ...events, mergeReviewReady: v };
+                                            setEvents(newEvents);
+                                            save(buildNotificationPayload({ events: newEvents }));
                                         } })] }), _jsx(SectionHint, { links: [
                                     {
                                         label: 'Notification system',
                                         href: 'https://github.com/shep-ai/cli/blob/main/specs/021-agent-notifications/spec.yaml',
                                     },
-                                ], children: "Three notification channels keep you in the loop: in-app toasts, browser push notifications, and native desktop alerts. Fine-tune which agent lifecycle events trigger a notification." })] }), _jsxs("div", { id: "section-feature-flags", className: "grid scroll-mt-18 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsxs(SettingsSection, { icon: Flag, title: "Feature Flags", description: "Enable or disable experimental features", badge: "Experimental", testId: "feature-flags-settings-section", children: [_jsx(SwitchRow, { label: "Skills", description: "Enable the skills system for agent capabilities", id: "flag-skills", testId: "switch-flag-skills", checked: flags.skills, onChange: (v) => {
+                                ], children: "In-app toast notifications keep you in the loop. Fine-tune which agent lifecycle events trigger a notification." })] }), _jsxs("div", { id: "section-feature-flags", className: "grid scroll-mt-18 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsxs(SettingsSection, { icon: Flag, title: "Feature Flags", description: "Enable or disable experimental features", badge: "Experimental", testId: "feature-flags-settings-section", children: [_jsx(SwitchRow, { label: "Skills", description: "Enable the skills system for agent capabilities", id: "flag-skills", testId: "switch-flag-skills", checked: flags.skills, onChange: (v) => {
                                             const newFlags = { ...flags, skills: v };
                                             setFlags(newFlags);
                                             save({ featureFlags: newFlags });

package/dist/src/presentation/web/components/features/settings/settings-page-client.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"settings-page-client.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/settings/settings-page-client.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAM5D,QAAA,MAAM,IAAI;;;;;;;CAOiC,CAAC;AAE5C,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAkBzB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAa7B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAsB5B,CAAC"}
+{"version":3,"file":"settings-page-client.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/settings/settings-page-client.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAM5D,QAAA,MAAM,IAAI;;;;;;;CAOiC,CAAC;AAE5C,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAiBzB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAa7B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAsB5B,CAAC"}

package/dist/src/presentation/web/components/features/settings/settings-page-client.stories.js

@@ -1,6 +1,6 @@
 import { SettingsPageClient } from './settings-page-client.js';
 import { createDefaultSettings } from '../../../../../../packages/core/src/domain/factories/settings-defaults.factory.js';
-import { AgentType, AgentAuthMethod } from '../../../../../../packages/core/src/domain/generated/output.js';
+import { AgentType } from '../../../../../../packages/core/src/domain/generated/output.js';
 const defaultSettings = createDefaultSettings();
 const meta = {
     title: 'Features/Settings/SettingsPageClient',
@@ -23,9 +23,8 @@ export const AllSections = {
         settings: {
             ...defaultSettings,
             agent: {
+                ...defaultSettings.agent,
                 type: AgentType.GeminiCli,
-                authMethod: AgentAuthMethod.Token,
-                token: 'sk-test-token-12345',
             },
             featureFlags: {
                 skills: true,

package/dist/src/presentation/web/hooks/use-deploy-action.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-deploy-action.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/use-deploy-action.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAM5E,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,SAAS,GAAG,YAAY,CAAC;IACrC,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAI,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,MAAM,EAAE,eAAe,GAAG,IAAI,CAAC;IAC/B,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;CACpB;AAOD,wBAAgB,eAAe,CAAC,KAAK,EAAE,iBAAiB,GAAG,IAAI,GAAG,iBAAiB,CAwKlF"}
+{"version":3,"file":"use-deploy-action.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/use-deploy-action.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAM5E,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,SAAS,GAAG,YAAY,CAAC;IACrC,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAI,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,MAAM,EAAE,eAAe,GAAG,IAAI,CAAC;IAC/B,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;CACpB;AAMD,wBAAgB,eAAe,CAAC,KAAK,EAAE,iBAAiB,GAAG,IAAI,GAAG,iBAAiB,CAmOlF"}

package/dist/src/presentation/web/hooks/use-deploy-action.js

@@ -6,7 +6,6 @@ import { deployRepository } from '../app/actions/deploy-repository.js';
 import { stopDeployment } from '../app/actions/stop-deployment.js';
 import { getDeploymentStatus } from '../app/actions/get-deployment-status.js';
 const log = createLogger('[useDeployAction]');
-const ERROR_CLEAR_DELAY = 5000;
 const POLL_INTERVAL = 3000;
 export function useDeployAction(input) {
     const [deployLoading, setDeployLoading] = useState(false);
@@ -14,7 +13,6 @@ export function useDeployAction(input) {
     const [deployError, setDeployError] = useState(null);
     const [status, setStatus] = useState(null);
     const [url, setUrl] = useState(null);
-    const errorTimerRef = useRef(null);
     const pollIntervalRef = useRef(null);
     const mountedRef = useRef(true);
     const statusRef = useRef(status);
@@ -29,11 +27,37 @@ export function useDeployAction(input) {
             mountedRef.current = false;
         };
     }, []);
+    // Fetch status on mount — recover running dev servers after page reload
+    useEffect(() => {
+        if (!input)
+            return;
+        let cancelled = false;
+        (async () => {
+            try {
+                const result = await getDeploymentStatus(input.targetId);
+                if (cancelled || !mountedRef.current)
+                    return;
+                if (result && result.state !== 'Stopped') {
+                    log.info(`mount recovery: "${input.targetId}" state=${result.state}, url=${result.url}`);
+                    setStatus(result.state);
+                    setUrl(result.url);
+                    startPolling(input.targetId);
+                }
+            }
+            catch {
+                // Server container may not be available (e.g., in tests)
+                log.debug(`mount recovery failed for "${input.targetId}" — ignoring`);
+            }
+        })();
+        return () => {
+            cancelled = true;
+        };
+        // Only run on mount (input identity is stable from the caller)
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [input?.targetId]);
     // Cleanup on unmount
     useEffect(() => {
         return () => {
-            if (errorTimerRef.current)
-                clearTimeout(errorTimerRef.current);
             if (pollIntervalRef.current)
                 clearInterval(pollIntervalRef.current);
         };
@@ -53,7 +77,20 @@ export function useDeployAction(input) {
                 stopPolling();
                 return;
             }
-            const result = await getDeploymentStatus(targetId);
+            let result;
+            try {
+                result = await getDeploymentStatus(targetId);
+            }
+            catch (err) {
+                log.warn(`poll fetch failed for "${targetId}":`, err);
+                // Treat fetch failure as deployment gone — clear UI
+                if (mountedRef.current) {
+                    setStatus(null);
+                    setUrl(null);
+                    stopPolling();
+                }
+                return;
+            }
             if (!mountedRef.current)
                 return;
             if (!result || result.state === 'Stopped') {
@@ -71,6 +108,32 @@ export function useDeployAction(input) {
             }
         }, POLL_INTERVAL);
     }, [stopPolling]);
+    // Idle poll — when no deployment is known, periodically check if one was
+    // started externally (e.g., from the drawer while the repo node is mounted).
+    const IDLE_POLL_INTERVAL = 5000;
+    useEffect(() => {
+        if (!input || status !== null)
+            return;
+        const timer = setInterval(async () => {
+            if (!mountedRef.current)
+                return;
+            try {
+                const result = await getDeploymentStatus(input.targetId);
+                if (!mountedRef.current)
+                    return;
+                if (result && result.state !== 'Stopped') {
+                    log.info(`idle poll: "${input.targetId}" state=${result.state}, url=${result.url}`);
+                    setStatus(result.state);
+                    setUrl(result.url);
+                    startPolling(input.targetId);
+                }
+            }
+            catch {
+                // ignore
+            }
+        }, IDLE_POLL_INTERVAL);
+        return () => clearInterval(timer);
+    }, [input, status, startPolling]);
     const handleDeploy = useCallback(async () => {
         if (!input) {
             log.warn('deploy() called but input is null — no-op');
@@ -81,8 +144,6 @@ export function useDeployAction(input) {
             return;
         }
         log.info(`deploy() — targetType="${input.targetType}", targetId="${input.targetId}", repositoryPath="${input.repositoryPath}"`);
-        if (errorTimerRef.current)
-            clearTimeout(errorTimerRef.current);
         setDeployLoading(true);
         setDeployError(null);
         try {
@@ -96,9 +157,8 @@ export function useDeployAction(input) {
             }
             if (!result.success) {
                 const errorMessage = result.error ?? 'An unexpected error occurred';
-                log.error(`deploy failed: ${errorMessage}`);
+                log.warn(`deploy failed: ${errorMessage}`);
                 setDeployError(errorMessage);
-                errorTimerRef.current = setTimeout(() => setDeployError(null), ERROR_CLEAR_DELAY);
             }
             else {
                 log.info(`deploy succeeded — initial state=${result.state}, starting polling`);
@@ -113,7 +173,6 @@ export function useDeployAction(input) {
             const errorMessage = err instanceof Error ? err.message : 'An unexpected error occurred';
             log.error(`deploy threw exception: ${errorMessage}`, err);
             setDeployError(errorMessage);
-            errorTimerRef.current = setTimeout(() => setDeployError(null), ERROR_CLEAR_DELAY);
         }
         finally {
             if (mountedRef.current) {

package/dist/src/presentation/web/lib/layout-with-dagre.js

@@ -3,12 +3,12 @@ import dagre from '@dagrejs/dagre';
 export const CANVAS_LAYOUT_DEFAULTS = {
     direction: 'LR',
     ranksep: 200,
-    nodesep: 15,
+    nodesep: 30,
 };
 /** Known node-type dimensions for the canvas node types */
 const NODE_DIMENSIONS = {
-    featureNode: { width: 288, height: 140 },
-    repositoryNode: { width: 400, height: 110 },
+    featureNode: { width: 288, height: 160 },
+    repositoryNode: { width: 400, height: 160 },
 };
 function getNodeSize(node, defaultSize) {
     // Prefer per-node size from data, then type-based lookup, then default