@shepai/cli 1.78.1 → 1.79.0

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

@@ -0,0 +1,157 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { PrStatus, CiStatus } from '../../../../../../packages/core/src/domain/generated/output.js';
+import { OverviewTab } from './overview-tab.js';
+const meta = {
+    title: 'Drawers/Feature/Tabs/OverviewTab',
+    component: OverviewTab,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'fullscreen',
+    },
+    decorators: [
+        (Story) => (_jsx("div", { style: { height: '600px', width: '400px', border: '1px solid var(--color-border)' }, children: _jsx(Story, {}) })),
+    ],
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const fullData = {
+    name: 'Auth Module',
+    description: 'Implement OAuth2 authentication flow with multiple providers',
+    featureId: '#f1',
+    lifecycle: 'implementation',
+    state: 'running',
+    progress: 65,
+    agentType: 'claude-code',
+    runtime: '2h 15m',
+    repositoryPath: '/home/user/my-repo',
+    branch: 'feat/auth-module',
+    pr: {
+        url: 'https://github.com/org/repo/pull/42',
+        number: 42,
+        status: PrStatus.Open,
+        ciStatus: CiStatus.Pending,
+        commitHash: 'abc1234567890def',
+    },
+};
+const noPrData = {
+    name: 'Search Index',
+    description: 'Elasticsearch full-text search setup',
+    featureId: '#f4',
+    lifecycle: 'implementation',
+    state: 'running',
+    progress: 40,
+    agentType: 'claude-code',
+    repositoryPath: '/home/user/my-repo',
+    branch: 'feat/search-index',
+};
+const noProgressData = {
+    name: 'API Rate Limiting',
+    description: 'Implement sliding window rate limiting for public endpoints',
+    featureId: '#bi1',
+    lifecycle: 'requirements',
+    state: 'action-required',
+    progress: 0,
+    repositoryPath: '/home/user/my-repo',
+    branch: 'feat/api-rate-limiting',
+};
+const doneData = {
+    name: 'Payment Gateway',
+    description: 'Stripe integration for subscriptions',
+    featureId: '#f3',
+    lifecycle: 'deploy',
+    state: 'done',
+    progress: 100,
+    runtime: '1h 42m',
+    repositoryPath: '/home/user/my-repo',
+    branch: 'feat/payment-gateway',
+    pr: {
+        url: 'https://github.com/org/repo/pull/55',
+        number: 55,
+        status: PrStatus.Merged,
+        ciStatus: CiStatus.Success,
+        commitHash: 'def4567890abc123',
+    },
+};
+const blockedData = {
+    name: 'Email Service',
+    description: 'Transactional email with SendGrid',
+    featureId: '#f5',
+    lifecycle: 'implementation',
+    state: 'blocked',
+    progress: 20,
+    blockedBy: 'Auth Module',
+    repositoryPath: '/home/user/my-repo',
+    branch: 'feat/email-service',
+};
+const errorData = {
+    name: 'Notification System',
+    description: 'Real-time notifications via WebSockets',
+    featureId: '#f6',
+    lifecycle: 'review',
+    state: 'error',
+    progress: 30,
+    errorMessage: 'Build failed: type mismatch in NotificationHandler',
+    repositoryPath: '/home/user/my-repo',
+    branch: 'feat/notifications',
+};
+const minimalData = {
+    name: 'Minimal Feature',
+    featureId: '#f0',
+    lifecycle: 'requirements',
+    state: 'creating',
+    progress: 0,
+    repositoryPath: '/home/user/my-repo',
+    branch: '',
+};
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+/** Default — full data with status, progress, PR card, and details. */
+export const Default = {
+    args: { data: fullData },
+};
+/** Feature with no PR — PR card is hidden. */
+export const NoPr = {
+    args: { data: noPrData },
+};
+/** Feature with 0% progress — progress bar is hidden. */
+export const NoProgress = {
+    args: { data: noProgressData },
+};
+/** Completed feature in deploy phase with merged PR. */
+export const DoneWithMergedPr = {
+    args: { data: doneData },
+};
+/** Blocked feature showing blocked-by detail. */
+export const Blocked = {
+    args: { data: blockedData },
+};
+/** Error state showing error message detail. */
+export const Error = {
+    args: { data: errorData },
+};
+/** Minimal data — only required fields, no optional details or PR. */
+export const Minimal = {
+    args: { data: minimalData },
+};
+/* ---------------------------------------------------------------------------
+ * Lifecycle phase stories
+ * ------------------------------------------------------------------------- */
+/** Requirements phase. */
+export const RequirementsPhase = {
+    args: { data: { ...noPrData, lifecycle: 'requirements' } },
+};
+/** Research phase. */
+export const ResearchPhase = {
+    args: { data: { ...noPrData, lifecycle: 'research' } },
+};
+/** Review phase. */
+export const ReviewPhase = {
+    args: { data: { ...noPrData, lifecycle: 'review' } },
+};
+/** Maintain phase. */
+export const MaintainPhase = {
+    args: { data: { ...noPrData, lifecycle: 'maintain' } },
+};

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

