camox 0.63.0 → 0.66.0

package/dist/features/studio/components/Patrol.js

@@ -5,20 +5,25 @@ import { useNavigate } from "../../navigation/navigation.js";
 import { AuthContext } from "../../../lib/auth.js";
 import { reads, useReadQuery } from "../../../lib/studio-reads.js";
 import { cn } from "../../../lib/utils.js";
+import { patrolMutations } from "../../../lib/queries.js";
 import { AssetLightbox } from "../../preview/components/AssetLightbox.js";
 import { BOTTOM_CARD_EDGES, CARD_BODY_EDGES } from "../../preview/components/SidebarStack.js";
 import { editCollectionItemPath } from "../routes.js";
-import { timeAgo } from "../draftLabel.js";
+import { studioStore } from "../studioStore.js";
+import { askAgentMessage, dismissLabel, dismissedSentence, findingSentence, fixLabel } from "../findingSentence.js";
 import { useShowInCanvas } from "../showInCanvas.js";
 import { Squareling } from "./Squareling.js";
+import { aboutSentence, whenTag } from "../patrollerBio.js";
 import { moreSentence, reportSentence, shortTimeAgo, whereReportLeads } from "../reportSentence.js";
-import { singleLocaleSentence, workingSentence } from "../workingSentence.js";
+import { workingSentence } from "../workingSentence.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { reportLocale } from "@camox/api-contract/patrol";
+import { useMutation } from "@tanstack/react-query";
+import { Button } from "@camox/ui/button";
 import { Popover, PopoverContent, PopoverTitle, PopoverTrigger } from "@camox/ui/popover";
 import { Badge } from "@camox/ui/badge";
-import { reportLocale } from "@camox/api-contract/patrol";
 
 //#region src/features/studio/components/Patrol.tsx
 /**
@@ -54,7 +59,7 @@ function Patrol(t0) {
 				children: "Patrol"
 			})
 		});
-		t4 = cn("bg-background min-h-0 flex-1 overflow-y-auto", CARD_BODY_EDGES);
+		t4 = cn("bg-background flex min-h-0 flex-1 flex-col overflow-y-auto", CARD_BODY_EDGES);
 		$[4] = t3;
 		$[5] = t4;
 	} else {
@@ -95,7 +100,7 @@ function Patrol(t0) {
 	return t7;
 }
 function ProjectPatrol(t0) {
-	const $ = c(36);
+	const $ = c(32);
 	const { projectId, inDraft } = t0;
 	let t1;
 	if ($[0] !== projectId) {
@@ -113,95 +118,100 @@ function ProjectPatrol(t0) {
 	const { data: locales } = useReadQuery(t2);
 	const [open, setOpen] = React.useState(null);
 	const now = useNow(3e4);
-	const [heldOrder, setHeldOrder] = React.useState(null);
-	const pointerIn = React.useRef(false);
-	let t3;
-	if ($[4] !== heldOrder || $[5] !== view) {
-		t3 = view && inHeldOrder(view, heldOrder);
-		$[4] = heldOrder;
-		$[5] = view;
-		$[6] = t3;
-	} else t3 = $[6];
-	const shown = t3;
-	let t4;
-	if ($[7] !== shown?.patrollers) {
-		t4 = shown?.patrollers.map(_temp).join(" ");
-		$[7] = shown?.patrollers;
-		$[8] = t4;
-	} else t4 = $[8];
-	const roster = useMovingRows(t4);
 	const [openFileId, setOpenFileId] = React.useState(null);
 	const showReport = useShowReport(inDraft, setOpenFileId);
-	if (!shown) return null;
-	let t5;
-	if ($[9] !== shown) {
-		t5 = () => setHeldOrder((held) => held ?? shown.patrollers.map(_temp2));
-		$[9] = shown;
-		$[10] = t5;
-	} else t5 = $[10];
-	const hold = t5;
+	const navigate = useNavigate();
+	let t3;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = patrolMutations.applyFix();
+		$[4] = t3;
+	} else t3 = $[4];
+	const applyFix = useMutation(t3);
+	let t4;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = patrolMutations.dismissFinding();
+		$[5] = t4;
+	} else t4 = $[5];
+	const dismissFinding = useMutation(t4);
+	if (!view) return null;
+	const t5 = locales?.length === 1;
 	let t6;
-	if ($[11] !== hold) {
-		t6 = (id_1) => {
-			setOpen(id_1);
-			if (id_1) hold();
-			else if (!pointerIn.current) setHeldOrder(null);
+	if ($[6] !== showReport) {
+		t6 = (shown) => {
+			setOpen(null);
+			showReport(shown);
 		};
-		$[11] = hold;
-		$[12] = t6;
-	} else t6 = $[12];
-	const openReports = t6;
+		$[6] = showReport;
+		$[7] = t6;
+	} else t6 = $[7];
 	let t7;
-	if ($[13] !== hold) {
-		t7 = () => {
-			pointerIn.current = true;
-			hold();
-		};
-		$[13] = hold;
-		$[14] = t7;
-	} else t7 = $[14];
+	if ($[8] !== applyFix || $[9] !== projectId) {
+		t7 = (finding) => applyFix.mutate({
+			projectId,
+			findingId: finding.id
+		});
+		$[8] = applyFix;
+		$[9] = projectId;
+		$[10] = t7;
+	} else t7 = $[10];
 	let t8;
-	if ($[15] !== open) {
-		t8 = () => {
-			pointerIn.current = false;
-			if (!open) setHeldOrder(null);
+	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = (patroller, finding_0) => {
+			setOpen(null);
+			studioStore.trigger.askAgent({ text: askAgentMessage(finding_0, patroller.role) });
 		};
-		$[15] = open;
-		$[16] = t8;
-	} else t8 = $[16];
-	const t9 = locales?.length === 1;
+		$[11] = t8;
+	} else t8 = $[11];
+	let t9;
+	if ($[12] !== dismissFinding || $[13] !== projectId) {
+		t9 = (finding_1) => dismissFinding.mutate({
+			projectId,
+			findingId: finding_1.id
+		});
+		$[12] = dismissFinding;
+		$[13] = projectId;
+		$[14] = t9;
+	} else t9 = $[14];
 	let t10;
-	if ($[17] !== openReports || $[18] !== showReport) {
-		t10 = (report) => {
-			openReports(null);
-			showReport(report);
+	if ($[15] !== navigate) {
+		t10 = (draft) => {
+			setOpen(null);
+			navigate({
+				to: window.location.href,
+				draft: draft.id
+			});
 		};
-		$[17] = openReports;
-		$[18] = showReport;
-		$[19] = t10;
-	} else t10 = $[19];
+		$[15] = navigate;
+		$[16] = t10;
+	} else t10 = $[16];
 	let t11;
-	if ($[20] !== inDraft || $[21] !== now || $[22] !== open || $[23] !== openReports || $[24] !== shown || $[25] !== t10 || $[26] !== t9) {
+	if ($[17] !== inDraft || $[18] !== now || $[19] !== open || $[20] !== t10 || $[21] !== t5 || $[22] !== t6 || $[23] !== t7 || $[24] !== t9 || $[25] !== view) {
 		t11 = /* @__PURE__ */ jsx(PatrolRoster, {
-			view: shown,
+			view,
 			now,
 			inDraft,
-			singleLocale: t9,
+			singleLocale: t5,
 			open,
-			onOpenChange: openReports,
-			onShow: t10
-		});
-		$[20] = inDraft;
-		$[21] = now;
-		$[22] = open;
-		$[23] = openReports;
-		$[24] = shown;
-		$[25] = t10;
-		$[26] = t9;
-		$[27] = t11;
-	} else t11 = $[27];
+			onOpenChange: setOpen,
+			onShow: t6,
+			onApply: t7,
+			onAsk: t8,
+			onDismiss: t9,
+			onOpenPatrolDraft: t10
+		});
+		$[17] = inDraft;
+		$[18] = now;
+		$[19] = open;
+		$[20] = t10;
+		$[21] = t5;
+		$[22] = t6;
+		$[23] = t7;
+		$[24] = t9;
+		$[25] = view;
+		$[26] = t11;
+	} else t11 = $[26];
 	let t12;
