@shepai/cli 1.182.1 → 1.183.0

package/dist/src/presentation/web/app/application/[id]/page.d.ts

@@ -1,8 +1,8 @@
-/** Skip static pre-rendering since we need runtime DI container and server context. */
-export declare const dynamic = "force-dynamic";
-export default function ApplicationRoute({ params }: {
+interface RouteProps {
     params: Promise<{
         id: string;
     }>;
-}): Promise<import("react/jsx-runtime").JSX.Element>;
+}
+export default function ApplicationRoute({ params }: RouteProps): Promise<import("react/jsx-runtime").JSX.Element>;
+export {};
 //# sourceMappingURL=page.d.ts.map

package/dist/src/presentation/web/app/application/[id]/page.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/app/application/[id]/page.tsx"],"names":[],"mappings":"AAaA,uFAAuF;AACvF,eAAO,MAAM,OAAO,kBAAkB,CAAC;AAEvC,wBAA8B,gBAAgB,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,OAAO,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAAE,oDAoE7F"}
+{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/app/application/[id]/page.tsx"],"names":[],"mappings":"AAEA,UAAU,UAAU;IAClB,MAAM,EAAE,OAAO,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CACjC;AAED,wBAA8B,gBAAgB,CAAC,EAAE,MAAM,EAAE,EAAE,UAAU,oDAGpE"}

package/dist/src/presentation/web/app/application/[id]/page.js

@@ -1,65 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { resolve } from '../../../lib/server-container.js';
-import { notFound } from 'next/navigation';
-import { ApplicationPage } from '../../../components/features/application-page/application-page.js';
-import { DeploymentStatusProvider } from '../../../hooks/deployment-status-provider.js';
-/** Skip static pre-rendering since we need runtime DI container and server context. */
-export const dynamic = 'force-dynamic';
+import { ApplicationPageLoader } from '../../../components/features/application-page/application-page-loader.js';
 export default async function ApplicationRoute({ params }) {
     const { id } = await params;
-    const getApp = resolve('GetApplicationUseCase');
-    const application = await getApp.execute(id);
-    if (!application) {
-        notFound();
-    }
-    // SSR-load the interactive chat state so the first user message (posted
-    // by createApplication before navigation) renders on first paint — no
-    // client-side fetch delay between mount and the message appearing.
-    const getChatState = resolve('GetInteractiveChatStateUseCase');
-    let initialChatState;
-    try {
-        initialChatState = await getChatState.execute({ featureId: `app-${application.id}` });
-    }
-    catch {
-        // If chat state lookup fails (e.g. no session yet) ChatTab falls back
-        // to fetching on mount. Not fatal.
-        initialChatState = undefined;
-    }
-    // SSR-load the dev-server deployment status too. Before this, on a
-    // page refresh while a dev server was running, we rendered the
-    // empty-state "No dev server running" for a split second until the
-    // client-side `hydrateOnMount` fetch returned. With the server
-    // reading `DeploymentService.getStatus()` up front — it's a cheap
-    // in-memory map lookup against state that was already reconciled
-    // from SQLite on startup — the first paint already knows the URL
-    // and the iframe loads instantly.
-    let initialDeployment;
-    try {
-        const deploymentService = resolve('IDeploymentService');
-        const status = deploymentService.getStatus(application.id);
-        if (status && status.state !== 'Stopped') {
-            initialDeployment = { state: status.state, url: status.url };
-        }
-    }
-    catch {
-        // Deployment service may not be registered in test environments —
-        // fall back to client-side hydration.
-        initialDeployment = undefined;
-    }
-    // Seed the provider with the current application's deployment so the
-    // store's `hydrate()` writes the initial state/url into the entry keyed
-    // by `application.id`. The application page is outside the (dashboard)
-    // route group, so it has its own provider instance rather than sharing
-    // the dashboard's.
-    const initialDeployments = initialDeployment
-        ? [
-            {
-                targetId: application.id,
-                targetType: 'application',
-                state: initialDeployment.state,
-                url: initialDeployment.url,
-            },
-        ]
-        : [];
-    return (_jsx(DeploymentStatusProvider, { initialDeployments: initialDeployments, children: _jsx(ApplicationPage, { application: application, initialChatState: initialChatState, initialDeployment: initialDeployment }) }));
+    return _jsx(ApplicationPageLoader, { applicationId: id });
 }

package/dist/src/presentation/web/app/applications/page.d.ts

@@ -0,0 +1,2 @@
+export default function ApplicationsPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=page.d.ts.map

package/dist/src/presentation/web/app/applications/page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/app/applications/page.tsx"],"names":[],"mappings":"AAEA,MAAM,CAAC,OAAO,UAAU,gBAAgB,4CAMvC"}

package/dist/src/presentation/web/app/applications/page.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ApplicationsPageClient } from '../../components/features/applications/applications-page-client.js';
+export default function ApplicationsPage() {
+    return (_jsx("div", { className: "dark:bg-background flex h-full flex-col overflow-y-auto bg-[#f6f7f8] p-6", children: _jsx(ApplicationsPageClient, {}) }));
+}

package/dist/src/presentation/web/components/assistant-ui/thread.js

