@sentry/junior-dashboard 0.276.0 → 0.277.0

package/src/client/pages/settings/AutoArchiveSettings.tsx

@@ -0,0 +1,145 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+
+import {
+  AUTO_ARCHIVE_MAX_GRACE_HOURS,
+  dashboardIdentitySchema,
+  type DashboardIdentity,
+} from "../../../api/schema";
+import { Button } from "../../components/ui/button";
+import { Checkbox } from "../../components/ui/checkbox";
+import { Field, FieldDescription, FieldLabel } from "../../components/ui/field";
+import { NativeSelect } from "../../components/ui/native-select";
+import { InlineError } from "../../components/InlineError";
+import { Card } from "../../components/layout/Card";
+import { useArchiveDoneConversations } from "../../conversations/autoArchiveQueries";
+import { patch } from "../../http";
+import type { DashboardCoreData } from "../../types";
+
+const dashboardCoreQueryKey = ["dashboard", "core"] as const;
+
+/** Grace periods offered in Settings, in hours. */
+const AUTO_ARCHIVE_GRACE_OPTIONS = [1, 6, 24, 72, AUTO_ARCHIVE_MAX_GRACE_HOURS];
+
+function formatArchivedCount(count: number): string {
+  if (count === 0) return "No done conversations to archive.";
+  return count === 1
+    ? "Archived 1 conversation."
+    : `Archived ${count} conversations.`;
+}
+
+function formatGraceHours(hours: number): string {
+  if (hours % 24 !== 0) return hours === 1 ? "1 hour" : `${hours} hours`;
+  const days = hours / 24;
+  if (days === 7) return "1 week";
+  return days === 1 ? "1 day" : `${days} days`;
+}
+
+/**
+ * Let the user turn auto-archive on for their conversations and pick how long
+ * finished work must stay quiet before Junior archives it.
+ */
+export function AutoArchiveSettings({
+  identity,
+}: {
+  identity: DashboardIdentity;
+}) {
+  const queryClient = useQueryClient();
+  const update = useMutation({
+    mutationFn: (
+      settings: Pick<
+        DashboardIdentity,
+        "autoArchiveDefault" | "autoArchiveGraceHours"
+      >,
+    ) => patch(dashboardIdentitySchema, "/api/me", settings),
+    onSuccess: (updated) => {
+      queryClient.setQueryData<DashboardCoreData>(
+        dashboardCoreQueryKey,
+        (current) => (current ? { ...current, me: updated } : current),
+      );
+    },
+  });
+  const archiveDone = useArchiveDoneConversations();
+  const enabled = identity.autoArchiveDefault ?? false;
+  const graceHours = identity.autoArchiveGraceHours ?? 24;
+  // Keep a saved value that is not a preset, so the select shows the truth.
+  const graceOptions = AUTO_ARCHIVE_GRACE_OPTIONS.includes(graceHours)
+    ? AUTO_ARCHIVE_GRACE_OPTIONS
+    : [...AUTO_ARCHIVE_GRACE_OPTIONS, graceHours].sort((a, b) => a - b);
+
+  return (
+    <Card className="mt-6 mb-0" padding="md" variant="raised">
+      <h2 className="m-0 text-lg font-bold">Conversations</h2>
+      <label className="mt-4 flex cursor-pointer items-start gap-3">
+        <Checkbox
+          checked={enabled}
+          className="mt-0.5"
+          disabled={update.isPending}
+          onCheckedChange={(checked) =>
+            update.mutate({ autoArchiveDefault: checked })
+          }
+        />
+        <span className="grid gap-0.5">
+          <span className="text-sm font-medium">
+            Auto-archive conversations when done
+          </span>
+          <span className="text-xs text-dashboard-text-muted">
+            Archive a conversation for you when all of its linked work, such as
+            pull requests, is merged or closed and nobody replies during the
+            wait time. You can change this for each conversation in its details.
+          </span>
+        </span>
+      </label>
+      <Field className="mt-5 max-w-xs">
+        <FieldLabel htmlFor="auto-archive-grace">Wait time</FieldLabel>
+        <NativeSelect
+          aria-describedby="auto-archive-grace-help"
+          disabled={update.isPending}
+          id="auto-archive-grace"
+          onChange={(event) =>
+            update.mutate({ autoArchiveGraceHours: Number(event.target.value) })
+          }
+          value={graceHours}
+        >
+          {graceOptions.map((hours) => (
+            <option key={hours} value={hours}>
+              {formatGraceHours(hours)}
+            </option>
+          ))}
+        </NativeSelect>
+        <FieldDescription id="auto-archive-grace-help">
+          How long finished work and the conversation stay quiet before archive.
+        </FieldDescription>
+      </Field>
+      {update.isError ? (
+        <InlineError className="mt-3">
+          Could not save this setting. Try again.
+        </InlineError>
+      ) : null}
+      <div className="mt-5 grid gap-1.5">
+        <div className="flex flex-wrap items-center gap-3">
+          <Button
+            disabled={archiveDone.isPending}
+            onClick={() => archiveDone.mutate()}
+            type="button"
+          >
+            {archiveDone.isPending ? "Archiving…" : "Archive done now"}
+          </Button>
+          {archiveDone.isSuccess ? (
+            <p className="m-0 text-sm text-dashboard-text-muted" role="status">
+              {formatArchivedCount(archiveDone.data.archived)}
+            </p>
+          ) : null}
+          {archiveDone.isError ? (
+            <InlineError>
+              Could not archive conversations. Try again.
+            </InlineError>
+          ) : null}
+        </div>
+        <p className="m-0 text-xs text-dashboard-text-muted">
+          Archive every done conversation once, without the wait time. Skips
+          conversations where you turned auto-archive off.
+        </p>
+      </div>
+    </Card>
+  );
+}