@@ -0,0 +1,8 @@
+import type { PlanData } from '../../../app/actions/get-feature-plan.js';
+export interface PlanTabProps {
+    plan: PlanData | null;
+    loading: boolean;
+    error: string | null;
+}
+export declare function PlanTab({ plan, loading, error }: PlanTabProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=plan-tab.d.ts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,40 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Loader2, Circle, Check, Eye } from 'lucide-react';
+import { AlertCircle, ListTodo } from 'lucide-react';
+import { Badge } from '../../ui/badge.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" }) }));
+    }
+    if (error) {
+        return (_jsxs("div", { className: "flex items-center gap-2 p-4 text-sm text-red-600", children: [_jsx(AlertCircle, { className: "h-4 w-4 shrink-0" }), _jsx("span", { children: 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] })] }));
+}

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

@@ -0,0 +1,22 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PlanTab } from './plan-tab.js';
+declare const meta: Meta<typeof PlanTab>;
+export default meta;
+type Story = StoryObj<typeof PlanTab>;
+/** Default — plan with tasks in various states (Todo, WIP, Done, Review). */
+export declare const Default: Story;
+/** All tasks completed. */
+export declare const AllTasksDone: Story;
+/** Draft plan in Requirements state. */
+export declare const DraftPlan: Story;
+/** Plan requiring clarification — ClarificationRequired state badge. */
+export declare const ClarificationRequired: Story;
+/** Plan with overview but no tasks defined yet. */
+export declare const NoTasks: Story;
+/** Loading state — spinner displayed while data is being fetched. */
+export declare const Loading: Story;
+/** Empty state — no plan created yet. */
+export declare const Empty: Story;
+/** Error state — inline error message. */
+export declare const Error: Story;
+//# sourceMappingURL=plan-tab.stories.d.ts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,188 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { PlanTab } from './plan-tab.js';
+const meta = {
+    title: 'Drawers/Feature/Tabs/PlanTab',
+    component: PlanTab,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'fullscreen',
+    },
+    decorators: [
+        (Story) => (_jsx("div", { style: { height: '600px', width: '400px', border: '1px solid var(--color-border)' }, children: _jsx(Story, {}) })),
+    ],
+};
+export default meta;
+/* ---------------------------------------------------------------------------
+ * Data fixtures
+ * ------------------------------------------------------------------------- */
+const mixedTasksPlan = {
+    state: 'Ready',
+    overview: 'Implement OAuth2 authentication flow with support for Google and GitHub identity providers. The implementation includes token management, callback handling, and user profile sync.',
+    tasks: [
+        {
+            title: 'Set up OAuth provider configuration',
+            description: 'Configure Google and GitHub OAuth apps with client IDs and secrets',
+            state: 'Done',
+        },
+        {
+            title: 'Implement callback handler',
+            description: 'Handle OAuth callback with authorization code exchange',
+            state: 'Done',
+        },
+        {
+            title: 'Add token refresh logic',
+            description: 'Implement silent token refresh using refresh tokens stored in httpOnly cookies',
+            state: 'Work in Progress',
+        },
+        {
+            title: 'Create user profile sync',
+            description: 'Sync user profile data from identity providers on login',
+            state: 'Todo',
+        },
+        {
+            title: 'Write integration tests',
+            description: 'Test the full OAuth flow with mocked providers',
+            state: 'Todo',
+        },
+        {
+            title: 'Update API documentation',
+            description: 'Document new authentication endpoints and flows',
+            state: 'Review',
+        },
+    ],
+};
+const allDonePlan = {
+    state: 'Ready',
+    overview: 'All implementation tasks for the rate limiting feature have been completed successfully.',
+    tasks: [
+        {
+            title: 'Design sliding window algorithm',
+            description: 'Implement Redis-backed sliding window counter',
+            state: 'Done',
+        },
+        {
+            title: 'Add rate limit middleware',
+            description: 'Express middleware that checks rate limits per IP',
+            state: 'Done',
+        },
+        {
+            title: 'Configure limits per endpoint',
+            description: 'Set different rate limits for public vs authenticated endpoints',
+            state: 'Done',
+        },
+        {
+            title: 'Add rate limit headers',
+            description: 'Include X-RateLimit-* headers in responses',
+            state: 'Done',
+        },
+    ],
+};
+const draftPlan = {
+    state: 'Requirements',
+    overview: 'Initial plan for implementing the notification system. Requirements are still being gathered.',
+    tasks: [
+        {
+            title: 'Define notification types',
+            description: 'Enumerate all notification events and their payloads',
+            state: 'Todo',
+        },
+        {
+            title: 'Set up WebSocket server',
+            description: 'Configure Socket.io with Redis adapter for horizontal scaling',
+            state: 'Todo',
+        },
+        {
+            title: 'Implement notification store',
+            description: 'Persist notifications in database with read/unread tracking',
+            state: 'Todo',
+        },
+    ],
+};
+const clarificationPlan = {
+    state: 'ClarificationRequired',
+    overview: 'Plan requires clarification on the scope of the email template system.',
+    tasks: [
+        {
+            title: 'Set up email provider',
+            description: 'Configure SendGrid API integration',
+            state: 'Done',
+        },
+        {
+            title: 'Create template engine',
+            description: 'Implement Handlebars-based email template rendering',
+            state: 'Todo',
+        },
+    ],
+};
+const noTasksPlan = {
+    state: 'Requirements',
+    overview: 'Plan overview is available but no tasks have been defined yet.',
+    tasks: [],
+};
+/* ---------------------------------------------------------------------------
+ * Stories
+ * ------------------------------------------------------------------------- */
+/** Default — plan with tasks in various states (Todo, WIP, Done, Review). */
+export const Default = {
+    args: {
+        plan: mixedTasksPlan,
+        loading: false,
+        error: null,
+    },
+};
+/** All tasks completed. */
+export const AllTasksDone = {
+    args: {
+        plan: allDonePlan,
+        loading: false,
+        error: null,
+    },
+};
+/** Draft plan in Requirements state. */
+export const DraftPlan = {
+    args: {
+        plan: draftPlan,
+        loading: false,
+        error: null,
+    },
+};
+/** Plan requiring clarification — ClarificationRequired state badge. */
+export const ClarificationRequired = {
+    args: {
+        plan: clarificationPlan,
+        loading: false,
+        error: null,
+    },
+};
+/** Plan with overview but no tasks defined yet. */
+export const NoTasks = {
+    args: {
+        plan: noTasksPlan,
+        loading: false,
+        error: null,
+    },
+};
+/** Loading state — spinner displayed while data is being fetched. */
+export const Loading = {
+    args: {
+        plan: null,
+        loading: true,
+        error: null,
+    },
+};
+/** Empty state — no plan created yet. */
+export const Empty = {
+    args: {
+        plan: null,
+        loading: false,
+        error: null,
+    },
+};
+/** Error state — inline error message. */
+export const Error = {
+    args: {
+        plan: null,
+        loading: false,
+        error: 'Failed to load plan data. Please try again.',
+    },
+};

