papilot 0.6.0 → 0.8.0

package/vendor/latex-review/src/web/review.tsx

@@ -18,8 +18,17 @@ import type {
 } from "../types.ts";
 import { PdfStrip } from "./PdfStrip.tsx";
 import { ChangeMap } from "./ChangeMap.tsx";
+import { EFFECTS_EVENT, EFFECTS_STORAGE, readExpandedEffects } from "./effect-preferences.ts";
 import { STATUS } from "./overview.tsx";
-import { t, tn, withLanguage } from "./i18n.ts";
+import { language, locale, t, tn, withLanguage } from "./i18n.ts";
+import {
+  ConfirmReferences,
+  ReferenceBanner,
+  ReferenceEntries,
+  risks,
+  useReferenceChecks,
+} from "./references.tsx";
+import { bindingLabel, readShortcuts, resolveShortcuts, shortcutAction, SHORTCUT_EVENT, SHORTCUT_STORAGE } from "./shortcuts.ts";
 import {
   STATE,
   buildStops,
@@ -91,12 +100,29 @@ function jobText(job: PageState["job"]) {
     ? job.ahead
       ? tn(
           job.ahead,
-          "Queued behind {n} other round…",
-          "Queued behind {n} other rounds…",
+          "Queued behind {n} update…",
+          "Queued behind {n} updates…",
         )
       : t("Queued…")
     : `${t(PHASE[job?.phase ?? ""] || "Starting")}…`;
 }
+
+function ReviewProgress({ value, total, label }: { value: number; total: number; label: string }) {
+  if (total === 0) return null;
+  return (
+    <div
+      className="meter review-progress"
+      role="progressbar"
+      aria-label={label}
+      aria-valuemin={0}
+      aria-valuemax={total}
+      aria-valuenow={value}
+      title={label}
+    >
+      <span aria-hidden="true"><span className="review-progress-value">{value}</span> / {total}</span>
+    </div>
+  );
+}
 export function ReviewApp({
   task,
   pinned,
@@ -119,15 +145,50 @@ export function ReviewApp({
       Record<string, PlaceView[] | "loading" | { error: string }>
     >({}),
     [composer, setComposer] = useState<Composer | null>(null),
+    // Accepting bibliography entries that are not verified waits for this.
+    [confirm, setConfirm] = useState<{
+      kind: Kind;
+      chosen: string[];
+      body: string;
+      items: { label: string; reasons: string[] }[];
+    } | null>(null),
     [draft, setDraft] = useState(""),
     [help, setHelp] = useState(false),
+    // A note can reveal a decided change without opening the history controls.
+    [linkedChange] = useState(() => {
+      const value = Number(new URLSearchParams(location.search).get("change") ?? -1);
+      return Number.isSafeInteger(value) && value >= 0 ? value : -1;
+    }),
     [history, setHistory] = useState(
-      Boolean(pinned) || new URLSearchParams(location.search).has("history"),
+      (Boolean(pinned) && linkedChange < 0) || new URLSearchParams(location.search).has("history"),
     );
   const paper = useRef<HTMLElement>(null),
     epoch = useRef(0),
     scrollUntil = useRef(0),
     snapshot = useRef({ state, detail, busy, composer, current });
+  const [shortcuts, setShortcuts] = useState(readShortcuts);
+  const [expandedEffects, setExpandedEffects] = useState(readExpandedEffects);
+  // Per-edit disclosure is temporary and scoped to its round. Changing the
+  // global preference resets those overrides without reloading the review.
+  const [effectOverrides, setEffectOverrides] = useState<Record<string, boolean>>({});
+  useEffect(() => {
+    const changed = (event: Event) => setExpandedEffects((event as CustomEvent).detail === true);
+    const stored = (event: StorageEvent) => { if (event.key === EFFECTS_STORAGE || event.key === null) setExpandedEffects(readExpandedEffects()); };
+    window.addEventListener(EFFECTS_EVENT, changed);
+    window.addEventListener('storage', stored);
+    return () => { window.removeEventListener(EFFECTS_EVENT, changed); window.removeEventListener('storage', stored); };
+  }, []);
+  useEffect(() => { setEffectOverrides({}); }, [expandedEffects]);
+  useEffect(() => {
+    const changed = (event: Event) => setShortcuts(resolveShortcuts((event as CustomEvent).detail));
+    const stored = (event: StorageEvent) => { if (event.key === SHORTCUT_STORAGE || event.key === null) setShortcuts(readShortcuts()); };
+    window.addEventListener(SHORTCUT_EVENT, changed);
+    window.addEventListener('storage', stored);
+    return () => { window.removeEventListener(SHORTCUT_EVENT, changed); window.removeEventListener('storage', stored); };
+  }, []);
+  function showHelp() {
+    if (window.dispatchEvent(new Event('latex-review:help', { cancelable: true }))) setHelp(true);
+  }
   snapshot.current = { state, detail, busy, composer, current };
   const units = useMemo(
       () => new Map(detail?.units.map((u) => [u.id, u]) ?? []),
@@ -157,6 +218,13 @@ export function ReviewApp({
     undecided = Object.keys(decisions).filter(
       (id) => decisions[id] === "pending",
     ),
+    references = useReferenceChecks(detail, api),
+    hazards = useMemo(
+      () => risks(detail?.references, references.checks, references.pending, references.confirmed),
+      [detail, references.checks, references.pending, references.confirmed],
+    ),
+    // Batch acceptance leaves the changes whose entries need a look.
+    batch = undecided.filter((id) => !hazards.has(id)),
     latest = Boolean(
       detail && state && detail.round === state.latest && !state.closed,
     ),
@@ -164,6 +232,9 @@ export function ReviewApp({
     label = (kind: string) => t((changes ? CHANGE_ACTION : ACTION)[kind] ?? kind),
     stateLabel = (value: string) =>
       t((changes ? CHANGE_STATE : STATE)[value] ?? value);
+  // Keyboard handlers read the newest checks, not those of their render.
+  const hazardsNow = useRef(hazards);
+  hazardsNow.current = hazards;
   // What each button acts on: undecided changes, or in changes mode the
   // staged ones for Unstage and every change still on disk for Revert.
   const targets = (units: string[], kind: Kind) =>
@@ -184,7 +255,7 @@ export function ReviewApp({
           : [];
   const navigation = stops
     .map((stop, index) => ({ stop, index }))
-    .filter(({ stop }) => browsing || pendingUnits(stop, decisions).length)
+    .filter(({ stop, index }) => browsing || index === linkedChange || pendingUnits(stop, decisions).length)
     .map(({ index }) => index);
   const adjacent = (index: number, direction: number) =>
     navigation[navigation.indexOf(index) + direction] ?? -1;
@@ -247,11 +318,20 @@ export function ReviewApp({
         const article = paper.current?.querySelector<HTMLElement>(
           `[data-stop="${index}"]`,
         );
-        article?.scrollIntoView({ block: "start", behavior: "smooth" });
+        if (article) reveal(article, "smooth");
         article?.focus({ preventScroll: true });
       });
     }
   }
+  function reveal(article: HTMLElement, behavior: ScrollBehavior = "instant") {
+    const root = paper.current;
+    if (!root) return;
+    // scrollIntoView also scrolls ancestors across the embedding iframe.
+    // Navigation belongs to the paper, independently of the host's Chat.
+    const padding = parseFloat(getComputedStyle(root).scrollPaddingTop) || 0;
+    const margin = parseFloat(getComputedStyle(article).scrollMarginTop) || 0;
+    root.scrollTo({ top: root.scrollTop + article.getBoundingClientRect().top - root.getBoundingClientRect().top - padding - margin, behavior });
+  }
   useEffect(() => {
     let cancelled = false,
       timer: ReturnType<typeof setTimeout>;
@@ -302,6 +382,7 @@ export function ReviewApp({
             !pendingUnits(nextStops[index], loadedState.decisions).length
           )
             index = nextPending(nextStops, loadedState.decisions, index);
+          if (linkedChange >= 0 && nextStops[linkedChange]) index = linkedChange;
           if (index < 0) index = pinned && nextStops.length ? 0 : -1;
           if (
             previous.detail &&
@@ -314,7 +395,7 @@ export function ReviewApp({
           setCurrent(index);
           setOpenSource(new Set());
           if (previous.detail)
-            setToast(t("Round {round} is ready", { round: target }));
+            setToast(t("Changes are ready"));
         } else setState(next);
       } catch (e) {
         if (!cancelled) {
@@ -334,11 +415,10 @@ export function ReviewApp({
   }, [task, pinned]);
   useEffect(() => {
     if (detail && current >= 0)
-      requestAnimationFrame(() =>
-        paper.current
-          ?.querySelector<HTMLElement>(`[data-stop="${current}"]`)
-          ?.scrollIntoView({ block: "start" }),
-      );
+      requestAnimationFrame(() => {
+        const article = paper.current?.querySelector<HTMLElement>(`[data-stop="${current}"]`);
+        if (article) reveal(article);
+      });
   }, [detail?.round]);
   useEffect(() => {
     if (state) document.title = `${t(state.title)} · LaTeX Review`;
@@ -373,6 +453,7 @@ export function ReviewApp({
     kind: Kind,
     chosen = targets(stops[current]?.units ?? [], kind),
     body = "",
+    confirmed = false,
   ) {
     if (
       !chosen.length ||
@@ -382,6 +463,13 @@ export function ReviewApp({
       blocked(kind)
     )
       return;
+    if (kind === "accept" && !confirmed) {
+      const items = chosen.flatMap((id) => hazardsNow.current.get(id) ?? []);
+      if (items.length) {
+        setConfirm({ kind, chosen, body, items });
+        return;
+      }
+    }
     epoch.current++;
     setBusy(true);
     snapshot.current.busy = true;
@@ -490,11 +578,13 @@ export function ReviewApp({
   }
   useEffect(() => {
     const listener = (event: KeyboardEvent) => {
+      if (event.defaultPrevented || event.isComposing) return;
       const target = event.target as HTMLElement,
         typing =
           target.matches("input,textarea,select") || target.isContentEditable;
       if (event.key === "Escape") {
-        if (help) setHelp(false);
+        if (confirm) setConfirm(null);
+        else if (help) setHelp(false);
         else if (composer) closeComposer();
         return;
       }
@@ -507,53 +597,32 @@ export function ReviewApp({
         void submitComposer();
         return;
       }
-      if (typing || help) return;
-      if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "z") {
+      if (typing || help || confirm || window.getSelection()?.toString()) return;
+      if ((event.metaKey || event.ctrlKey) && !event.altKey && !event.shiftKey && event.key.toLowerCase() === "z") {
         event.preventDefault();
         void undo();
         return;
       }
-      if (
-        event.metaKey ||
-        event.ctrlKey ||
-        event.altKey ||
-        composer ||
-        window.getSelection()?.toString()
-      )
-        return;
-      const key = event.key.toLowerCase();
-      if (
-        [
-          "a",
-          "r",
-          "c",
-          "j",
-          "k",
-          "arrowright",
-          "arrowleft",
-          "n",
-          "s",
-          "u",
-          "?",
-        ].includes(key)
-      )
-        event.preventDefault();
-      if (key === "a")
+      if (composer) return;
+      const action = shortcutAction(event, shortcuts);
+      if (!action || (changes && action === 'comment')) return;
+      event.preventDefault();
+      if (action === 'accept')
         void decide(kinds(stops[current]?.units ?? [])[0] ?? "accept");
-      else if (key === "r") void decide("reject");
-      else if (key === "c" && !changes) beginComposer();
-      else if (key === "j" || key === "arrowright")
+      else if (action === 'reject') void decide("reject");
+      else if (action === 'comment') beginComposer();
+      else if (action === 'next')
         select(adjacent(current, 1));
-      else if (key === "k" || key === "arrowleft")
+      else if (action === 'previous')
         select(adjacent(current, -1));
-      else if (key === "n") select(nextPending(stops, decisions, current));
-      else if (key === "s") toggleSource(current);
-      else if (key === "u") void undo();
-      else if (key === "?") setHelp(true);
+      else if (action === 'pending') select(nextPending(stops, decisions, current));
+      else if (action === 'source') toggleSource(current);
+      else if (action === 'undo') void undo();
+      else if (action === 'help') showHelp();
     };
     window.addEventListener("keydown", listener);
     return () => window.removeEventListener("keydown", listener);
-  }, [state, detail, current, busy, composer, draft, help, history]);
+  }, [state, detail, current, busy, composer, draft, help, confirm, history, shortcuts]);
   function onScroll() {
     if (
       !paper.current ||
@@ -589,8 +658,8 @@ export function ReviewApp({
               <button
                 className="nav"
                 aria-label={t("Previous change")}
-                aria-keyshortcuts="k ArrowLeft"
-                title={t("Previous change (K or ←)")}
+                aria-keyshortcuts={shortcuts.previous.join(' ')}
+                title={[t('Previous change'), shortcuts.previous.map(bindingLabel).join(' / ')].filter(Boolean).join(' · ')}
                 disabled={adjacent(index, -1) < 0}
                 onClick={() => select(adjacent(index, -1))}
               >
@@ -604,16 +673,16 @@ export function ReviewApp({
           {available.length ? (
             <>
               {available.map((kind) => {
-                const key = kind === "unstage" ? "a" : kind[0],
+                const keys = shortcuts[kind === 'unstage' ? 'accept' : kind],
                   count = targets(units, kind).length;
                 return (
                   <button
                     className={kind}
                     key={kind}
-                    aria-keyshortcuts={key}
+                    aria-keyshortcuts={keys.join(' ')}
                     title={
                       actionLock(kind) ||
-                      `${label(kind)} (${key.toUpperCase()})`
+                      [label(kind), keys.map(bindingLabel).join(' / ')].filter(Boolean).join(' · ')
                     }
                     aria-describedby={
                       actionLock(kind) ? "review-lock" : undefined
@@ -632,7 +701,7 @@ export function ReviewApp({
           ) : remaining >= 0 ? (
             <button
               className="skip"
-              aria-keyshortcuts="n"
+              aria-keyshortcuts={shortcuts.pending.join(' ')}
               onClick={() => select(nextPending(stops, decisions, current))}
             >
               {changes ? t("Next unstaged") : t("Next undecided")}
@@ -643,15 +712,15 @@ export function ReviewApp({
                 ? stateLabel(stopState(units, decisions))
                 : latest
                   ? t("Review complete")
-                  : t("Earlier round")}
+                  : t("Earlier changes")}
             </span>
           )}
           {navigation.length > 1 && (
             <button
               className="nav"
               aria-label={t("Next change")}
-              aria-keyshortcuts="j ArrowRight"
-              title={t("Next change (J or →)")}
+              aria-keyshortcuts={shortcuts.next.join(' ')}
+              title={[t('Next change'), shortcuts.next.map(bindingLabel).join(' / ')].filter(Boolean).join(' · ')}
               disabled={adjacent(index, 1) < 0}
               onClick={() => select(adjacent(index, 1))}
             >
@@ -683,7 +752,10 @@ export function ReviewApp({
     clean: boolean,
   ): ReactNode {
     const { total, shown } = unit.effects!,
-      loaded = more[`${detail!.round}:${unit.id}`],
+      key = `${detail!.round}:${unit.id}`,
+      open = effectOverrides[key] ?? (expandedEffects || unit.visual === "unmapped" || unit.visual === "identical"),
+      bodyId = `effects-${detail!.round}-${unit.id}`,
+      loaded = more[key],
       places = [...shown, ...(Array.isArray(loaded) ? loaded : [])],
       strips = (items: Strip[], side: "before" | "after") =>
         items.length > 0 && (
@@ -705,47 +777,57 @@ export function ReviewApp({
     return (
       <section className="effects" key={unit.id}>
         <p className="effects-head">
-          {tn(total, "Affects {n} place", "Affects {n} places")}
-        </p>
-        {places.map((place, i) => (
-          <div className="place" key={i}>
-            <p className="place-where">
-              {t("p. {pages}", { pages: place.page })}
-              {place.section ? ` · ${place.section}` : ""}
-              {place.with
-                ? ` · ${t("with {changes}", {
-                    changes: place.with
-                      .map((id) =>
-                        firstStop.has(id)
-                          ? t("Change {n}", { n: firstStop.get(id)! + 1 })
-                          : (units.get(id)?.file ?? id),
-                      )
-                      .join(", "),
-                  })}`
-                : ""}
-            </p>
-            {strips(place.before, "before")}
-            {strips(place.after, "after")}
-          </div>
-        ))}
-        {total > places.length && (
-          <button
-            className="link more-places"
-            disabled={loaded === "loading"}
-            onClick={() => void loadPlaces(unit.id)}
-          >
-            {loaded === "loading"
-              ? t("Loading…")
-              : tn(
-                  total - places.length,
-                  "Show {n} more",
-                  "Show {n} more",
-                )}
+          <button className="link effects-toggle" aria-expanded={open} aria-controls={bodyId}
+            onClick={() => setEffectOverrides((values) => ({ ...values, [key]: !open }))}>
+            <span aria-hidden="true">{open ? "▾" : "▸"}</span>{" "}
+            {tn(total, "Affects {n} place", "Affects {n} places")}
           </button>
-        )}
-        {loaded && typeof loaded === "object" && "error" in loaded && (
-          <p className="caption">{loaded.error}</p>
-        )}
+        </p>
+        <div id={bodyId} hidden={!open}>
+          {open && (
+            <>
+              {places.map((place, i) => (
+                <div className="place" key={i}>
+                  <p className="place-where">
+                    {t("p. {pages}", { pages: place.page })}
+                    {place.section ? ` · ${place.section}` : ""}
+                    {place.with
+                      ? ` · ${t("with {changes}", {
+                          changes: place.with
+                            .map((id) =>
+                              firstStop.has(id)
+                                ? t("Change {n}", { n: firstStop.get(id)! + 1 })
+                                : (units.get(id)?.file ?? id),
+                            )
+                            .join(", "),
+                        })}`
+                      : ""}
+                  </p>
+                  {strips(place.before, "before")}
+                  {strips(place.after, "after")}
+                </div>
+              ))}
+              {total > places.length && (
+                <button
+                  className="link more-places"
+                  disabled={loaded === "loading"}
+                  onClick={() => void loadPlaces(unit.id)}
+                >
+                  {loaded === "loading"
+                    ? t("Loading…")
+                    : tn(
+                        total - places.length,
+                        "Show {n} more",
+                        "Show {n} more",
+                      )}
+                </button>
+              )}
+              {loaded && typeof loaded === "object" && "error" in loaded && (
+                <p className="caption">{loaded.error}</p>
+              )}
+            </>
+          )}
+        </div>
       </section>
     );
   }
@@ -755,11 +837,16 @@ export function ReviewApp({
     inline: boolean,
   ): ReactNode {
     const known = block.units.map((id) => units.get(id)!).filter(Boolean),
+      // A .bib edit is shown entry by entry, every field, rather than as
+      // the bibliography's typeset lines alone.
+      bib = detail!.references?.entries.filter((e) => (e.units ?? [e.unit]).some((id) => block.units.includes(id))) ?? [],
+      uncited = detail!.references?.missing.filter((m) => m.unit && block.units.includes(m.unit)) ?? [],
       status = stopState(block.units, decisions),
       reviewed = !pendingUnits(stops[index], decisions).length,
+      expanded = browsing || index === linkedChange,
       // A reverted change shows the text that is back on disk; staged and
       // unstaged ones keep their before and after.
-      resolved = history
+      resolved = history || index === linkedChange
         ? undefined
         : changes
           ? status === "rejected"
@@ -769,15 +856,17 @@ export function ReviewApp({
             (status === "commented" ? "after" : undefined),
       source =
         openSource.has(index) ||
-        block.identical ||
-        (!block.before.length && !block.after.length),
+        (!bib.length &&
+          (block.identical || (!block.before.length && !block.after.length))),
       remarks = [
         ...new Set(
           block.units.map((id) => state?.comments[id]).filter(Boolean),
         ),
       ],
       location = describeLocation(known, t),
-      kindLabel = block.reflow
+      kindLabel = bib.length
+        ? t("Bibliography")
+        : block.reflow
         ? t("Reflow")
         : [
             ...new Set(
@@ -808,17 +897,17 @@ export function ReviewApp({
     return (
       <article
         key={index}
-        className={`change ${inline ? "inline" : "standalone"}${current === index ? " current" : ""}${reviewed && !browsing ? " reviewed-change" : ""}${reviewed && !browsing && !resolved ? " mixed-reviewed" : ""}`}
+        className={`change ${inline ? "inline" : "standalone"}${current === index ? " current" : ""}${reviewed && !expanded ? " reviewed-change" : ""}${reviewed && !expanded && !resolved ? " mixed-reviewed" : ""}`}
         data-stop={index}
         data-state={status}
         data-resolved={resolved}
         tabIndex={-1}
         onClick={() => {
-          if (index !== current && !composer && (browsing || !reviewed))
+          if (index !== current && !composer && (expanded || !reviewed))
             select(index, false);
         }}
       >
-        {reviewed && !browsing && !resolved && (
+        {reviewed && !expanded && !resolved && (
           <p className="reviewed-placeholder">
             <button
               className="link"
@@ -861,7 +950,8 @@ export function ReviewApp({
           </button>
           <button
             className={`link ${source ? "active" : ""}`}
-            title={t("Show the LaTeX source (S)")}
+            title={[t('Show LaTeX source'), shortcuts.source.map(bindingLabel).join(' / ')].filter(Boolean).join(' · ')}
+            aria-keyshortcuts={shortcuts.source.join(' ')}
             onClick={() => toggleSource(index)}
           >
             {block.units.length > 1
@@ -876,9 +966,7 @@ export function ReviewApp({
               .map((h, i) => (
                 <p key={i}>
                   <strong>
-                    {t("Revised after your comment in round {round}: ", {
-                      round: h.round,
-                    })}
+                    {t("Revised after your comment: ")}
                   </strong>
                   “{h.comment}”
                 </p>
@@ -890,7 +978,7 @@ export function ReviewApp({
           block.before.length > 0 &&
           images(block.before, "before")}
         {block.after.length > 0 && images(block.after, "after")}
-        {block.identical && (
+        {block.identical && !bib.length && (
           <p className="caption">
             {t("No visible change in the PDF; see the LaTeX source.")}
           </p>
@@ -910,6 +998,25 @@ export function ReviewApp({
             ))}
           </div>
         )}
+        {uncited.length > 0 && (
+          <p className="reference-problem reference-uncited">
+            {uncited
+              .map((m) => t("Cites {key}, which no bibliography entry defines.", { key: m.key }))
+              .join(language() === "zh-CN" ? "" : " ")}
+          </p>
+        )}
+        {bib.length > 0 && (
+          <ReferenceEntries
+            entries={bib}
+            checks={references.checks}
+            pending={references.pending > 0}
+            onRetry={references.retry}
+            confirmed={references.confirmed}
+            onConfirm={(id, on) =>
+              void references.confirm(id, on).catch((e) => setToast((e as Error).message))
+            }
+          />
+        )}
         {source && (
           <div className="source">
             {known.map((unit) => (
@@ -1000,31 +1107,28 @@ export function ReviewApp({
             {changes
               ? t("Since the last commit")
               : detail
-                ? t("Round {round}", { round: detail.round }) +
-                  (detail.round !== state?.latest ? t(" (earlier round)") : "")
+                ? (detail.round === state?.latest ? t("Current changes") : t("Earlier changes"))
                 : ""}
           </span>
         </div>
-        {count.total > 0 && (
-          <div className="meter">
-            <span>
-              {changes
-                ? t("{staged} of {total} staged", {
-                    staged: count.accepted,
-                    total: count.accepted + count.pending,
-                  })
-                : t("{decided} of {total} decided", {
-                    decided: count.decided,
-                    total: count.total,
-                  })}
-            </span>
-          </div>
-        )}
+        <ReviewProgress
+          value={changes ? count.accepted : count.decided}
+          total={changes ? count.accepted + count.pending : count.total}
+          label={changes
+            ? t("{staged} of {total} staged", {
+                staged: count.accepted,
+                total: count.accepted + count.pending,
+              })
+            : t("{decided} of {total} decided", {
+                decided: count.decided,
+                total: count.total,
+              })}
+        />
         <div className="bar-end">
           {/* Batch decisions cover only undecided changes; accepted,
               rejected and commented changes keep their state. A single
               undecided change is decided from its own bar. */}
-          {count.pending > 1 && (
+          {count.pending > 1 && batch.length > 0 && (
             <button
               className="ghost accept accept-all"
               disabled={
@@ -1035,30 +1139,41 @@ export function ReviewApp({
               }
               title={
                 state?.decisionLock ||
-                (changes
-                  ? tn(
-                      count.pending,
-                      "Stage the {n} unstaged change.",
-                      "Stage the {n} unstaged changes.",
-                    )
-                  : tn(
-                      count.pending,
-                      "Accept the {n} undecided change in this round. Decided and commented changes stay as they are. Undo reverses the whole batch.",
-                      "Accept the {n} undecided changes in this round. Decided and commented changes stay as they are. Undo reverses the whole batch.",
-                    ))
+                [
+                  changes
+                    ? tn(
+                        batch.length,
+                        "Stage the {n} unstaged change.",
+                        "Stage the {n} unstaged changes.",
+                      )
+                    : tn(
+                        batch.length,
+                        "Accept {n} undecided change",
+                        "Accept {n} undecided changes",
+                      ),
+                  undecided.length > batch.length
+                    ? tn(
+                        undecided.length - batch.length,
+                        "Leaves {n} change with bibliography entries to check.",
+                        "Leaves {n} changes with bibliography entries to check.",
+                      )
+                    : "",
+                ]
+                  .filter(Boolean)
+                  .join(" ")
               }
               aria-label={
                 changes
-                  ? t("Stage all ({n})", { n: count.pending })
-                  : t("Accept all ({n})", { n: count.pending })
+                  ? t("Stage all ({n})", { n: batch.length })
+                  : t("Accept all ({n})", { n: batch.length })
               }
               aria-describedby={state?.decisionLock ? "review-lock" : undefined}
-              onClick={() => void decide("accept", undecided)}
+              onClick={() => void decide("accept", batch)}
             >
               <span className="batch-label">
                 {changes ? t("Stage all") : t("Accept all")}
               </span>
-              <span className="batch-count">{count.pending}</span>
+              <span className="batch-count">{batch.length}</span>
             </button>
           )}
           {count.pending > 1 && !changes && (
@@ -1074,8 +1189,8 @@ export function ReviewApp({
                 state?.decisionLock ||
                 tn(
                   count.pending,
-                  "Reject the {n} undecided change in this round. Decided and commented changes stay as they are. Undo reverses the whole batch.",
-                  "Reject the {n} undecided changes in this round. Decided and commented changes stay as they are. Undo reverses the whole batch.",
+                  "Reject {n} undecided change",
+                  "Reject {n} undecided changes",
                 )
               }
               aria-label={t("Reject all ({n})", { n: count.pending })}
@@ -1111,7 +1226,8 @@ export function ReviewApp({
             <button
               className="ghost undo"
               disabled={!latest || busy || Boolean(state.decisionLock)}
-              title={state.decisionLock || t("Put back what the last revert removed (U)")}
+              title={state.decisionLock || [t('Undo revert'), shortcuts.undo.map(bindingLabel).join(' / ')].filter(Boolean).join(' · ')}
+              aria-keyshortcuts={shortcuts.undo.join(' ')}
               onClick={() => void undo()}
             >
               {t("Undo revert")}
@@ -1122,7 +1238,7 @@ export function ReviewApp({
           {detail && !history && !changes && (
             <button
               className="ghost history"
-              title={t("Earlier decisions and rounds")}
+              title={t("Review history")}
               onClick={() => {
                 setHistory(true);
                 if (current < 0 && stops.length) setCurrent(0);
@@ -1134,7 +1250,7 @@ export function ReviewApp({
           <button
             className="ghost round"
             aria-label={t("Keyboard shortcuts")}
-            onClick={() => setHelp(true)}
+            onClick={showHelp}
           >
             ?
           </button>
@@ -1145,7 +1261,7 @@ export function ReviewApp({
           <label>
             {t("History")}{" "}
             <select
-              aria-label={t("Review round")}
+              aria-label={t("Review history")}
               value={detail.round}
               onChange={(e) => {
                 location.href = withLanguage(
@@ -1160,8 +1276,10 @@ export function ReviewApp({
                 .reverse()
                 .map((round) => (
                   <option key={round} value={round}>
-                    {t("Round {round}", { round })}
-                    {round === state?.latest ? t(" (latest)") : ""}
+                    {round === state?.latest ? t("Current changes") : (() => {
+                      const published = state?.history?.find(entry => entry.number === round)?.created;
+                      return published ? new Intl.DateTimeFormat(locale(), { dateStyle: "medium", timeStyle: "medium" }).format(new Date(published * 1000)) : t("Earlier changes");
+                    })()}
                   </option>
                 ))}
             </select>
@@ -1208,6 +1326,68 @@ export function ReviewApp({
       )}
       <div className="review-body">
         <main id="paper" ref={paper} tabIndex={-1} onScroll={onScroll}>
+          {changes && detail && !count.pending && (count.accepted > 0 || !stops.length) && (
+            <div className="review-complete" role="status" tabIndex={-1}>
+              <strong>
+                {count.accepted
+                  ? t("All changes are staged")
+                  : t("No uncommitted changes")}
+              </strong>
+              <span>
+                {count.accepted
+                  ? t("Commit them when you are ready.")
+                  : t("The PDF matches the last commit.")}
+              </span>
+              <div className="review-complete-actions" />
+            </div>
+          )}
+          {!changes && detail && !history && !count.pending && (
+            <div className="review-complete" role="status" tabIndex={-1}>
+              <strong>
+                {t(
+                  state?.workspace?.status === "waiting_input"
+                    ? "Agent needs your input"
+                    : state?.workspace?.status === "queued"
+                      ? "Feedback queued"
+                      : state?.workspace?.status === "running"
+                        ? "Feedback sent · Agent is working"
+                        : state?.workspace?.status === "building" ||
+                            state?.state === "building"
+                          ? "Preparing the next review…"
+                          : "All changes reviewed",
+                )}
+              </strong>
+              <span>
+                {t(
+                  state?.workspace?.status === "waiting_input"
+                    ? "Open Chat to answer the agent's question."
+                    : ["running", "queued", "building"].includes(
+                          state?.workspace?.status || "",
+                        ) || state?.state === "building"
+                      ? "New changes will appear here when ready."
+                      : state?.workspace?.comments
+                        ? "Your comments are saved. Send feedback so the agent can revise."
+                        : state?.workspace?.deferred
+                          ? state.workspace.accepted
+                            ? "Accepted changes are saved in this task. Choose where to save them below."
+                            : state.workspace.destination === "branch"
+                              ? "Accepted changes are committed to the task branch."
+                              : state.workspace.destination === "workspace"
+                                ? "Accepted changes are in your manuscript."
+                                : "There are no accepted changes to save."
+                        : state?.workspace?.accepted
+                          ? "Accepted changes are in your manuscript."
+                          : state?.workspace?.unsent && !count.accepted
+                            ? "Your decisions are saved. Send them to the agent to continue."
+                            : count.commented && !state?.workspace
+                              ? "Your comments are saved for the agent."
+                              : "There are no new changes to review. Previous decisions are available in History.",
+                )}
+              </span>
+              {/* A host such as Papilot puts its next step here, for example a commit. */}
+              <div className="review-complete-actions" />
+            </div>
+          )}
           {(state?.commentLock || state?.decisionLock) && (
             <div className="banner" id="review-lock" role="status">
               {t((state.commentLock || state.decisionLock)!)}
@@ -1240,15 +1420,15 @@ export function ReviewApp({
                     "Updating the comparison with your latest edits. You can keep staging and reverting meanwhile.",
                   )
                 : t(
-                    "The agent is publishing a new round. You can keep reviewing; the new round will include your decisions.",
+                    "Updating changes…",
                   )}
             </div>
           )}
           {!changes && detail && state?.latest && detail.round !== state.latest && (
             <div className="banner">
-              {t("You are viewing round {round}.", { round: detail.round })}{" "}
+              {t("Viewing earlier changes.")}{" "}
               <a href={withLanguage(`?task=${encodeURIComponent(task)}`)}>
-                {t("Go to round {round} →", { round: state.latest })}
+                {t("Back to current changes →")}
               </a>
             </div>
           )}
@@ -1266,60 +1446,19 @@ export function ReviewApp({
               </details>
             </div>
           ) : null}
-          {changes && detail && !count.pending && (count.accepted > 0 || !stops.length) && (
-            <div className="review-complete" role="status">
-              <strong>
-                {count.accepted
-                  ? t("All changes are staged")
-                  : t("No uncommitted changes")}
-              </strong>
-              <span>
-                {count.accepted
-                  ? t("Commit them when you are ready.")
-                  : t("The PDF matches the last commit.")}
-              </span>
-              <div className="review-complete-actions" />
-            </div>
-          )}
-          {!changes && detail && !history && !count.pending && (
-            <div className="review-complete" role="status">
-              <strong>
-                {t(
-                  state?.workspace?.status === "waiting_input"
-                    ? "Agent needs your input"
-                    : state?.workspace?.status === "queued"
-                      ? "Feedback queued"
-                      : state?.workspace?.status === "running"
-                        ? "Feedback sent · Agent is working"
-                        : state?.workspace?.status === "building" ||
-                            state?.state === "building"
-                          ? "Preparing the next review…"
-                          : "All changes reviewed",
-                )}
-              </strong>
-              <span>
-                {t(
-                  state?.workspace?.status === "waiting_input"
-                    ? "Open Chat to answer the agent's question."
-                    : ["running", "queued", "building"].includes(
-                          state?.workspace?.status || "",
-                        ) || state?.state === "building"
-                      ? "New changes will appear here when ready."
-                      : state?.workspace?.comments
-                        ? "Your comments are saved. Send feedback so the agent can revise."
-                        : state?.workspace?.accepted
-                          ? "Accepted changes are in your manuscript."
-                          : state?.workspace?.unsent && !count.accepted
-                            ? "Your decisions are saved. Send them to the agent to continue."
-                            : count.commented && !state?.workspace
-                              ? "Your comments are saved for the agent."
-                              : "There are no new changes to review. Previous decisions are available in History.",
-                )}
-              </span>
-              {/* A host such as Papilot puts its next step here, for example a commit. */}
-              <div className="review-complete-actions" />
-            </div>
-          )}
+          {detail?.references &&
+            (detail.references.entries.length > 0 ||
+              detail.references.missing.length > 0) && (
+              <ReferenceBanner
+                references={detail.references}
+                checks={references.checks}
+                pending={references.pending}
+                confirmed={references.confirmed}
+                changeOf={(unit) => (unit ? (firstStop.get(unit) ?? -1) : -1)}
+                onSelect={(index) => select(index)}
+                onRetry={references.retry}
+              />
+            )}
           <div className="document">
             {detail ? (
               <>
@@ -1356,16 +1495,14 @@ export function ReviewApp({
                 ))}
                 {detail.loose.length > 0 && (
                   <section className="part">
-                    <h2 className="part-title">
-                      {detail.sections.length
-                        ? t("Other changes")
-                        : t("Changes")}
-                    </h2>
+                    {detail.sections.length > 0 && (
+                      <h2 className="part-title">{t("Other changes")}</h2>
+                    )}
                     {detail.loose.map((block) => change(block, index++, false))}
                   </section>
                 )}
                 {!stops.length && !changes && (
-                  <p className="empty">{t("This round has no changes.")}</p>
+                  <p className="empty">{t("No changes to review.")}</p>
                 )}
               </>
             ) : error ? (
@@ -1442,6 +1579,18 @@ export function ReviewApp({
           {toast}
         </div>
       )}
+      {confirm && (
+        <ConfirmReferences
+          items={confirm.items}
+          staging={changes}
+          onCancel={() => setConfirm(null)}
+          onConfirm={() => {
+            const chosen = confirm;
+            setConfirm(null);
+            void decide(chosen.kind, chosen.chosen, chosen.body, true);
+          }}
+        />
+      )}
       {help && (
         <div className="help-backdrop" onClick={() => setHelp(false)}>
           <dialog
@@ -1453,26 +1602,28 @@ export function ReviewApp({
             <dl>
               {(changes
                 ? [
-                    ["A", "Stage or unstage"],
-                    ["R", "Revert"],
-                    ["J / K or → / ←", "Next / previous change"],
-                    ["N", "Next unstaged"],
-                    ["S", "Show LaTeX source"],
-                    ["⌘Z / U", "Undo revert"],
+                    [shortcuts.accept.map(bindingLabel).join(' / '), "Stage or unstage"],
+                    [shortcuts.reject.map(bindingLabel).join(' / '), "Revert"],
+                    [shortcuts.next.map(bindingLabel).join(' / '), "Next change"],
+                    [shortcuts.previous.map(bindingLabel).join(' / '), "Previous change"],
+                    [shortcuts.pending.map(bindingLabel).join(' / '), "Next unstaged"],
+                    [shortcuts.source.map(bindingLabel).join(' / '), "Show LaTeX source"],
+                    [["⌘Z / Ctrl+Z", ...shortcuts.undo.map(bindingLabel)].join(' / '), "Undo revert"],
                     ["⌘C / Ctrl+C", "Copy selected PDF text"],
                   ]
                 : [
-                    ["A", "Accept"],
-                    ["R", "Reject"],
-                    ["C", "Comment"],
-                    ["J / K or → / ←", "Next / previous change"],
-                    ["N", "Next undecided"],
-                    ["S", "Show LaTeX source"],
-                    ["⌘Z / U", "Undo"],
+                    [shortcuts.accept.map(bindingLabel).join(' / '), "Accept"],
+                    [shortcuts.reject.map(bindingLabel).join(' / '), "Reject"],
+                    [shortcuts.comment.map(bindingLabel).join(' / '), "Comment"],
+                    [shortcuts.next.map(bindingLabel).join(' / '), "Next change"],
+                    [shortcuts.previous.map(bindingLabel).join(' / '), "Previous change"],
+                    [shortcuts.pending.map(bindingLabel).join(' / '), "Next undecided"],
+                    [shortcuts.source.map(bindingLabel).join(' / '), "Show LaTeX source"],
+                    [["⌘Z / Ctrl+Z", ...shortcuts.undo.map(bindingLabel)].join(' / '), "Undo"],
                     ["⌘C / Ctrl+C", "Copy selected PDF text"],
                   ]
               ).map(([key, label]) => (
-                <Fragment key={key}>
+                <Fragment key={label}>
                   <dt>
                     <kbd>{t(key)}</kbd>
                   </dt>