@@ -61,7 +61,7 @@ const UserMessage = () => {
     if (text.startsWith(INTERACTION_PREFIX)) {
         return _jsx(InteractionResponseMessage, { text: text });
     }
-    return (_jsxs(MessagePrimitive.Root, { className: "group animate-in fade-in-0 slide-in-from-bottom-1 flex w-full items-start gap-2.5 px-4 py-0.5 duration-300 ease-out", children: [_jsx("div", { className: "mt-0.5 flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-violet-500/15", children: _jsx(User, { className: "h-3.5 w-3.5 text-violet-500" }) }), _jsxs("div", { className: "flex max-w-[85%] min-w-0 flex-col gap-0.5", children: [_jsx("div", { className: "text-foreground mt-px overflow-hidden rounded-2xl rounded-tl-sm border border-violet-500/15 bg-violet-500/8 px-4 py-2 text-sm leading-relaxed break-words shadow-sm backdrop-blur-md", children: _jsx(MessagePrimitive.Content, { components: { Text: UserMessageText } }) }), _jsxs("div", { className: "flex items-center gap-1.5 opacity-0 transition-opacity group-hover:opacity-100", children: [_jsx(MessageMeta, {}), _jsx(ActionBarPrimitive.Root, { className: "flex items-center gap-1", children: _jsx(ActionBarPrimitive.Copy, { asChild: true, children: _jsx(IconButton, { tooltip: "Copy", children: _jsx(Copy, {}) }) }) })] })] })] }));
+    return (_jsxs(MessagePrimitive.Root, { className: "group animate-in fade-in-0 slide-in-from-bottom-1 flex w-full items-start gap-2.5 px-4 py-0.5 duration-300 ease-out", children: [_jsx("div", { className: "mt-0.5 flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-violet-500/15", children: _jsx(User, { className: "h-3.5 w-3.5 text-violet-500" }) }), _jsxs("div", { className: "flex max-w-[85%] min-w-0 flex-col gap-0.5", children: [_jsx("div", { className: "text-foreground mt-px overflow-hidden rounded-2xl rounded-tl-sm border border-violet-500/15 bg-violet-500/8 px-4 py-2 text-sm leading-relaxed break-words shadow-sm backdrop-blur-md dark:bg-violet-500/15", children: _jsx(MessagePrimitive.Content, { components: { Text: UserMessageText } }) }), _jsxs("div", { className: "flex items-center gap-1.5 opacity-0 transition-opacity group-hover:opacity-100", children: [_jsx(MessageMeta, {}), _jsx(ActionBarPrimitive.Root, { className: "flex items-center gap-1", children: _jsx(ActionBarPrimitive.Copy, { asChild: true, children: _jsx(IconButton, { tooltip: "Copy", children: _jsx(Copy, {}) }) }) })] })] })] }));
 };
 /** Compact green bubble showing the user's selections from an AskUserQuestion interaction. */
 function InteractionResponseMessage({ text }) {
@@ -96,7 +96,7 @@ const AssistantMessage = () => {
     if (toolEvent) {
         return (_jsxs(MessagePrimitive.Root, { className: "group animate-in fade-in-0 slide-in-from-bottom-1 flex w-full items-start gap-2.5 px-4 py-0.5 duration-300 ease-out", children: [_jsx("div", { className: "text-muted-foreground/40 mt-1 flex h-6 w-6 shrink-0 items-center justify-center", children: _jsx(Bot, { className: "h-3 w-3" }) }), _jsx("div", { className: "flex min-w-0 flex-1 items-center py-0.5", children: _jsx(ToolBubble, { text: rawText }) })] }));
     }
-    return (_jsxs(MessagePrimitive.Root, { className: "group animate-in fade-in-0 slide-in-from-bottom-1 flex w-full items-start gap-2.5 px-4 py-0.5 duration-300 ease-out", children: [_jsx("div", { className: "bg-muted flex h-6 w-6 shrink-0 items-center justify-center rounded-full", children: _jsx(Bot, { className: "text-muted-foreground h-3.5 w-3.5" }) }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [_jsx("div", { className: "bg-muted/50 text-foreground mt-px overflow-hidden rounded-2xl rounded-tl-sm border border-white/5 px-4 py-2 text-sm leading-relaxed break-words shadow-sm backdrop-blur-md", children: _jsx(MessagePrimitive.Content, { components: { Text: AssistantMessageText } }) }), _jsxs("div", { className: "flex items-center gap-1.5 opacity-0 transition-opacity group-hover:opacity-100", children: [_jsx(MessageMeta, {}), _jsx(ActionBarPrimitive.Root, { className: "flex items-center gap-1", children: _jsx(ActionBarPrimitive.Copy, { asChild: true, children: _jsx(IconButton, { tooltip: "Copy", children: _jsx(Copy, {}) }) }) })] })] })] }));
+    return (_jsxs(MessagePrimitive.Root, { className: "group animate-in fade-in-0 slide-in-from-bottom-1 flex w-full items-start gap-2.5 px-4 py-0.5 duration-300 ease-out", children: [_jsx("div", { className: "bg-muted flex h-6 w-6 shrink-0 items-center justify-center rounded-full", children: _jsx(Bot, { className: "text-muted-foreground h-3.5 w-3.5" }) }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [_jsx("div", { className: "bg-muted/50 text-foreground mt-px overflow-hidden rounded-2xl rounded-tl-sm border border-white/5 px-4 py-2 text-sm leading-relaxed break-words shadow-sm backdrop-blur-md dark:bg-neutral-800/60", children: _jsx(MessagePrimitive.Content, { components: { Text: AssistantMessageText } }) }), _jsxs("div", { className: "flex items-center gap-1.5 opacity-0 transition-opacity group-hover:opacity-100", children: [_jsx(MessageMeta, {}), _jsx(ActionBarPrimitive.Root, { className: "flex items-center gap-1", children: _jsx(ActionBarPrimitive.Copy, { asChild: true, children: _jsx(IconButton, { tooltip: "Copy", children: _jsx(Copy, {}) }) }) })] })] })] }));
 };
 // ── Collapsible code block ───────────────────────────────────────────────
 const CODE_COLLAPSED_HEIGHT = 200; // px

