@sentry/junior-dashboard 0.275.0 → 0.277.0

package/src/client/conversations/conversationMemory.ts

@@ -0,0 +1,139 @@
+import { useQuery } from "@tanstack/react-query";
+import { createContext, useContext } from "react";
+import { z } from "zod";
+
+import { fetchDashboardJson } from "../http";
+import { conversationSideReadQueryKey } from "./queries";
+
+const conversationMemoryListSchema = z
+  .object({
+    events: z.array(
+      z
+        .object({
+          memoryIds: z.array(z.string().min(1)).min(1),
+          source: z.enum(["captured", "recalled"]),
+          turnId: z.string().min(1).optional(),
+        })
+        .strict(),
+    ),
+    memories: z.array(
+      z
+        .object({
+          content: z.string().min(1),
+          id: z.string().min(1),
+          visibility: z.enum(["private", "public"]),
+        })
+        .strict(),
+    ),
+  })
+  .strict();
+
+export type ConversationMemoryList = z.output<
+  typeof conversationMemoryListSchema
+>;
+export type ConversationMemory = ConversationMemoryList["memories"][number];
+type MemorySource = ConversationMemoryList["events"][number]["source"];
+
+/** One transcript spot that recalled or captured memories. */
+export type MemoryAnchor = { source: MemorySource; turnId: string };
+
+/** Load what one Conversation recalled and captured. */
+export function useConversationMemories(conversationId: string) {
+  return useQuery({
+    queryFn: ({ signal }) =>
+      fetchDashboardJson(
+        conversationMemoryListSchema,
+        `/api/plugins/memory/conversations/${encodeURIComponent(conversationId)}/memories`,
+        signal,
+      ),
+    queryKey: conversationSideReadQueryKey(conversationId, "memories"),
+    retry: false,
+  });
+}
+
+/** Name the transcript element that opens one anchor's popover. */
+export function memoryAnchorKey(anchor: MemoryAnchor): string {
+  return `${anchor.source}:${anchor.turnId}`;
+}
+
+/** List the memories that one transcript spot recalled or captured. */
+export function anchorMemories(
+  list: ConversationMemoryList | undefined,
+  anchor: MemoryAnchor,
+): ConversationMemory[] {
+  const event = list?.events.find(
+    (candidate) =>
+      candidate.source === anchor.source && candidate.turnId === anchor.turnId,
+  );
+  if (!event || !list) return [];
+  const byId = new Map(list.memories.map((memory) => [memory.id, memory]));
+  return event.memoryIds.flatMap((id) => {
+    const memory = byId.get(id);
+    return memory ? [memory] : [];
+  });
+}
+
+/** One row of the Conversation memory list. */
+export type ConversationMemoryEntry = {
+  memory: ConversationMemory;
+  source: MemorySource;
+  turnId?: string;
+};
+
+/**
+ * Flatten recalls and captures into one list in Conversation order. A memory
+ * shows once per source, at the first Turn that recalled or captured it.
+ */
+export function conversationMemoryEntries(
+  list: ConversationMemoryList | undefined,
+): ConversationMemoryEntry[] {
+  if (!list) return [];
+  const byId = new Map(list.memories.map((memory) => [memory.id, memory]));
+  const seen = new Set<string>();
+  const entries: ConversationMemoryEntry[] = [];
+  for (const event of list.events) {
+    for (const id of event.memoryIds) {
+      const key = `${event.source}:${id}`;
+      const memory = byId.get(id);
+      if (seen.has(key) || !memory) continue;
+      seen.add(key);
+      entries.push({
+        memory,
+        source: event.source,
+        ...(event.turnId ? { turnId: event.turnId } : undefined),
+      });
+    }
+  }
+  return entries;
+}
+
+/** The open memory popover, and the memory it highlights. */
+export type OpenMemoryPopover = MemoryAnchor & { memoryId?: string };
+
+/** Shared memory popover state for one Conversation page. */
+export type ConversationMemoryState = {
+  list?: ConversationMemoryList;
+  open?: OpenMemoryPopover;
+  setOpen(open: OpenMemoryPopover | undefined): void;
+};
+
+/**
+ * Let the transcript and the details panel share memory popovers. Only the
+ * Conversation page sets it, so nested transcripts show plain events.
+ */
+export const ConversationMemoryContext = createContext<
+  ConversationMemoryState | undefined
+>(undefined);
+
+/** Read the memory popover state of the current Conversation page. */
+export function useConversationMemoryState() {
+  return useContext(ConversationMemoryContext);
+}
+
+/** True for the memory plugin event that a Turn's capture emits. */
+export function isMemoryCaptureEvent(part: {
+  name: string;
+  namespace: string;
+}): boolean {
+  return part.namespace === "memory" && part.name === "memories_captured";
+}

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/eventTranscript.ts

