@shepai/cli 1.86.1 → 1.87.0

package/dist/src/presentation/web/app/actions/get-feature-plan.d.ts

@@ -1,7 +1,17 @@
+export interface AcceptanceCriterionData {
+    description: string;
+    verified: boolean;
+}
+export interface ActionItemData {
+    name: string;
+    description: string;
+    acceptanceCriteria: AcceptanceCriterionData[];
+}
 export interface PlanTaskData {
     title: string;
     description: string;
     state: string;
+    actionItems: ActionItemData[];
 }
 export interface PlanData {
     state: string;

package/dist/src/presentation/web/app/actions/get-feature-plan.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"get-feature-plan.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/app/actions/get-feature-plan.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB;AAED,KAAK,aAAa,GAAG;IAAE,IAAI,EAAE,QAAQ,GAAG,SAAS,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAExE,wBAAsB,cAAc,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,aAAa,CAAC,CAgC9E"}
+{"version":3,"file":"get-feature-plan.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/app/actions/get-feature-plan.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,uBAAuB;IACtC,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,EAAE,uBAAuB,EAAE,CAAC;CAC/C;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,cAAc,EAAE,CAAC;CAC/B;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB;AAED,KAAK,aAAa,GAAG;IAAE,IAAI,EAAE,QAAQ,GAAG,SAAS,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAExE,wBAAsB,cAAc,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,aAAa,CAAC,CAwC9E"}

package/dist/src/presentation/web/app/actions/get-feature-plan.js

@@ -20,6 +20,14 @@ export async function getFeaturePlan(featureId) {
                 title: t.title ?? '',
                 description: t.description ?? '',
                 state: t.state,
+                actionItems: (t.actionItems ?? []).map((ai) => ({
+                    name: ai.name,
+                    description: ai.description,
+                    acceptanceCriteria: (ai.acceptanceCriteria ?? []).map((ac) => ({
+                        description: ac.description,
+                        verified: ac.verified,
+                    })),
+                })),
             })),
         };
         return { plan };

package/dist/src/presentation/web/components/common/feature-drawer-tabs/plan-tab.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plan-tab.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/plan-tab.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,QAAQ,EAAgB,MAAM,gCAAgC,CAAC;AAE7E,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,QAAQ,GAAG,IAAI,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAoBD,wBAAgB,OAAO,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,YAAY,2CAgD7D"}
+{"version":3,"file":"plan-tab.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/plan-tab.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE/D,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,QAAQ,GAAG,IAAI,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAQD,wBAAgB,OAAO,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,YAAY,2CAgD7D"}

package/dist/src/presentation/web/components/common/feature-drawer-tabs/plan-tab.js

@@ -1,20 +1,14 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Loader2, Circle, Check, Eye } from 'lucide-react';
+import { Loader2 } from 'lucide-react';
 import { AlertCircle, ListTodo } from 'lucide-react';
 import { Badge } from '../../ui/badge.js';
+import { TaskProgressView } from '../../common/task-progress-view/index.js';
 const planStateBadgeStyles = {
     Requirements: 'border-transparent bg-blue-50 text-blue-700 hover:bg-blue-50',
     ClarificationRequired: 'border-transparent bg-amber-50 text-amber-700 hover:bg-amber-50',
     Ready: 'border-transparent bg-green-50 text-green-700 hover:bg-green-50',
 };