package/dist/src/presentation/web/components/common/feature-drawer-tabs/use-tab-data-fetch.d.ts

@@ -0,0 +1,30 @@
+/** State for a single tab's data, loading, and error. */
+export interface TabState<T = unknown> {
+    data: T | null;
+    loading: boolean;
+    error: string | null;
+}
+/** A function that fetches data for a tab given a feature ID. */
+export type TabFetcher<T = unknown> = (featureId: string) => Promise<T>;
+/** Map of tab keys to their fetcher functions. */
+export type TabFetchers<K extends string> = Record<K, TabFetcher>;
+/** Return type of the useTabDataFetch hook. */
+export interface UseTabDataFetchResult<K extends string> {
+    /** Per-tab state (data, loading, error). */
+    tabs: Record<K, TabState>;
+    /** Fetch data for a tab. Uses cache if already fetched. */
+    fetchTab: (tab: K) => Promise<void>;
+    /** Force re-fetch for a tab, bypassing cache. */
+    refreshTab: (tab: K) => Promise<void>;
+}
+/**
+ * Custom hook for lazy-loading tab data with per-tab caching.
+ *
+ * - Fetches data only when a tab is explicitly activated via fetchTab().
+ * - Caches results so revisiting a loaded tab is instant.
+ * - Clears all cached data when featureId changes.
+ * - Supports force re-fetch via refreshTab() for SSE-driven updates.
+ * - Uses ref-based callbacks to avoid stale closures (matches useArtifactFetch pattern).
+ */
+export declare function useTabDataFetch<K extends string>(featureId: string, fetchers: TabFetchers<K>): UseTabDataFetchResult<K>;
+//# sourceMappingURL=use-tab-data-fetch.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-tab-data-fetch.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-drawer-tabs/use-tab-data-fetch.ts"],"names":[],"mappings":"AAIA,yDAAyD;AACzD,MAAM,WAAW,QAAQ,CAAC,CAAC,GAAG,OAAO;IACnC,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,iEAAiE;AACjE,MAAM,MAAM,UAAU,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC;AAExE,kDAAkD;AAClD,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,MAAM,IAAI,MAAM,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC;AAElE,+CAA+C;AAC/C,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS,MAAM;IACrD,4CAA4C;IAC5C,IAAI,EAAE,MAAM,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;IAC1B,2DAA2D;IAC3D,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpC,iDAAiD;IACjD,UAAU,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACvC;AAMD;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,CAAC,SAAS,MAAM,EAC9C,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,GACvB,qBAAqB,CAAC,CAAC,CAAC,CAmG1B"}