@@ -97,6 +97,9 @@ export function pendingTranscriptMessage(
       ? { actorIdentityId: message.actorIdentityId }
       : undefined),
     ...(message.mentions ? { mentions: message.mentions } : undefined),
+    ...(message.reviewItemChange
+      ? { reviewItemChanges: [message.reviewItemChange] }
+      : undefined),
   };
 }
 
@@ -240,6 +243,9 @@ export function transcriptMessagesFromEvents(
         ...(data.explicitMention !== undefined
           ? { explicitMention: data.explicitMention }
           : undefined),
+        ...(data.reviewItemChanges
+          ? { reviewItemChanges: data.reviewItemChanges }
+          : undefined),
         ...(data.source ? { source: data.source } : undefined),
       };
       messages.push(message);
@@ -327,6 +333,7 @@ export function transcriptMessagesFromEvents(
           kind: data.kind,
           loadedAt: event.createdAt,
           pluginName: data.pluginName,
+          turnId: data.turnId,
           version: data.version,
         });
       }
@@ -411,6 +418,7 @@ export function transcriptMessagesFromEvents(
             name: data.name,
             version: data.version,
             presentation: data.presentation,
+            ...(data.turnId ? { turnId: data.turnId } : undefined),
           },
         ]),
       );

package/src/client/conversations/queries.ts

@@ -1,9 +1,9 @@
 import { useDeferredValue, useEffect, useMemo, useRef } from "react";
 import {
+  type QueryClient,
   queryOptions,
   useInfiniteQuery,
   useMutation,
-  useMutationState,
   useQuery,
   useQueryClient,
 } from "@tanstack/react-query";