-const taskStateConfig = {
-    Todo: { icon: Circle, colorClass: 'text-muted-foreground' },
-    'Work in Progress': { icon: Loader2, colorClass: 'text-blue-600', spinning: true },
-    Done: { icon: Check, colorClass: 'text-emerald-600' },
-    Review: { icon: Eye, colorClass: 'text-amber-600' },
-};
-const defaultTaskConfig = { icon: Circle, colorClass: 'text-muted-foreground' };
 export function PlanTab({ plan, loading, error }) {
     if (loading) {
         return (_jsx("div", { "data-testid": "plan-tab-loading", className: "flex items-center justify-center p-8", children: _jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" }) }));
@@ -25,16 +19,5 @@ export function PlanTab({ plan, loading, error }) {
     if (!plan) {
         return (_jsxs("div", { className: "flex flex-col items-center justify-center gap-2 p-8", children: [_jsx(ListTodo, { className: "text-muted-foreground h-8 w-8" }), _jsx("p", { className: "text-muted-foreground text-sm", children: "No plan created yet" })] }));
     }
-    return (_jsxs("div", { className: "flex flex-col gap-4 p-4", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium", children: "Plan State" }), _jsx(Badge, { className: planStateBadgeStyles[plan.state] ?? 'border-transparent bg-gray-50 text-gray-700', children: plan.state })] }), plan.overview ? (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium", children: "Overview" }), _jsx("p", { className: "text-sm leading-relaxed", children: plan.overview })] })) : null, _jsx(TaskList, { tasks: plan.tasks })] }));
-}
-function TaskList({ tasks }) {
-    if (tasks.length === 0) {
-        return (_jsx("div", { className: "flex flex-col items-center justify-center gap-2 py-4", children: _jsx("p", { className: "text-muted-foreground text-sm", children: "No tasks defined yet" }) }));
-    }
-    return (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium", children: "Tasks" }), _jsx("div", { "data-testid": "plan-task-list", className: "flex flex-col gap-2", children: tasks.map((task, index) => (_jsx(TaskItem, { task: task, index: index }, task.title || `task-${index}`))) })] }));
-}
-function TaskItem({ task, index }) {
-    const config = taskStateConfig[task.state] ?? defaultTaskConfig;
-    const Icon = config.icon;
-    return (_jsxs("div", { "data-testid": `plan-task-${index}`, className: `flex items-start gap-2 rounded-md border px-3 py-2 ${config.colorClass}`, children: [_jsx(Icon, { className: `mt-0.5 h-4 w-4 shrink-0 ${config.spinning ? 'animate-spin' : ''}` }), _jsxs("div", { className: "flex min-w-0 flex-col gap-0.5", children: [_jsx("span", { className: "text-sm font-medium", children: task.title }), task.description ? (_jsx("span", { className: "text-muted-foreground text-xs", children: task.description })) : null] })] }));
+    return (_jsxs("div", { className: "flex flex-col gap-4 p-4", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium", children: "Plan State" }), _jsx(Badge, { className: planStateBadgeStyles[plan.state] ?? 'border-transparent bg-gray-50 text-gray-700', children: plan.state })] }), plan.overview ? (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium", children: "Overview" }), _jsx("p", { className: "text-sm leading-relaxed", children: plan.overview })] })) : null, _jsx(TaskProgressView, { tasks: plan.tasks })] }));
 }

package/dist/src/presentation/web/components/common/feature-drawer-tabs/plan-tab.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plan-tab.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/plan-tab.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAGrC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAc9B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,CAAC;AA0HtC,6EAA6E;AAC7E,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,2BAA2B;AAC3B,eAAO,MAAM,YAAY,EAAE,KAM1B,CAAC;AAEF,wCAAwC;AACxC,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAEF,wEAAwE;AACxE,eAAO,MAAM,qBAAqB,EAAE,KAMnC,CAAC;AAEF,mDAAmD;AACnD,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,qEAAqE;AACrE,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,yCAAyC;AACzC,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,0CAA0C;AAC1C,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC"}
+{"version":3,"file":"plan-tab.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/plan-tab.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAGrC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAc9B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,CAAC;AAoMtC,6EAA6E;AAC7E,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,2BAA2B;AAC3B,eAAO,MAAM,YAAY,EAAE,KAM1B,CAAC;AAEF,wCAAwC;AACxC,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAEF,wEAAwE;AACxE,eAAO,MAAM,qBAAqB,EAAE,KAMnC,CAAC;AAEF,mDAAmD;AACnD,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,qEAAqE;AACrE,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,yCAAyC;AACzC,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,0CAA0C;AAC1C,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC"}

package/dist/src/presentation/web/components/common/feature-drawer-tabs/plan-tab.stories.js

