Merge branch 'feat/dashboard-agent-flows-watch' into feat/agent-storybook-gallery

Author: kathiekiwi

apps/webapp/app/components/dashboard-agent/DashboardAgentChat.tsx

@@ -24,8 +24,8 @@ import type { AgentPageContext } from "./page-context-types";
 import { retryAction } from "./retry-action";
 import {
   fetchChatTranscript,
-  hasOpenInvestigation,
   pollSettledTranscript,
+  transcriptLooksUnfinished,
 } from "./settled-transcript";
 import { takeNavigateIntent } from "./turn-navigation";
 import { sendRequestOutcome } from "./send-request";
@@ -373,8 +373,9 @@ export function DashboardAgentChat({
 
     onTurnSettled();
     // The terminal card is written to the chat row after the stream closes, so this
-    // mounted panel would otherwise keep showing the last `in_progress` revision.
-    if (!hasOpenInvestigation(messagesRef.current)) return;
+    // mounted panel would otherwise keep showing the last `in_progress` revision — or,
+    // if the stream died mid-tool, the tool call it never got an output for.
+    if (!transcriptLooksUnfinished(messagesRef.current)) return;
     void pollSettledTranscript<UIMessage>({
       fetchTranscript: () => fetchChatTranscript(actionPath, chatId),
       apply: (merge) => setMessages((current) => merge(current)),

apps/webapp/app/components/dashboard-agent/DashboardAgentPanel.tsx

@@ -513,6 +513,16 @@ export function DashboardAgentPanel({
       try {
         const res = await fetch(actionPath, { method: "POST", body });
         if (!res.ok) throw new Error(`Watch cancel failed (${res.status})`);
+        // Empty when the watch had already resolved: then nothing was written.
+        const data = (await res.json()) as { messages?: UIMessage[] };
+        if (data.messages?.length) {
+          const messages = data.messages;
+          setAppendedMessages((current) => ({
+            chatId,
+            messages,
+            seq: (current?.seq ?? 0) + 1,
+          }));
+        }
       } catch (error) {
         console.error("Dashboard agent: failed to cancel watch", error);
         toast.error("We couldn't stop that watch. Try again in a moment.");

apps/webapp/app/components/dashboard-agent/report-sparkline.tsx

@@ -464,10 +464,10 @@ export function ReportProvenance({ uri }: { uri: string }) {
 // --- sparkline --------------------------------------------------------------
 
 /** The fixed sparkline column. Keeps every sparkline aligned. */
-const SPARK_WIDTH_CLASS = "w-[6.5rem]";
+const SPARK_WIDTH_CLASS = "w-[5.5rem]";
 
 /** The chart's own width; the trailing peak label uses the column's remainder. */
-const SPARK_WIDTH = 72;
+const SPARK_WIDTH = 56;
 
 type ReportSparkDatum = { count: number; date: Date | null; hot: boolean };
 
@@ -570,18 +570,18 @@ export function ReportSparkline({
  * chart start on the same vertical whatever the value's width.
  */
 /**
- * Below a 22rem container the fixed tracks no longer fit beside the value, so the
+ * Below a 19rem container the fixed tracks no longer fit beside the value, so the
  * sparkline drops to its own line. The columns never change, so the value, delta
  * and note stay on the same verticals at every panel width.
  */
 const METRIC_ROW_CLASS =
-  "grid grid-cols-[7rem_minmax(0,1fr)_2.75rem_6.5rem] items-center gap-x-2 @max-[22rem]:grid-cols-[7rem_minmax(0,1fr)_2.75rem] @max-[22rem]:gap-y-1.5";
+  "grid grid-cols-[6rem_minmax(0,1fr)_2.75rem_5.5rem] items-center gap-x-2 @max-[19rem]:grid-cols-[6rem_minmax(0,1fr)_2.75rem] @max-[19rem]:gap-y-1.5";
 
 /** The sparkline cell: its own full-width line once the row goes narrow. */
-const SPARK_CELL_CLASS = "@max-[22rem]:col-span-3 @max-[22rem]:justify-self-end";
+const SPARK_CELL_CLASS = "@max-[19rem]:col-span-3 @max-[19rem]:justify-self-end";
 
-// Labels are never truncated: the column is sized for the longest one and
-// anything longer wraps.
+// Labels are never truncated: the column fits the common ones and anything
+// longer wraps.
 const LABEL_CLASS = "text-xs uppercase leading-tight tracking-wide text-text-dimmed";
 
 /** A metric's movement against its baseline. Direction is always an arrow. */
@@ -674,7 +674,7 @@ export function ReportMetricRow({
         ) : (
           // Keeps the column occupied so a series-less metric doesn't pull the
           // rows out of alignment.
-          <span aria-hidden className="@max-[22rem]:hidden" />
+          <span aria-hidden className="@max-[19rem]:hidden" />
         )}
       </li>
 
@@ -683,7 +683,7 @@ export function ReportMetricRow({
         // vertical as every other row's value.
         <li key={sub.label} className={METRIC_ROW_CLASS}>
           {/* Indented under the parent label, shallow enough to stay inside the
-              7rem label column. */}
+              6rem label column. */}
           <span className={cn(LABEL_CLASS, "pl-6")}>{sub.label}</span>
           <span className="whitespace-nowrap text-sm tabular-nums text-text-dimmed">
             {sub.value}

apps/webapp/app/components/dashboard-agent/settled-transcript.test.ts

@@ -6,6 +6,7 @@ import {
   hasOpenInvestigation,
   mergeSettledMessages,
   pollSettledTranscript,
+  transcriptLooksUnfinished,
 } from "./settled-transcript";
 
 /**
@@ -119,6 +120,27 @@ describe("reading the transcript endpoint", () => {
   });
 });
 
+describe("deciding whether a settled turn is worth re-reading", () => {
+  // The stream EOF'd while `get_report` was running: the part never gets an output.
+  const DANGLING_TOOL = {
+    id: "msg_dangling",
+    role: "assistant",
+    parts: [{ type: "tool-get_report", toolCallId: "call_1", state: "input-available" }],
+  };
+
+  it("re-reads when the stream died mid-tool, not only when a card is open", () => {
+    expect(transcriptLooksUnfinished([DANGLING_TOOL])).toBe(true);
+  });
+
+  it("re-reads while a card is still open", () => {
+    expect(transcriptLooksUnfinished([OPEN])).toBe(true);
+  });
+
+  it("leaves a fully settled transcript alone", () => {
+    expect(transcriptLooksUnfinished([OPEN, SETTLED])).toBe(false);
+  });
+});
+
 describe("an already-open panel when a turn is exhausted", () => {
   it("stops showing Working… without a reload or a reopen", async () => {
     // What the mounted panel holds when the stream closes: the card the model opened

apps/webapp/app/components/dashboard-agent/settled-transcript.ts

@@ -1,4 +1,4 @@
-import { liveInvestigation } from "./progress-line";
+import { inFlightToolName, liveInvestigation } from "./progress-line";
 
 /**
  * Re-reading the stored transcript once a turn settles.
@@ -29,6 +29,15 @@ export function hasOpenInvestigation(messages: ReadonlyArray<unknown>): boolean
   return liveInvestigation(messages as never) !== null;
 }
 
+/**
+ * Whether the transcript still reads as mid-turn. A stream that dies without
+ * `turn-complete` leaves the tool part it was on dangling forever, so an open card is
+ * not the only shape a re-read has to recover from.
+ */
+export function transcriptLooksUnfinished(messages: ReadonlyArray<unknown>): boolean {
+  return hasOpenInvestigation(messages) || inFlightToolName(messages as never) !== null;
+}
+
 /**
  * The settlement is written in `onTurnComplete`, which runs AFTER the client's stream
  * closes, so the first re-read can legitimately land before it. Retry a few times,

apps/webapp/app/routes/resources.orgs.$organizationSlug.projects.$projectParam.env.$envParam.dashboard-agent.ts

@@ -1,6 +1,5 @@
 import { json, type ActionFunctionArgs, type LoaderFunctionArgs } from "@remix-run/server-runtime";
 import {
-  cancelWatch,
   chatExists,
   countUnreadWatchWakes,
   countChatsWithUnreadWork,
@@ -36,6 +35,7 @@ import { findProjectBySlug } from "~/models/project.server";
 import { findEnvironmentBySlug } from "~/models/runtimeEnvironment.server";
 import {
   authorizeWatchEnvironmentById,
+  cancelDashboardAgentWatch,
   deleteChatWithWatches,
   listActiveWatchesForChats,
   submitDashboardAgentWatch,
@@ -670,10 +670,14 @@ export const action = async ({ request, params }: ActionFunctionArgs) => {
         return json({ error: "Chat not found" }, { status: 404 });
       }
 
-      // `cancelWatch` only touches an active row, so an already-resolved watch keeps
-      // its outcome and this is a no-op.
-      await cancelWatch(dashboardAgentDb, { id: watchId, reason: "user" });
-      return json({ ok: true });
+      // Only an active row is cancelled, so an already-resolved watch keeps its outcome,
+      // this is a no-op and no note is written.
+      const { messages } = await cancelDashboardAgentWatch({
+        watchId,
+        userId,
+        organizationId: project.organizationId,
+      });
+      return json({ ok: true, messages });
     }
   }
 };

apps/webapp/app/services/dashboardAgentWatches.server.ts

@@ -30,8 +30,10 @@ import {
 } from "@internal/dashboard-agent-db";
 import {
   VIEW_BLOCK_VERSION,
+  WATCH_CANCELLED_MESSAGE_ID_PREFIX,
   WATCH_CONFIRMATION_MESSAGE_ID_PREFIX,
   WATCH_REQUEST_MESSAGE_ID_PREFIX,
+  watchCancelledSentence,
   watchConfirmationBlockBody,
   watchDraftSchema,
   watchIdentity,
@@ -1123,6 +1125,37 @@ export async function scheduleWatchDelivery(watch: { id: string; expiresAt: Date
   );
 }
 
+/**
+ * Stop a watch the user asked to stop, and say so in the chat that owns it.
+ *
+ * Only this reason leaves a line: the other cancellations either take the chat with them or
+ * already state themselves. `cancelWatch` is guarded on `active`, so a second cancel — or a
+ * watch that resolved first — writes nothing, and the id keyed off the watch keeps a retry
+ * from adding a second line. Deterministic: no wake, no delivery, no model.
+ */
+export async function cancelDashboardAgentWatch(params: {
+  watchId: string;
+  userId: string;
+  organizationId: string;
+}): Promise<{ cancelled: boolean; messages: WatchTranscriptMessage[] }> {
+  const cancelled = await cancelWatch(dashboardAgentDb, { id: params.watchId, reason: "user" });
+  if (!cancelled) return { cancelled: false, messages: [] };
+
+  const message: WatchTranscriptMessage = {
+    id: `${WATCH_CANCELLED_MESSAGE_ID_PREFIX}${cancelled.id}`,
+    role: "assistant",
+    parts: [{ type: "text", text: watchCancelledSentence(cancelled.spec) }],
+  };
+  await appendChatMessageOnce(dashboardAgentDb, {
+    chatId: cancelled.chatId,
+    userId: params.userId,
+    organizationId: params.organizationId,
+    message,
+  });
+
+  return { cancelled: true, messages: [message] };
+}
+
 /**
  * Delete a chat and end its watches in one transaction, so no live watch is left on an
  * invisible chat. Owner-scoped, so a chatId the caller doesn't own deletes nothing.

apps/webapp/test/dashboardAgentWatches.test.ts

@@ -93,6 +93,7 @@ process.env.ALERT_EMAIL_TRANSPORT = "smtp";
 const {
   armDashboardAgentWatchBatch,
   authorizeWatchEnvironment,
+  cancelDashboardAgentWatch,
   createDashboardAgentWatch,
   deleteChatWithWatches,
   listActiveWatchesForChats,
@@ -784,6 +785,68 @@ describe("the chat cascade and the list view", () => {
     }
   );
 
+  postgresTest(
+    "a user's own cancel leaves one neutral line in the chat, and only one",
+    async ({ prisma, postgresContainer }) => {
+      await boot(prisma, postgresContainer.getConnectionUri());
+      const seeded = await seed(prisma, "usercancel");
+      await seedChat(seeded, "chat_1");
+
+      const created = await create({ seeded, chatId: "chat_1" });
+      expect(created.ok).toBe(true);
+      if (!created.ok) return;
+
+      const cancel = () =>
+        cancelDashboardAgentWatch({
+          watchId: created.watchId,
+          userId: seeded.user.id,
+          organizationId: seeded.organization.id,
+        });
+
+      expect(await cancel()).toMatchObject({
+        cancelled: true,
+        messages: [
+          {
+            id: `watch-cancelled:${created.watchId}`,
+            role: "assistant",
+            parts: [{ type: "text", text: "Stopped watching run run_1." }],
+          },
+        ],
+      });
+      expect(await getWatch(ctx.agentDb, { id: created.watchId })).toMatchObject({
+        status: "cancelled",
+        cancelReason: "user",
+        deliveryStatus: "not_required",
+      });
+      expect(await storedMessages(seeded, "chat_1")).toMatchObject([
+        { id: `watch-cancelled:${created.watchId}`, role: "assistant" },
+      ]);
+
+      // The row is no longer active, so the second cancel writes nothing at all.
+      expect(await cancel()).toEqual({ cancelled: false, messages: [] });
+      expect(await storedMessages(seeded, "chat_1")).toHaveLength(1);
+    }
+  );
+
+  postgresTest(
+    "a chat delete cancels its watches without a line in the chat",
+    async ({ prisma, postgresContainer }) => {
+      await boot(prisma, postgresContainer.getConnectionUri());
+      const seeded = await seed(prisma, "silentcancel");
+      await seedChat(seeded, "chat_1");
+
+      const created = await create({ seeded, chatId: "chat_1" });
+      expect(created.ok).toBe(true);
+
+      await deleteChatWithWatches({ chatId: "chat_1", userId: seeded.user.id });
+
+      const rows = await ctx.prisma.$queryRawUnsafe<{ message_id: string }[]>(
+        `select message_id from trigger_dashboard_agent.chat_messages where chat_id = 'chat_1'`
+      );
+      expect(rows).toEqual([]);
+    }
+  );
+
   postgresTest(
     "aggregates active watches per chat in one query",
     async ({ prisma, postgresContainer }) => {

internal-packages/dashboard-agent-contracts/src/watch-wording.ts

@@ -506,6 +506,14 @@ export function watchConditionLabel(spec: WatchSpec): string {
   return watchConditionWording(spec).label;
 }
 
+/**
+ * The line a user's own cancel leaves in the transcript. States that the watch
+ * stopped and nothing about what it saw — it is not a wake.
+ */
+export function watchCancelledSentence(spec: WatchSpec): string {
+  return `Stopped watching ${watchSubjectLabel(spec)}.`;
+}
+
 /** The Watch button's tooltip. */
 export function watchTooltipLabel(spec: WatchSpec): string {
   return watchConditionWording(spec).tooltip;

internal-packages/dashboard-agent-contracts/src/watch.ts

@@ -136,6 +136,9 @@ export const WATCH_REQUEST_MESSAGE_ID_PREFIX = "watch-request:";
 /** The transcript id of the confirmation that a watch is running, keyed by the watch. */
 export const WATCH_CONFIRMATION_MESSAGE_ID_PREFIX = "watch-confirmation:";
 
+/** The transcript id of the note that the user stopped a watch, keyed by the watch. */
+export const WATCH_CANCELLED_MESSAGE_ID_PREFIX = "watch-cancelled:";
+
 /**
  * A deterministic consent record, not a turn the user spent, so it never counts
  * against the message cap and the retry button never resends it.