package/dist/src/presentation/web/components/common/feature-drawer-tabs/use-tab-data-fetch.js

@@ -0,0 +1,100 @@
+'use client';
+import { useState, useRef, useCallback, useEffect } from 'react';
+function createInitialTabState() {
+    return { data: null, loading: false, error: null };
+}
+/**
+ * Custom hook for lazy-loading tab data with per-tab caching.
+ *
+ * - Fetches data only when a tab is explicitly activated via fetchTab().
+ * - Caches results so revisiting a loaded tab is instant.
+ * - Clears all cached data when featureId changes.
+ * - Supports force re-fetch via refreshTab() for SSE-driven updates.
+ * - Uses ref-based callbacks to avoid stale closures (matches useArtifactFetch pattern).
+ */
+export function useTabDataFetch(featureId, fetchers) {
+    const tabKeys = Object.keys(fetchers);
+    const [tabStates, setTabStates] = useState(() => {
+        const initial = {};
+        for (const key of tabKeys) {
+            initial[key] = createInitialTabState();
+        }
+        return initial;
+    });
+    // Ref-based fetchers to avoid stale closures in callbacks.
+    const fetchersRef = useRef(fetchers);
+    fetchersRef.current = fetchers;
+    // Ref-based featureId to use current value in callbacks.
+    const featureIdRef = useRef(featureId);
+    featureIdRef.current = featureId;
+    // Track mounted state to prevent state updates after unmount.
+    const mountedRef = useRef(true);
+    useEffect(() => {
+        mountedRef.current = true;
+        return () => {
+            mountedRef.current = false;
+        };
+    }, []);
+    // Clear all cached data when featureId changes.
+    const prevFeatureIdRef = useRef(featureId);
+    useEffect(() => {
+        if (prevFeatureIdRef.current !== featureId) {
+            prevFeatureIdRef.current = featureId;
+            setTabStates((prev) => {
+                const cleared = {};
+                for (const key of Object.keys(prev)) {
+                    cleared[key] = createInitialTabState();
+                }
+                return cleared;
+            });
+        }
+    }, [featureId]);
+    const doFetch = useCallback(async (tab) => {
+        const fetcher = fetchersRef.current[tab];
+        const currentFeatureId = featureIdRef.current;
+        if (!fetcher)
+            return;
+        if (mountedRef.current) {
+            setTabStates((prev) => ({
+                ...prev,
+                [tab]: { ...prev[tab], loading: true, error: null },
+            }));
+        }
+        try {
+            const data = await fetcher(currentFeatureId);
+            if (mountedRef.current) {
+                setTabStates((prev) => ({
+                    ...prev,
+                    [tab]: { data, loading: false, error: null },
+                }));
+            }
+        }
+        catch (error) {
+            if (mountedRef.current) {
+                const message = error instanceof Error ? error.message : 'Failed to fetch tab data';
+                setTabStates((prev) => ({
+                    ...prev,
+                    [tab]: { data: null, loading: false, error: message },
+                }));
+            }
+        }
+    }, []);
+    const fetchTab = useCallback(async (tab) => {
+        // Check if data is already cached (non-null data means already fetched)
+        const current = tabStates[tab];
+        if (current && current.data !== null)
+            return;
+        // Also skip if currently loading
+        if (current && current.loading)
+            return;
+        await doFetch(tab);
+    }, [tabStates, doFetch]);
+    const refreshTab = useCallback(async (tab) => {
+        await doFetch(tab);
+    }, [doFetch]);
+    return {
+        tabs: tabStates,
+        fetchTab,
+        refreshTab,
+    };
+}