package/src/client/pages/settings/SettingsPage.tsx

@@ -24,6 +24,7 @@ import { InlineError } from "../../components/InlineError";
 import { Card } from "../../components/layout/Card";
 import { DashboardApiError, fetchDashboardJson, patch, put } from "../../http";
 import type { DashboardCoreData } from "../../types";
+import { AutoArchiveSettings } from "./AutoArchiveSettings";
 import { SettingsPageLayout } from "./SettingsPageLayout";
 
 const dashboardCoreQueryKey = ["dashboard", "core"] as const;
@@ -108,6 +109,7 @@ export function SettingsPage({ identity }: SettingsPageProps) {
       </form>
       <ConversationStartSetting />
       <ComposerAutocorrectSetting />
+      <AutoArchiveSettings identity={identity} />
       <CustomizationForm />
     </SettingsPageLayout>
   );

package/src/client/review-desk/ConversationReviewItems.tsx

@@ -3,6 +3,7 @@ import { useEffect, useRef, useState } from "react";
 import type { ReviewItemPayload } from "@sentry/junior/api/schema";
 
 import { LoadMorePagination } from "../components/Pagination";
+import { Collapsible, CollapsibleContent } from "../components/ui/collapsible";
 import {
   DetailsCard,
   DetailsList,
@@ -74,9 +75,9 @@ function ReviewItemRow(props: {
     if (props.defaultExpanded) setExpanded(true);
   }, [props.defaultExpanded]);
   return (
-    <>
+    <Collapsible className="min-w-0" onOpenChange={setExpanded} open={expanded}>
       <DetailsRow
-        expanded={expanded}
+        disclosure
         icon={<Inbox aria-hidden="true" className="size-3.5" />}
         meta={
           <span className="grid size-5 place-items-center">
@@ -86,14 +87,11 @@ function ReviewItemRow(props: {
             />
           </span>
         }
-        onToggle={() => setExpanded((value) => !value)}
         title={props.item.title}
       />
-      {expanded ? (
-        <div className="px-1.5 pb-1">
-          <ReviewItemCard item={props.item} />
-        </div>
-      ) : null}
-    </>
+      <CollapsibleContent className="px-1.5 pb-1">
+        <ReviewItemCard item={props.item} />
+      </CollapsibleContent>
+    </Collapsible>
   );
 }

package/src/client/review-desk/queries.ts

@@ -20,7 +20,8 @@ import {
 import { conversationDetailTitle } from "../format";
 import { fetchDashboardJson, post } from "../http";
 
-const REVIEW_ITEMS_QUERY_KEY = ["dashboard", "review-items"] as const;
+/** Prefix of every Review item read, for refreshes after a change. */
+export const REVIEW_ITEMS_QUERY_KEY = ["dashboard", "review-items"] as const;
 const COUNT_REFRESH_MS = 60_000;
 
 /**

package/src/client/types.ts

@@ -176,6 +176,7 @@ export type Conversation = {
   annotations?: ConversationSummaryReport["annotations"];
   sidebarAnnotations?: ConversationSummaryReport["sidebarAnnotations"];
   archivedAt?: string | null;
+  pinnedAt?: string | null;
   auxiliaryCosts?: ConversationSummaryReport["auxiliaryCosts"];
   channel?: string;
   channelName?: string;

package/src/conversation-cache.ts

@@ -1,7 +1,7 @@
 import { createHash } from "node:crypto";
 import type { MiddlewareHandler } from "hono";
 
-/** Revalidate dashboard detail reads only after the route checks viewer access. */
+/** Revalidate mock detail reads on content, after the route checks viewer access. */
 export const revalidateConversation: MiddlewareHandler = async (
   context,
   next,

package/src/mock-reporting/fixtures.ts

@@ -135,12 +135,36 @@ const DASHBOARD_QA_PLAN_CHECK_ID =
   "junior:internal:dashboard-qa:advisor-plan:claim-check";
 /** Process-local archive state so mock restore can be exercised in visual QA. */
 const mockArchivedConversationIds = new Set<string>([ARCHIVED_CONVERSATION_ID]);
+/** Process-local pins so the Pinned section can be exercised in visual QA. */
+const mockPinnedConversationIds = new Set<string>();
 
-/** Restore process-local archive state so tests sharing a worker do not leak state. */
-export function resetMockConversationArchiveState(): void {
+/** Process-local auto-archive choices for mock visual QA. */
+const mockAutoArchiveByConversationId = new Map<string, boolean>();
+
+/**
+ * Restore process-local archive, pin, and auto-archive state so tests sharing
+ * a worker do not leak state.
+ */
+export function resetMockConversationViewerState(): void {
   mockArchivedConversationIds.clear();
   mockArchivedConversationIds.add(ARCHIVED_CONVERSATION_ID);
+  mockPinnedConversationIds.clear();
+  mockAutoArchiveByConversationId.clear();
 }
+
+/** Add the viewer's mock archive and pin times to one conversation. */
+function withMockViewerState<T extends { conversationId: string }>(
+  report: T & { archivedAt?: string | null },
+): T & { archivedAt: string | undefined; pinnedAt: string | null } {
+  return {
+    ...report,
+    archivedAt: mockArchivedConversationIds.has(report.conversationId)
+      ? (report.archivedAt ?? iso(NOW_MS, -2 * 24 * 60 * 60_000))
+      : undefined,
+    pinnedAt: mockPinnedConversationIds.has(report.conversationId) ? NOW : null,
+  };
+}
+
 const PEOPLE_ACTIVITY_DAYS = 90;
 const PEOPLE_PROFILE_ACTIVITY_DAYS = 365;
 const PUBLIC_MOCK_CHANNEL_IDS = new Set([
@@ -1657,19 +1681,11 @@ function summaryFromConversation(
     ...summary,
     ...(activityPreview ? { activityPreview } : undefined),
   };
-  const withArchiveState = mockArchivedConversationIds.has(
-    conversation.conversationId,
-  )
-    ? {
-        ...summaryWithActivity,
-        archivedAt:
-          summaryWithActivity.archivedAt ?? iso(NOW_MS, -2 * 24 * 60 * 60_000),
-      }
-    : { ...summaryWithActivity, archivedAt: undefined };
-  return withArchiveState.channel &&
-    PUBLIC_MOCK_CHANNEL_IDS.has(withArchiveState.channel)
-    ? { ...withArchiveState, locationId: `mock:${withArchiveState.channel}` }
-    : withArchiveState;
+  const withViewerState = withMockViewerState(summaryWithActivity);
+  return withViewerState.channel &&
+    PUBLIC_MOCK_CHANNEL_IDS.has(withViewerState.channel)
+    ? { ...withViewerState, locationId: `mock:${withViewerState.channel}` }
+    : withViewerState;
 }
 
 function mockConversationFeed(nowMs: number): ConversationFeed {
@@ -1924,11 +1940,70 @@ export function setMockConversationArchived(
     (conversation) => conversation.conversationId === conversationId,
   );
   if (!exists) return undefined;
-  if (archived) mockArchivedConversationIds.add(conversationId);
-  else mockArchivedConversationIds.delete(conversationId);
+  if (archived) {
+    mockArchivedConversationIds.add(conversationId);
+    // Match the API: archive also unpins.
+    mockPinnedConversationIds.delete(conversationId);
+  } else {
+    mockArchivedConversationIds.delete(conversationId);
+    // Match the API: a manual restore turns auto-archive off.
+    mockAutoArchiveByConversationId.set(conversationId, false);
+  }
   return { archivedAt: archived ? NOW : null };
 }
 
+/** Pin or unpin one mock conversation for local dashboard visual QA. */
+export function setMockConversationPinned(
+  conversationId: string,
+  pinned: boolean,
+): { pinnedAt: string | null } | undefined {
+  const exists = mockConversations(NOW_MS).some(
+    (conversation) => conversation.conversationId === conversationId,
+  );
+  if (!exists) return undefined;
+  if (pinned) {
+    mockPinnedConversationIds.add(conversationId);
+    // Match the API: a pin also restores an archived conversation.
+    mockArchivedConversationIds.delete(conversationId);
+  } else {
+    mockPinnedConversationIds.delete(conversationId);
+  }
+  return { pinnedAt: pinned ? NOW : null };
+}
+
+/** Archive every done mock conversation once, like the archive-done API. */
+export function archiveMockDoneConversations(): { archived: number } {
+  let archived = 0;
+  for (const summary of mockConversationFeed(NOW_MS).conversations) {
+    if (
+      summary.archivedAt ||
+      summary.pinnedAt ||
+      !summary.assignedWork ||
+      summary.unfinishedWork ||
+      !summary.finishedWorkAt ||
+      mockAutoArchiveByConversationId.get(summary.conversationId) === false
+    ) {
+      continue;
+    }
+    mockArchivedConversationIds.add(summary.conversationId);
+    archived += 1;
+  }
+  return { archived };
+}
+
+/** Save a mock auto-archive choice for local dashboard visual QA. */
+export function setMockConversationAutoArchive(
+  conversationId: string,
+  autoArchive: boolean,
+): { autoArchive: boolean } | undefined {
+  const exists = mockConversations(NOW_MS).some(
+    (conversation) => conversation.conversationId === conversationId,
+  );
+  if (!exists) return undefined;
+  mockAutoArchiveByConversationId.set(conversationId, autoArchive);
+  return { autoArchive };
+}
+
 /** Return accepted mailbox rows for local dashboard visual QA. */
 export function readMockConversationPendingMessages(
   conversationId: string,
@@ -2151,22 +2226,23 @@ export function readMockConversationDetail(
     canFork:
       !parentConversationId &&
       conversationDetail.eventHistory.status !== "redacted",
+    ...(conversationDetail.isParticipant
+      ? {
+          autoArchive:
+            mockAutoArchiveByConversationId.get(conversationId) ?? false,
+        }
+      : undefined),
   };
-  const withArchiveState = mockArchivedConversationIds.has(conversationId)
-    ? {
-        ...detail,
-        archivedAt: detail.archivedAt ?? iso(NOW_MS, -2 * 24 * 60 * 60_000),
-      }
-    : { ...detail, archivedAt: undefined };
-  const events = withArchiveState.events.slice(-limit);
+  const withViewerState = withMockViewerState(detail);
+  const events = withViewerState.events.slice(-limit);
   const bounded =
-    events.length < withArchiveState.events.length && events[0]
+    events.length < withViewerState.events.length && events[0]
       ? {
-          ...withArchiveState,
+          ...withViewerState,
           events,
           previousCursor: mockBeforeCursor(conversationId, events[0].seq),
         }
-      : withArchiveState;
+      : withViewerState;
   return bounded.channel && PUBLIC_MOCK_CHANNEL_IDS.has(bounded.channel)
     ? { ...bounded, locationId: `mock:${bounded.channel}` }
     : bounded;

package/src/mock-reporting/routes.ts

@@ -7,6 +7,10 @@ import {
   actorProfileReportSchema,
   archiveConversationBodySchema,
   archiveConversationResponseSchema,
+  pinConversationBodySchema,
+  pinConversationResponseSchema,
+  archiveDoneConversationsResponseSchema,
+  conversationAutoArchiveSchema,
   conversationChildAgentsReportSchema,
   conversationDetailQuerySchema,
   conversationDetailReportSchema,
@@ -66,6 +70,9 @@ import {
   readMockAutomationExecutions,
   readMockAutomationList,
   setMockConversationArchived,
+  setMockConversationPinned,
+  setMockConversationAutoArchive,
+  archiveMockDoneConversations,
 } from "./fixtures";
 import { readMockConversationWatches } from "./watches";
 
@@ -289,6 +296,46 @@ export function createMockReportingApi(): Hono<{
       ? jsonResponse(archiveConversationResponseSchema, result)
       : errorResponse("Conversation not found.", 404);
   });
+  app.patch("/conversations/:conversationId/pin", async (c) => {
+    const params = conversationParamsSchema.safeParse(c.req.param());
+    if (!params.success) {
+      return errorResponse("Invalid route parameters.", 400);
+    }
+    const body = pinConversationBodySchema.safeParse(await c.req.json());
+    if (!body.success) {
+      return errorResponse("Invalid request body.", 400);
+    }
+    const result = setMockConversationPinned(
+      params.data.conversationId,
+      body.data.pinned,
+    );
+    return result
+      ? jsonResponse(pinConversationResponseSchema, result)
+      : errorResponse("Conversation not found.", 404);
+  });
+  app.post("/conversations/archive-done", () =>
+    jsonResponse(
+      archiveDoneConversationsResponseSchema,
+      archiveMockDoneConversations(),
+    ),
+  );
+  app.patch("/conversations/:conversationId/auto-archive", async (c) => {
+    const params = conversationParamsSchema.safeParse(c.req.param());
+    if (!params.success) {
+      return errorResponse("Invalid route parameters.", 400);
+    }
+    const body = conversationAutoArchiveSchema.safeParse(await c.req.json());
+    if (!body.success) {
+      return errorResponse("Invalid request body.", 400);
+    }
+    const result = setMockConversationAutoArchive(
+      params.data.conversationId,
+      body.data.autoArchive,
+    );
+    return result
+      ? jsonResponse(conversationAutoArchiveSchema, result)
+      : errorResponse("Conversation not found.", 404);
+  });
   // Fixed bodies so dashboard mock can exercise image/file attachment cards.
   app.get("/conversations/:conversationId/attachments/:attachmentId", (c) => {
     const conversationId = c.req.param("conversationId");