@shepai/cli 1.78.0-pr247.58f85f0 → 1.78.0-pr247.d196fda

package/dist/src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feature-create-drawer.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.tsx"],"names":[],"mappings":"AA2BA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAC/F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qCAAqC,CAAC;AAI5E,YAAY,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAE/F,0DAA0D;AAC1D,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,cAAc,EAAE,CAAC;IAC9B,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE;QACb,QAAQ,EAAE,OAAO,CAAC;QAClB,SAAS,EAAE,OAAO,CAAC;QACnB,UAAU,EAAE,OAAO,CAAC;KACrB,CAAC;IACF,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0EAA0E;IAC1E,IAAI,EAAE,OAAO,CAAC;IACd,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAcD,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,qEAAqE;IACrE,QAAQ,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACjC,kGAAkG;IAClG,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,8CAA8C;IAC9C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,cAAc,EACd,YAAoB,EACpB,gBAAgB,EAChB,QAAQ,EACR,eAAe,EACf,gBAAgB,EAChB,YAAY,GACb,EAAE,wBAAwB,2CA6X1B"}
+{"version":3,"file":"feature-create-drawer.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.tsx"],"names":[],"mappings":"AA2BA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAC/F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qCAAqC,CAAC;AAI5E,YAAY,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAE/F,0DAA0D;AAC1D,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,cAAc,EAAE,CAAC;IAC9B,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE;QACb,QAAQ,EAAE,OAAO,CAAC;QAClB,SAAS,EAAE,OAAO,CAAC;QACnB,UAAU,EAAE,OAAO,CAAC;KACrB,CAAC;IACF,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0EAA0E;IAC1E,IAAI,EAAE,OAAO,CAAC;IACd,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAcD,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,qEAAqE;IACrE,QAAQ,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACjC,kGAAkG;IAClG,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,8CAA8C;IAC9C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,cAAc,EACd,YAAoB,EACpB,gBAAgB,EAChB,QAAQ,EACR,eAAe,EACf,gBAAgB,EAChB,YAAY,GACb,EAAE,wBAAwB,2CA4X1B"}

package/dist/src/presentation/web/components/common/feature-create-drawer/feature-create-drawer.js

