@sentry/junior-dashboard 0.276.0 → 0.278.0

package/src/client/conversations/conversationSections.ts

@@ -7,18 +7,22 @@ export type ConversationSection = {
 };
 
 const DAY_MS = 24 * 60 * 60 * 1000;
-// Sorts before every time section.
+// Pinned sorts first, then Needs attention, then every time section.
+const PINNED_SECTION = { key: "pinned", label: "Pinned", order: -2 };
 const ATTENTION_SECTION = {
   key: "attention",
   label: "Needs attention",
-  order: Number.NEGATIVE_INFINITY,
+  order: -1,
 };
 
 /**
- * Group conversations into Needs attention, then by last activity: Today,
- * Yesterday, Previous 7 days, Previous 30 days, then one section per month.
+ * Group conversations into Pinned, then Needs attention, then by last
+ * activity: Today, Yesterday, Previous 7 days, Previous 30 days, then one
+ * section per month.
  *
- * Conversations in `attentionIds` go to Needs attention, newest first.
+ * A pinned conversation shows only in Pinned, even when it needs attention.
+ * Conversations in `attentionIds` go to Needs attention. Each section lists
+ * the newest first.
  */
 export function buildConversationSections(
   conversations: Conversation[],
@@ -35,14 +39,16 @@ export function buildConversationSections(
   );
 
   for (const conversation of sorted) {
-    const section = options.attentionIds?.has(conversation.id)
-      ? ATTENTION_SECTION
-      : conversationSection(
-          activityTime(conversation),
-          nowDay,
-          options.nowMs,
-          options.timeZone,
-        );
+    const section = conversation.pinnedAt
+      ? PINNED_SECTION
+      : options.attentionIds?.has(conversation.id)
+        ? ATTENTION_SECTION
+        : conversationSection(
+            activityTime(conversation),
+            nowDay,
+            options.nowMs,
+            options.timeZone,
+          );
     const existing = sections.get(section.key);
     if (existing) {
       existing.conversations.push(conversation);
@@ -65,16 +71,16 @@ export function attentionConversationIds(
 }
 
 /**
- * Sort attention conversations to the front. The sort is stable, so each group
- * keeps the feed order. Paginated lists call this before paging, so page 1
- * holds every attention conversation.
+ * Sort pinned, then attention conversations to the front. The sort is stable,
+ * so each group keeps the feed order. Paginated lists call this before paging,
+ * so page 1 holds every pinned and attention conversation.
  */
-export function attentionFirst(
+export function pinnedAndAttentionFirst(
   conversations: Conversation[],
   attentionIds: ReadonlySet<string>,
 ): Conversation[] {
   const rank = (conversation: Conversation) =>
-    attentionIds.has(conversation.id) ? 0 : 1;
+    conversation.pinnedAt ? 0 : attentionIds.has(conversation.id) ? 1 : 2;
   return [...conversations].sort((left, right) => rank(left) - rank(right));
 }
 

package/src/client/conversations/conversationSidebarLayout.ts

@@ -0,0 +1,61 @@
+import { useState, useSyncExternalStore } from "react";
+
+const OPEN_KEY = "junior:conversation:sidebar-open";
+const WIDTH_KEY = "junior:conversation:sidebar-width";
+const WIDE_QUERY = "(min-width: 768px)";
+
+/** Pixel limits for the conversation list beside a selected conversation. */
+export const SIDEBAR_WIDTH = { default: 320, max: 480, min: 240 } as const;
+
+/** Remember whether the conversation list is open in this browser. */
+export function useConversationSidebarOpen() {
+  const [open, setOpen] = useState(() => readStorage(OPEN_KEY) !== "false");
+
+  function updateOpen(next: boolean) {
+    setOpen(next);
+    writeStorage(OPEN_KEY, String(next));
+  }
+
+  return [open, updateOpen] as const;
+}
+
+/** Read the conversation list width saved in this browser. */
+export function readSidebarWidth(): number {
+  const saved = Number(readStorage(WIDTH_KEY));
+  if (!Number.isFinite(saved) || saved <= 0) return SIDEBAR_WIDTH.default;
+  return Math.min(SIDEBAR_WIDTH.max, Math.max(SIDEBAR_WIDTH.min, saved));
+}
+
+/** Save the conversation list width without a React render per drag step. */
+export function saveSidebarWidth(width: number) {
+  writeStorage(WIDTH_KEY, String(Math.round(width)));
+}
+
+/** Report whether the viewport has room for the list beside the transcript. */
+export function useSidebarFits(): boolean {
+  return useSyncExternalStore(
+    (onChange) => {
+      const media = window.matchMedia(WIDE_QUERY);
+      media.addEventListener("change", onChange);
+      return () => media.removeEventListener("change", onChange);
+    },
+    () => window.matchMedia(WIDE_QUERY).matches,
+    () => false,
+  );
+}
+
+function readStorage(key: string): string | null {
+  try {
+    return window.localStorage.getItem(key);
+  } catch {
+    return null;
+  }
+}
+
+function writeStorage(key: string, value: string) {
+  try {
+    window.localStorage.setItem(key, value);
+  } catch {
+    // The layout still works for this page when browser storage is unavailable.
+  }
+}

package/src/client/conversations/eventLog.ts

@@ -10,31 +10,12 @@ import {
   summarizeCost,
 } from "../format";
 
-/** Read recorded event configuration, including reports from before model context was added. */
-export function eventLogModel(
-  event: ConversationReportEvent,
-): ConversationReportEvent["model"] {
-  if (event.model) return event.model;
-  const data = event.data;
-  if (data.type === "turn_routed" || data.type === "handoff") {
-    return {
-      modelId: data.modelId,
-      modelProfile: data.modelProfile,
-      reasoningLevel: data.reasoningLevel,
-    };
-  }
-  return undefined;
-}
-
-/** Keep call costs distinct from router cost and never repeat usage on tool results. */
+/** Show call usage once and never repeat it on tool results. */
 export function eventLogUsage(event: ConversationReportEvent): string {
   const usage = event.modelCall?.usage;
   const cost = summarizeCost(usage);
   const fields = [
     cost ? `${formatCostBreakdown(cost)} call` : undefined,
-    event.data.type === "turn_routed" && event.data.costUsd !== undefined
-      ? `${formatCostBreakdown({ total: event.data.costUsd })} router`
-      : undefined,
     ...(
       [
         ["inputTokens", "in"],
@@ -77,8 +58,6 @@ export function eventLogSummary(data: ConversationReportEventData): string {
       return data.state === "failed"
         ? `${data.state} · ${data.failureCode}${data.failureReason ? ` · ${data.failureReason}` : ""}`
         : `${data.state} · ${data.turnId}`;
-    case "turn_routed":
-      return `Route selected · ${data.source}${data.confidence !== undefined ? ` · ${Math.round(data.confidence * 100)}% confidence` : ""}`;
     case "turn_context":
       return `${data.pluginName} · ${data.kind} · v${data.version}`;
     case "guardian_action_reviewed":
@@ -91,8 +70,6 @@ export function eventLogSummary(data: ConversationReportEventData): string {
         .join(", ");
     case "compaction":
       return data.summary ?? "Agent history compacted";
-    case "handoff":
-      return "Handoff · New configuration applied";
     case "subagent":
       return `${data.agentName ?? data.subagentKind} · ${data.status} · ${data.childConversationId}`;
   }
@@ -132,16 +109,10 @@ export function eventLogRows(
   events: readonly ConversationReportEvent[],
 ): EventLogRow[] {
   return events.map((event) => {
-    const model = eventLogModel(event);
     return {
       event,
       summary: eventLogSummary(event.data).replace(/\s+/g, " ").slice(0, 300),
-      metadata: [
-        model?.modelId,
-        model?.modelProfile,
-        model?.reasoningLevel && `${model.reasoningLevel} reasoning`,
-        eventLogUsage(event),
-      ]
+      metadata: [event.model?.modelId, eventLogUsage(event)]
         .filter(Boolean)
         .join(" · "),
     };

package/src/client/conversations/eventTranscript.ts

@@ -51,9 +51,6 @@ function specialToolIds(events: ConversationReportEvent[]): Set<string> {
   const ids = new Set<string>();
   for (const event of events) {
     const data = event.data;
-    if (data.type === "handoff" && data.triggeringToolCallId) {
-      ids.add(data.triggeringToolCallId);
-    }
     if (data.type === "subagent" && data.parentToolCallId) {
       ids.add(data.parentToolCallId);
     }
@@ -243,6 +240,7 @@ export function transcriptMessagesFromEvents(
         ...(data.explicitMention !== undefined
           ? { explicitMention: data.explicitMention }
           : undefined),
+        ...(data.quiet ? { quiet: data.quiet } : undefined),
         ...(data.reviewItemChanges
           ? { reviewItemChanges: data.reviewItemChanges }
           : undefined),
@@ -308,22 +306,6 @@ export function transcriptMessagesFromEvents(
       continue;
     }
 
-    if (data.type === "turn_routed") {
-      const message = latestUserMessageByTurn.get(data.turnId);
-      if (message) {
-        message.route = {
-          modelProfile: data.modelProfile,
-          modelId: data.modelId,
-          reasoningLevel: data.reasoningLevel,
-          ...(data.confidence !== undefined
-            ? { confidence: data.confidence }
-            : undefined),
-          source: data.source,
-        };
-      }
-      continue;
-    }
-
     if (data.type === "turn_context") {
       const message = latestUserMessageByTurn.get(data.turnId);
       if (message) {
@@ -437,34 +419,19 @@ export function transcriptMessagesFromEvents(
       continue;
     }
 
-    if (data.type === "compaction" || data.type === "handoff") {
+    if (data.type === "compaction") {
       messages.push(
         eventMessage(event, "system", [
           {
             type: "context_event",
             ...(event.mentions ? { mentions: event.mentions } : undefined),
-            event:
-              data.type === "handoff"
-                ? {
-                    type: data.type,
-                    createdAt: event.createdAt,
-                    modelId: data.modelId,
-                    modelProfile: data.modelProfile,
-                    ...(data.summary ? { summary: data.summary } : undefined),
-                    ...(data.reasoningLevel
-                      ? { reasoningLevel: data.reasoningLevel }
-                      : undefined),
-                  }
-                : {
-                    type: data.type,
-                    createdAt: event.createdAt,
-                    ...(data.modelId ? { modelId: data.modelId } : undefined),
-                    ...(data.modelProfile
-                      ? { modelProfile: data.modelProfile }
-                      : undefined),
-                    ...(data.summary ? { summary: data.summary } : undefined),
-                    ...(data.details ? { details: data.details } : undefined),
-                  },
+            event: {
+              type: data.type,
+              createdAt: event.createdAt,
+              ...(data.modelId ? { modelId: data.modelId } : undefined),
+              ...(data.summary ? { summary: data.summary } : undefined),
+              ...(data.details ? { details: data.details } : undefined),
+            },
           },
         ]),
       );