@@ -23,31 +23,96 @@ const mixedTasksPlan = {
             title: 'Set up OAuth provider configuration',
             description: 'Configure Google and GitHub OAuth apps with client IDs and secrets',
             state: 'Done',
+            actionItems: [
+                {
+                    name: 'Create OAuth config module',
+                    description: 'Define provider configuration schema and load from env',
+                    acceptanceCriteria: [
+                        { description: 'Config loads from environment variables', verified: true },
+                        { description: 'Validation rejects missing client ID or secret', verified: true },
+                    ],
+                },
+                {
+                    name: 'Register OAuth apps',
+                    description: 'Register apps with Google and GitHub developer consoles',
+                    acceptanceCriteria: [
+                        { description: 'Google OAuth app created with correct scopes', verified: true },
+                        { description: 'GitHub OAuth app created with correct callback URL', verified: true },
+                    ],
+                },
+            ],
         },
         {
             title: 'Implement callback handler',
             description: 'Handle OAuth callback with authorization code exchange',
             state: 'Done',
+            actionItems: [
+                {
+                    name: 'Build callback endpoint',
+                    description: 'GET /auth/callback with code exchange logic',
+                    acceptanceCriteria: [
+                        { description: 'Exchanges authorization code for tokens', verified: true },
+                    ],
+                },
+            ],
         },
         {
             title: 'Add token refresh logic',
             description: 'Implement silent token refresh using refresh tokens stored in httpOnly cookies',
             state: 'Work in Progress',
+            actionItems: [
+                {
+                    name: 'Implement refresh endpoint',
+                    description: 'POST /auth/refresh to issue new access token',
+                    acceptanceCriteria: [
+                        { description: 'Returns new access token when refresh token is valid', verified: true },
+                        { description: 'Returns 401 when refresh token is expired', verified: false },
+                    ],
+                },
+                {
+                    name: 'Add httpOnly cookie handling',
+                    description: 'Store refresh tokens in secure httpOnly cookies',
+                    acceptanceCriteria: [
+                        { description: 'Cookies are set with Secure and HttpOnly flags', verified: false },
+                    ],
+                },
+            ],
         },
         {
             title: 'Create user profile sync',
             description: 'Sync user profile data from identity providers on login',
             state: 'Todo',
+            actionItems: [
+                {
+                    name: 'Fetch profile from provider',
+                    description: 'Use access token to retrieve user profile from Google/GitHub',
+                    acceptanceCriteria: [
+                        { description: 'Retrieves name, email, and avatar from Google', verified: false },
+                        { description: 'Retrieves name, email, and avatar from GitHub', verified: false },
+                    ],
+                },
+            ],
         },
         {
             title: 'Write integration tests',
             description: 'Test the full OAuth flow with mocked providers',
             state: 'Todo',
+            actionItems: [],
         },
         {
             title: 'Update API documentation',
             description: 'Document new authentication endpoints and flows',
             state: 'Review',
+            actionItems: [
+                {
+                    name: 'Document auth endpoints',
+                    description: 'Add OpenAPI specs for all auth routes',
+                    acceptanceCriteria: [
+                        { description: 'All endpoints have OpenAPI documentation', verified: true },
+                        { description: 'Examples included for each endpoint', verified: true },
+                    ],
+                },
+            ],
         },
     ],
 };
@@ -59,21 +124,25 @@ const allDonePlan = {
             title: 'Design sliding window algorithm',
             description: 'Implement Redis-backed sliding window counter',
             state: 'Done',
+            actionItems: [],
         },
         {
             title: 'Add rate limit middleware',
             description: 'Express middleware that checks rate limits per IP',
             state: 'Done',
+            actionItems: [],
         },
         {
             title: 'Configure limits per endpoint',
             description: 'Set different rate limits for public vs authenticated endpoints',
             state: 'Done',
+            actionItems: [],
         },
         {
             title: 'Add rate limit headers',
             description: 'Include X-RateLimit-* headers in responses',
             state: 'Done',
+            actionItems: [],
         },
     ],
 };
@@ -85,16 +154,19 @@ const draftPlan = {
             title: 'Define notification types',
             description: 'Enumerate all notification events and their payloads',
             state: 'Todo',
+            actionItems: [],
         },
         {
             title: 'Set up WebSocket server',
             description: 'Configure Socket.io with Redis adapter for horizontal scaling',
             state: 'Todo',
+            actionItems: [],
         },
         {
             title: 'Implement notification store',
             description: 'Persist notifications in database with read/unread tracking',
             state: 'Todo',
+            actionItems: [],
         },
     ],
 };
