@sentry/junior-dashboard 0.279.0 → 0.280.0

package/src/client/conversations/TranscriptRows.tsx

@@ -1,6 +1,10 @@
 import type { ComponentPropsWithoutRef, ReactNode } from "react";
 
 import { cn } from "../styles";
+import {
+  ConversationCatchUpButton,
+  ConversationCatchUpCard,
+} from "./ConversationCatchUp";
 
 /** Keep row padding and the gap between transcript entries in one place. */
 export function TranscriptRows({
@@ -20,17 +24,26 @@ export function TranscriptRows({
  */
 export function TranscriptUnreadMarker() {
   return (
-    <div
-      className="flex items-center gap-3 py-1"
-      data-transcript-unread-marker=""
-      role="separator"
-      aria-label="New messages"
-    >
-      <span className="h-px flex-1 bg-dashboard-accent/50" />
-      <span className="shrink-0 font-sans text-xs font-semibold text-dashboard-accent-text">
-        New
-      </span>
-      <span className="h-px flex-1 bg-dashboard-accent/50" />
+    <div className="grid gap-2 py-1" data-transcript-unread-marker="">
+      {/* Equal side columns keep "New" centered when the catch-up offer shows. */}
+      <div className="grid grid-cols-[1fr_auto_1fr] items-center gap-3">
+        <span
+          aria-label="New messages"
+          className="h-px bg-dashboard-accent/50"
+          role="separator"
+        />
+        <span
+          aria-hidden="true"
+          className="font-sans text-xs font-semibold text-dashboard-accent-text"
+        >
+          New
+        </span>
+        <div className="flex min-w-0 items-center gap-3">
+          <span className="h-px flex-1 bg-dashboard-accent/50" />
+          <ConversationCatchUpButton />
+        </div>
+      </div>
+      <ConversationCatchUpCard />
     </div>
   );
 }

package/src/client/conversations/TranscriptView.tsx

@@ -12,6 +12,7 @@ import { cn } from "../styles";
 import { ConversationTranscriptView } from "./ConversationTranscript";
 import { ConversationEventLog } from "./ConversationEventLog";
 import {
+  TranscriptJumpToLatestContext,
   transcriptBottomVersion,
   transcriptJuniorMessageVersion,
   useAutoLoadHistoryPage,
@@ -23,7 +24,7 @@ import {
   type TranscriptUnreadRange,
 } from "./transcriptReadPosition";
 import { TranscriptSearchProvider } from "./transcriptSearch";
-import type { TranscriptHistory } from "./transcriptUnreadHistory";
+import type { TranscriptHistory } from "./transcriptAroundHistory";
 import {
   TurnContextPanelProvider,
   type TurnContextPanel,
@@ -61,6 +62,8 @@ export function Transcript(props: {
   transcript?: ConversationTranscript;
   /** Show turn context in the owner's panel. Without it, a drawer opens. */
   turnContextPanel?: TurnContextPanel;
+  /** Open where a link shows its row instead of the latest message. */
+  startAtLink?: boolean;
   /** Open at the "New" marker instead of the latest message. */
   startAtUnread?: boolean;
   /** Rows that were unread when the Conversation opened get a marker. */
@@ -79,6 +82,7 @@ export function Transcript(props: {
     historyVersion: props.historyVersion ?? "empty",
     juniorMessageVersion: transcriptJuniorMessageVersion(props.transcript),
     pinRequestVersion: props.pinRequestVersion,
+    startAtLink: props.startAtLink,
     startAtUnread: view === "rich" && props.startAtUnread,
     view,
     versions: {
@@ -114,6 +118,11 @@ export function Transcript(props: {
     historyVersion: props.historyVersion ?? "empty",
     onLoad: () => newer?.load(),
   });
+  const jumpToLatest = () => {
+    // The latest page is in the detail, so the jump needs no request.
+    newer?.showLatest();
+    bottomPinning.jumpToBottom();
+  };
 
   if (!props.transcript) {
     return (
@@ -162,17 +171,20 @@ export function Transcript(props: {
             conversation={props.transcript}
             onSearchChange={props.onSearchChange ?? setLocalSearch}
             onSelectedSeqChange={props.onSelectedEventSeqChange}
+            scrollAnchorKey={bottomPinning.scrollAnchorKey}
             selectedSeq={props.selectedEventSeq}
           />
         ) : (
           <TurnContextPanelProvider panel={props.turnContextPanel}>
-            <ConversationTranscriptView
-              onOpenSubagentTranscript={props.onOpenSubagentTranscript}
-              conversation={props.transcript}
-              pendingMessages={props.pendingMessages}
-              responding={props.responding ?? props.live ?? false}
-              unread={props.unread}
-            />
+            <TranscriptJumpToLatestContext value={jumpToLatest}>
+              <ConversationTranscriptView
+                onOpenSubagentTranscript={props.onOpenSubagentTranscript}
+                conversation={props.transcript}
+                pendingMessages={props.pendingMessages}
+                responding={props.responding ?? props.live ?? false}
+                unread={props.unread}
+              />
+            </TranscriptJumpToLatestContext>
           </TurnContextPanelProvider>
         )}
         {newer ? (
@@ -206,11 +218,7 @@ export function Transcript(props: {
         />
         <JumpToLatestButton
           hasPendingUpdate={bottomPinning.hasPendingUpdate}
-          onClick={() => {
-            // The latest page is in the detail, so the jump needs no request.
-            newer?.showLatest();
-            bottomPinning.jumpToBottom();
-          }}
+          onClick={jumpToLatest}
           visible={bottomPinning.showJumpToLatest}
         />
       </div>

package/src/client/conversations/conversationArchive.ts

@@ -11,6 +11,7 @@ import type {
 import { archiveConversationResponseSchema } from "@sentry/junior/api/schema";
 
 import { patch } from "../http";
+import type { Conversation } from "../types";
 import {
   conversationDetailQueryKey,
   type ConversationSnapshot,
@@ -82,6 +83,27 @@ export function usePendingArchiveConversationUpdates() {
   });
 }
 
+/**
+ * Router state for home after a conversation archives itself. Home reports
+ * the background archive result, because the conversation page is gone.
+ */
+export type ArchivedFromConversationState = {
+  archivedConversation: Conversation;
+};
+
+/** Read the newest archive or restore status for one conversation. */
+export function useLatestArchiveStatus(conversationId: string | undefined) {
+  const statuses = useMutationState({
+    filters: {
+      exact: true,
+      mutationKey: [...archiveConversationMutationKey, conversationId],
+    },
+    select: (mutation) => mutation.state.status,
+  });
+  // The mutation cache keeps insertion order, so the last entry is newest.
+  return conversationId ? statuses.at(-1) : undefined;
+}
+
 /** Archive or restore one conversation with an immediate reversible cache update. */
 export function useArchiveConversation(
   conversationId: string,

package/src/client/conversations/conversationCatchUpState.ts

@@ -0,0 +1,96 @@
+/**
+ * Offer a catch-up when a reader comes back to a lot of unread activity. The
+ * reader asks for it, because each summary costs a model call and a short
+ * wait.
+ */
+import { useMutation } from "@tanstack/react-query";
+import { createContext, useContext } from "react";
+
+import {
+  conversationCatchUpSchema,
+  type ConversationCatchUp,
+  type ConversationDetailReport,
+} from "@sentry/junior/api/schema";
+import { post } from "../http";
+import type { TranscriptUnreadRange } from "./transcriptReadPosition";
+
+/** Fewer unread Turns than this are quicker to read than a summary. */
+const CATCH_UP_MIN_TURNS = 2;
+
+/** The catch-up offer for the unread range of one Conversation visit. */
+export type ConversationCatchUpState = {
+  data?: ConversationCatchUp;
+  error: boolean;
+  pending: boolean;
+  request(): void;
+};
+
+/**
+ * Count the Turns that finished in the unread range. When the range goes past
+ * the loaded rows, the reader has at least a page of unread rows.
+ */
+function hasEnoughUnread(
+  events: ConversationDetailReport["events"],
+  unread: TranscriptUnreadRange,
+  pages: { hasNewerPage: boolean; hasPreviousPage: boolean },
+): boolean {
+  if (pages.hasNewerPage) return true;
+  const first = events[0];
+  if (pages.hasPreviousPage && first && first.seq > unread.afterSeq) {
+    return true;
+  }
+  let turns = 0;
+  for (const event of events) {
+    if (event.seq <= unread.afterSeq || event.seq > unread.throughSeq) continue;
+    if (
+      event.data.type === "turn_lifecycle" &&
+      event.data.state !== "started"
+    ) {
+      turns += 1;
+    }
+  }
+  return turns >= CATCH_UP_MIN_TURNS;
+}
+
+/** Offer a catch-up only when enough is unread. */
+export function useConversationCatchUp(input: {
+  conversationId: string;
+  events?: ConversationDetailReport["events"];
+  hasNewerPage: boolean;
+  hasPreviousPage: boolean;
+  unread?: TranscriptUnreadRange;
+}): ConversationCatchUpState | undefined {
+  const { unread } = input;
+  const mutation = useMutation({
+    mutationFn: (range: TranscriptUnreadRange) =>
+      post(
+        conversationCatchUpSchema,
+        `/api/conversations/${encodeURIComponent(input.conversationId)}/catch-up`,
+        range,
+      ),
+  });
+  // Once asked, keep the answer even if the loaded rows change.
+  const asked = !mutation.isIdle;
+  if (
+    !unread ||
+    (!asked && (!input.events || !hasEnoughUnread(input.events, unread, input)))
+  ) {
+    return undefined;
+  }
+  return {
+    data: mutation.data,
+    error: mutation.isError,
+    pending: mutation.isPending,
+    request: () => mutation.mutate(unread),
+  };
+}
+
+/** Only the Conversation page sets it, so nested transcripts offer nothing. */
+export const ConversationCatchUpContext = createContext<
+  ConversationCatchUpState | undefined
+>(undefined);
+
+/** Read the catch-up offer of the current Conversation page. */
+export function useConversationCatchUpState() {
+  return useContext(ConversationCatchUpContext);
+}

package/src/client/conversations/conversationMemory.ts

@@ -1,6 +1,6 @@
 import { useQuery } from "@tanstack/react-query";
 import { createContext, useContext } from "react";
-import { z } from "zod";
+import * as z from "zod";
 
 import { fetchDashboardJson } from "../http";
 import { conversationSideReadQueryKey } from "./queries";
@@ -11,6 +11,7 @@ const conversationMemoryListSchema = z
       z
         .object({
           memoryIds: z.array(z.string().min(1)).min(1),
+          seq: z.number().int().min(0),
           source: z.enum(["captured", "recalled"]),
           turnId: z.string().min(1).optional(),
         })
@@ -76,6 +77,8 @@ export function anchorMemories(
 /** One row of the Conversation memory list. */
 export type ConversationMemoryEntry = {
   memory: ConversationMemory;
+  /** The recall or capture event, where the transcript opens. */
+  seq: number;
   source: MemorySource;
   turnId?: string;
 };
@@ -99,6 +102,7 @@ export function conversationMemoryEntries(
       seen.add(key);
       entries.push({
         memory,
+        seq: event.seq,
         source: event.source,
         ...(event.turnId ? { turnId: event.turnId } : undefined),
       });
@@ -110,6 +114,9 @@ export function conversationMemoryEntries(
 /** The open memory popover, and the memory it highlights. */
 export type OpenMemoryPopover = MemoryAnchor & { memoryId?: string };
 
+/** A memory chosen in details, and the event where the transcript opens. */
+export type MemoryJump = OpenMemoryPopover & { seq: number };
+
 /** Shared memory popover state for one Conversation page. */
 export type ConversationMemoryState = {
   list?: ConversationMemoryList;

package/src/client/conversations/queries.ts

@@ -221,7 +221,9 @@ export function conversationDetailQueryOptions(
 /**
  * Read positions only move forward. A poll that started before a read report
  * finished must not put an older position back in the cache, nor the unread
- * cursor of that older position.
+ * cursor of that older position. The cache already holds the cursor for the
+ * newer position: a read does not change the detail version, so no later poll
+ * would bring it back.
  */
 function keepLatestReadPosition(
   previous: ConversationSnapshot,
@@ -230,8 +232,14 @@ function keepLatestReadPosition(
   const kept = previous.readPosition;
   if (!kept) return next;
   if ((next.readPosition?.lastReadSeq ?? -1) >= kept.lastReadSeq) return next;
-  const { unreadCursor: _olderCursor, ...rest } = next;
-  return { ...rest, readPosition: kept };
+  const { unreadCursor: _olderCursor, unreadPage: _olderPage, ...rest } = next;
+  return {
+    ...rest,
+    readPosition: kept,
+    ...(previous.unreadCursor
+      ? { unreadCursor: previous.unreadCursor, unreadPage: previous.unreadPage }
+      : undefined),
+  };
 }
 
 /** Create one dashboard conversation and refresh the personal feed. */

package/src/client/conversations/{transcriptUnreadHistory.ts → transcriptAroundHistory.ts}

@@ -1,11 +1,13 @@
 /**
- * Open a long Conversation at the reader's read position.
+ * Open a long Conversation away from its latest events: at the reader's read
+ * position, or at a linked event, Turn, or memory.
  *
  * The detail holds the latest page of events. When the read position is
  * older than that page, the transcript starts with the page around the read
  * position instead: the last read events and the unread events after them.
  * The first detail fetch of a visit brings that page, so it needs no second
- * request.
+ * request. A link to a row that the transcript does not hold starts it with
+ * the page around that row, which the server finds in one request.
  * Like earlier pages, newer pages load when the reader scrolls near them, so
  * the server reads only the pages that the reader reaches.
  *
@@ -54,23 +56,33 @@ export type TranscriptHistory = {
 };
 
 /**
- * Load the transcript from `unreadCursor`. Returns `undefined` when there is
- * no cursor, or when the first page fails, so the caller shows the latest
- * page instead.
+ * The row that the transcript opens at: the `unreadCursor` of the read
+ * position, or a linked event seq or Turn id.
  */
-export function useUnreadHistory(input: {
+export type HistoryStart =
+  | { around: string }
+  | { event: string }
+  | { turn: string };
+
+/**
+ * Load the transcript from the page around `start`. Returns `undefined` when
+ * there is no start, or when the first page fails, so the caller shows the
+ * latest page instead.
+ */
+export function useHistoryAround(input: {
   conversationId: string;
   /** The latest page, from the polled detail. */
   detail: ConversationDetailReport | undefined;
-  /** `unreadCursor` from the detail when the Conversation opened. */
-  unreadCursor: string | undefined;
-  /** Skip the newer pages. The caller then passes no `unreadCursor`. */
+  start?: HistoryStart;
+  /** Skip the newer pages. The caller then passes no `start`. */
   onShowLatest: () => void;
-  /** The page around `unreadCursor`, when the detail brought it. */
-  unreadPage?: ConversationEventPage;
+  /** The page around `start` failed. */
+  onStartFailed?: () => void;
+  /** The page around `start`, when the detail brought it. */
+  startPage?: ConversationEventPage;
 }): (TranscriptHistory & { isPending: boolean }) | undefined {
-  const { conversationId, detail, onShowLatest, unreadCursor, unreadPage } =
-    input;
+  const { conversationId, detail, onShowLatest, onStartFailed, start } = input;
+  const startKey = start ? Object.entries(start)[0]?.join(":") : undefined;
   const latestEventsRef = useRef<ConversationReportEvent[]>([]);
   const latestEvents = useMemo(() => {
     const kept = keepLatestEvents(latestEventsRef.current, detail?.events);
@@ -78,28 +90,24 @@ export function useUnreadHistory(input: {
     return kept;
   }, [detail?.events]);
   const latestFirstSeq = latestEvents[0]?.seq;
-  const joinedRef = useRef(false);
+  // The start whose newer pages joined the latest page.
+  const joinedRef = useRef<string>(undefined);
   const newer = useInfiniteQuery({
-    // Only the page around the read position loads by itself. The data never
-    // goes stale, so a refetch cannot reload every newer page at once.
-    enabled: Boolean(unreadCursor),
+    // Only the page around the start loads by itself. The data never goes
+    // stale, so a refetch cannot reload every newer page at once.
+    enabled: Boolean(start),
     staleTime: Infinity,
-    // Each visit starts again from the page around the read position. Pages
-    // from an earlier visit can end at an old latest event, which would
-    // leave a gap before the latest page.
+    // Each visit starts again from the page around the start. Pages from an
+    // earlier visit can end at an old latest event, which would leave a gap
+    // before the latest page.
     gcTime: 0,
-    queryKey: ["conversation", conversationId, "unread", unreadCursor, "newer"],
+    queryKey: ["conversation", conversationId, "around", startKey, "newer"],
     queryFn: ({ pageParam, signal }) =>
       readConversationEventsFrom(conversationId, pageParam, signal),
-    initialPageParam: { around: unreadCursor ?? "" } as NewerPageParam,
+    initialPageParam: (start ?? { around: "" }) as NewerPageParam,
     // The page that came with the detail. Without it, the query reads it.
-    ...(unreadPage
-      ? {
-          initialData: {
-            pageParams: [{ around: unreadCursor ?? "" }],
-            pages: [unreadPage],
-          },
-        }
+    ...(input.startPage && start
+      ? { initialData: { pageParams: [start], pages: [input.startPage] } }
       : undefined),
     getNextPageParam: (page): NewerPageParam | undefined =>
       reachesLatest(page, latestFirstSeq) || !page.nextCursor
@@ -110,13 +118,7 @@ export function useUnreadHistory(input: {
   const firstNewerPage = newer.data?.pages[0];
   const earlier = useInfiniteQuery({
     enabled: false,
-    queryKey: [
-      "conversation",
-      conversationId,
-      "unread",
-      unreadCursor,
-      "earlier",
-    ],
+    queryKey: ["conversation", conversationId, "around", startKey, "earlier"],
     queryFn: ({ pageParam, signal }) =>
       readConversationEvents(conversationId, pageParam, signal),
     initialPageParam: firstNewerPage?.previousCursor ?? "",
@@ -130,16 +132,20 @@ export function useUnreadHistory(input: {
   const reached = lastNewerPage
     ? reachesLatest(lastNewerPage, latestFirstSeq)
     : false;
-  if (reached) joinedRef.current = true;
+  if (reached) joinedRef.current = startKey;
   // No newer page can fill the gap before the latest page, or the latest
   // events already on screen would leave until one does.
   const skipped =
     lastNewerPage !== undefined &&
     !reached &&
-    (joinedRef.current || !lastNewerPage.nextCursor);
+    (joinedRef.current === startKey || !lastNewerPage.nextCursor);
   useEffect(() => {
     if (skipped) onShowLatest();
   }, [onShowLatest, skipped]);
+  const startFailed = Boolean(start && newer.error && !newerPages);
+  useEffect(() => {
+    if (startFailed) onStartFailed?.();
+  }, [onStartFailed, startFailed]);
   const pages = useMemo(
     () => [...(earlierPages ?? []), ...(newerPages ?? [])],
     [earlierPages, newerPages],
@@ -156,7 +162,7 @@ export function useUnreadHistory(input: {
     [detail, latestEvents, newerPages, pages, reached],
   );
 
-  if (!unreadCursor || skipped || (newer.error && !newerPages)) {
+  if (!start || skipped || startFailed) {
     return undefined;
   }
 
@@ -225,10 +231,10 @@ function reachesLatest(
   return lastSeq + 1 >= latestFirstSeq;
 }
 
-/** The first page is around the read position. The rest follow it. */
-type NewerPageParam = { around: string } | { after: string };
+/** The first page is around the start. The rest follow it. */
+type NewerPageParam = HistoryStart | { after: string };
 
-/** Read one bounded page of events around or after a history cursor. */
+/** Read one bounded page of events around a start or after a cursor. */
 function readConversationEventsFrom(
   conversationId: string,
   param: NewerPageParam,

package/src/client/conversations/transcriptBottomPinning.ts

@@ -1,4 +1,5 @@
 import {
+  createContext,
   useCallback,
   useEffect,
   useLayoutEffect,
@@ -52,6 +53,8 @@ type BottomPinResult = {
   contentRef: RefCallback<HTMLDivElement>;
   hasPendingUpdate: boolean;
   jumpToBottom: () => void;
+  /** The `data-scroll-anchor` key of the row that holds the reader's place. */
+  scrollAnchorKey: () => string | undefined;
   showJumpToLatest: boolean;
 };
 
@@ -319,6 +322,8 @@ export function usePinnedTranscriptBottom(input: {
   historyVersion: string;
   juniorMessageVersion: string;
   pinRequestVersion?: number;
+  /** Open where a link shows its row, not at the latest message. */
+  startAtLink?: boolean;
   /** Open at the "New" marker when the transcript has one. */
   startAtUnread?: boolean;
   view: TranscriptViewMode;
@@ -331,7 +336,9 @@ export function usePinnedTranscriptBottom(input: {
   endsAtLatestRef.current = input.endsAtLatest ?? true;
   const followingRef = useRef(false);
   const initializedRef = useRef(false);
-  const initializedConversationRef = useRef<string | null>(null);
+  // The Conversation and start that the transcript opened with. A link at
+  // open that fails becomes a normal start, so the transcript opens again.
+  const startedRef = useRef<string | null>(null);
   const previousScrollTopRef = useRef<number | null>(null);
   // The scroll position that the last restore set. Its scroll event is not
   // a reader scroll, so it must not change follow intent.
@@ -546,13 +553,20 @@ export function usePinnedTranscriptBottom(input: {
 
   useBrowserLayoutEffect(() => {
     if (!contentElement || !input.conversationId) return;
-    if (initializedConversationRef.current === input.conversationId) return;
+    const start = `${input.conversationId}:${input.startAtLink ? "link" : "start"}`;
+    if (startedRef.current === start) return;
 
     const root = scrollRootFor(contentElement);
     if (!root) return;
 
-    initializedConversationRef.current = input.conversationId;
+    startedRef.current = start;
     setHasPendingUpdate(false);
+    // The link scrolls to its row, maybe before this runs. Do not move away.
+    if (input.startAtLink) {
+      previousScrollTopRef.current = scrollSnapshot(root).scrollTop;
+      setFollowingIntent(false);
+      return;
+    }
     if (input.startAtUnread && openAtUnreadMarker()) return;
 
     setScrollTop(root, scrollSnapshot(root).scrollHeight);
@@ -565,6 +579,7 @@ export function usePinnedTranscriptBottom(input: {
   }, [
     contentElement,
     input.conversationId,
+    input.startAtLink,
     input.startAtUnread,
     openAtUnreadMarker,
     setFollowingIntent,
@@ -761,6 +776,8 @@ export function usePinnedTranscriptBottom(input: {
     scrollToBottom("auto");
   }, [input.pinRequestVersion, scrollToBottom, setFollowingIntent]);
 
+  const scrollAnchorKey = useCallback(() => scrollAnchorRef.current?.key, []);
+
   return useMemo(
     () => ({
       anchorRef,
@@ -768,6 +785,7 @@ export function usePinnedTranscriptBottom(input: {
       contentRef,
       hasPendingUpdate,
       jumpToBottom,
+      scrollAnchorKey,
       showJumpToLatest: shouldShowJumpToLatest({
         enabled: input.enabled,
         endsAtLatest: input.endsAtLatest,
@@ -785,10 +803,16 @@ export function usePinnedTranscriptBottom(input: {
       input.endsAtLatest,
       jumpToBottom,
       openedAtUnread,
+      scrollAnchorKey,
     ],
   );
 }
 
+/** Jump to the latest row from inside the transcript, like the floating pill. */
+export const TranscriptJumpToLatestContext = createContext<
+  (() => void) | undefined
+>(undefined);
+
 /**
  * Load the next history page when the reader scrolls near the edge where it
  * goes: the top for earlier pages, the bottom for newer pages.

package/src/client/conversations/transcriptReadPosition.ts

@@ -4,7 +4,8 @@
  * Rows from stored events carry `data-transcript-seq`. While the page is
  * visible, the reporter sends the sequence of the last row that has reached
  * the viewport. The server keeps the highest value, so every client of the
- * same user shares one position. Detail polls bring it back to other clients.
+ * same user shares one position. A write does not change the detail version,
+ * so other clients get it with the next detail change or a reload.
  *
  * The page reads the position once when a Conversation opens. That value
  * places the "New" marker and, by the reader's preference, where the
@@ -139,6 +140,27 @@ function readPositionAtOpen(
   return { lastReadSeq, unread: { afterSeq: lastReadSeq, throughSeq } };
 }
 
+/**
+ * Put a stored read position in the cached detail. Polls answer 304 after a
+ * read, so the cache must also drop the unread cursor once the reader reaches
+ * the latest page, as the server would. Otherwise the next visit in this
+ * session opens at rows the reader has already read.
+ */
+function withReadPosition(
+  detail: ConversationDetailReport,
+  readPosition: ConversationReadPosition,
+): ConversationDetailReport {
+  const firstSeq = detail.events[0]?.seq;
+  if (
+    !detail.unreadCursor ||
+    (firstSeq !== undefined && readPosition.lastReadSeq + 1 < firstSeq)
+  ) {
+    return { ...detail, readPosition };
+  }
+  const { unreadCursor: _cursor, unreadPage: _page, ...rest } = detail;
+  return { ...rest, readPosition };
+}
+
 /**
  * Send read positions for one Conversation. A position at or before the one
  * in the cached detail is not sent, because the server already has it. The
@@ -157,7 +179,7 @@ export function useMarkConversationRead(conversationId: string) {
     onSuccess: (readPosition) => {
       queryClient.setQueryData<ConversationDetailReport>(
         conversationDetailQueryKey(conversationId),
-        (detail) => (detail ? { ...detail, readPosition } : detail),
+        (detail) => detail && withReadPosition(detail, readPosition),
       );
     },
   });

package/src/client/conversations/turnContext.ts

@@ -1,4 +1,4 @@
-import { z } from "zod";
+import * as z from "zod";
 
 import type { TranscriptViewTurnContext } from "../types";
 

package/src/client/pages/admin/AdminPage.tsx

@@ -5,7 +5,7 @@ import type { PluginUserPageLink } from "@sentry/junior-plugin-api";
 import { Card } from "../../components/layout/Card";
 import { PageHeader } from "../../components/layout/PageHeader";
 import { dashboardContainerClass } from "../../styles";
-import { pluginUserPagePath } from "../user/PluginUserPage";
+import { pluginUserPagePath } from "../user/pluginUserPageRoutes";
 import {
   ServiceAccountsSection,
   useServiceAccounts,

package/src/client/pages/admin/ServiceAccountsSection.tsx

@@ -5,7 +5,7 @@ import {
   type UseQueryResult,
 } from "@tanstack/react-query";
 import { KeyRound } from "lucide-react";
-import type { z } from "zod";
+import type * as z from "zod";
 import {
   disconnectServiceAccountResponseSchema,
   serviceAccountListSchema,