-	if ($[28] !== openFileId) {
+	if ($[27] !== openFileId) {
 		t12 = openFileId && /* @__PURE__ */ jsx(AssetLightbox, {
 			open: true,
 			onOpenChange: (open_0) => {
@@ -209,39 +219,27 @@ function ProjectPatrol(t0) {
 			},
 			fileId: openFileId
 		});
-		$[28] = openFileId;
-		$[29] = t12;
-	} else t12 = $[29];
+		$[27] = openFileId;
+		$[28] = t12;
+	} else t12 = $[28];
 	let t13;
-	if ($[30] !== roster || $[31] !== t11 || $[32] !== t12 || $[33] !== t7 || $[34] !== t8) {
-		t13 = /* @__PURE__ */ jsxs("div", {
-			ref: roster,
-			className: "relative",
-			onPointerEnter: t7,
-			onPointerLeave: t8,
-			children: [t11, t12]
-		});
-		$[30] = roster;
-		$[31] = t11;
-		$[32] = t12;
-		$[33] = t7;
-		$[34] = t8;
-		$[35] = t13;
-	} else t13 = $[35];
+	if ($[29] !== t11 || $[30] !== t12) {
+		t13 = /* @__PURE__ */ jsxs("div", { children: [t11, t12] });
+		$[29] = t11;
+		$[30] = t12;
+		$[31] = t13;
+	} else t13 = $[31];
 	return t13;
 }