@@ -106,11 +178,13 @@ const clarificationPlan = {
             title: 'Set up email provider',
             description: 'Configure SendGrid API integration',
             state: 'Done',
+            actionItems: [],
         },
         {
             title: 'Create template engine',
             description: 'Implement Handlebars-based email template rendering',
             state: 'Todo',
+            actionItems: [],
         },
     ],
 };

package/dist/src/presentation/web/components/common/task-progress-view/index.d.ts

@@ -0,0 +1,3 @@
+export { TaskProgressView } from './task-progress-view.js';
+export type { TaskProgressViewProps } from './task-progress-view.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/presentation/web/components/common/task-progress-view/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/task-progress-view/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,YAAY,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/src/presentation/web/components/common/task-progress-view/index.js

@@ -0,0 +1 @@
+export { TaskProgressView } from './task-progress-view.js';

package/dist/src/presentation/web/components/common/task-progress-view/task-progress-view.d.ts

@@ -0,0 +1,6 @@
+import type { PlanTaskData } from '../../../app/actions/get-feature-plan.js';
+export interface TaskProgressViewProps {
+    tasks: PlanTaskData[];
+}
+export declare function TaskProgressView({ tasks }: TaskProgressViewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=task-progress-view.d.ts.map

package/dist/src/presentation/web/components/common/task-progress-view/task-progress-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"task-progress-view.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/task-progress-view/task-progress-view.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,YAAY,EAAkB,MAAM,gCAAgC,CAAC;AAEnF,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB;AA8CD,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,EAAE,qBAAqB,2CAmBhE"}

package/dist/src/presentation/web/components/common/task-progress-view/task-progress-view.js