package/dist/src/presentation/web/components/common/feature-node/feature-node-state-config.d.ts

@@ -34,6 +34,18 @@ export interface FeatureNodeData {
     agentType?: AgentTypeValue;
     /** LLM model identifier used for this feature's agent run. */
     modelId?: string;
+    /** Feature summary / user query */
+    summary?: string;
+    /** Epoch ms or ISO string when the feature was created */
+    createdAt?: string | number;
+    /** Repository display name (e.g. "my-repo") */
+    repositoryName?: string;
+    /** Base branch the feature was branched from (e.g. "main") */
+    baseBranch?: string;
+    /** AI-generated one-line description of the feature (from spec artifact) */
+    oneLiner?: string;
+    /** Original user query that initiated this feature */
+    userQuery?: string;
     /** PR metadata for features with an associated pull request */
     pr?: {
         url: string;

package/dist/src/presentation/web/components/common/feature-node/feature-node-state-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feature-node-state-config.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node-state-config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmD,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAChG,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAC/E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,MAAM,MAAM,gBAAgB,GACxB,UAAU,GACV,SAAS,GACT,iBAAiB,GACjB,MAAM,GACN,SAAS,GACT,OAAO,CAAC;AAEZ,MAAM,MAAM,qBAAqB,GAC7B,cAAc,GACd,UAAU,GACV,gBAAgB,GAChB,QAAQ,GACR,QAAQ,GACR,UAAU,CAAC;AAEf,0DAA0D;AAC1D,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,qBAAqB,EAAE,MAAM,CAOxE,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,qBAAqB,EAAE,MAAM,CAOvE,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,qBAAqB,CAAC;IACjC,KAAK,EAAE,gBAAgB,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,8CAA8C;IAC9C,cAAc,EAAE,MAAM,CAAC;IACvB,uCAAuC;IACvC,MAAM,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,gFAAgF;IAChF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,8DAA8D;IAC9D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+DAA+D;IAC/D,EAAE,CAAC,EAAE;QACH,GAAG,EAAE,MAAM,CAAC;QACZ,MAAM,EAAE,MAAM,CAAC;QACf,MAAM,EAAE,QAAQ,CAAC;QACjB,QAAQ,CAAC,EAAE,QAAQ,CAAC;QACpB,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,aAAa,CAAC,CAAC;AAEnE,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,UAAU,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,gBAAgB,EAAE,sBAAsB,CA6DnF,CAAC"}
+{"version":3,"file":"feature-node-state-config.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/feature-node/feature-node-state-config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmD,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAChG,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAC/E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,MAAM,MAAM,gBAAgB,GACxB,UAAU,GACV,SAAS,GACT,iBAAiB,GACjB,MAAM,GACN,SAAS,GACT,OAAO,CAAC;AAEZ,MAAM,MAAM,qBAAqB,GAC7B,cAAc,GACd,UAAU,GACV,gBAAgB,GAChB,QAAQ,GACR,QAAQ,GACR,UAAU,CAAC;AAEf,0DAA0D;AAC1D,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,qBAAqB,EAAE,MAAM,CAOxE,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,qBAAqB,EAAE,MAAM,CAOvE,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,qBAAqB,CAAC;IACjC,KAAK,EAAE,gBAAgB,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,8CAA8C;IAC9C,cAAc,EAAE,MAAM,CAAC;IACvB,uCAAuC;IACvC,MAAM,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,gFAAgF;IAChF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,8DAA8D;IAC9D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,+CAA+C;IAC/C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+DAA+D;IAC/D,EAAE,CAAC,EAAE;QACH,GAAG,EAAE,MAAM,CAAC;QACZ,MAAM,EAAE,MAAM,CAAC;QACf,MAAM,EAAE,QAAQ,CAAC;QACjB,QAAQ,CAAC,EAAE,QAAQ,CAAC;QACpB,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,aAAa,CAAC,CAAC;AAEnE,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,UAAU,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,gBAAgB,EAAE,sBAAsB,CA6DnF,CAAC"}

package/dist/src/presentation/web/components/common/index.d.ts

@@ -3,18 +3,17 @@ export { AddRepositoryButton } from './add-repository-button/index.js';
 export { ElapsedTime, formatElapsed } from './elapsed-time/index.js';
 export { EmptyState, type EmptyStateProps } from './empty-state/index.js';
 export { FeatureCreateDrawer, type FeatureCreateDrawerProps, type FeatureCreatePayload, } from './feature-create-drawer/index.js';
-export { FeatureDrawer, type FeatureDrawerProps } from './feature-drawer/index.js';
+export { useFeatureActions, type FeatureActionsInput, type FeatureActionsState, } from './feature-drawer/index.js';
 export { FeatureListItem, type FeatureListItemProps } from './feature-list-item/index.js';
-export { useFeatureActions, type FeatureActionsInput, type FeatureActionsState, } from './feature-drawer/use-feature-actions.js';
 export { FeatureNode, featureNodeStateConfig, type FeatureNodeState, type FeatureLifecyclePhase, type FeatureNodeData, type FeatureNodeType, type FeatureNodeStateConfig, } from './feature-node/index.js';
 export { FeatureStatusBadges, type FeatureStatusBadgesProps } from './feature-status-badges/index.js';
 export { FeatureStatusGroup, type FeatureStatusGroupProps } from './feature-status-group/index.js';
 export { LoadingSkeleton } from './loading-skeleton/index.js';
 export { RepositoryNode, type RepositoryNodeData, type RepositoryNodeType, } from './repository-node/index.js';
 export { PageHeader } from './page-header/index.js';
-export { PrdQuestionnaire, PrdQuestionnaireDrawer, type PrdQuestionnaireProps, type PrdQuestionnaireDrawerProps, type PrdQuestion, type PrdFinalAction, type PrdOption, type PrdQuestionnaireData, } from './prd-questionnaire/index.js';
+export { PrdQuestionnaire, type PrdQuestionnaireProps, type PrdQuestion, type PrdFinalAction, type PrdOption, type PrdQuestionnaireData, } from './prd-questionnaire/index.js';
 export { ShepLogo, type ShepLogoProps } from './shep-logo/index.js';
-export { TechDecisionsReview, TechDecisionsDrawer, type TechDecisionsReviewProps, type TechDecisionsDrawerProps, type TechDecisionsReviewData, } from './tech-decisions-review/index.js';
+export { TechDecisionsReview, type TechDecisionsReviewProps, type TechDecisionsReviewData, } from './tech-decisions-review/index.js';
 export { SidebarCollapseToggle, type SidebarCollapseToggleProps } from './sidebar-collapse-toggle/index.js';
 export { SidebarNavItem, type SidebarNavItemProps } from './sidebar-nav-item/index.js';
 export { SidebarSectionHeader, type SidebarSectionHeaderProps } from './sidebar-section-header/index.js';

package/dist/src/presentation/web/components/common/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/common/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC7E,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,EAC7B,KAAK,oBAAoB,GAC1B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC1E,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACjF,OAAO,EACL,iBAAiB,EACjB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,GACzB,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EACL,WAAW,EACX,sBAAsB,EACtB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,sBAAsB,GAC5B,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAC7F,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAC1F,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EACL,cAAc,EACd,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,GACxB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EACL,gBAAgB,EAChB,sBAAsB,EACtB,KAAK,qBAAqB,EAC1B,KAAK,2BAA2B,EAChC,KAAK,WAAW,EAChB,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,oBAAoB,GAC1B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,KAAK,wBAAwB,EAC7B,KAAK,wBAAwB,EAC7B,KAAK,uBAAuB,GAC7B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,MAAM,2BAA2B,CAAC;AACnG,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAChG,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/common/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC7E,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,EAC7B,KAAK,oBAAoB,GAC1B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,iBAAiB,EACjB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,GACzB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACjF,OAAO,EACL,WAAW,EACX,sBAAsB,EACtB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,sBAAsB,GAC5B,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAC7F,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAC1F,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EACL,cAAc,EACd,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,GACxB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,EAC1B,KAAK,WAAW,EAChB,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,oBAAoB,GAC1B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,EAC7B,KAAK,uBAAuB,GAC7B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,MAAM,2BAA2B,CAAC;AACnG,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAChG,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/src/presentation/web/components/common/index.js

@@ -3,18 +3,17 @@ export { AddRepositoryButton } from './add-repository-button/index.js';
 export { ElapsedTime, formatElapsed } from './elapsed-time/index.js';
 export { EmptyState } from './empty-state/index.js';
 export { FeatureCreateDrawer, } from './feature-create-drawer/index.js';
-export { FeatureDrawer } from './feature-drawer/index.js';
+export { useFeatureActions, } from './feature-drawer/index.js';
 export { FeatureListItem } from './feature-list-item/index.js';
-export { useFeatureActions, } from './feature-drawer/use-feature-actions.js';
 export { FeatureNode, featureNodeStateConfig, } from './feature-node/index.js';
 export { FeatureStatusBadges } from './feature-status-badges/index.js';
 export { FeatureStatusGroup } from './feature-status-group/index.js';
 export { LoadingSkeleton } from './loading-skeleton/index.js';
 export { RepositoryNode, } from './repository-node/index.js';
 export { PageHeader } from './page-header/index.js';
-export { PrdQuestionnaire, PrdQuestionnaireDrawer, } from './prd-questionnaire/index.js';
+export { PrdQuestionnaire, } from './prd-questionnaire/index.js';
 export { ShepLogo } from './shep-logo/index.js';
-export { TechDecisionsReview, TechDecisionsDrawer, } from './tech-decisions-review/index.js';
+export { TechDecisionsReview, } from './tech-decisions-review/index.js';
 export { SidebarCollapseToggle } from './sidebar-collapse-toggle/index.js';
 export { SidebarNavItem } from './sidebar-nav-item/index.js';
 export { SidebarSectionHeader } from './sidebar-section-header/index.js';