@@ -12,13 +12,11 @@ import type {
   ConversationEventPage,
   ConversationFeed,
   ConversationPendingMessagesReport,
-  ConversationSummaryReport,
   InputImage,
 } from "@sentry/junior/api/schema";
 import {
   acceptedConversationMessageSchema,
   webMessageId,
-  archiveConversationResponseSchema,
   cancelConversationPendingMessagesResponseSchema,
   conversationDetailReportSchema,
   conversationEventPageSchema,
@@ -28,11 +26,11 @@ import {
   stopConversationTurnResponseSchema,
 } from "@sentry/junior/api/schema";
 
+import { REVIEW_ITEMS_QUERY_KEY } from "../review-desk/queries";
 import {
   DashboardApiError,
   del,
   fetchDashboardJson,
-  patch,
   post,
   readDashboardResponse,
 } from "../http";
@@ -66,78 +64,13 @@ export function conversationDetailQueryKey(conversationId: string | undefined) {
   return ["conversation", conversationId, "detail"] as const;
 }
 
-function archivedConversationQueryKey(conversationId: string) {
-  return ["dashboard", "archived-conversation", conversationId] as const;
-}
-
-/** Read active/archived status from a dashboard conversations query key. */
-function conversationFeedStatus(
-  queryKey: readonly unknown[],
-): "active" | "archived" | undefined {
-  const status = queryKey[queryKey.length - 1];
-  return status === "active" || status === "archived" ? status : undefined;
-}
-
-type ArchivedConversationSnapshot = {
-  conversation: ConversationSummaryReport;
-  feedQueryHashes: string[];
-};
-
-const archiveConversationMutationKey = [
-  "dashboard",
-  "archive-conversation",
-] as const;
-
-type ArchiveConversationVariables = {
-  archived: boolean;
-  lastSeenAt: string;
-};
-
-type ArchiveConversationMutationContext = {
-  archivedQueryKey: ReturnType<typeof archivedConversationQueryKey>;
-  archivedSnapshot?: ArchivedConversationSnapshot;
-  detailQueryKey: ReturnType<typeof conversationDetailQueryKey>;
-  previousArchivedSnapshot?: ArchivedConversationSnapshot;
-  previousDetail?: ConversationDetailReport;
-  previousFeeds: Array<[readonly unknown[], ConversationFeed | undefined]>;
-};
-
-export type PendingArchiveConversationUpdate = {
-  archived: boolean;
-  conversation?: ConversationSummaryReport;
-  conversationId: string;
-};
-
-/** Read pending archive state so refetches cannot visually replace optimistic UI. */
-export function usePendingArchiveConversationUpdates() {
-  return useMutationState({
-    filters: {
-      mutationKey: archiveConversationMutationKey,
-      status: "pending",
-    },
-    select: (mutation) => {
-      const variables = mutation.state
-        .variables as ArchiveConversationVariables;
-      const context = mutation.state.context as
-        | ArchiveConversationMutationContext
-        | undefined;
-      const conversationId = mutation.options.mutationKey?.[2];
-      return {
-        archived: variables.archived,
-        conversation: context?.archivedSnapshot?.conversation,
-        conversationId:
-          typeof conversationId === "string" ? conversationId : "",
-      } satisfies PendingArchiveConversationUpdate;
-    },
-  });
-}
-
 // Right after a send, Junior usually reads the message within a few seconds.
 // Poll fast for that window only, then fall back to the normal live interval.
 const FAST_POLL_INTERVAL_MS = 500;
 const FAST_POLL_WINDOW_MS = 6_000;
 
-type ConversationSnapshot = ConversationDetailReport & {
+/** The cached detail report with its mailbox and revalidation ETag. */
+export type ConversationSnapshot = ConversationDetailReport & {
   mailbox?: ConversationPendingMessagesReport;
   detailEtag?: string;
 };
@@ -153,6 +86,32 @@ async function readConversationSnapshot(
   return { ...detail, mailbox };
 }
 
+const CONVERSATION_SIDE_READS = ["agents", "memories", "watches"] as const;
+
+/**
+ * Key a read that shows beside the detail report, such as in the details
+ * panel. A detail change refreshes it.
+ */
+export function conversationSideReadQueryKey(
+  conversationId: string,
+  read: (typeof CONVERSATION_SIDE_READS)[number],
+) {
+  return ["conversation", conversationId, read] as const;
+}
+
+/** Refresh the side reads and Review items. Only mounted reads refetch. */
+function refreshConversationSideReads(
+  client: QueryClient,
+  conversationId: string,
+) {
+  for (const read of CONVERSATION_SIDE_READS) {
+    void client.invalidateQueries({
+      queryKey: conversationSideReadQueryKey(conversationId, read),
+    });
+  }
+  void client.invalidateQueries({ queryKey: REVIEW_ITEMS_QUERY_KEY });
+}
+
 /** Refresh history and mailbox as one visible snapshot, including idle input. */
 export function conversationDetailQueryOptions(
   conversationId: string | undefined,
@@ -165,14 +124,26 @@ export function conversationDetailQueryOptions(
   return queryOptions({
     enabled: Boolean(conversationId),
     queryKey: conversationDetailQueryKey(conversationId),
-    queryFn: ({ signal, client }) =>
-      readConversationSnapshot(
+    queryFn: async ({ signal, client }) => {
+      const previous = client.getQueryData<ConversationSnapshot>(
+        conversationDetailQueryKey(conversationId),
+      );
+      const next = await readConversationSnapshot(
         conversationId!,
         signal,
-        client.getQueryData<ConversationSnapshot>(
-          conversationDetailQueryKey(conversationId),
-        ),
-      ),
+        previous,
+      );
+      // Side reads do not poll. A new ETag means the Conversation changed,
+      // so the details panel may be stale too.
+      if (
+        previous?.detailEtag &&
+        next.detailEtag &&
+        previous.detailEtag !== next.detailEtag
+      ) {
+        refreshConversationSideReads(client, conversationId!);
+      }
+      return next;
+    },
     structuralSharing: (previous, next) => {
       if (!next || typeof next !== "object") return next;
       if (!previous || typeof previous !== "object") return next;
@@ -510,167 +481,6 @@ export function useStopConversationTurn(conversationId: string) {
   });
 }
 
-/** Archive or restore one conversation with an immediate reversible cache update. */
-export function useArchiveConversation(
-  conversationId: string,
-  options?: {
-    onError?(): void;
-    onSuccess?(archivedAt: string | null): void;
-  },
-) {
-  const queryClient = useQueryClient();
-  return useMutation({
-    mutationKey: [...archiveConversationMutationKey, conversationId],
-    mutationFn: (args: ArchiveConversationVariables) =>
-      patch(
-        archiveConversationResponseSchema,
-        `/api/conversations/${encodeURIComponent(conversationId)}/archive`,
-        args,
-      ),
-    onMutate: async (args) => {
-      const conversationQueries = { queryKey: ["dashboard", "conversations"] };
-      const detailQueryKey = conversationDetailQueryKey(conversationId);
-      const archivedQueryKey = archivedConversationQueryKey(conversationId);
-      await Promise.all([
-        queryClient.cancelQueries(conversationQueries),
-        queryClient.cancelQueries({ queryKey: detailQueryKey }),
-      ]);
-      const previousFeeds =
-        queryClient.getQueriesData<ConversationFeed>(conversationQueries);
-      const previousDetail =
-        queryClient.getQueryData<ConversationDetailReport>(detailQueryKey);
-      const previousArchivedSnapshot =
-        queryClient.getQueryData<ArchivedConversationSnapshot>(
-          archivedQueryKey,
-        );
-      const archivedAt = args.archived ? new Date().toISOString() : null;
-      // Snapshot from any loaded feed, including archived-only fixtures that
-      // were never archived through this client session.
-      const archivedSnapshot =
-        buildArchivedConversationSnapshot(previousFeeds, conversationId) ??
-        previousArchivedSnapshot;
-
-      previousFeeds.forEach(([queryKey, feed]) => {
-        if (!feed) return;
-        const conversationExists = feed.conversations.some(
-          (conversation) => conversation.conversationId === conversationId,
-        );
-        const feedStatus = conversationFeedStatus(queryKey);
-        const shouldRestore =
-          !args.archived &&
-          !conversationExists &&
-          Boolean(archivedSnapshot) &&
-          feedStatus !== "archived";
-        const conversations = shouldRestore
-          ? [
-              ...feed.conversations,
-              { ...archivedSnapshot!.conversation, archivedAt: null },
-            ].sort((a, b) => b.lastSeenAt.localeCompare(a.lastSeenAt))
-          : feed.conversations.map((conversation) =>
-              conversation.conversationId === conversationId
-                ? { ...conversation, archivedAt }
-                : conversation,
-            );
-        queryClient.setQueryData<ConversationFeed>(queryKey, {
-          ...feed,
-          conversations,
-        });
-      });
-      queryClient.setQueryData<ConversationSnapshot>(
-        detailQueryKey,
-        (detail) =>
-          detail ? { ...detail, archivedAt, detailEtag: undefined } : detail,
-      );
-      if (archivedSnapshot) {
-        queryClient.setQueryData(archivedQueryKey, archivedSnapshot);
-      }
-      return {
-        archivedQueryKey,
-        archivedSnapshot,
-        detailQueryKey,
-        previousArchivedSnapshot,
-        previousDetail,
-        previousFeeds,
-      } satisfies ArchiveConversationMutationContext;
-    },
-    onError: (_error, _args, context) => {
-      context?.previousFeeds.forEach(([queryKey, feed]) => {
-        queryClient.setQueryData(queryKey, feed);
-      });
-      if (context) {
-        queryClient.setQueryData(
-          context.detailQueryKey,
-          context.previousDetail,
-        );
-        if (context.previousArchivedSnapshot) {
-          queryClient.setQueryData(
-            context.archivedQueryKey,
-            context.previousArchivedSnapshot,
-          );
-        } else {
-          queryClient.removeQueries({
-            exact: true,
-            queryKey: context.archivedQueryKey,
-          });
-        }
-      }
-      options?.onError?.();
-    },
-    onSuccess: (result, args) => {
-      queryClient.setQueryData<ConversationSnapshot>(
-        conversationDetailQueryKey(conversationId),
-        (detail) =>
-          detail
-            ? {
-                ...detail,
-                archivedAt: result.archivedAt,
-                detailEtag: undefined,
-              }
-            : detail,
-      );
-      if (!args.archived) {
-        queryClient.removeQueries({
-          exact: true,
-          queryKey: archivedConversationQueryKey(conversationId),
-        });
-      }
-      options?.onSuccess?.(result.archivedAt);
-    },
-    onSettled: async () => {
-      await Promise.all([
-        queryClient.invalidateQueries({
-          queryKey: ["dashboard", "conversations"],
-        }),
-        queryClient.invalidateQueries({
-          queryKey: ["dashboard", "locations"],
-        }),
-        queryClient.invalidateQueries({ queryKey: ["dashboard", "people"] }),
-        queryClient.invalidateQueries({
-          exact: true,
-          queryKey: conversationDetailQueryKey(conversationId),
-        }),
-      ]);
-    },
-  });
-}
-
-function buildArchivedConversationSnapshot(
-  feeds: Array<[readonly unknown[], ConversationFeed | undefined]>,
-  conversationId: string,
-): ArchivedConversationSnapshot | undefined {
-  let conversation: ConversationSummaryReport | undefined;
-  const feedQueryHashes: string[] = [];
-  for (const [queryKey, feed] of feeds) {
-    const feedConversation = feed?.conversations.find(
-      (item) => item.conversationId === conversationId,
-    );
-    if (!feedConversation) continue;
-    conversation ??= feedConversation;
-    feedQueryHashes.push(JSON.stringify(queryKey));
-  }
-  return conversation ? { conversation, feedQueryHashes } : undefined;
-}
-
 /** Fetch a bounded conversation snapshot and older pages on demand. */
 export function useConversationData(conversationId: string | undefined) {
   const queryClient = useQueryClient();

package/src/client/conversations/usePinConversation.ts

@@ -0,0 +1,88 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type {
+  ConversationDetailReport,
+  ConversationFeed,
+} from "@sentry/junior/api/schema";
+import { pinConversationResponseSchema } from "@sentry/junior/api/schema";
+
+import { patch } from "../http";
+import { conversationDetailQueryKey } from "./queries";
+
+type DetailCache = ConversationDetailReport & { detailEtag?: string };
+
+/**
+ * Pin or unpin one conversation for the viewer. The feed and detail caches
+ * change at once, so the row moves to or from the Pinned section before the
+ * request returns. A failed request puts the old caches back.
+ */
+export function usePinConversation(
+  conversationId: string,
+  options?: { onError?(pinned: boolean): void; onSuccess?(): void },
+) {
+  const queryClient = useQueryClient();
+  const feeds = { queryKey: ["dashboard", "conversations"] };
+  const detailQueryKey = conversationDetailQueryKey(conversationId);
+  const setPinnedAt = (pinnedAt: string | null) => {
+    // Match the API: a pin also restores an archived conversation.
+    const viewerMarks = pinnedAt
+      ? { archivedAt: null, pinnedAt }
+      : { pinnedAt };
+    queryClient.setQueriesData<ConversationFeed>(feeds, (feed) =>
+      feed
+        ? {
+            ...feed,
+            conversations: feed.conversations.map((conversation) =>
+              conversation.conversationId === conversationId
+                ? { ...conversation, ...viewerMarks }
+                : conversation,
+            ),
+          }
+        : feed,
+    );
+    // Clear the etag so the next read gets a full body, not a 304 that keeps
+    // this local value.
+    queryClient.setQueryData<DetailCache>(detailQueryKey, (detail) =>
+      detail ? { ...detail, ...viewerMarks, detailEtag: undefined } : detail,
+    );
+  };
+  return useMutation({
+    mutationFn: (pinned: boolean) =>
+      patch(
+        pinConversationResponseSchema,
+        `/api/conversations/${encodeURIComponent(conversationId)}/pin`,
+        { pinned },
+      ),
+    onMutate: async (pinned) => {
+      await Promise.all([
+        queryClient.cancelQueries(feeds),
+        queryClient.cancelQueries({ queryKey: detailQueryKey }),
+      ]);
+      const previous = {
+        detail: queryClient.getQueryData<DetailCache>(detailQueryKey),
+        feeds: queryClient.getQueriesData<ConversationFeed>(feeds),
+      };
+      setPinnedAt(pinned ? new Date().toISOString() : null);
+      return previous;
+    },
+    onError: (_error, pinned, previous) => {
+      previous?.feeds.forEach(([queryKey, feed]) => {
+        queryClient.setQueryData(queryKey, feed);
+      });
+      queryClient.setQueryData(detailQueryKey, previous?.detail);
+      options?.onError?.(pinned);
+    },
+    onSuccess: (result) => {
+      setPinnedAt(result.pinnedAt);
+      options?.onSuccess?.();
+    },
+    // A reader's first pin adds the conversation to their feed.
+    onSettled: () =>
+      Promise.all([
+        queryClient.invalidateQueries(feeds),
+        queryClient.invalidateQueries({
+          exact: true,
+          queryKey: detailQueryKey,
+        }),
+      ]),
+  });
+}