@@ -0,0 +1,84 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useMemo } from 'react';
+import { Loader2, Circle, Check, Eye, ChevronRight, CheckCircle2, CircleDashed, } from 'lucide-react';
+import { cn } from '../../../lib/utils.js';
+const taskStateConfig = {
+    Todo: {
+        icon: Circle,
+        colorClass: 'text-muted-foreground',
+        borderClass: 'border-border',
+        label: 'Todo',
+    },
+    'Work in Progress': {
+        icon: Loader2,
+        colorClass: 'text-blue-600',
+        borderClass: 'border-blue-200',
+        spinning: true,
+        label: 'In Progress',
+    },
+    Done: {
+        icon: Check,
+        colorClass: 'text-emerald-600',
+        borderClass: 'border-emerald-200',
+        label: 'Done',
+    },
+    Review: {
+        icon: Eye,
+        colorClass: 'text-amber-600',
+        borderClass: 'border-amber-200',
+        label: 'Review',
+    },
+};
+const defaultTaskConfig = {
+    icon: Circle,
+    colorClass: 'text-muted-foreground',
+    borderClass: 'border-border',
+    label: 'Unknown',
+};
+export function TaskProgressView({ tasks }) {
+    if (tasks.length === 0) {
+        return (_jsx("div", { className: "flex flex-col items-center justify-center gap-2 py-4", children: _jsx("p", { className: "text-muted-foreground text-sm", children: "No tasks defined yet" }) }));
+    }
+    return (_jsxs("div", { "data-testid": "task-progress-view", className: "flex flex-col gap-3", children: [_jsx(ProgressSummary, { tasks: tasks }), _jsx("div", { "data-testid": "task-progress-list", className: "flex flex-col gap-2", children: tasks.map((task, index) => (_jsx(TaskCard, { task: task, index: index }, task.title || `task-${index}`))) })] }));
+}
+// ── Progress Summary ─────────────────────────────────────────────────
+function ProgressSummary({ tasks }) {
+    const counts = useMemo(() => {
+        const done = tasks.filter((t) => t.state === 'Done').length;
+        const wip = tasks.filter((t) => t.state === 'Work in Progress').length;
+        const review = tasks.filter((t) => t.state === 'Review').length;
+        const todo = tasks.filter((t) => t.state !== 'Done' && t.state !== 'Work in Progress' && t.state !== 'Review').length;
+        const total = tasks.length;
+        const percent = total > 0 ? Math.round((done / total) * 100) : 0;
+        return { done, wip, review, todo, total, percent };
+    }, [tasks]);
+    return (_jsxs("div", { "data-testid": "task-progress-summary", className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium", children: "Task Progress" }), _jsxs("span", { className: "text-muted-foreground text-xs", children: [counts.done, " of ", counts.total, " done"] })] }), _jsx("div", { className: "bg-muted h-2 w-full overflow-hidden rounded-full", children: _jsx("div", { "data-testid": "task-progress-bar", className: "h-full rounded-full bg-emerald-500 transition-all", style: { width: `${counts.percent}%` } }) }), _jsxs("div", { className: "flex flex-wrap gap-3", children: [counts.done > 0 ? (_jsx(StatChip, { icon: Check, label: "Done", count: counts.done, className: "text-emerald-600" })) : null, counts.wip > 0 ? (_jsx(StatChip, { icon: Loader2, label: "In Progress", count: counts.wip, className: "text-blue-600" })) : null, counts.review > 0 ? (_jsx(StatChip, { icon: Eye, label: "Review", count: counts.review, className: "text-amber-600" })) : null, counts.todo > 0 ? (_jsx(StatChip, { icon: Circle, label: "Todo", count: counts.todo, className: "text-muted-foreground" })) : null] })] }));
+}
+function StatChip({ icon: Icon, label, count, className, }) {
+    return (_jsxs("span", { className: cn('flex items-center gap-1 text-xs', className), children: [_jsx(Icon, { className: "h-3 w-3" }), count, " ", label] }));
+}
+// ── Task Card ────────────────────────────────────────────────────────
+function TaskCard({ task, index }) {
+    const [expanded, setExpanded] = useState(false);
+    const config = taskStateConfig[task.state] ?? defaultTaskConfig;
+    const Icon = config.icon;
+    const hasDetails = task.actionItems.length > 0;
+    const handleToggle = useCallback(() => {
+        if (hasDetails) {
+            setExpanded((prev) => !prev);
+        }
+    }, [hasDetails]);
+    return (_jsxs("div", { "data-testid": `task-card-${index}`, className: cn('rounded-lg border', config.borderClass), children: [_jsxs("button", { type: "button", onClick: handleToggle, disabled: !hasDetails, className: cn('flex w-full items-start gap-2 px-3 py-2.5 text-left', hasDetails && 'hover:bg-muted/50 cursor-pointer transition-colors'), children: [_jsx(Icon, { className: cn('mt-0.5 h-4 w-4 shrink-0', config.colorClass, config.spinning && 'animate-spin') }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [_jsx("span", { className: cn('text-sm font-medium', config.colorClass), children: task.title }), task.description ? (_jsx("span", { className: "text-muted-foreground text-xs", children: task.description })) : null] }), hasDetails ? (_jsx(ChevronRight, { className: cn('text-muted-foreground mt-0.5 h-4 w-4 shrink-0 transition-transform', expanded && 'rotate-90') })) : null] }), expanded && hasDetails ? (_jsx("div", { className: "border-t px-3 py-2.5", children: _jsx("div", { className: "flex flex-col gap-2", children: task.actionItems.map((item, aiIndex) => (_jsx(ActionItemRow, { item: item }, item.name || `ai-${aiIndex}`))) }) })) : null] }));
+}
+// ── Action Item Row ──────────────────────────────────────────────────
+function ActionItemRow({ item }) {
+    const totalCriteria = item.acceptanceCriteria.length;
+    const verifiedCriteria = item.acceptanceCriteria.filter((ac) => ac.verified).length;
+    const allVerified = totalCriteria > 0 && verifiedCriteria === totalCriteria;
+    return (_jsxs("div", { "data-testid": "action-item", className: "flex flex-col gap-1.5", children: [_jsxs("div", { className: "flex items-start gap-2", children: [allVerified ? (_jsx(CheckCircle2, { className: "mt-0.5 h-3.5 w-3.5 shrink-0 text-emerald-600" })) : (_jsx(CircleDashed, { className: "text-muted-foreground mt-0.5 h-3.5 w-3.5 shrink-0" })), _jsxs("div", { className: "flex min-w-0 flex-col gap-0.5", children: [_jsx("span", { className: "text-xs font-medium", children: item.name }), item.description ? (_jsx("span", { className: "text-muted-foreground text-[11px]", children: item.description })) : null] }), totalCriteria > 0 ? (_jsxs("span", { className: "text-muted-foreground ml-auto shrink-0 text-[11px]", children: [verifiedCriteria, "/", totalCriteria] })) : null] }), totalCriteria > 0 ? (_jsx("div", { className: "ml-5.5 flex flex-col gap-1", children: item.acceptanceCriteria.map((ac, acIndex) => (_jsx(AcceptanceCriterionRow, { criterion: ac }, ac.description || `ac-${acIndex}`))) })) : null] }));
+}
+// ── Acceptance Criterion Row ─────────────────────────────────────────
+function AcceptanceCriterionRow({ criterion, }) {
+    return (_jsxs("div", { "data-testid": "acceptance-criterion", className: "flex items-start gap-1.5", children: [criterion.verified ? (_jsx(Check, { className: "mt-0.5 h-3 w-3 shrink-0 text-emerald-600" })) : (_jsx(Circle, { className: "text-muted-foreground mt-0.5 h-3 w-3 shrink-0" })), _jsx("span", { className: cn('text-[11px]', criterion.verified ? 'text-muted-foreground line-through' : 'text-foreground'), children: criterion.description })] }));
+}

package/dist/src/presentation/web/components/common/task-progress-view/task-progress-view.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { TaskProgressView } from './task-progress-view.js';
+declare const meta: Meta<typeof TaskProgressView>;
+export default meta;
+type Story = StoryObj<typeof TaskProgressView>;
+/** Default — tasks in mixed states with action items and acceptance criteria. */
+export declare const Default: Story;
+/** All tasks completed. */
+export declare const AllDone: Story;
+/** All tasks in Todo state. */
+export declare const AllTodo: Story;
+/** Empty — no tasks defined. */
+export declare const Empty: Story;
+/** Single task with detailed action items. */
+export declare const SingleTaskDetailed: Story;
+//# sourceMappingURL=task-progress-view.stories.d.ts.map

package/dist/src/presentation/web/components/common/task-progress-view/task-progress-view.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"task-progress-view.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/task-progress-view/task-progress-view.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAGxD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAgB,CAYvC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,gBAAgB,CAAC,CAAC;AA+J/C,iFAAiF;AACjF,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,2BAA2B;AAC3B,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,+BAA+B;AAC/B,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,gCAAgC;AAChC,eAAO,MAAM,KAAK,EAAE,KAInB,CAAC;AAEF,8CAA8C;AAC9C,eAAO,MAAM,kBAAkB,EAAE,KAIhC,CAAC"}

package/dist/src/presentation/web/components/common/task-progress-view/task-progress-view.stories.js

@@ -0,0 +1,194 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TaskProgressView } from './task-progress-view.js';
+const meta = {
+    title: 'Composed/TaskProgressView',
+    component: TaskProgressView,
+    tags: ['autodocs'],
+    parameters: { layout: 'padded' },
+    decorators: [
+        (Story) => (_jsx("div", { style: { width: '400px', border: '1px solid var(--color-border)', padding: '16px' }, children: _jsx(Story, {}) })),
+    ],
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const mixedTasks = [
+    {
+        title: 'Set up OAuth provider configuration',
+        description: 'Configure Google and GitHub OAuth apps with client IDs and secrets',
+        state: 'Done',
+        actionItems: [
+            {
+                name: 'Create OAuth config module',
+                description: 'Define provider configuration schema and load from env',
+                acceptanceCriteria: [
+                    { description: 'Config loads from environment variables', verified: true },
+                    { description: 'Validation rejects missing client ID or secret', verified: true },
+                ],
+            },
+            {
+                name: 'Register OAuth apps',
+                description: 'Register apps with Google and GitHub developer consoles',
+                acceptanceCriteria: [
+                    { description: 'Google OAuth app created with correct scopes', verified: true },
+                    { description: 'GitHub OAuth app created with correct callback URL', verified: true },
+                ],
+            },
+        ],
+    },
+    {
+        title: 'Implement callback handler',
+        description: 'Handle OAuth callback with authorization code exchange',
+        state: 'Done',
+        actionItems: [
+            {
+                name: 'Build callback endpoint',
+                description: 'GET /auth/callback with code exchange logic',
+                acceptanceCriteria: [
+                    { description: 'Exchanges authorization code for tokens', verified: true },
+                ],
+            },
+        ],
+    },
+    {
+        title: 'Add token refresh logic',
+        description: 'Implement silent token refresh using refresh tokens stored in httpOnly cookies',
+        state: 'Work in Progress',
+        actionItems: [
+            {
+                name: 'Implement refresh endpoint',
+                description: 'POST /auth/refresh to issue new access token',
+                acceptanceCriteria: [
+                    { description: 'Returns new access token when refresh token is valid', verified: true },
+                    { description: 'Returns 401 when refresh token is expired', verified: false },
+                ],
+            },
+            {
+                name: 'Add httpOnly cookie handling',
+                description: 'Store refresh tokens in secure httpOnly cookies',
+                acceptanceCriteria: [
+                    { description: 'Cookies are set with Secure and HttpOnly flags', verified: false },
+                ],
+            },
+        ],
+    },
+    {
+        title: 'Create user profile sync',
+        description: 'Sync user profile data from identity providers on login',
+        state: 'Todo',
+        actionItems: [
+            {
+                name: 'Fetch profile from provider',
+                description: 'Use access token to retrieve user profile from Google/GitHub',
+                acceptanceCriteria: [
+                    { description: 'Retrieves name, email, and avatar from Google', verified: false },
+                    { description: 'Retrieves name, email, and avatar from GitHub', verified: false },
+                ],
+            },
+        ],
+    },
+    {
+        title: 'Write integration tests',
+        description: 'Test the full OAuth flow with mocked providers',
+        state: 'Todo',
+        actionItems: [],
+    },
+    {
+        title: 'Update API documentation',
+        description: 'Document new authentication endpoints and flows',
+        state: 'Review',
+        actionItems: [
+            {
+                name: 'Document auth endpoints',
+                description: 'Add OpenAPI specs for all auth routes',
+                acceptanceCriteria: [
+                    { description: 'All endpoints have OpenAPI documentation', verified: true },
+                    { description: 'Examples included for each endpoint', verified: true },
+                ],
+            },
+        ],
+    },
+];
+const allDoneTasks = [
+    {
+        title: 'Design sliding window algorithm',
+        description: 'Implement Redis-backed sliding window counter',
+        state: 'Done',
+        actionItems: [
+            {
+                name: 'Implement counter',
+                description: 'Redis ZADD-based sliding window',
+                acceptanceCriteria: [
+                    { description: 'Counts requests in time window', verified: true },
+                    { description: 'Cleans up expired entries', verified: true },
+                ],
+            },
+        ],
+    },
+    {
+        title: 'Add rate limit middleware',
+        description: 'Express middleware that checks rate limits per IP',
+        state: 'Done',
+        actionItems: [],
+    },
+    {
+        title: 'Configure limits per endpoint',
+        description: 'Set different rate limits for public vs authenticated endpoints',
+        state: 'Done',
+        actionItems: [],
+    },
+];
+const allTodoTasks = [
+    {
+        title: 'Define notification types',
+        description: 'Enumerate all notification events and their payloads',
+        state: 'Todo',
+        actionItems: [],
+    },
+    {
+        title: 'Set up WebSocket server',
+        description: 'Configure Socket.io with Redis adapter',
+        state: 'Todo',
+        actionItems: [],
+    },
+    {
+        title: 'Implement notification store',
+        description: 'Persist notifications in database',
+        state: 'Todo',
+        actionItems: [],
+    },
+];
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+/** Default — tasks in mixed states with action items and acceptance criteria. */
+export const Default = {
+    args: {
+        tasks: mixedTasks,
+    },
+};
+/** All tasks completed. */
+export const AllDone = {
+    args: {
+        tasks: allDoneTasks,
+    },
+};
+/** All tasks in Todo state. */
+export const AllTodo = {
+    args: {
+        tasks: allTodoTasks,
+    },
+};
+/** Empty — no tasks defined. */
+export const Empty = {
+    args: {
+        tasks: [],
+    },
+};
+/** Single task with detailed action items. */
+export const SingleTaskDetailed = {
+    args: {
+        tasks: [mixedTasks[2]],
+    },
+};