-function _temp2(t0) {
-	const { id: id_0 } = t0;
-	return id_0;
-}
-function _temp(t0) {
-	const { id } = t0;
-	return id;
-}
+/** A report, as the Patrol shows its subject. */
+const shownOf = (report) => ({
+	...report,
+	locale: reportLocale(report.summary)
+});
 /**
-* Shows a report's subject where it is, in the report's locale, and on Live for a Live report seen
-* from a draft: a page, block or item selected on the Canvas, a record in its collection, or a
-* file, opened over the Canvas.
+* Shows a report's or a finding's subject where it is, in its locale, and on Live for a Live one
+* seen from a draft: a page, block or item selected on the Canvas, a record in its collection, or
+* a file, opened over the Canvas.
 */
 function useShowReport(inDraft, openFile) {
 	const $ = c(6);
@@ -254,7 +252,7 @@ function useShowReport(inDraft, openFile) {
 			const { place } = report;
 			if (!place) return;
 			const toLive = inDraft && report.live ? { draft: null } : {};
-			const tag = reportLocale(report.summary);
+			const tag = report.locale;
 			if (place.kind === "page") {
 				const { pageId, blockId, itemId } = place;
 				showInCanvas({
@@ -290,70 +288,10 @@ function useShowReport(inDraft, openFile) {
 	} else t0 = $[5];
 	return t0;
 }
-/**
-* The view with its patrollers in the order held, if any, and its latest content: patrollers the
-* order doesn't hold follow, in the view's order, and those no longer in the view are dropped.
-*/
-function inHeldOrder(view, order) {
-	if (!order) return view;
-	const place = (id) => {
-		const index = order.indexOf(id);
-		return index === -1 ? order.length : index;
-	};
-	return {
-		...view,
-		patrollers: [...view.patrollers].sort((a, b) => place(a.id) - place(b.id))
-	};
-}
-/** How long a patroller takes to move to its new place, in ms. */
-const MOVE_DURATION = 250;
-/** A strong ease-out: the move starts at once and settles gently. */
-const MOVE_EASING = "cubic-bezier(0.23, 1, 0.32, 1)";
-/**
-* Moves each patroller from where it showed to its new place when the order (a key of their ids)
-* changes, rather than jumping there. Without motion for editors who reduce it.
-*/
-function useMovingRows(order) {
-	const $ = c(2);
-	const node = React.useRef(null);
-	const last = React.useRef(null);
-	let t0;
-	if ($[0] !== order) {
-		t0 = () => {
-			const roster = node.current;
-			if (!roster) return;
-			const rows = [...roster.querySelectorAll("[data-patroller]")];
-			const tops = new Map(rows.map(_temp3));
-			const previous = last.current;
-			last.current = {
-				order,
-				tops
-			};
-			if (!previous || previous.order === order) return;
-			if (matchMedia("(prefers-reduced-motion: reduce)").matches) return;
-			for (const row_0 of rows) {
-				const from = previous.tops.get(row_0.dataset.patroller);
-				const to = tops.get(row_0.dataset.patroller);
-				if (from === void 0 || from === to) continue;
-				row_0.animate([{ transform: `translateY(${from - to}px)` }, { transform: "none" }], {
-					duration: MOVE_DURATION,
-					easing: MOVE_EASING
-				});
-			}
-		};
-		$[0] = order;
-		$[1] = t0;
-	} else t0 = $[1];
-	React.useLayoutEffect(t0);
-	return node;
-}
-function _temp3(row) {
-	return [row.dataset.patroller, row.offsetTop];
-}
 /** The time now, updated every `intervalMs`. */
 function useNow(intervalMs) {
 	const $ = c(3);
-	const [now, setNow] = React.useState(_temp4);
+	const [now, setNow] = React.useState(_temp);
 	let t0;
 	let t1;
 	if ($[0] !== intervalMs) {
@@ -372,62 +310,81 @@ function useNow(intervalMs) {
 	React.useEffect(t0, t1);
 	return now;
 }
-function _temp4() {
+function _temp() {
 	return Date.now();
 }
 /**
-* A `PatrolView`, in the order it gives: each patroller's avatar, role, and when it last worked,
-* opening its reports in a popover to the left. Live's reports carry a tag when a draft is viewed. In a
-* project with a single locale, the Translator invites the editor to add a language instead.
+* A `PatrolView`, in the order it gives, as avatars in rows of three, each over its role like a
+* story. Each opens its reports in a popover to the left, under its role and when it last worked,
+* or what it's on. Live's reports carry a tag when a draft is viewed. In a project with a single
+* locale, the Translator invites the editor to add a language instead.
 */
 function PatrolRoster(t0) {
-	const $ = c(17);
-	const { view, now, inDraft, singleLocale, open, onOpenChange, onShow } = t0;
+	const $ = c(27);
+	const { view, now, inDraft, singleLocale, open, onOpenChange, onShow, onApply, onAsk, onDismiss, onOpenPatrolDraft } = t0;
 	let t1;
-	if ($[0] !== inDraft || $[1] !== now || $[2] !== onOpenChange || $[3] !== onShow || $[4] !== open || $[5] !== singleLocale || $[6] !== view.patrollers) {
+	if ($[0] !== inDraft || $[1] !== now || $[2] !== onApply || $[3] !== onAsk || $[4] !== onDismiss || $[5] !== onOpenChange || $[6] !== onOpenPatrolDraft || $[7] !== onShow || $[8] !== open || $[9] !== singleLocale || $[10] !== view.patrolDraft || $[11] !== view.patrollers) {
 		let t2;
-		if ($[8] !== inDraft || $[9] !== now || $[10] !== onOpenChange || $[11] !== onShow || $[12] !== open || $[13] !== singleLocale) {
+		if ($[13] !== inDraft || $[14] !== now || $[15] !== onApply || $[16] !== onAsk || $[17] !== onDismiss || $[18] !== onOpenChange || $[19] !== onOpenPatrolDraft || $[20] !== onShow || $[21] !== open || $[22] !== singleLocale || $[23] !== view.patrolDraft) {
 			t2 = (patroller) => /* @__PURE__ */ jsx(PatrollerRow, {
 				patroller,
 				now,
 				inDraft,
-				idle: singleLocale ? singleLocaleSentence(patroller.id) : void 0,
+				singleLocale,
 				open: open === patroller.id,
 				onOpenChange: (next) => onOpenChange(next ? patroller.id : null),
-				onShow
+				onShow,
+				onApply,
+				onAsk,
+				onDismiss,
+				patrolDraft: view.patrolDraft,
+				onOpenPatrolDraft
 			}, patroller.id);
-			$[8] = inDraft;
-			$[9] = now;
-			$[10] = onOpenChange;
-			$[11] = onShow;
-			$[12] = open;
-			$[13] = singleLocale;
-			$[14] = t2;
-		} else t2 = $[14];
+			$[13] = inDraft;
+			$[14] = now;
+			$[15] = onApply;
+			$[16] = onAsk;
+			$[17] = onDismiss;
+			$[18] = onOpenChange;
+			$[19] = onOpenPatrolDraft;
+			$[20] = onShow;
+			$[21] = open;
+			$[22] = singleLocale;
+			$[23] = view.patrolDraft;
+			$[24] = t2;
+		} else t2 = $[24];
 		t1 = view.patrollers.map(t2);
 		$[0] = inDraft;
 		$[1] = now;
-		$[2] = onOpenChange;
-		$[3] = onShow;
-		$[4] = open;
-		$[5] = singleLocale;
-		$[6] = view.patrollers;
-		$[7] = t1;
-	} else t1 = $[7];
+		$[2] = onApply;
+		$[3] = onAsk;
+		$[4] = onDismiss;
+		$[5] = onOpenChange;
+		$[6] = onOpenPatrolDraft;
+		$[7] = onShow;
+		$[8] = open;
+		$[9] = singleLocale;
+		$[10] = view.patrolDraft;
+		$[11] = view.patrollers;
+		$[12] = t1;
+	} else t1 = $[12];
 	let t2;
-	if ($[15] !== t1) {
-		t2 = /* @__PURE__ */ jsx("ul", {
-			className: "flex flex-col gap-px p-1",
-			children: t1
-		});
-		$[15] = t1;
-		$[16] = t2;
-	} else t2 = $[16];
+	if ($[25] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			className: "px-1 py-3",
+			children: /* @__PURE__ */ jsx("ul", {
+				className: "mx-auto grid w-fit grid-cols-[repeat(3,5rem)] gap-y-3.5",
+				children: t1
+			})
+		});
+		$[25] = t1;
+		$[26] = t2;
+	} else t2 = $[26];
 	return t2;
 }
 /**
-* A thin, low-contrast arc travelling around a working patroller's avatar circle, or the whole
-* circle pulsing slowly under reduced motion. The motion lives in `studio.css`.
+* A thin, low-contrast arc travelling around a working patroller's avatar, where its story ring
+* goes, or the whole ring pulsing slowly under reduced motion. The motion lives in `studio.css`.
 */
 function WorkingArc() {
 	const $ = c(1);
@@ -436,12 +393,12 @@ function WorkingArc() {
 		t0 = /* @__PURE__ */ jsx("svg", {
 			"data-working-indicator": true,
 			"aria-hidden": true,
-			viewBox: "0 0 32 32",
-			className: "patrol-working text-foreground/30 pointer-events-none absolute inset-0 size-full",
+			viewBox: "0 0 36 36",
+			className: "patrol-working text-foreground/40 pointer-events-none absolute -inset-[3px] size-[calc(100%+6px)]",
 			children: /* @__PURE__ */ jsx("circle", {
-				cx: "16",
-				cy: "16",
-				r: "15.25",
+				cx: "18",
+				cy: "18",
+				r: "17.25",
 				pathLength: "100",
 				fill: "none",
 				stroke: "currentColor",
@@ -456,7 +413,7 @@ function WorkingArc() {
 }
 function PatrollerRow(t0) {
 	const $ = c(53);
-	const { patroller, now, inDraft, idle, open, onOpenChange, onShow } = t0;
+	const { patroller, now, inDraft, singleLocale, open, onOpenChange, onShow, onApply, onAsk, onDismiss, patrolDraft, onOpenPatrolDraft } = t0;
 	const statusId = React.useId();
 	let t1;
 	if ($[0] !== patroller.id || $[1] !== patroller.working) {
@@ -466,174 +423,471 @@ function PatrollerRow(t0) {
 		$[2] = t1;
 	} else t1 = $[2];
 	const working = t1;
-	let t2;
-	if ($[3] !== idle || $[4] !== now || $[5] !== patroller.lastActivityAt || $[6] !== working) {
-		t2 = working ?? idle ?? (patroller.lastActivityAt === null ? "" : timeAgo(patroller.lastActivityAt, now));
-		$[3] = idle;
-		$[4] = now;
-		$[5] = patroller.lastActivityAt;
+	const count = patroller.findings.length;
+	const t2 = open || void 0;
+	const t3 = working ? statusId : void 0;
+	let t4;
+	if ($[3] !== count || $[4] !== working) {
+		t4 = !working && /* @__PURE__ */ jsx("span", {
+			"aria-hidden": true,
+			className: cn("group-focus-visible/patroller:ring-ring/50 pointer-events-none absolute -inset-[3px] rounded-full border group-focus-visible/patroller:ring-[3px]", count > 0 ? "border-foreground border-[1.5px]" : "border-border")
+		});
+		$[3] = count;
+		$[4] = working;
+		$[5] = t4;
+	} else t4 = $[5];
+	let t5;
+	if ($[6] !== working) {
+		t5 = working && /* @__PURE__ */ jsx(WorkingArc, {});
 		$[6] = working;
-		$[7] = t2;
-	} else t2 = $[7];
-	const subtitle = t2;
-	const t3 = open || void 0;
-	const t4 = working ? statusId : void 0;
-	const t5 = working ? "working" : "idle";
-	let t6;
-	if ($[8] !== patroller.id || $[9] !== t5) {
-		t6 = /* @__PURE__ */ jsx(Squareling, {
-			variant: patroller.id,
-			status: t5,
-			className: "size-5"
+		$[7] = t5;
+	} else t5 = $[7];
+	const t6 = working ? "working" : patroller.duty === "off" ? "asleep" : "idle";
+	let t7;
+	if ($[8] !== patroller.id || $[9] !== t6) {
+		t7 = /* @__PURE__ */ jsx("span", {
+			className: "bg-muted group-hover/patroller:bg-muted-foreground/15 group-data-popup-open/patroller:bg-muted-foreground/15 flex size-full items-center justify-center rounded-full transition-colors",
+			children: /* @__PURE__ */ jsx(Squareling, {
+				variant: patroller.id,
+				status: t6,
+				className: "size-6"
+			})
 		});
 		$[8] = patroller.id;
-		$[9] = t5;
-		$[10] = t6;
-	} else t6 = $[10];
-	let t7;
-	if ($[11] !== working) {
-		t7 = working && /* @__PURE__ */ jsx(WorkingArc, {});
-		$[11] = working;
-		$[12] = t7;
-	} else t7 = $[12];
+		$[9] = t6;
+		$[10] = t7;
+	} else t7 = $[10];
 	let t8;
-	if ($[13] !== t6 || $[14] !== t7) {
-		t8 = /* @__PURE__ */ jsxs("span", {
-			className: "bg-muted relative flex size-8 shrink-0 items-center justify-center rounded-full",
-			children: [t6, t7]
+	if ($[11] !== count) {
+		t8 = count > 0 && /* @__PURE__ */ jsx("span", {
+			"data-findings-count": true,
+			"aria-label": `${count} open ${count === 1 ? "finding" : "findings"}`,
+			className: "bg-foreground text-background ring-background absolute -top-1.5 -right-1.5 flex h-4 min-w-4 items-center justify-center rounded-full px-1 text-[10px] font-medium tabular-nums ring-2",
+			children: count
 		});
-		$[13] = t6;
-		$[14] = t7;
-		$[15] = t8;
-	} else t8 = $[15];
+		$[11] = count;
+		$[12] = t8;
+	} else t8 = $[12];
 	let t9;
-	if ($[16] !== patroller.role) {
-		t9 = /* @__PURE__ */ jsx("span", {
-			"data-patroller-role": true,
-			className: "truncate text-sm font-medium",
-			children: patroller.role
+	if ($[13] !== t4 || $[14] !== t5 || $[15] !== t7 || $[16] !== t8) {
+		t9 = /* @__PURE__ */ jsxs("span", {
+			className: "relative flex size-10 shrink-0 transition-[scale] duration-200 ease-out group-hover/patroller:scale-105 group-active/patroller:scale-95 motion-reduce:transition-none",
+			children: [
+				t4,
+				t5,
+				t7,
+				t8
+			]
 		});
-		$[16] = patroller.role;
+		$[13] = t4;
+		$[14] = t5;
+		$[15] = t7;
+		$[16] = t8;
 		$[17] = t9;
 	} else t9 = $[17];
-	const t10 = working ? true : void 0;
-	let t11;
-	if ($[18] !== subtitle || $[19] !== t10) {
-		t11 = /* @__PURE__ */ jsx("span", {
-			"data-patroller-subtitle": true,
-			"aria-hidden": t10,
-			className: "text-muted-foreground truncate text-xs",
-			children: subtitle
+	let t10;
+	if ($[18] !== patroller.role) {
+		t10 = /* @__PURE__ */ jsx("span", {
+			"data-patroller-role": true,
+			className: "max-w-full truncate text-[11px] leading-4 font-medium",
+			children: patroller.role
 		});
-		$[18] = subtitle;
+		$[18] = patroller.role;
 		$[19] = t10;
-		$[20] = t11;
-	} else t11 = $[20];
-	let t12;
-	if ($[21] !== t11 || $[22] !== t9) {
-		t12 = /* @__PURE__ */ jsxs("span", {
-			className: "flex min-w-0 flex-col",
-			children: [t9, t11]
+	} else t10 = $[19];
+	let t11;
+	if ($[20] !== t10 || $[21] !== t3 || $[22] !== t9) {
+		t11 = /* @__PURE__ */ jsxs(PopoverTrigger, {
+			"aria-describedby": t3,
+			className: "group/patroller flex max-w-full min-w-0 cursor-pointer flex-col items-center gap-1 pt-[3px] outline-none",
+			children: [t9, t10]
 		});
-		$[21] = t11;
+		$[20] = t10;
+		$[21] = t3;
 		$[22] = t9;
-		$[23] = t12;
-	} else t12 = $[23];
+		$[23] = t11;
+	} else t11 = $[23];
+	let t12;
+	if ($[24] !== onAsk || $[25] !== patroller) {
+		t12 = (finding) => onAsk(patroller, finding);
+		$[24] = onAsk;
+		$[25] = patroller;
+		$[26] = t12;
+	} else t12 = $[26];
 	let t13;
-	if ($[24] !== t12 || $[25] !== t4 || $[26] !== t8) {
-		t13 = /* @__PURE__ */ jsxs(PopoverTrigger, {
-			"aria-describedby": t4,
-			className: "hover:bg-muted/60 data-popup-open:bg-muted/60 focus-visible:ring-ring/50 flex cursor-pointer items-center gap-2.5 rounded-lg px-2 py-1.5 text-left outline-none focus-visible:ring-[3px]",
-			children: [t8, t12]
-		});
-		$[24] = t12;
-		$[25] = t4;
-		$[26] = t8;
-		$[27] = t13;
-	} else t13 = $[27];
-	let t14;
-	if ($[28] !== patroller.role) {
-		t14 = /* @__PURE__ */ jsx(PopoverTitle, {
-			className: "text-sm",
-			children: patroller.role
-		});
-		$[28] = patroller.role;
-		$[29] = t14;
-	} else t14 = $[29];
-	let t15;
-	if ($[30] !== inDraft || $[31] !== now || $[32] !== onShow || $[33] !== patroller) {
-		t15 = /* @__PURE__ */ jsx(PatrollerReports, {
-			patroller,
-			now,
-			inDraft,
-			onShow
+	if ($[27] !== inDraft || $[28] !== now || $[29] !== onApply || $[30] !== onDismiss || $[31] !== onOpenPatrolDraft || $[32] !== onShow || $[33] !== patrolDraft || $[34] !== patroller || $[35] !== singleLocale || $[36] !== t12) {
+		t13 = /* @__PURE__ */ jsx(PopoverContent, {
+			sideOffset: 8,
+			className: "w-96 gap-3 p-4",
+			children: /* @__PURE__ */ jsx(PatrollerCard, {
+				patroller,
+				now,
+				inDraft,
+				singleLocale,
+				onShow,
+				onApply,
+				onAsk: t12,
+				onDismiss,
+				patrolDraft,
+				onOpenPatrolDraft
+			})
 		});
-		$[30] = inDraft;
-		$[31] = now;
+		$[27] = inDraft;
+		$[28] = now;
+		$[29] = onApply;
+		$[30] = onDismiss;
+		$[31] = onOpenPatrolDraft;
 		$[32] = onShow;
-		$[33] = patroller;
-		$[34] = t15;
-	} else t15 = $[34];
-	let t16;
-	if ($[35] !== t14 || $[36] !== t15) {
-		t16 = /* @__PURE__ */ jsxs(PopoverContent, {
-			side: "left",
-			align: "start",
-			sideOffset: 12,
-			className: "w-80 gap-2 p-3",
-			children: [t14, t15]
-		});
-		$[35] = t14;
-		$[36] = t15;
-		$[37] = t16;
-	} else t16 = $[37];
-	let t17;
-	if ($[38] !== onOpenChange || $[39] !== open || $[40] !== t13 || $[41] !== t16) {
-		t17 = /* @__PURE__ */ jsxs(Popover, {
+		$[33] = patrolDraft;
+		$[34] = patroller;
+		$[35] = singleLocale;
+		$[36] = t12;
+		$[37] = t13;
+	} else t13 = $[37];
+	let t14;
+	if ($[38] !== onOpenChange || $[39] !== open || $[40] !== t11 || $[41] !== t13) {
+		t14 = /* @__PURE__ */ jsxs(Popover, {
 			open,
 			onOpenChange,
-			children: [t13, t16]
+			children: [t11, t13]
 		});
 		$[38] = onOpenChange;
 		$[39] = open;
-		$[40] = t13;
-		$[41] = t16;
-		$[42] = t17;
-	} else t17 = $[42];
-	let t18;
+		$[40] = t11;
+		$[41] = t13;
+		$[42] = t14;
+	} else t14 = $[42];
+	let t15;
 	if ($[43] !== working) {
-		t18 = working && `Working: ${working.charAt(0).toLowerCase()}${working.slice(1)}`;
+		t15 = working && `Working: ${working.charAt(0).toLowerCase()}${working.slice(1)}`;
 		$[43] = working;
-		$[44] = t18;
-	} else t18 = $[44];
-	let t19;
-	if ($[45] !== statusId || $[46] !== t18) {
-		t19 = /* @__PURE__ */ jsx("span", {
+		$[44] = t15;
+	} else t15 = $[44];
+	let t16;
+	if ($[45] !== statusId || $[46] !== t15) {
+		t16 = /* @__PURE__ */ jsx("span", {
 			id: statusId,
 			"data-working-status": true,
 			role: "status",
 			className: "sr-only",
-			children: t18
+			children: t15
 		});
 		$[45] = statusId;
-		$[46] = t18;
-		$[47] = t19;
-	} else t19 = $[47];
-	let t20;
-	if ($[48] !== patroller.id || $[49] !== t17 || $[50] !== t19 || $[51] !== t3) {
-		t20 = /* @__PURE__ */ jsxs("li", {
+		$[46] = t15;
+		$[47] = t16;
+	} else t16 = $[47];
+	let t17;
+	if ($[48] !== patroller.id || $[49] !== t14 || $[50] !== t16 || $[51] !== t2) {
+		t17 = /* @__PURE__ */ jsxs("li", {
 			"data-patroller": patroller.id,
-			"data-open": t3,
-			className: "flex flex-col",
-			children: [t17, t19]
+			"data-open": t2,
+			className: "flex justify-center",
+			children: [t14, t16]
 		});
 		$[48] = patroller.id;
-		$[49] = t17;
-		$[50] = t19;
-		$[51] = t3;
-		$[52] = t20;
-	} else t20 = $[52];
-	return t20;
+		$[49] = t14;
+		$[50] = t16;
+		$[51] = t2;
+		$[52] = t17;
+	} else t17 = $[52];
+	return t17;
+}
+/**
+* A patroller's popover, a profile card: its avatar and role, a tag of when it works where the
+* editor is over what it does, what it's on while it works, then what it did.
+*/
+function PatrollerCard(t0) {
+	const $ = c(47);
+	let props;
+	let singleLocale;
+	if ($[0] !== t0) {
+		({singleLocale, ...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+		$[2] = singleLocale;
+	} else {
+		props = $[1];
+		singleLocale = $[2];
+	}
+	const { patroller, inDraft } = props;
+	let t1;
+	if ($[3] !== patroller.id || $[4] !== patroller.working) {
+		t1 = patroller.working && workingSentence(patroller.id, patroller.working);
+		$[3] = patroller.id;
+		$[4] = patroller.working;
+		$[5] = t1;
+	} else t1 = $[5];
+	const working = t1;
+	let t2;
+	if ($[6] !== inDraft || $[7] !== patroller.duty || $[8] !== patroller.id || $[9] !== singleLocale) {
+		t2 = whenTag(patroller.id, patroller.duty, inDraft, singleLocale);
+		$[6] = inDraft;
+		$[7] = patroller.duty;
+		$[8] = patroller.id;
+		$[9] = singleLocale;
+		$[10] = t2;
+	} else t2 = $[10];
+	const when = t2;
+	const t3 = working ? "working" : patroller.duty === "off" ? "asleep" : "idle";
+	let t4;
+	if ($[11] !== patroller.id || $[12] !== t3) {
+		t4 = /* @__PURE__ */ jsx(Squareling, {
+			variant: patroller.id,
+			status: t3,
+			className: "size-7"
+		});
+		$[11] = patroller.id;
+		$[12] = t3;
+		$[13] = t4;
+	} else t4 = $[13];
+	let t5;
+	if ($[14] !== working) {
+		t5 = working && /* @__PURE__ */ jsx(WorkingArc, {});
+		$[14] = working;
+		$[15] = t5;
+	} else t5 = $[15];
+	let t6;
+	if ($[16] !== t4 || $[17] !== t5) {
+		t6 = /* @__PURE__ */ jsxs("span", {
+			className: "bg-muted relative flex size-12 shrink-0 items-center justify-center rounded-full",
+			children: [t4, t5]
+		});
+		$[16] = t4;
+		$[17] = t5;
+		$[18] = t6;
+	} else t6 = $[18];
+	let t7;
+	if ($[19] !== patroller.role) {
+		t7 = /* @__PURE__ */ jsx(PopoverTitle, {
+			className: "min-w-0 text-base",
+			children: patroller.role
+		});
+		$[19] = patroller.role;
+		$[20] = t7;
+	} else t7 = $[20];
+	let t8;
+	if ($[21] !== t6 || $[22] !== t7) {
+		t8 = /* @__PURE__ */ jsxs("header", {
+			className: "flex items-center gap-3",
+			children: [t6, t7]
+		});
+		$[21] = t6;
+		$[22] = t7;
+		$[23] = t8;
+	} else t8 = $[23];
+	const t9 = when.runs ? "bg-emerald-500" : "bg-muted-foreground/40";
+	let t10;
+	if ($[24] !== t9) {
+		t10 = cn("size-1.5 rounded-full", t9);
+		$[24] = t9;
+		$[25] = t10;
+	} else t10 = $[25];
+	let t11;
+	if ($[26] !== t10) {
+		t11 = /* @__PURE__ */ jsx("span", {
+			"aria-hidden": true,
+			className: t10
+		});
+		$[26] = t10;
+		$[27] = t11;
+	} else t11 = $[27];
+	let t12;
+	if ($[28] !== t11 || $[29] !== when.label) {
+		t12 = /* @__PURE__ */ jsxs("span", {
+			"data-patroller-when": true,
+			className: "bg-muted text-muted-foreground inline-flex items-center gap-1.5 rounded-full py-0.5 pr-2.5 pl-2 text-xs font-medium",
+			children: [t11, when.label]
+		});
+		$[28] = t11;
+		$[29] = when.label;
+		$[30] = t12;
+	} else t12 = $[30];
+	let t13;
+	if ($[31] !== patroller.id) {
+		t13 = aboutSentence(patroller.id);
+		$[31] = patroller.id;
+		$[32] = t13;
+	} else t13 = $[32];
+	let t14;
+	if ($[33] !== t13) {
+		t14 = /* @__PURE__ */ jsx("p", {
+			"data-patroller-about": true,
+			className: "text-sm",
+			children: t13
+		});
+		$[33] = t13;
+		$[34] = t14;
+	} else t14 = $[34];
+	let t15;
+	if ($[35] !== t12 || $[36] !== t14) {
+		t15 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col items-start gap-1.5",
+			children: [t12, t14]
+		});
+		$[35] = t12;
+		$[36] = t14;
+		$[37] = t15;
+	} else t15 = $[37];
+	let t16;
+	if ($[38] !== working) {
+		t16 = working && /* @__PURE__ */ jsx("p", {
+			"data-patroller-working": true,
+			className: "bg-muted rounded-md px-2.5 py-1.5 text-xs",
+			children: working
+		});
+		$[38] = working;
+		$[39] = t16;
+	} else t16 = $[39];
+	let t17;
+	if ($[40] !== props) {
+		t17 = /* @__PURE__ */ jsx("div", {
+			className: "flex flex-col gap-2 border-t pt-3",
+			children: /* @__PURE__ */ jsx(PatrollerDetails, { ...props })
+		});
+		$[40] = props;
+		$[41] = t17;
+	} else t17 = $[41];
+	let t18;
+	if ($[42] !== t15 || $[43] !== t16 || $[44] !== t17 || $[45] !== t8) {
+		t18 = /* @__PURE__ */ jsxs(Fragment, { children: [
+			t8,
+			t15,
+			t16,
+			t17
+		] });
+		$[42] = t15;
+		$[43] = t16;
+		$[44] = t17;
+		$[45] = t8;
+		$[46] = t18;
+	} else t18 = $[46];
+	return t18;
+}
+/**
+* What a patroller's popover shows: its open findings with their actions, then its reports, then
+* the history of its dismissals.
+*/
+function PatrollerDetails(t0) {
+	const $ = c(23);
+	const { patroller, now, inDraft, onShow, onApply, onAsk, onDismiss, patrolDraft, onOpenPatrolDraft } = t0;
+	let t1;
+	if ($[0] !== inDraft || $[1] !== onApply || $[2] !== onAsk || $[3] !== onDismiss || $[4] !== onOpenPatrolDraft || $[5] !== onShow || $[6] !== patrolDraft || $[7] !== patroller.findings || $[8] !== patroller.id) {
+		t1 = patroller.findings.length > 0 && /* @__PURE__ */ jsx("ul", {
+			"data-findings": patroller.id,
+			className: "flex flex-col gap-2 text-xs",
+			children: patroller.findings.map((finding) => /* @__PURE__ */ jsxs("li", {
+				"data-finding": true,
+				className: "flex flex-col gap-1",
+				children: [/* @__PURE__ */ jsxs("span", {
+					className: "flex items-baseline gap-2",
+					children: [/* @__PURE__ */ jsx("span", {
+						"data-finding-sentence": true,
+						className: "min-w-0 flex-1",
+						children: findingSentence(finding)
+					}), inDraft && finding.live && /* @__PURE__ */ jsx(Badge, {
+						variant: "outline",
+						size: "sm",
+						children: "Live"
+					})]
+				}), /* @__PURE__ */ jsxs("span", {
+					className: "flex flex-wrap gap-1",
+					children: [
+						finding.place && /* @__PURE__ */ jsx(Button, {
+							variant: "outline",
+							size: "xs",
+							onClick: () => onShow(finding),
+							children: "Show"
+						}),
+						finding.fix && !finding.live && /* @__PURE__ */ jsx(Button, {
+							variant: "outline",
+							size: "xs",
+							onClick: () => onApply(finding),
+							children: fixLabel(finding.fix)
+						}),
+						inDraft && !finding.live && /* @__PURE__ */ jsx(Button, {
+							variant: "outline",
+							size: "xs",
+							onClick: () => onAsk(finding),
+							children: "Ask the agent"
+						}),
+						!inDraft && patrolDraft && /* @__PURE__ */ jsx(Button, {
+							variant: "outline",
+							size: "xs",
+							onClick: () => onOpenPatrolDraft(patrolDraft),
+							children: "Open the Patrol Draft"
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							size: "xs",
+							onClick: () => onDismiss(finding),
+							children: dismissLabel(finding.about)
+						})
+					]
+				})]
+			}, finding.id))
+		});
+		$[0] = inDraft;
+		$[1] = onApply;
+		$[2] = onAsk;
+		$[3] = onDismiss;
+		$[4] = onOpenPatrolDraft;
+		$[5] = onShow;
+		$[6] = patrolDraft;
+		$[7] = patroller.findings;
+		$[8] = patroller.id;
+		$[9] = t1;
+	} else t1 = $[9];
+	let t2;
+	if ($[10] !== inDraft || $[11] !== now || $[12] !== onShow || $[13] !== patroller) {
+		t2 = /* @__PURE__ */ jsx(PatrollerReports, {
+			patroller,
+			now,
+			inDraft,
+			onShow
+		});
+		$[10] = inDraft;
+		$[11] = now;
+		$[12] = onShow;
+		$[13] = patroller;
+		$[14] = t2;
+	} else t2 = $[14];
+	let t3;
+	if ($[15] !== now || $[16] !== patroller.dismissals || $[17] !== patroller.id) {
+		t3 = patroller.dismissals.length > 0 && /* @__PURE__ */ jsx("ul", {
+			"data-dismissals": patroller.id,
+			"aria-label": "Dismissed",
+			className: "text-muted-foreground flex flex-col gap-1 border-t pt-2 text-xs",
+			children: patroller.dismissals.map((dismissal) => /* @__PURE__ */ jsxs("li", {
+				"data-dismissal": true,
+				className: "flex items-baseline gap-2",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "min-w-0 flex-1",
+					children: `${dismissedSentence(dismissal.about)}: dismissed by ${dismissal.by.name}`
+				}), /* @__PURE__ */ jsx("time", {
+					dateTime: new Date(dismissal.at).toISOString(),
+					className: "shrink-0",
+					children: shortTimeAgo(dismissal.at, now)
+				})]
+			}, dismissal.id))
+		});
+		$[15] = now;
+		$[16] = patroller.dismissals;
+		$[17] = patroller.id;
+		$[18] = t3;
+	} else t3 = $[18];
+	let t4;
+	if ($[19] !== t1 || $[20] !== t2 || $[21] !== t3) {
+		t4 = /* @__PURE__ */ jsxs(Fragment, { children: [
+			t1,
+			t2,
+			t3
+		] });
+		$[19] = t1;
+		$[20] = t2;
+		$[21] = t3;
+		$[22] = t4;
+	} else t4 = $[22];
+	return t4;
 }
 /**
 * A patroller's reports, latest first, each with a Live tag when a draft is viewed and how long
@@ -643,6 +897,7 @@ function PatrollerReports(t0) {
 	const $ = c(16);
 	const { patroller, now, inDraft, onShow } = t0;
 	if (patroller.reports.length === 0 && patroller.more.length === 0) {
+		if (patroller.findings.length > 0 || patroller.dismissals.length > 0) return null;
 		let t1;
 		if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
 			t1 = /* @__PURE__ */ jsx("p", {
@@ -753,7 +1008,7 @@ function ReportSentence(t0) {
 	const t3 = `${sentence}: ${leads}`;
 	let t4;
 	if ($[8] !== onShow || $[9] !== report) {
-		t4 = () => onShow(report);
+		t4 = () => onShow(shownOf(report));
 		$[8] = onShow;
 		$[9] = report;
 		$[10] = t4;
@@ -776,4 +1031,4 @@ function ReportSentence(t0) {
 }
 
 //#endregion
-export { Patrol, PatrolRoster, PatrollerReports, inHeldOrder };
+export { Patrol, PatrolRoster, PatrollerCard, PatrollerDetails, PatrollerReports };