@@ -125,7 +125,7 @@ export function FeatureCreateDrawer({ open, onClose, onSubmit, repositoryPath, i
     return (_jsx(BaseDrawer, { open: open, onClose: attemptClose, size: "md", modal: false, dismissOnOutsideClick: true, "data-testid": "feature-create-drawer", header: _jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "h-2.5 w-2.5 shrink-0 rounded-full bg-blue-500" }), _jsx(DrawerTitle, { children: "NEW FEATURE" })] }), isSubmitting ? (_jsx(DrawerDescription, { asChild: true, children: _jsx("div", { children: _jsx(Badge, { variant: "secondary", children: "Creating..." }) }) })) : null] }), footer: _jsxs("div", { className: "flex flex-row justify-end gap-2", children: [_jsx(Button, { variant: "outline", onClick: attemptClose, disabled: isSubmitting, children: "Cancel" }), _jsx(Button, { type: "submit", form: "create-feature-form", disabled: !description.trim() || isSubmitting, children: isSubmitting ? 'Creating...' : '+ Create Feature' })] }), children: _jsx("div", { className: "overflow-y-auto p-4", children: _jsx(TooltipProvider, { delayDuration: 400, children: _jsxs("form", { id: "create-feature-form", onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "feature-description", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "DESCRIBE YOUR FEATURE" }), _jsxs("div", { className: "border-input focus-within:ring-ring/50 focus-within:border-ring overflow-hidden rounded-md border shadow-xs transition-[color,box-shadow] focus-within:ring-[3px]", children: [_jsx(Textarea, { id: "feature-description", placeholder: "e.g. Add GitHub OAuth login with callback handling and token refresh...", value: description, onChange: (e) => setDescription(e.target.value), rows: 7, required: true, disabled: isSubmitting, className: "field-sizing-fixed min-h-42! resize-none rounded-none border-0 shadow-none focus-visible:ring-0" }), _jsxs("div", { className: "border-input flex items-center gap-3 border-t px-3 py-1.5", children: [_jsx(AgentModelPicker, { initialAgentType: overrideAgent ?? currentAgentType ?? 'claude-code', initialModel: overrideModel ?? currentModel ?? 'claude-sonnet-4-6', mode: "override", onAgentModelChange: (agent, model) => {
                                                         setOverrideAgent(agent);
                                                         setOverrideModel(model);
-                                                    }, disabled: isSubmitting, className: "w-55" }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "ml-auto flex cursor-pointer items-center gap-2", children: [_jsx(Switch, { id: "fast-mode", checked: fast, onCheckedChange: setFast, disabled: isSubmitting }), _jsx(Label, { htmlFor: "fast-mode", className: "cursor-pointer text-sm font-medium", children: "Fast Mode" })] }) }), _jsx(TooltipContent, { side: "bottom", children: "Skip SDLC phases and implement directly from your prompt." })] })] })] })] }), hasFeatures && initialParentId !== undefined ? (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "parent-feature", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "PARENT FEATURE" }), _jsx(ParentFeatureCombobox, { features: features, value: parentId, onChange: setParentId, disabled: isSubmitting })] })) : null, _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "border-input flex items-center gap-4 rounded-md border px-3 py-2.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "text-muted-foreground w-16 shrink-0 cursor-default text-xs font-semibold tracking-wider", children: "APPROVE" }) }), _jsx(TooltipContent, { side: "bottom", children: "Auto-approve phase transitions without manual review." })] }), _jsx("div", { className: "flex flex-1 items-center gap-4", children: AUTO_APPROVE_OPTIONS.map((opt) => (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: `approve-${opt.id}`, size: "sm", checked: approvalGates[opt.id] ?? false, onCheckedChange: (v) => setApprovalGates((prev) => ({ ...prev, [opt.id]: v })), disabled: isSubmitting ||
+                                                    }, disabled: isSubmitting }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "ml-auto flex cursor-pointer items-center gap-2", children: [_jsx(Switch, { id: "fast-mode", checked: fast, onCheckedChange: setFast, disabled: isSubmitting }), _jsx(Label, { htmlFor: "fast-mode", className: "cursor-pointer text-sm font-medium", children: "Fast Mode" })] }) }), _jsx(TooltipContent, { side: "bottom", children: "Skip SDLC phases and implement directly from your prompt." })] })] })] })] }), hasFeatures && initialParentId !== undefined ? (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "parent-feature", className: "text-muted-foreground text-xs font-semibold tracking-wider", children: "PARENT FEATURE" }), _jsx(ParentFeatureCombobox, { features: features, value: parentId, onChange: setParentId, disabled: isSubmitting })] })) : null, _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "border-input flex items-center gap-4 rounded-md border px-3 py-2.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "text-muted-foreground w-16 shrink-0 cursor-default text-xs font-semibold tracking-wider", children: "APPROVE" }) }), _jsx(TooltipContent, { side: "bottom", children: "Auto-approve phase transitions without manual review." })] }), _jsx("div", { className: "flex flex-1 items-center gap-4", children: AUTO_APPROVE_OPTIONS.map((opt) => (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { className: "flex cursor-pointer items-center gap-1.5", children: [_jsx(Switch, { id: `approve-${opt.id}`, size: "sm", checked: approvalGates[opt.id] ?? false, onCheckedChange: (v) => setApprovalGates((prev) => ({ ...prev, [opt.id]: v })), disabled: isSubmitting ||
                                                                         (fast && (opt.id === 'allowPrd' || opt.id === 'allowPlan')) }), _jsx(Label, { htmlFor: `approve-${opt.id}`, className: "cursor-pointer text-xs font-medium", children: opt.label })] }) }), _jsx(TooltipContent, { side: "bottom", children: fast && (opt.id === 'allowPrd' || opt.id === 'allowPlan')
                                                             ? 'Skipped in Fast Mode'
                                                             : opt.description })] }, opt.id))) }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: () => {

package/dist/src/presentation/web/components/features/settings/AgentModelPicker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../src/presentation/web/components/features/settings/AgentModelPicker/index.tsx"],"names":[],"mappings":"AAaA,MAAM,WAAW,qBAAqB;IACpC,gBAAgB,EAAE,MAAM,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,IAAI,EAAE,UAAU,GAAG,UAAU,CAAC;CAC/B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,gBAAgB,EAChB,YAAY,EACZ,kBAAkB,EAClB,QAAQ,EACR,SAAS,EACT,IAAI,GACL,EAAE,qBAAqB,2CAoNvB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../src/presentation/web/components/features/settings/AgentModelPicker/index.tsx"],"names":[],"mappings":"AAaA,MAAM,WAAW,qBAAqB;IACpC,gBAAgB,EAAE,MAAM,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,IAAI,EAAE,UAAU,GAAG,UAAU,CAAC;CAC/B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,gBAAgB,EAChB,YAAY,EACZ,kBAAkB,EAClB,QAAQ,EACR,SAAS,EACT,IAAI,GACL,EAAE,qBAAqB,2CAqMvB"}

package/dist/src/presentation/web/components/features/settings/AgentModelPicker/index.js

@@ -1,5 +1,5 @@
 'use client';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from 'react';
 import { Check, ChevronLeft, ChevronRight } from 'lucide-react';
 import { getAllAgentModels } from '../../../../app/actions/get-all-agent-models.js';
@@ -82,9 +82,9 @@ export function AgentModelPicker({ initialAgentType, initialModel, onAgentModelC
     const isDisabled = (disabled ?? false) || loading;
     const AgentIcon = getAgentTypeIcon(agentType);
     const agentLabel = groups.find((g) => g.agentType === agentType)?.label ?? agentType;
-    const modelName = model ? getModelMeta(model).displayName || model : null;
+    const displayModel = model ? getModelMeta(model).displayName || model : agentLabel;
     const activeGroup = drillAgent ? groups.find((g) => g.agentType === drillAgent) : null;
-    return (_jsxs("div", { className: cn('flex flex-col gap-1', className), children: [_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", role: "combobox", "aria-expanded": open, disabled: isDisabled, className: "w-auto cursor-pointer justify-start font-normal hover:border-violet-300 hover:bg-violet-50/50 dark:hover:border-violet-700 dark:hover:bg-violet-950/30", children: _jsxs("span", { className: "flex items-center gap-2 truncate", children: [_jsx(AgentIcon, { className: "h-4 w-4 shrink-0" }), loading ? ('Loading…') : (_jsxs("span", { className: "flex items-center gap-1", children: [_jsx("span", { className: "text-muted-foreground text-xs", children: agentLabel }), modelName ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-muted-foreground/50 text-xs", children: "\u00B7" }), _jsx("span", { className: "text-xs font-medium", children: modelName })] })) : null] }))] }) }) }), _jsx(PopoverContent, { className: "w-(--radix-popover-trigger-width) overflow-hidden p-0", align: "start", children: _jsxs("div", { className: "flex transition-transform duration-200 ease-in-out", style: { transform: `translateX(${level === 1 ? '-50%' : '0%'})`, width: '200%' }, children: [_jsxs("div", { className: "w-1/2 shrink-0", children: [_jsx("div", { className: "text-muted-foreground border-b px-3 py-2 text-xs font-medium", children: "Select agent" }), groups.map((group) => {
+    return (_jsxs("div", { className: cn('flex flex-col gap-1', className), children: [_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", role: "combobox", "aria-expanded": open, disabled: isDisabled, className: "w-auto cursor-pointer font-normal", children: _jsxs("span", { className: "flex items-center gap-2 truncate", children: [_jsx(AgentIcon, { className: "h-4 w-4 shrink-0" }), loading ? 'Loading…' : displayModel] }) }) }), _jsx(PopoverContent, { className: "w-64 overflow-hidden p-0", align: "start", children: _jsxs("div", { className: "flex transition-transform duration-200 ease-in-out", style: { transform: `translateX(${level === 1 ? '-50%' : '0%'})`, width: '200%' }, children: [_jsxs("div", { className: "w-1/2 shrink-0", children: [_jsx("div", { className: "text-muted-foreground border-b px-3 py-2 text-xs font-medium", children: "Select agent" }), groups.map((group) => {
                                             const GroupIcon = getAgentTypeIcon(group.agentType);
                                             const isActive = agentType === group.agentType;
                                             const hasModels = group.models.length > 0;

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":"AAoCA,OAAO,KAAK,EACV,QAAQ,EAGT,MAAM,sCAAsC,CAAC;AAyB9C,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;CACpB;AAwPD,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,uBAAuB,2CAyxB7F"}
+{"version":3,"file":"settings-page-client.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/settings/settings-page-client.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EACV,QAAQ,EAGT,MAAM,sCAAsC,CAAC;AAe9C,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;CACpB;AA6GD,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,uBAAuB,2CAyhB7F"}

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

@@ -1,14 +1,12 @@
 '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, } from 'lucide-react';
+import { Eye, EyeOff, Check } 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 } from '../../../../../../packages/core/src/domain/generated/output.js';
@@ -25,15 +23,6 @@ const EDITOR_OPTIONS = [
     { value: EditorType.Zed, label: 'Zed' },
     { value: EditorType.Antigravity, label: 'Antigravity' },
 ];
-const SECTIONS = [
-    { id: 'agent', label: 'Agent', icon: Bot },
-    { id: 'environment', label: 'Environment', icon: Terminal },
-    { id: 'workflow', label: 'Workflow', icon: GitBranch },
-    { id: 'ci', label: 'CI', icon: Activity },
-    { id: 'notifications', label: 'Notifications', icon: Bell },
-    { id: 'feature-flags', label: 'Flags', icon: Flag },
-    { id: 'database', label: 'Database', icon: Database },
-];
 function useSaveIndicator() {
     const [isPending, startTransition] = useTransition();
     const [showSaved, setShowSaved] = useState(false);
@@ -56,51 +45,21 @@ function useSaveIndicator() {
     }, [startTransition]);
     return { isPending, showSaved, save };
 }
-/* ── Reusable row components ── */
-function SettingsRow({ label, description, htmlFor, children, }) {
-    return (_jsxs("div", { className: "flex items-center justify-between gap-4 border-b py-2.5 last:border-b-0", children: [_jsxs("div", { className: "min-w-0", children: [_jsx(Label, { htmlFor: htmlFor, className: "cursor-pointer text-sm font-normal whitespace-nowrap", children: label }), description ? (_jsx("p", { className: "text-muted-foreground text-[11px] leading-tight", children: description })) : null] }), _jsx("div", { className: "flex shrink-0 items-center gap-2", children: children })] }));
-}
-function SwitchRow({ label, description, id, testId, checked, onChange, }) {
-    return (_jsx(SettingsRow, { label: label, description: description, htmlFor: id, children: _jsx(Switch, { id: id, "data-testid": testId, checked: checked, onCheckedChange: onChange, className: "cursor-pointer" }) }));
-}
-/* ── Section card wrapper ── */
-function SettingsSection({ icon: Icon, title, description, badge, testId, children, }) {
-    return (_jsxs("div", { className: "bg-background rounded-lg border", "data-testid": testId, children: [_jsxs("div", { className: "bg-muted/30 border-b px-4 py-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Icon, { className: "text-muted-foreground h-3.5 w-3.5" }), _jsx("h2", { className: "text-sm font-semibold", children: title }), badge ? (_jsx("span", { className: "bg-muted text-muted-foreground rounded px-1.5 py-0.5 text-[9px] font-medium tracking-wider uppercase", children: badge })) : null] }), _jsx("p", { className: "text-muted-foreground mt-0.5 text-[11px]", children: description })] }), _jsx("div", { className: "px-4", children: children })] }));
+function SettingsRow({ label, htmlFor, children, }) {
+    return (_jsxs("div", { className: "flex items-center justify-between gap-4 border-b py-3 last:border-b-0", children: [_jsx(Label, { htmlFor: htmlFor, className: "cursor-pointer text-sm font-normal whitespace-nowrap", children: label }), _jsx("div", { className: "flex items-center gap-2", children: children })] }));
 }
-function NumberStepper({ id, testId, value, onChange, onBlur, placeholder, min = 1, max, step = 1, suffix, }) {
-    const numValue = value === '' ? undefined : parseInt(value, 10);
-    const decrement = () => {
-        const current = numValue ?? parseInt(placeholder, 10);
-        const next = Math.max(min, current - step);
-        onChange(String(next));
-    };
-    const increment = () => {
-        const current = numValue ?? parseInt(placeholder, 10);
-        const next = max != null ? Math.min(max, current + step) : current + step;
-        onChange(String(next));
-    };
-    return (_jsxs("div", { className: "flex items-center gap-1.5", children: [_jsxs("div", { className: "flex items-center overflow-hidden rounded-md border", children: [_jsx("button", { type: "button", onClick: () => {
-                            decrement();
-                        }, onMouseUp: onBlur, className: "text-muted-foreground hover:bg-muted hover:text-foreground flex h-8 w-7 cursor-pointer items-center justify-center border-r transition-colors", "aria-label": "Decrease", children: _jsx(Minus, { className: "h-3 w-3" }) }), _jsx("input", { id: id, "data-testid": testId, type: "text", inputMode: "numeric", pattern: "[0-9]*", value: value, placeholder: placeholder, onChange: (e) => {
-                            const v = e.target.value.replace(/[^0-9]/g, '');
-                            onChange(v);
-                        }, onBlur: onBlur, className: "h-8 w-14 bg-transparent text-center text-xs outline-none" }), _jsx("button", { type: "button", onClick: () => {
-                            increment();
-                        }, onMouseUp: onBlur, className: "text-muted-foreground hover:bg-muted hover:text-foreground flex h-8 w-7 cursor-pointer items-center justify-center border-l transition-colors", "aria-label": "Increase", children: _jsx(Plus, { className: "h-3 w-3" }) })] }), suffix ? _jsx("span", { className: "text-muted-foreground text-[11px]", children: suffix }) : null] }));
+function SelectRow({ label, id, testId, value, options, onChange, }) {
+    return (_jsx(SettingsRow, { label: label, htmlFor: id, children: _jsxs(Select, { value: value, onValueChange: onChange, children: [_jsx(SelectTrigger, { id: id, "data-testid": testId, className: "w-45 cursor-pointer", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: options.map((opt) => (_jsx(SelectItem, { value: opt.value, children: opt.label }, opt.value))) })] }) }));
 }
-function SubsectionLabel({ children }) {
-    return (_jsx("div", { className: "border-b pt-3 pb-1", children: _jsx("span", { className: "text-muted-foreground text-[10px] font-semibold tracking-wider uppercase", children: children }) }));
+function SwitchRow({ label, id, testId, checked, onChange, }) {
+    return (_jsx(SettingsRow, { label: label, htmlFor: id, children: _jsx(Switch, { id: id, "data-testid": testId, checked: checked, onCheckedChange: onChange, className: "cursor-pointer" }) }));
 }
-function SectionHint({ children, links, }) {
-    return (_jsxs("div", { className: "hidden pt-2 lg:block", children: [_jsx("p", { className: "text-muted-foreground/70 text-[11px] leading-relaxed", children: children }), links != null && links.length > 0 ? (_jsx("div", { className: "mt-2 flex flex-col gap-1", children: links.map((link) => (_jsxs("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "text-muted-foreground hover:text-foreground inline-flex items-center gap-1 text-[10px] transition-colors", children: [_jsx(ExternalLink, { className: "h-2.5 w-2.5" }), link.label] }, link.href))) })) : null] }));
-}
-/* ── Main component ── */
 export function SettingsPageClient({ settings, shepHome, dbFileSize }) {
     const { isPending, showSaved, save } = useSaveIndicator();
     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 [authMethod, setAuthMethod] = useState(settings.agent.authMethod);
     const [token, setToken] = useState(settings.agent.token ?? '');
     const [showToken, setShowToken] = useState(false);
     // Environment state
@@ -174,182 +133,99 @@ export function SettingsPageClient({ settings, shepHome, dbFileSize }) {
             },
         };
     }
-    const [activeSection, setActiveSection] = useState('agent');
-    // Track which section is in view via IntersectionObserver
-    useEffect(() => {
-        const els = SECTIONS.map((s) => document.getElementById(`section-${s.id}`)).filter(Boolean);
-        if (els.length === 0)
-            return;
-        const observer = new IntersectionObserver((entries) => {
-            for (const entry of entries) {
-                if (entry.isIntersecting) {
-                    setActiveSection(entry.target.id.replace('section-', ''));
-                }
-            }
-        }, { rootMargin: '-20% 0px -60% 0px', threshold: 0 });
-        for (const el of els)
-            observer.observe(el);
-        return () => observer.disconnect();
-    }, []);
-    const scrollToSection = useCallback((id) => {
-        const el = document.getElementById(`section-${id}`);
-        if (!el)
-            return;
-        el.scrollIntoView({ behavior: 'smooth', block: 'start' });
-        // Flash highlight
-        el.style.animation = 'none';
-        // Force reflow
-        void el.offsetHeight;
-        el.style.animation = 'section-flash 1s ease-out';
-    }, []);
-    return (_jsxs("div", { "data-testid": "settings-page-client", className: "max-w-5xl", children: [_jsxs("div", { className: "mb-4 flex items-center gap-3", children: [_jsx("h1", { className: "text-sm font-bold tracking-tight", children: "Settings" }), _jsx("nav", { className: "flex items-center gap-0.5", children: SECTIONS.map((s) => {
-                            const SectionIcon = s.icon;
-                            const isActive = activeSection === s.id;
-                            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));
-                        }) }), isPending ? (_jsx("span", { className: "text-muted-foreground ml-auto text-xs", children: "Saving..." })) : null, showSaved && !isPending ? (_jsxs("span", { className: "ml-auto flex items-center gap-1 text-xs text-green-600", children: [_jsx(Check, { className: "h-3 w-3" }), "Saved"] })) : null] }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { id: "section-agent", className: "grid scroll-mt-6 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: [
-                                    {
-                                        label: 'Agent system',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/docs/architecture/agent-system.md',
-                                    },
-                                    {
-                                        label: 'Adding agents',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/docs/development/adding-agents.md',
-                                    },
-                                    {
-                                        label: 'Configuration guide',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/docs/guides/configuration.md',
-                                    },
-                                ], children: "Choose which AI coding agent powers your features. Each agent supports different models and capabilities. Authentication is resolved automatically via your active session." })] }), _jsxs("div", { id: "section-environment", className: "grid scroll-mt-6 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsx(SettingsSection, { icon: Terminal, title: "Environment", description: "Editor and shell preferences", testId: "environment-settings-section", children: _jsx(SettingsRow, { label: "Default Editor", description: "Editor launched for file operations", htmlFor: "default-editor", children: _jsxs(Select, { value: editor, onValueChange: (v) => {
-                                            setEditor(v);
-                                            save({
-                                                environment: { defaultEditor: v, shellPreference: shell },
-                                            });
-                                        }, children: [_jsx(SelectTrigger, { id: "default-editor", "data-testid": "editor-select", className: "w-55 cursor-pointer text-xs", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: EDITOR_OPTIONS.map((opt) => {
-                                                    const Icon = getEditorTypeIcon(opt.value);
-                                                    return (_jsx(SelectItem, { value: opt.value, children: _jsxs("span", { className: "flex items-center gap-2 text-xs", children: [_jsx(Icon, { className: "h-4 w-4 shrink-0" }), opt.label] }) }, opt.value));
-                                                }) })] }) }) }), _jsx(SectionHint, { links: [
-                                    {
-                                        label: 'Configuration guide',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/docs/guides/configuration.md',
-                                    },
-                                ], children: "Your preferred editor is used when opening files for review or editing during the development workflow." })] }), _jsxs("div", { id: "section-workflow", className: "grid scroll-mt-6 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsxs(SettingsSection, { icon: GitBranch, title: "Workflow", description: "Automation behavior after implementation", testId: "workflow-settings-section", children: [_jsx(SwitchRow, { label: "Auto-approve PRD", description: "Skip manual review of requirements", id: "allow-prd", testId: "switch-allow-prd", checked: allowPrd, onChange: (v) => {
-                                            setAllowPrd(v);
-                                            save(buildWorkflowPayload({ allowPrd: v }));
-                                        } }), _jsx(SwitchRow, { label: "Auto-approve Plan", description: "Skip manual review of implementation plan", id: "allow-plan", testId: "switch-allow-plan", checked: allowPlan, onChange: (v) => {
-                                            setAllowPlan(v);
-                                            save(buildWorkflowPayload({ allowPlan: v }));
-                                        } }), _jsx(SwitchRow, { label: "Auto-approve Merge", description: "Merge without manual review", id: "allow-merge", testId: "switch-allow-merge", checked: allowMerge, onChange: (v) => {
-                                            setAllowMerge(v);
-                                            save(buildWorkflowPayload({ allowMerge: v }));
-                                        } }), _jsx(SwitchRow, { label: "Push on complete", description: "Push to remote when implementation finishes", id: "push-on-complete", testId: "switch-push-on-complete", checked: pushOnComplete, onChange: (v) => {
-                                            setPushOnComplete(v);
-                                            save(buildWorkflowPayload({ pushOnComplete: v }));
-                                        } }), _jsx(SwitchRow, { label: "Open PR on complete", description: "Create a pull request when done", id: "open-pr", testId: "switch-open-pr", checked: openPr, onChange: (v) => {
-                                            setOpenPr(v);
-                                            save(buildWorkflowPayload({ openPr: v }));
-                                        } })] }), _jsx(SectionHint, { links: [
-                                    {
-                                        label: 'Approval gates',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/specs/016-hitl-approval-gates/spec.yaml',
-                                    },
-                                    {
-                                        label: 'Push & PR flags',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/specs/037-feature-pr-push-flags/spec.yaml',
-                                    },
-                                ], children: "Control how autonomous each feature run is. Auto-approve skips the human review pause at each phase. Push and PR options control what happens after successful implementation." })] }), _jsxs("div", { id: "section-ci", className: "grid scroll-mt-6 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsxs(SettingsSection, { icon: Activity, title: "Continuous Integration", description: "Limits and timeouts for CI monitoring", testId: "ci-settings-section", children: [_jsx(SettingsRow, { label: "Max fix attempts", description: "Agent retries on failing CI", htmlFor: "ci-max-fix", children: _jsx(NumberStepper, { id: "ci-max-fix", testId: "ci-max-fix-input", placeholder: "3", value: ciMaxFix, onChange: setCiMaxFix, onBlur: () => {
-                                                if (ciMaxFix !== originalCiMaxFix)
-                                                    save(buildWorkflowPayload({ ciMaxFix }));
-                                            }, min: 1, max: 10 }) }), _jsx(SettingsRow, { label: "Watch timeout", description: "Max wait for CI completion", htmlFor: "ci-timeout", children: _jsx(NumberStepper, { id: "ci-timeout", testId: "ci-timeout-input", placeholder: "300", value: ciTimeout, onChange: setCiTimeout, onBlur: () => {
-                                                if (ciTimeout !== originalCiTimeout)
-                                                    save(buildWorkflowPayload({ ciTimeout }));
-                                            }, min: 30, step: 30, suffix: "sec" }) }), _jsx(SettingsRow, { label: "Max log size", description: "Truncate CI logs beyond this limit", htmlFor: "ci-log-max", children: _jsx(NumberStepper, { id: "ci-log-max", testId: "ci-log-max-input", placeholder: "50000", value: ciLogMax, onChange: setCiLogMax, onBlur: () => {
-                                                if (ciLogMax !== originalCiLogMax)
-                                                    save(buildWorkflowPayload({ ciLogMax }));
-                                            }, min: 1000, step: 5000, suffix: "chars" }) })] }), _jsx(SectionHint, { links: [
-                                    {
-                                        label: 'CI/CD pipeline',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/docs/development/cicd.md',
-                                    },
-                                    {
-                                        label: 'CI security gates',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/specs/003-cicd-security-gates/spec.md',
-                                    },
-                                ], children: "When a feature completes, the agent can watch CI and auto-fix failures. These limits prevent runaway retries and control how much log output is sent to the agent for analysis." })] }), _jsxs("div", { id: "section-notifications", className: "grid scroll-mt-6 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);
-                                            save(buildNotificationPayload({ events: newEvents }));
-                                        } }), _jsx(SwitchRow, { label: "Phase completed", id: "notif-event-phaseCompleted", testId: "switch-event-phaseCompleted", checked: events.phaseCompleted, onChange: (v) => {
-                                            const newEvents = { ...events, phaseCompleted: v };
-                                            setEvents(newEvents);
-                                            save(buildNotificationPayload({ events: newEvents }));
-                                        } }), _jsx(SwitchRow, { label: "Waiting approval", id: "notif-event-waitingApproval", testId: "switch-event-waitingApproval", checked: events.waitingApproval, onChange: (v) => {
-                                            const newEvents = { ...events, waitingApproval: v };
-                                            setEvents(newEvents);
-                                            save(buildNotificationPayload({ events: newEvents }));
-                                        } }), _jsx(SwitchRow, { label: "Agent completed", id: "notif-event-agentCompleted", testId: "switch-event-agentCompleted", checked: events.agentCompleted, onChange: (v) => {
-                                            const newEvents = { ...events, agentCompleted: v };
-                                            setEvents(newEvents);
-                                            save(buildNotificationPayload({ events: newEvents }));
-                                        } }), _jsx(SwitchRow, { label: "Agent failed", id: "notif-event-agentFailed", testId: "switch-event-agentFailed", checked: events.agentFailed, onChange: (v) => {
-                                            const newEvents = { ...events, agentFailed: v };
-                                            setEvents(newEvents);
-                                            save(buildNotificationPayload({ events: newEvents }));
-                                        } }), _jsx(SubsectionLabel, { children: "Pull Request Events" }), _jsx(SwitchRow, { label: "PR merged", id: "notif-event-prMerged", testId: "switch-event-prMerged", checked: events.prMerged, onChange: (v) => {
-                                            const newEvents = { ...events, prMerged: v };
-                                            setEvents(newEvents);
-                                            save(buildNotificationPayload({ events: newEvents }));
-                                        } }), _jsx(SwitchRow, { label: "PR closed", id: "notif-event-prClosed", testId: "switch-event-prClosed", checked: events.prClosed, onChange: (v) => {
-                                            const newEvents = { ...events, prClosed: v };
-                                            setEvents(newEvents);
-                                            save(buildNotificationPayload({ events: newEvents }));
-                                        } }), _jsx(SwitchRow, { label: "PR checks passed", id: "notif-event-prChecksPassed", testId: "switch-event-prChecksPassed", checked: events.prChecksPassed, onChange: (v) => {
-                                            const newEvents = { ...events, prChecksPassed: v };
-                                            setEvents(newEvents);
-                                            save(buildNotificationPayload({ events: newEvents }));
-                                        } }), _jsx(SwitchRow, { label: "PR checks failed", id: "notif-event-prChecksFailed", testId: "switch-event-prChecksFailed", checked: events.prChecksFailed, onChange: (v) => {
-                                            const newEvents = { ...events, prChecksFailed: 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-6 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 });
-                                        } }), _jsx(SwitchRow, { label: "Deployments", description: "Enable environment deployment workflows", id: "flag-envDeploy", testId: "switch-flag-envDeploy", checked: flags.envDeploy, onChange: (v) => {
-                                            const newFlags = { ...flags, envDeploy: v };
-                                            setFlags(newFlags);
-                                            save({ featureFlags: newFlags });
-                                        } }), _jsx(SwitchRow, { label: "Debug", description: "Show debug panels and verbose logging", id: "flag-debug", testId: "switch-flag-debug", checked: flags.debug, onChange: (v) => {
-                                            const newFlags = { ...flags, debug: v };
-                                            setFlags(newFlags);
-                                            save({ featureFlags: newFlags });
-                                        } })] }), _jsx(SectionHint, { children: "Experimental features that are still under development. Enable at your own risk \u2014 they may change or be removed in future versions. Debug mode adds verbose logging useful for troubleshooting." })] }), _jsxs("div", { id: "section-database", className: "grid scroll-mt-6 grid-cols-1 gap-x-5 rounded-lg lg:grid-cols-[1fr_280px]", children: [_jsxs(SettingsSection, { icon: Database, title: "Database", description: "Local storage information", testId: "database-settings-section", children: [_jsx(SettingsRow, { label: "Location", description: "Path to the local SQLite database", children: _jsx("span", { className: "text-muted-foreground max-w-50 truncate font-mono text-xs", "data-testid": "shep-home-path", children: shepHome }) }), _jsx(SettingsRow, { label: "Size", children: _jsx("span", { className: "text-muted-foreground text-xs", "data-testid": "db-file-size", children: dbFileSize }) })] }), _jsx(SectionHint, { links: [
-                                    {
-                                        label: 'Settings service',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/docs/architecture/settings-service.md',
-                                    },
-                                    {
-                                        label: 'Settings spec',
-                                        href: 'https://github.com/shep-ai/cli/blob/main/specs/005-global-settings-service/spec.md',
-                                    },
-                                ], children: "All settings are stored in a local SQLite database at ~/.shep/data. The database uses a singleton record pattern with automatic migrations on startup." })] })] })] }));
+    return (_jsxs("div", { "data-testid": "settings-page-client", className: "max-w-lg", children: [_jsxs("div", { className: "flex items-center justify-between border-b pb-3", children: [_jsx("h1", { className: "text-sm font-bold tracking-tight", children: "Settings" }), 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] }), _jsxs("div", { children: [_jsx("h2", { className: "text-muted-foreground mt-6 mb-1 text-xs font-medium tracking-wide uppercase", "data-testid": "agent-settings-section", children: "Agent" }), _jsx(SettingsRow, { label: "Agent & Model", htmlFor: "agent-model-picker", children: _jsx(AgentModelPicker, { initialAgentType: agentType, initialModel: settings.models.default, mode: "settings", onAgentModelChange: (newAgent) => setAgentType(newAgent), className: "w-45" }) }), _jsx(SelectRow, { label: "Authentication", id: "auth-method", testId: "auth-method-select", value: authMethod, options: AUTH_METHOD_OPTIONS, onChange: (v) => {
+                            setAuthMethod(v);
+                            save(buildAgentPayload({ authMethod: v }));
+                        } }), 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("h2", { className: "text-muted-foreground mt-6 mb-1 text-xs font-medium tracking-wide uppercase", "data-testid": "environment-settings-section", children: "Environment" }), _jsx(SettingsRow, { label: "Editor", htmlFor: "default-editor", children: _jsxs(Select, { value: editor, onValueChange: (v) => {
+                                setEditor(v);
+                                save({ environment: { defaultEditor: v, shellPreference: shell } });
+                            }, children: [_jsx(SelectTrigger, { id: "default-editor", "data-testid": "editor-select", className: "w-45 cursor-pointer", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: EDITOR_OPTIONS.map((opt) => {
+                                        const Icon = getEditorTypeIcon(opt.value);
+                                        return (_jsx(SelectItem, { value: opt.value, children: _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(Icon, { className: "h-4 w-4 shrink-0" }), opt.label] }) }, opt.value));
+                                    }) })] }) }), _jsx("h2", { className: "text-muted-foreground mt-6 mb-1 text-xs font-medium tracking-wide uppercase", "data-testid": "workflow-settings-section", children: "Workflow" }), _jsx(SwitchRow, { label: "Open PR on complete", id: "open-pr", testId: "switch-open-pr", checked: openPr, onChange: (v) => {
+                            setOpenPr(v);
+                            save(buildWorkflowPayload({ openPr: v }));
+                        } }), _jsx(SwitchRow, { label: "Push on complete", id: "push-on-complete", testId: "switch-push-on-complete", checked: pushOnComplete, onChange: (v) => {
+                            setPushOnComplete(v);
+                            save(buildWorkflowPayload({ pushOnComplete: v }));
+                        } }), _jsx(SwitchRow, { label: "Auto-approve PRD", id: "allow-prd", testId: "switch-allow-prd", checked: allowPrd, onChange: (v) => {
+                            setAllowPrd(v);
+                            save(buildWorkflowPayload({ allowPrd: v }));
+                        } }), _jsx(SwitchRow, { label: "Auto-approve Plan", id: "allow-plan", testId: "switch-allow-plan", checked: allowPlan, onChange: (v) => {
+                            setAllowPlan(v);
+                            save(buildWorkflowPayload({ allowPlan: v }));
+                        } }), _jsx(SwitchRow, { label: "Auto-approve Merge", id: "allow-merge", testId: "switch-allow-merge", checked: allowMerge, onChange: (v) => {
+                            setAllowMerge(v);
+                            save(buildWorkflowPayload({ allowMerge: v }));
+                        } }), _jsx("h2", { className: "text-muted-foreground mt-6 mb-1 text-xs font-medium tracking-wide uppercase", "data-testid": "ci-settings-section", children: "CI" }), _jsx(SettingsRow, { label: "Max fix attempts", htmlFor: "ci-max-fix", children: _jsx(Input, { id: "ci-max-fix", "data-testid": "ci-max-fix-input", type: "text", inputMode: "numeric", pattern: "[0-9]*", placeholder: "3", value: ciMaxFix, onChange: (e) => setCiMaxFix(e.target.value), onBlur: () => {
+                                if (ciMaxFix !== originalCiMaxFix)
+                                    save(buildWorkflowPayload({ ciMaxFix }));
+                            }, className: "w-20" }) }), _jsx(SettingsRow, { label: "Watch timeout (s)", htmlFor: "ci-timeout", children: _jsx(Input, { id: "ci-timeout", "data-testid": "ci-timeout-input", type: "text", inputMode: "numeric", pattern: "[0-9]*", placeholder: "300", value: ciTimeout, onChange: (e) => setCiTimeout(e.target.value), onBlur: () => {
+                                if (ciTimeout !== originalCiTimeout)
+                                    save(buildWorkflowPayload({ ciTimeout }));
+                            }, className: "w-20" }) }), _jsx(SettingsRow, { label: "Max log chars", htmlFor: "ci-log-max", children: _jsx(Input, { id: "ci-log-max", "data-testid": "ci-log-max-input", type: "text", inputMode: "numeric", pattern: "[0-9]*", placeholder: "50000", value: ciLogMax, onChange: (e) => setCiLogMax(e.target.value), onBlur: () => {
+                                if (ciLogMax !== originalCiLogMax)
+                                    save(buildWorkflowPayload({ ciLogMax }));
+                            }, className: "w-20" }) }), _jsx("h2", { className: "text-muted-foreground mt-6 mb-1 text-xs font-medium tracking-wide uppercase", "data-testid": "notification-settings-section", children: "Notifications" }), _jsx(SwitchRow, { label: "In-app", id: "notif-in-app", testId: "switch-in-app", checked: inApp, onChange: (v) => {
+                            setInApp(v);
+                            save(buildNotificationPayload({ inApp: v }));
+                        } }), _jsx(SwitchRow, { label: "Browser", id: "notif-browser", testId: "switch-browser", checked: browser, onChange: (v) => {
+                            setBrowser(v);
+                            save(buildNotificationPayload({ browser: v }));
+                        } }), _jsx(SwitchRow, { label: "Desktop", id: "notif-desktop", testId: "switch-desktop", checked: desktop, onChange: (v) => {
+                            setDesktop(v);
+                            save(buildNotificationPayload({ desktop: v }));
+                        } }), _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);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx(SwitchRow, { label: "Phase completed", id: "notif-event-phaseCompleted", testId: "switch-event-phaseCompleted", checked: events.phaseCompleted, onChange: (v) => {
+                            const newEvents = { ...events, phaseCompleted: v };
+                            setEvents(newEvents);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx(SwitchRow, { label: "Waiting approval", id: "notif-event-waitingApproval", testId: "switch-event-waitingApproval", checked: events.waitingApproval, onChange: (v) => {
+                            const newEvents = { ...events, waitingApproval: v };
+                            setEvents(newEvents);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx(SwitchRow, { label: "Agent completed", id: "notif-event-agentCompleted", testId: "switch-event-agentCompleted", checked: events.agentCompleted, onChange: (v) => {
+                            const newEvents = { ...events, agentCompleted: v };
+                            setEvents(newEvents);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx(SwitchRow, { label: "Agent failed", id: "notif-event-agentFailed", testId: "switch-event-agentFailed", checked: events.agentFailed, onChange: (v) => {
+                            const newEvents = { ...events, agentFailed: v };
+                            setEvents(newEvents);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx(SwitchRow, { label: "PR merged", id: "notif-event-prMerged", testId: "switch-event-prMerged", checked: events.prMerged, onChange: (v) => {
+                            const newEvents = { ...events, prMerged: v };
+                            setEvents(newEvents);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx(SwitchRow, { label: "PR closed", id: "notif-event-prClosed", testId: "switch-event-prClosed", checked: events.prClosed, onChange: (v) => {
+                            const newEvents = { ...events, prClosed: v };
+                            setEvents(newEvents);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx(SwitchRow, { label: "PR checks passed", id: "notif-event-prChecksPassed", testId: "switch-event-prChecksPassed", checked: events.prChecksPassed, onChange: (v) => {
+                            const newEvents = { ...events, prChecksPassed: v };
+                            setEvents(newEvents);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx(SwitchRow, { label: "PR checks failed", id: "notif-event-prChecksFailed", testId: "switch-event-prChecksFailed", checked: events.prChecksFailed, onChange: (v) => {
+                            const newEvents = { ...events, prChecksFailed: v };
+                            setEvents(newEvents);
+                            save(buildNotificationPayload({ events: newEvents }));
+                        } }), _jsx("h2", { className: "text-muted-foreground mt-6 mb-1 text-xs font-medium tracking-wide uppercase", "data-testid": "feature-flags-settings-section", children: "Feature Flags" }), _jsx(SwitchRow, { label: "Skills", id: "flag-skills", testId: "switch-flag-skills", checked: flags.skills, onChange: (v) => {
+                            const newFlags = { ...flags, skills: v };
+                            setFlags(newFlags);
+                            save({ featureFlags: newFlags });
+                        } }), _jsx(SwitchRow, { label: "Deployments", id: "flag-envDeploy", testId: "switch-flag-envDeploy", checked: flags.envDeploy, onChange: (v) => {
+                            const newFlags = { ...flags, envDeploy: v };
+                            setFlags(newFlags);
+                            save({ featureFlags: newFlags });
+                        } }), _jsx(SwitchRow, { label: "Debug", id: "flag-debug", testId: "switch-flag-debug", checked: flags.debug, onChange: (v) => {
+                            const newFlags = { ...flags, debug: v };
+                            setFlags(newFlags);
+                            save({ featureFlags: newFlags });
+                        } }), _jsx("h2", { className: "text-muted-foreground mt-6 mb-1 text-xs font-medium tracking-wide uppercase", "data-testid": "database-settings-section", children: "Database" }), _jsx(SettingsRow, { label: "Location", children: _jsx("span", { className: "text-muted-foreground max-w-50 truncate font-mono text-xs", "data-testid": "shep-home-path", children: shepHome }) }), _jsx(SettingsRow, { label: "Size", children: _jsx("span", { className: "text-muted-foreground text-xs", "data-testid": "db-file-size", children: dbFileSize }) })] })] }));
 }