fix(webapp,agent): contextual cmd+J, bare progress lines, error links land

- cmd+J is contextual: closed opens the panel, open starts a new chat;
  closing is Esc or the header's x — the New chat tooltip now shows cmd+J
  (displayed once, registered once)
- in-flight tool work renders as a bare spinner line, not a bordered pill —
  chips are for artifacts that stay, progress is transient
- error evidence and navigate targets normalize the API's friendly id to
  the raw fingerprint, so View similar failures opens the error page
  instead of 'Error not found'

Author: kathiekiwi

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

@@ -51,6 +51,9 @@ export function DashboardAgent({
   }, []);
   // A request from `openWith`, handed to the panel. `seq` makes repeat requests
   // with the same text distinct, so the panel can tell them apart.
+  // Bumped by contextual ⌘J while the panel is open; the panel starts a new
+  // chat when it changes.
+  const [newChatSeq, setNewChatSeq] = useState(0);
   const [requestedMessage, setRequestedMessage] = useState<
     { text: string; seq: number } | undefined
   >(undefined);
@@ -71,12 +74,18 @@ export function DashboardAgent({
     setRequestedMessage((current) => ({ text: trimmed, seq: (current?.seq ?? 0) + 1 }));
   }, []);
 
-  // ⌘J toggles the panel. Opening mounts the composer, which focuses itself, so
-  // the shortcut lands you in the text field. Enabled inside inputs too, so the
-  // same keystroke closes the panel while you're typing in it.
+  // ⌘J is contextual: closed → open the panel (the composer focuses itself, so
+  // the keystroke lands you in the text field); open → start a new chat.
+  // Closing is Esc or the header's ×, never ⌘J.
   useShortcutKeys({
     shortcut: TOGGLE_PANEL_SHORTCUT,
-    action: () => setPanelOpen(!open),
+    action: () => {
+      if (!open) {
+        setPanelOpen(true);
+      } else {
+        setNewChatSeq((seq) => seq + 1);
+      }
+    },
     disabled: !hasAccess,
     enabledOnInputElements: true,
   });