package/dist/src/presentation/web/components/common/application-node/application-node.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"application-node.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/application-node/application-node.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AA8CrE,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,mBAAmB,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB,2CAuZA"}
+{"version":3,"file":"application-node.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/common/application-node/application-node.tsx"],"names":[],"mappings":"AA8BA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAMrE,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,mBAAmB,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB,2CAwZA"}

package/dist/src/presentation/web/components/common/application-node/application-node.js

@@ -11,44 +11,10 @@ import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../
 import { useTurnStatus } from '../../../hooks/turn-statuses-provider.js';
 import { useDeployAction } from '../../../hooks/use-deploy-action.js';
 import { DeploymentState } from '../../../../../../packages/core/src/domain/generated/output.js';
+import { deriveAppLiveStatus } from '../../../lib/derive-app-status.js';
 /** Preview slot height. Roomier than the old 120px to give the live
  *  iframe / start-preview CTA more presence on the canvas. */
 const PREVIEW_HEIGHT_PX = 180;
-/**
- * Pick the effective status for the card's status pill. "Idle" is
- * never shown. The fallback when nothing is actively happening is
- * "Ready" (standby) — unless the dev server is running, in which
- * case "Live" takes over as the persistent resting state.
- *
- * Priority (highest wins):
- *
- *   - `processing`      → "In Progress"  (agent actively running a turn)
- *   - `awaiting_input`  → "Warning"      (agent blocked on user question)
- *   - deploymentUrl set → "Live"         (dev server running at a real URL)
- *   - persisted Error   → "Error"
- *   - otherwise         → "Ready"        (agent finished, preview not running)
- *
- * Note the `unread` turn status intentionally collapses into the
- * default branch — when the agent just finished a turn but the user
- * hasn't scrolled back to read it, we still show Ready (or Live if
- * the dev server is up). The user is already looking at the card,
- * a "you have unread output" nag adds no information.
- */
-function deriveLiveStatus(persistedStatus, turnStatus, deploymentUrl) {
-    if (turnStatus === 'processing') {
-        return { label: 'In Progress', dotClass: 'bg-violet-500', pulse: true };
-    }
-    if (turnStatus === 'awaiting_input') {
-        return { label: 'Warning', dotClass: 'bg-amber-500', pulse: true };
-    }
-    if (deploymentUrl) {
-        return { label: 'Live', dotClass: 'bg-emerald-500', pulse: true };
-    }
-    if (persistedStatus === 'Error') {
-        return { label: 'Error', dotClass: 'bg-red-500', pulse: false };
-    }
-    return { label: 'Ready', dotClass: 'bg-sky-500', pulse: false };
-}
 export function ApplicationNode({ data, selected, }) {
     const { i18n } = useTranslation('web');
     const isRtl = i18n.dir() === 'rtl';
@@ -86,7 +52,7 @@ export function ApplicationNode({ data, selected, }) {
     // collapses the pill from "Live" back to "Ready" — there is
     // intentionally no secondary snapshot URL that could stay stale.
     const effectiveDeploymentUrl = deploy.url;
-    const live = deriveLiveStatus(data.status, turnStatus, effectiveDeploymentUrl ?? undefined);
+    const live = deriveAppLiveStatus(data.status, turnStatus, !!effectiveDeploymentUrl);
     // Clicking anything in the "card controls" zone (Preview button,
     // open-in-new-tab) must not trigger the card's navigation-to-app
     // click handler. A single stopPropagation wrapper keeps every
@@ -116,7 +82,7 @@ export function ApplicationNode({ data, selected, }) {
                         e.stopPropagation();
                         data.onClick?.();
                     }
-                }, className: cn('nodrag bg-card flex w-[26rem] cursor-pointer flex-col overflow-hidden rounded-xl border shadow-sm transition-[border-color,box-shadow] duration-200 dark:bg-neutral-800/80', selected && 'border-blue-400 dark:border-amber-500/60'), children: [_jsxs("div", { className: "flex items-center gap-3 px-4 py-4", children: [_jsx("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-gradient-to-br from-indigo-500 to-violet-500", children: _jsx(LayoutGrid, { className: "h-4 w-4 text-white" }) }), _jsx("span", { "data-testid": "application-node-name", className: "min-w-0 truncate text-sm font-medium", children: data.name }), _jsxs("span", { className: "ms-auto flex shrink-0 items-center gap-1.5", children: [_jsx("span", { "data-testid": "application-node-status-dot", className: cn('relative flex h-2 w-2 items-center justify-center rounded-full', live.dotClass), children: live.pulse ? (_jsx("span", { className: cn('absolute inline-flex h-full w-full animate-ping rounded-full opacity-60', live.dotClass) })) : null }), _jsx("span", { "data-testid": "application-node-status-text", className: "text-muted-foreground text-xs", children: live.label })] })] }), _jsx("div", { className: "px-4 pb-4", children: _jsxs("div", { className: "bg-muted group/preview relative overflow-hidden rounded-lg", style: { height: PREVIEW_HEIGHT_PX }, children: [effectiveDeploymentUrl ? (_jsx("iframe", { src: effectiveDeploymentUrl, title: `${data.name} live preview`, 
+                }, className: cn('nodrag bg-card flex w-[26rem] cursor-pointer flex-col overflow-hidden rounded-xl border shadow-sm transition-[border-color,box-shadow] duration-200 dark:bg-neutral-800/80', selected && 'border-blue-400 dark:border-amber-500/60', !selected && live.borderClass), children: [_jsxs("div", { className: "flex items-center gap-3 px-4 py-4", children: [_jsx("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-gradient-to-br from-indigo-500 to-violet-500", children: _jsx(LayoutGrid, { className: "h-4 w-4 text-white" }) }), _jsx("span", { "data-testid": "application-node-name", className: "min-w-0 truncate text-sm font-medium", children: data.name }), _jsxs("span", { className: "ms-auto flex shrink-0 items-center gap-1.5", children: [_jsx("span", { "data-testid": "application-node-status-dot", className: cn('relative flex h-2 w-2 items-center justify-center rounded-full', live.dotClass), children: live.pulse ? (_jsx("span", { className: cn('absolute inline-flex h-full w-full animate-ping rounded-full opacity-60', live.dotClass) })) : null }), _jsx("span", { "data-testid": "application-node-status-text", className: "text-muted-foreground text-xs", children: live.label })] })] }), _jsx("div", { className: "px-4 pb-4", children: _jsxs("div", { className: "bg-muted group/preview relative overflow-hidden rounded-lg", style: { height: PREVIEW_HEIGHT_PX }, children: [effectiveDeploymentUrl ? (_jsx("iframe", { src: effectiveDeploymentUrl, title: `${data.name} live preview`, 
                                     // 2.5× inner size scaled to 0.4 = exactly 1.0
                                     // effective size. The iframe renders at a real
                                     // browser viewport (good enough for responsive

package/dist/src/presentation/web/components/features/application-page/application-page-loader.d.ts

@@ -0,0 +1,4 @@
+export declare function ApplicationPageLoader({ applicationId }: {
+    applicationId: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=application-page-loader.d.ts.map

package/dist/src/presentation/web/components/features/application-page/application-page-loader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"application-page-loader.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/application-page/application-page-loader.tsx"],"names":[],"mappings":"AAkBA,wBAAgB,qBAAqB,CAAC,EAAE,aAAa,EAAE,EAAE;IAAE,aAAa,EAAE,MAAM,CAAA;CAAE,2CAsDjF"}

package/dist/src/presentation/web/components/features/application-page/application-page-loader.js

@@ -0,0 +1,47 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useQuery } from '@tanstack/react-query';
+import { Loader2 } from 'lucide-react';
+import { notFound } from 'next/navigation';
+import { DeploymentStatusProvider } from '../../../hooks/deployment-status-provider.js';
+import { ApplicationPage } from './application-page.js';
+export function ApplicationPageLoader({ applicationId }) {
+    const { data, isLoading, error } = useQuery({
+        queryKey: ['application', applicationId],
+        queryFn: async () => {
+            const res = await fetch(`/api/applications/${applicationId}`);
+            if (res.status === 404)
+                throw new Error('not-found');
+            if (!res.ok)
+                throw new Error('Failed to fetch application');
+            return res.json();
+        },
+        staleTime: 60_000,
+        retry: (count, err) => {
+            if (err instanceof Error && err.message === 'not-found')
+                return false;
+            return count < 2;
+        },
+    });
+    if (error?.message === 'not-found') {
+        notFound();
+    }
+    if (isLoading || !data) {
+        return (_jsx("div", { className: "bg-background flex h-dvh items-center justify-center", children: _jsx(Loader2, { className: "text-muted-foreground h-6 w-6 animate-spin" }) }));
+    }
+    const { application, initialChatState, deployment } = data;
+    const initialDeployment = deployment
+        ? { state: deployment.state, url: deployment.url }
+        : undefined;
+    const initialDeployments = initialDeployment
+        ? [
+            {
+                targetId: application.id,
+                targetType: 'application',
+                state: initialDeployment.state,
+                url: initialDeployment.url,
+            },
+        ]
+        : [];
+    return (_jsx(DeploymentStatusProvider, { initialDeployments: initialDeployments, children: _jsx(ApplicationPage, { application: application, initialChatState: initialChatState, initialDeployment: initialDeployment }) }));
+}

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

@@ -1 +1 @@
-{"version":3,"file":"application-page.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/application-page/application-page.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,WAAW,EAAqB,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AACvE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sFAAsF,CAAC;AA8nBtH;;;;;;GAMG;AACH,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,eAAe,CAAC;IACvB,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;CACpB;AAED,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,WAAW,CAAC;IACzB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,yBAAyB,CAAC;CAC/C;AAED,wBAAgB,eAAe,CAAC,EAAE,WAAW,EAAE,gBAAgB,EAAE,EAAE,oBAAoB,2CAgGtF"}
+{"version":3,"file":"application-page.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/application-page/application-page.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,WAAW,EAAqB,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AACvE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sFAAsF,CAAC;AA0qBtH;;;;;;GAMG;AACH,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,eAAe,CAAC;IACvB,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;CACpB;AAED,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,WAAW,CAAC;IACzB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,yBAAyB,CAAC;CAC/C;AAED,wBAAgB,eAAe,CAAC,EAAE,WAAW,EAAE,gBAAgB,EAAE,EAAE,oBAAoB,2CAwItF"}

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

@@ -1,13 +1,15 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback, useEffect, useRef, useState } from 'react';
-import { useRouter } from 'next/navigation';
 import { useQuery } from '@tanstack/react-query';
 import { toast } from 'sonner';
-import { ArrowLeft, LayoutGrid, GitBranch, Copy, FolderOpen, ClipboardList, Cpu, FilePlus, FilePen, } from 'lucide-react';
+import { LayoutGrid, GitBranch, Copy, FolderOpen, ClipboardList, Cpu, FilePlus, FilePen, Trash2, } from 'lucide-react';
+import { useRouter } from 'next/navigation';
 import { DeploymentState } from '../../../../../../packages/core/src/domain/generated/output.js';
 import { cn } from '../../../lib/utils.js';
 import { Button } from '../../ui/button.js';
+import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from '../../ui/dialog.js';
+import { deleteApplication } from '../../../app/actions/delete-application.js';
 import { ChatTab } from '../../features/chat/ChatTab.js';
 import { APPLICATION_CREATION_PLACEHOLDER_STEPS } from '../../features/chat/workflow-placeholder.js';
 import { TerminalTab } from '../../features/application-page/terminal-tab.js';
@@ -16,6 +18,7 @@ import { RunDevButton } from '../../features/application-page/run-dev-button.js'
 import { WebPreviewTab } from '../../features/application-page/web-preview-tab.js';
 import { useDeployAction } from '../../../hooks/use-deploy-action.js';
 import { useTurnStatus } from '../../../hooks/turn-statuses-provider.js';
+import { deriveAppLiveStatus } from '../../../lib/derive-app-status.js';
 import { chatQueryKey, fetchChatState } from '../../features/chat/chat-state-query.js';
 import { openFolder } from '../../../app/actions/open-folder.js';
 import { getApplicationDebugPrompt } from '../../../app/actions/get-application-debug-prompt.js';
@@ -35,35 +38,8 @@ const VIEW_LABELS = {
     terminal: 'Terminal',
     web: 'Web',
 };
-/**
- * Derive a single effective status label + dot color. "Idle" is
- * never shown. MUST match the priority order in
- * `components/common/application-node/application-node.tsx` so the
- * canvas card and the application page agree on every parameter.
- *
- * Priority (highest wins):
- *
- *   - `processing`      → "In Progress"  (agent actively running a turn)
- *   - `awaiting_input`  → "Warning"      (agent blocked on user question)
- *   - deployReady       → "Live"         (dev server running at a real URL)
- *   - persisted Error   → "Error"
- *   - otherwise         → "Ready"        (agent finished, preview not running)
- */
-function deriveLiveStatusPill(persistedStatus, turnStatus, deployReady) {
-    if (turnStatus === 'processing') {
-        return { label: 'In Progress', dotClass: 'bg-violet-500', pulse: true };
-    }
-    if (turnStatus === 'awaiting_input') {
-        return { label: 'Warning', dotClass: 'bg-amber-500', pulse: true };
-    }
-    if (deployReady) {
-        return { label: 'Live', dotClass: 'bg-emerald-500', pulse: true };
-    }
-    if (persistedStatus === 'Error') {
-        return { label: 'Error', dotClass: 'bg-red-500', pulse: false };
-    }
-    return { label: 'Ready', dotClass: 'bg-sky-500', pulse: false };
-}
+/* Status derivation is shared with canvas nodes and application cards
+ * via `lib/derive-app-status.ts` — single source of truth. */
 /* ------------------------------------------------------------------ */
 /*  Short path helper                                                  */
 /* ------------------------------------------------------------------ */
@@ -73,8 +49,8 @@ function shortPath(path) {
     const idx = normalized.lastIndexOf('/');
     return idx === -1 ? normalized : normalized.slice(idx + 1);
 }
-function AppTopBar({ application, activeView, onViewChange, onBack, initialChatState, deploy, }) {
-    return (_jsxs("header", { className: cn('bg-background/95 supports-[backdrop-filter]:bg-background/70 sticky top-0 z-20 flex shrink-0 items-center gap-2 border-b px-3 backdrop-blur', TOP_BAR_HEIGHT_CLASS), children: [_jsx(Button, { variant: "ghost", size: "icon", "aria-label": "Back to canvas", onClick: onBack, className: "h-7 w-7", children: _jsx(ArrowLeft, { className: "h-3.5 w-3.5" }) }), _jsx("div", { className: "flex h-6 w-6 shrink-0 items-center justify-center rounded-md bg-gradient-to-br from-indigo-500 to-violet-500", children: _jsx(LayoutGrid, { className: "h-3 w-3 text-white" }) }), _jsx("h1", { className: "min-w-0 truncate text-sm font-semibold", children: application.name }), _jsx(StatusPill, { applicationId: application.id, persistedStatus: application.status, deployReady: deploy.status === DeploymentState.Ready }), _jsx(Divider, {}), _jsx(PathCluster, { repositoryPath: application.repositoryPath }), _jsx("div", { className: "flex-1" }), _jsx(SessionChip, { featureId: `app-${application.id}`, initialChatState: initialChatState }), _jsx(CopyPromptButton, { applicationId: application.id }), _jsx(RunDevButton, { deploy: deploy }), _jsx(ViewSwitcher, { active: activeView, onChange: onViewChange })] }));
+function AppTopBar({ application, activeView, onViewChange, agentRunning, initialChatState, deploy, }) {
+    return (_jsxs("header", { className: cn('bg-background/95 supports-[backdrop-filter]:bg-background/70 sticky top-0 z-20 flex shrink-0 items-center gap-2 border-b px-3 backdrop-blur', TOP_BAR_HEIGHT_CLASS), children: [_jsx("div", { className: "flex h-6 w-6 shrink-0 items-center justify-center rounded-md bg-gradient-to-br from-indigo-500 to-violet-500", children: _jsx(LayoutGrid, { className: "h-3 w-3 text-white" }) }), _jsx("h1", { className: "min-w-0 truncate text-sm font-semibold", children: application.name }), _jsx(StatusPill, { applicationId: application.id, persistedStatus: application.status, deployReady: deploy.status === DeploymentState.Ready }), _jsx(Divider, {}), _jsx(PathCluster, { repositoryPath: application.repositoryPath }), _jsx("div", { className: "flex-1" }), _jsx(SessionChip, { featureId: `app-${application.id}`, initialChatState: initialChatState, persistedSessionId: application.agentSessionId }), _jsx(CopyPromptButton, { applicationId: application.id }), _jsx(DeleteButton, { applicationId: application.id, applicationName: application.name }), _jsx(RunDevButton, { deploy: deploy, disabled: agentRunning }), _jsx(ViewSwitcher, { active: activeView, onChange: onViewChange, disabledTabs: agentRunning ? ['web'] : [] })] }));
 }
 /* ------------------------------------------------------------------ */
 /*  Path cluster — short path + copy + open-in-file-manager            */
@@ -135,12 +111,7 @@ function GitStatusCluster({ repositoryPath }) {
 /* ------------------------------------------------------------------ */
 /*  Session chip — model + short session id, live via shared query     */
 /* ------------------------------------------------------------------ */
-function SessionChip({ featureId, initialChatState, }) {
-    // Reads from the SAME TanStack Query cache entry the chat tab uses.
-    // The `message`/`session_status`/`turn_status` SSE events inside
-    // ChatTab's useChatRuntime mutate this cache directly, so the chip
-    // updates live as the session transitions booting → ready and the
-    // SDK reports back its assigned session id.
+function SessionChip({ featureId, initialChatState, persistedSessionId, }) {
     const { data: chatState } = useQuery({
         queryKey: chatQueryKey(featureId),
         queryFn: () => fetchChatState(featureId),
@@ -150,7 +121,9 @@ function SessionChip({ featureId, initialChatState, }) {
         refetchOnReconnect: false,
     });
     const sessionInfo = chatState?.sessionInfo;
-    const sessionId = sessionInfo?.sessionId ?? null;
+    // Prefer the persisted ID from the Application entity (always available),
+    // fall back to the live session info (only available while session is active).
+    const sessionId = persistedSessionId ?? sessionInfo?.sessionId ?? null;
     const model = sessionInfo?.model ?? null;
     const shortId = sessionId ? sessionId.slice(0, 8) : null;
     const handleCopy = useCallback(async () => {
@@ -201,6 +174,21 @@ function CopyPromptButton({ applicationId }) {
     }, [applicationId, busy]);
     return (_jsx(Button, { variant: "ghost", size: "icon", onClick: handleClick, disabled: busy, className: "text-muted-foreground hover:text-foreground h-7 w-7", "aria-label": "Copy full generated prompt (debug)", title: "Copy full generated prompt (debug) \u2014 system + user message", children: _jsx(ClipboardList, { className: "h-3.5 w-3.5" }) }));
 }
+function DeleteButton({ applicationId, applicationName, }) {
+    const router = useRouter();
+    const [confirmOpen, setConfirmOpen] = useState(false);
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "ghost", size: "icon", onClick: () => setConfirmOpen(true), className: "text-muted-foreground hover:text-destructive h-7 w-7", "aria-label": "Delete application", title: "Delete application", children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) }), _jsx(Dialog, { open: confirmOpen, onOpenChange: setConfirmOpen, children: _jsxs(DialogContent, { className: "max-w-xs", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Delete application?" }), _jsxs(DialogDescription, { children: ["This will permanently remove ", _jsx("strong", { children: applicationName }), "."] })] }), _jsxs(DialogFooter, { className: "grid grid-cols-2 gap-2 sm:flex-none", children: [_jsx(DialogClose, { asChild: true, children: _jsx(Button, { variant: "outline", children: "Cancel" }) }), _jsx(Button, { variant: "destructive", onClick: async () => {
+                                        setConfirmOpen(false);
+                                        const result = await deleteApplication(applicationId);
+                                        if (result.error) {
+                                            toast.error('Failed to delete', { description: result.error });
+                                        }
+                                        else {
+                                            toast.success('Application deleted');
+                                            router.push('/applications');
+                                        }
+                                    }, children: "Delete" })] })] }) })] }));
+}
 function StatusPill({ applicationId, persistedStatus, deployReady, }) {
     // Read live turn status from the global SSE subscription and fold
     // it PLUS the dev-server deploy state onto the persisted status so
@@ -208,18 +196,19 @@ function StatusPill({ applicationId, persistedStatus, deployReady, }) {
     // "Unread" / "Live") instead of being stuck at the coarse DB
     // snapshot which almost always reads "Idle".
     const turnStatus = useTurnStatus(`app-${applicationId}`);
-    const live = deriveLiveStatusPill(persistedStatus, turnStatus, deployReady);
+    const live = deriveAppLiveStatus(persistedStatus, turnStatus, deployReady);
     return (_jsxs("span", { className: "border-border/60 inline-flex h-5 shrink-0 items-center gap-1 rounded-full border px-2 text-[10px] font-medium tracking-wide uppercase", children: [_jsx("span", { className: cn('relative flex h-1.5 w-1.5 items-center justify-center rounded-full', live.dotClass), children: live.pulse ? (_jsx("span", { className: cn('absolute inline-flex h-full w-full animate-ping rounded-full opacity-60', live.dotClass) })) : null }), live.label] }));
 }
 function Divider() {
     return _jsx("span", { className: "bg-border/60 mx-1 h-4 w-px shrink-0" });
 }
-function ViewSwitcher({ active, onChange, }) {
+function ViewSwitcher({ active, onChange, disabledTabs = [], }) {
     return (_jsx("div", { role: "tablist", "aria-label": "Right pane view", className: "bg-muted/60 flex items-center rounded-md p-0.5", children: VIEW_TABS.map((v) => {
             const selected = v === active;
-            return (_jsx("button", { type: "button", role: "tab", "aria-selected": selected, onClick: () => onChange(v), className: cn('h-6 cursor-pointer rounded-sm px-2.5 text-[11px] font-medium transition-colors', selected
+            const disabled = disabledTabs.includes(v);
+            return (_jsx("button", { type: "button", role: "tab", "aria-selected": selected, "aria-disabled": disabled, disabled: disabled, onClick: () => onChange(v), className: cn('h-6 rounded-sm px-2.5 text-[11px] font-medium transition-colors', disabled ? 'text-muted-foreground/40 cursor-not-allowed' : 'cursor-pointer', !disabled && selected
                     ? 'bg-background text-foreground shadow-sm'
-                    : 'text-muted-foreground hover:text-foreground'), children: VIEW_LABELS[v] }, v));
+                    : !disabled && 'text-muted-foreground hover:text-foreground'), children: VIEW_LABELS[v] }, v));
         }) }));
 }
 /* ------------------------------------------------------------------ */
@@ -271,7 +260,6 @@ function ViewBody({ activeView, applicationId, terminalCwd, deploy, }) {
     return (_jsxs("div", { className: "relative flex min-h-0 flex-1", children: [_jsx("div", { className: cn('absolute inset-0 flex min-h-0 flex-col', activeView === 'terminal' ? 'visible' : 'pointer-events-none invisible'), "aria-hidden": activeView !== 'terminal', children: _jsx(TerminalTab, { cwd: terminalCwd }) }), _jsx("div", { className: cn('absolute inset-0 flex min-h-0 flex-col', activeView === 'ide' ? 'visible' : 'pointer-events-none invisible'), "aria-hidden": activeView !== 'ide', children: _jsx(IdeTab, { applicationId: applicationId }) }), hasWebContent ? (_jsx("div", { className: cn('absolute inset-0 flex min-h-0 flex-col', activeView === 'web' ? 'visible' : 'pointer-events-none invisible'), "aria-hidden": activeView !== 'web', children: _jsx(WebPreviewTab, { deploy: deploy }) })) : (activeView === 'web' && _jsx(WebPreviewTab, { deploy: deploy }))] }));
 }
 export function ApplicationPage({ application, initialChatState }) {
-    const router = useRouter();
     const [activeView, setActiveView] = useState('ide');
     // Hoisted dev-server state — subscribes to the shared
     // DeploymentStatusProvider scoped to this application's id. The server
@@ -285,6 +273,39 @@ export function ApplicationPage({ application, initialChatState }) {
         targetType: 'application',
         repositoryPath: application.repositoryPath,
     });
+    // ── Agent-running detection ────────────────────────────────
+    // While the agent is processing, the dev server is likely being
+    // modified — disable preview and auto-restart when done.
+    const turnStatus = useTurnStatus(`app-${application.id}`);
+    const agentRunning = turnStatus === 'processing';
+    const prevAgentRunningRef = useRef(false);
+    // Track whether the dev server was running before the agent started,
+    // so we only restart it (not cold-start) after the agent finishes.
+    const wasRunningBeforeAgentRef = useRef(false);
+    useEffect(() => {
+        const wasRunning = prevAgentRunningRef.current;
+        prevAgentRunningRef.current = agentRunning;
+        if (agentRunning && !wasRunning) {
+            // Agent just started — stop the dev server if running, remember
+            // that it was running so we can restart after.
+            if (deploy.status === DeploymentState.Ready || deploy.status === DeploymentState.Booting) {
+                wasRunningBeforeAgentRef.current = true;
+                void deploy.stop();
+            }
+            // Switch away from web tab while agent works
+            if (activeView === 'web') {
+                setActiveView('ide');
+            }
+        }
+        if (!agentRunning && wasRunning) {
+            // Agent just finished — restart the dev server if it was
+            // previously running.
+            if (wasRunningBeforeAgentRef.current) {
+                wasRunningBeforeAgentRef.current = false;
+                void deploy.deploy();
+            }
+        }
+    }, [agentRunning, deploy, activeView]);
     // When the dev server transitions to Ready, auto-switch the right
     // pane to the Web tab the first time it happens so the user
     // immediately sees their app without an extra click. Only triggers
@@ -299,15 +320,15 @@ export function ApplicationPage({ application, initialChatState }) {
             hasAutoSwitchedRef.current = false;
         }
     }, [deploy.status, deploy.url]);
-    // Back → control center. We navigate AND refresh so the dashboard layout
-    // re-runs `getGraphData()` server-side. Without `router.refresh()` the
-    // App Router serves the cached RSC from when the user was last on `/`,
-    // which does NOT include the application they just created.
-    const handleBack = useCallback(() => {
-        router.push('/');
-        router.refresh();
-    }, [router]);
-    return (_jsxs("div", { className: "bg-background flex h-dvh flex-col", children: [_jsx(AppTopBar, { application: application, activeView: activeView, onViewChange: setActiveView, onBack: handleBack, initialChatState: initialChatState, deploy: deploy }), _jsx(ResizableSplit, { left: _jsx(ChatTab, { featureId: `app-${application.id}`, worktreePath: application.repositoryPath, initialAgent: application.agentType, initialModel: application.modelOverride, initialChatState: initialChatState, hideHeader: true, workflowPlaceholder: APPLICATION_CREATION_PLACEHOLDER_STEPS, onAllStepsComplete: () => {
+    // Prevent switching to web tab while agent is running
+    const handleViewChange = useCallback((view) => {
+        if (view === 'web' && agentRunning)
+            return;
+        setActiveView(view);
+    }, [agentRunning]);
+    return (_jsxs("div", { className: "bg-background flex h-dvh flex-col", children: [_jsx(AppTopBar, { application: application, activeView: activeView, onViewChange: handleViewChange, agentRunning: agentRunning, initialChatState: initialChatState, deploy: deploy }), _jsx(ResizableSplit, { left: _jsx(ChatTab, { featureId: `app-${application.id}`, worktreePath: application.repositoryPath, initialAgent: application.agentType, initialModel: application.modelOverride, initialChatState: initialChatState, hideHeader: true, workflowPlaceholder: APPLICATION_CREATION_PLACEHOLDER_STEPS, onResumeWorkflow: () => {
+                        void fetch(`/api/applications/${application.id}/resume`, { method: 'POST' });
+                    }, onAllStepsComplete: () => {
                         // Kick off the dev server as soon as the agent has
                         // finished the scaffold workflow. The Idle→Ready
                         // transition in the deploy hook then auto-switches

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

@@ -1 +1 @@
-{"version":3,"file":"application-page.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/application-page/application-page.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAgBrD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,eAAe,CAOtC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAWpB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAWxB,CAAC"}
+{"version":3,"file":"application-page.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/application-page/application-page.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAiBrD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,eAAe,CAOtC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAWpB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAWxB,CAAC"}

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

@@ -8,6 +8,7 @@ const baseApp = {
     repositoryPath: '/home/user/projects/my-todo-app',
     additionalPaths: [],
     status: ApplicationStatus.Idle,
+    setupComplete: false,
     createdAt: new Date().toISOString(),
     updatedAt: new Date().toISOString(),
 };

package/dist/src/presentation/web/components/features/application-page/run-dev-button.d.ts

@@ -2,6 +2,8 @@ import type { DeployActionState } from '../../../hooks/use-deploy-action.js';
 export interface RunDevButtonProps {
     deploy: DeployActionState;
     className?: string;
+    /** When true the button is grayed out and non-interactive (e.g. agent is running). */
+    disabled?: boolean;
     /**
      * Visual density of the Ready state.
      *
@@ -15,5 +17,5 @@ export interface RunDevButtonProps {
      */
     variant?: 'full' | 'compact';
 }
-export declare function RunDevButton({ deploy, className, variant }: RunDevButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function RunDevButton({ deploy, className, disabled, variant }: RunDevButtonProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=run-dev-button.d.ts.map

package/dist/src/presentation/web/components/features/application-page/run-dev-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"run-dev-button.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/application-page/run-dev-button.tsx"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAEnE,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,iBAAiB,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC9B;AAED,wBAAgB,YAAY,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,OAAgB,EAAE,EAAE,iBAAiB,2CAuJtF"}
+{"version":3,"file":"run-dev-button.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/application-page/run-dev-button.tsx"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAEnE,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,iBAAiB,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sFAAsF;IACtF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC9B;AAED,wBAAgB,YAAY,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAgB,EAAE,EAAE,iBAAiB,2CA+JhG"}

package/dist/src/presentation/web/components/features/application-page/run-dev-button.js

@@ -33,7 +33,7 @@ import { useCallback } from 'react';
 import { Play, Square, Loader2, TriangleAlert, ExternalLink } from 'lucide-react';
 import { DeploymentState } from '../../../../../../packages/core/src/domain/generated/output.js';
 import { cn } from '../../../lib/utils.js';
-export function RunDevButton({ deploy, className, variant = 'full' }) {
+export function RunDevButton({ deploy, className, disabled, variant = 'full' }) {
     const openUrl = useCallback(() => {
         if (deploy.url)
             window.open(deploy.url, '_blank', 'noopener,noreferrer');
@@ -76,5 +76,9 @@ export function RunDevButton({ deploy, className, variant = 'full' }) {
     // ────────────────────────────────────────────────────────────
     // Idle — default "Preview" button (Shep AI purple)
     // ────────────────────────────────────────────────────────────
-    return (_jsxs("button", { type: "button", onClick: deploy.deploy, className: cn('inline-flex h-7 shrink-0 items-center gap-1.5 rounded-md border border-violet-500/50 bg-gradient-to-br from-indigo-500/15 to-violet-500/20 px-2.5 text-[11px] font-medium text-violet-700 transition-colors hover:from-indigo-500/25 hover:to-violet-500/30 dark:text-violet-300', className), title: "Install dependencies and preview the app", "aria-label": "Preview app", children: [_jsx(Play, { className: "h-3 w-3 fill-current" }), _jsx("span", { children: "Preview" })] }));
+    return (_jsxs("button", { type: "button", onClick: deploy.deploy, disabled: disabled, className: cn('inline-flex h-7 shrink-0 items-center gap-1.5 rounded-md border px-2.5 text-[11px] font-medium transition-colors', disabled
+            ? 'border-border bg-muted text-muted-foreground/40 cursor-not-allowed'
+            : 'border-violet-500/50 bg-gradient-to-br from-indigo-500/15 to-violet-500/20 text-violet-700 hover:from-indigo-500/25 hover:to-violet-500/30 dark:text-violet-300', className), title: disabled
+            ? 'Preview disabled while agent is running'
+            : 'Install dependencies and preview the app', "aria-label": "Preview app", children: [_jsx(Play, { className: "h-3 w-3 fill-current" }), _jsx("span", { children: "Preview" })] }));
 }

package/dist/src/presentation/web/components/features/applications/application-card.d.ts

@@ -0,0 +1,7 @@
+import type { ApplicationWithStatus } from '../../../../../../packages/core/src/application/use-cases/applications/list-applications.use-case.js';
+export interface ApplicationCardProps {
+    application: ApplicationWithStatus;
+    className?: string;
+}
+export declare function ApplicationCard({ application, className }: ApplicationCardProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=application-card.d.ts.map

package/dist/src/presentation/web/components/features/applications/application-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"application-card.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/applications/application-card.tsx"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,4EAA4E,CAAC;AAExH,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,qBAAqB,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID,wBAAgB,eAAe,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,oBAAoB,2CA0O/E"}