@@ -121,6 +130,7 @@ export function DashboardAgent({
                 <DashboardAgentPanel
                   onClose={() => setPanelOpen(false)}
                   requestedMessage={requestedMessage}
+                  newChatSeq={newChatSeq}
                   promotedPrompt={promotedPrompt}
                   isFullscreen={fullscreen}
                   onToggleFullscreen={toggleFullscreen}

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

@@ -8,12 +8,14 @@ import { ShortcutKey } from "~/components/primitives/ShortcutKey";
 import type { Shortcut } from "~/hooks/useShortcutKeys";
 import { DashboardAgentHistoryMenu, type DashboardAgentChat } from "./DashboardAgentHistory";
 
-/** New chat. Sits next to the panel's own ⌘J so the pair is easy to remember. */
+/**
+ * New chat — the same ⌘J that opens the panel: contextual, registered ONCE in
+ * `DashboardAgent` (closed → open, open → new chat). This constant is display
+ * only; nothing else may register it or the keystroke would fire twice.
+ */
 export const NEW_CHAT_SHORTCUT: Shortcut = {
-  modifiers: ["mod", "shift"],
+  modifiers: ["mod"],
   key: "j",
-  // The composer holds focus while the panel is open, so a shortcut that only
-  // fires outside inputs would never fire at all.
   enabledOnInputElements: true,
 };
 
@@ -104,8 +106,12 @@ export function DashboardAgentHeader({
             variant="minimal/small"
             className="aspect-square h-6 p-1"
             aria-label="New chat"
-            tooltip="New chat"
-            shortcut={NEW_CHAT_SHORTCUT}
+            tooltip={
+              <span className="flex items-center">
+                New chat
+                <ShortcutKey shortcut={NEW_CHAT_SHORTCUT} variant="medium" />
+              </span>
+            }
             onClick={onNewChat}
             LeadingIcon={<PlusIcon className="size-4 text-text-dimmed" />}
           />

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

@@ -81,6 +81,7 @@ type ActiveChat = {
 export function DashboardAgentPanel({
   onClose,
   requestedMessage,
+  newChatSeq,
   promotedPrompt,
   isFullscreen = false,
   onToggleFullscreen,
@@ -93,6 +94,9 @@ export function DashboardAgentPanel({
   // Text handed to the panel from outside (`openWith`). `seq` distinguishes
   // repeat requests with the same text.
   requestedMessage?: { text: string; seq: number };
+  // Bumped by the contextual ⌘J while the panel is open — each change starts a
+  // new chat.
+  newChatSeq?: number;
   // The product-controlled promoted prompt chip, from the feature flag.
   promotedPrompt?: SuggestedPrompt;
 }) {
@@ -355,6 +359,15 @@ export function DashboardAgentPanel({
     [openChat]
   );
 
+  // Contextual ⌘J: each bump while the panel is open starts a new chat. A ref
+  // skips the mount-time value so opening the panel never resets a restored chat.
+  const seenNewChatSeq = useRef(newChatSeq ?? 0);
+  useEffect(() => {
+    if (newChatSeq === undefined || newChatSeq === seenNewChatSeq.current) return;
+    seenNewChatSeq.current = newChatSeq;
+    newChat();
+  }, [newChatSeq, newChat]);
+
   const deleteChat = useCallback(
     async (id: string) => {
       const body = new FormData();

apps/webapp/app/components/dashboard-agent/chat-layout.tsx

@@ -22,7 +22,7 @@
  *                         card (diagnosis, investigation, report, chart), a
  *                         callout, a chip row
  *   - `ChatProgress`    — a spinner and one line of progress
- *   - `ChatPendingTool` — a tool call still in flight, as a compact pill
+ *   - `ChatPendingTool` — a tool call still in flight: a bare spinner line
  *   - `ChatToolRow`     — a tool-call row, optionally with progress under it
  *   - `ChatNote`        — an inline system / interceptor note
  *   - `ChatStatusLine`  — an icon and one line of status
@@ -221,7 +221,7 @@ export function ChatProgress({ children }: { children: React.ReactNode }) {
 }
 
 /**
- * A tool call still in flight, as a compact pill: a spinner and one short phrase
+ * A tool call still in flight: a spinner and one short phrase
  * saying what the agent is doing.
  *
  * It replaces the tool row for the whole in-flight phase, so the transcript never
@@ -232,17 +232,12 @@ export function ChatProgress({ children }: { children: React.ReactNode }) {
  */
 export function ChatPendingTool({ label }: { label: string }) {
   const insetClass = useInsetClass();
+  // A bare progress line, not a pill: bordered chips read as artifacts that
+  // stay, while in-flight work is transient — the same register as ChatProgress.
   return (
-    <div className={cn(insetClass, "flex min-w-0")}>
-      <span
-        className={cn(
-          "inline-flex h-6 min-w-0 items-center rounded-full border border-border-bright bg-background-bright px-2.5 text-xs text-text-dimmed",
-          CHIP_GAP
-        )}
-      >
-        <Spinner className="size-3 shrink-0" />
-        <span className="truncate">{label}</span>
-      </span>
+    <div className={cn(insetClass, "flex min-w-0 items-center text-xs text-text-dimmed", CHIP_GAP)}>
+      <Spinner className="size-3 shrink-0" />
+      <span className="truncate">{label}</span>
     </div>
   );
 }

internal-packages/dashboard-agent/src/dashboard-agent.test.ts

@@ -628,7 +628,7 @@ describe("buildDashboardAgentTools", () => {
     await expect(
       callTool("navigate_to", { destination: { kind: "error", fingerprint: "error_1" } })
     ).resolves.toEqual({
-      intent: { kind: "navigate", target: "trigger://proj_abc/env_abc/error/error_1" },
+      intent: { kind: "navigate", target: "trigger://proj_abc/env_abc/error/1" },
     });
 
     // A queue name's `/` is percent-encoded, so a task queue round-trips.
@@ -809,9 +809,9 @@ describe("buildDashboardAgentTools", () => {
     expect(output.error).toBeUndefined();
     const investigation = output.blocks[0].investigation;
     expect(investigation.hypotheses[0].evidence.map((e: { uri: string }) => e.uri)).toEqual([
-      "trigger://proj_abc/env_abc/error/error_c4b4a797397a9c43",
+      "trigger://proj_abc/env_abc/error/c4b4a797397a9c43",
       "trigger://proj_abc/env_abc/deployment/20260726.4",
-      "trigger://proj_abc/env_abc/error/error_c4b4a797397a9c43",
+      "trigger://proj_abc/env_abc/error/c4b4a797397a9c43",
     ]);
     expect(investigation.evidence.map((e: { uri: string }) => e.uri)).toEqual([
       "trigger://proj_abc/env_abc/run/run_abc123",
@@ -987,7 +987,7 @@ describe("buildDashboardAgentTools", () => {
     // The follow-up that navigates points at the canonical error URI.
     expect(actions[1].intent).toEqual({
       kind: "navigate",
-      target: "trigger://proj_abc/env_abc/error/error_c4b4a797397a9c43",
+      target: "trigger://proj_abc/env_abc/error/c4b4a797397a9c43",
     });
   });
 

internal-packages/dashboard-agent/src/tools.ts

@@ -783,7 +783,10 @@ export function buildDashboardAgentTools(ctx: DashboardAgentToolContext): ToolSe
           parsed = { ...base, kind: "run", runId: ref };
           break;
         case "error":
-          parsed = { ...base, kind: "error", fingerprint: ref };
+          // The errors API returns friendly ids ("error_<fingerprint>") but the
+          // canonical URI — and the dashboard error page it resolves to — key on
+          // the raw fingerprint. Same normalization the watch checks apply.
+          parsed = { ...base, kind: "error", fingerprint: ref.replace(/^error_/, "") };
           break;
         case "queue":
           parsed = { ...base, kind: "queue", name: ref };
@@ -1440,7 +1443,12 @@ export function buildDashboardAgentTools(ctx: DashboardAgentToolContext): ToolSe
             parsed = { kind: "run", ...scope, runId: destination.runId };
             break;
           case "error":
-            parsed = { kind: "error", ...scope, fingerprint: destination.fingerprint };
+            // Accept the API's friendly id ("error_<fp>") — the page keys on the raw one.
+            parsed = {
+              kind: "error",
+              ...scope,
+              fingerprint: destination.fingerprint.replace(/^error_/, ""),
+            };
             break;
           case "queue":
             parsed = { kind: "queue", ...scope, name: destination.name };