hotfix(acks): paginate /api/acks and surface server-side aggregates

The Acks page silently capped at 100 of 1056 rows in the operator's
DB: the eyebrow read `${items.length} on file` (not the server's
`total`), the KPI strip summed from the 100 visible items, and the
endpoint accepted no `offset` — so the user had no signal that 956
more acks existed. Same class of bug on the Activity page (cap=200,
no 'X of Y' hint).

Backend
- /api/acks (acks.py): add `offset`, bump `le=1000`→`le=5000`,
  slice `rows[offset:offset+limit]`, return server-side
  `aggregates` (accepted/rejected/received summed over the full
  row set, not the page) so the KPI strip reflects every persisted
  999 instead of just the visible 50.
- /api/activity list + stream (api.py): bump `le=500`→`le=5000` so
  the page can ask for a denser snapshot.
- /api/277ca-acks (api.py): bump `le=1000`→`le=5000` for
  consistency.
- /api/ta1-acks: left at `le=1000` — TA1s aren't shipped today and
  the structural fix (offset + aggregates) wasn't applied, so a
  larger cap would just make the same latent silent-failure easier
  to hit. (TODO: fold in the same shape when Gainwell starts
  shipping TA1s.)

Frontend
- listAcks (api.ts): accept `offset`, surface `aggregates`,
  adapt wire `*_count` keys to the in-page
  `accepted`/`rejected`/`received` shape so the page can use
  `data.aggregates` as a drop-in for the page-local fallback
  accumulator.
- useAcks (hooks): pass `offset` through; return type carries
  `aggregates`.
- Acks.tsx: add `page` state (PAGE_SIZE=50), use `data.total`
  for eyebrow + watermark (not `items.length`), use
  `data.aggregates` for the KPI strip (with in-page fallback
  accumulator on first paint), render `<Pagination>` when
  `totalCount > PAGE_SIZE`. Footer row reads "N rows on file"
  instead of "N rows".
- ActivityLog.tsx: bump `limit: 200`→`limit: 500`, eyebrow reads
  "Activity · showing N most recent" to make the bounded-window
  semantics honest (the endpoint doesn't expose a true total — it
  reports events matching the current kind/since filter, capped at
  the request limit).

Tests
- test_acks.py: 4 new tests pin the fix:
  1. `offset` walks the full set; `has_more` flips at the
     boundary.
  2. `aggregates` reflects the full row set, not the page (the
     silent-failure pin) — and stays stable across page slices.
  3. `limit` cap of 5000 is enforced (422 above it).
  4. `offset` past the end returns an empty page with stable
     aggregates (a stale UI page state across a row count change
     must not 500 or zero the KPIs).

Live smoke-verified: /api/acks?limit=2&offset=0 vs ?offset=2 return
the expected row slices, aggregates stable at 15/10/15 for 5 seeded
rows, /api/acks?limit=10000 rejected with 422.

Triage note: the TA1 section (`Ta1AcksSection`, lines 609-616 of
Acks.tsx) has the same latent silent-failure pattern (page-sums
KPIs, no offset on /api/ta1-acks). Left untouched because the
empty-state copy says Gainwell doesn't ship TA1s today and the
larger structural fix belongs in a follow-up.

src/hooks/useAcks.ts

@@ -1,5 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import { api, type PaginatedResponse } from "@/lib/api";
+import { api, type AckAggregates, type PaginatedResponse } from "@/lib/api";
 import type { Ack } from "@/types";
 
 /**
@@ -7,9 +7,14 @@ import type { Ack } from "@/types";
  * intentionally has no in-memory fallback (there is no zustand
  * sample-data path for ACKs in v1 — the UI is empty until the
  * backend serves real rows).
+ *
+ * The response carries `aggregates` summed over the *full* row set
+ * (not just the visible page) so the KPI strip on the Acks page
+ * reflects every persisted 999 — without this, totals silently
+ * under-report once the row count exceeds the page size.
  */
-export function useAcks(params: { limit?: number } = {}) {
-  return useQuery<PaginatedResponse<Ack>>({
+export function useAcks(params: { limit?: number; offset?: number } = {}) {
+  return useQuery<PaginatedResponse<Ack> & { aggregates: AckAggregates }>({
     queryKey: ["acks", params],
     queryFn: () => api.listAcks(params),
     enabled: api.isConfigured,

src/lib/api.ts

@@ -160,6 +160,19 @@ export interface PaginatedResponse<T> {
   has_more: boolean;
 }
 
+/**
+ * Server-side aggregates returned alongside `/api/acks` — summed over
+ * the *full* persisted row set (not just the visible page). The
+ * `accepted` / `rejected` / `received` keys match the in-page `totals`
+ * shape so the page can use `data.aggregates` as a drop-in for the
+ * page-local fallback accumulator.
+ */
+export interface AckAggregates {
+  accepted: number;
+  rejected: number;
+  received: number;
+}
+
 /**
  * Lightweight summary used by the GET /api/batches list endpoint. Distinct
  * from the parser's `BatchSummary` (which lives in `@/types` and carries the
@@ -753,21 +766,37 @@ function mapAck(row: RawAckRow): Ack {
   };
 }
 
-async function listAcks(params: { limit?: number } = {}): Promise<PaginatedResponse<Ack>> {
+async function listAcks(
+  params: { limit?: number; offset?: number } = {},
+): Promise<
+  PaginatedResponse<Ack> & {
+    aggregates: AckAggregates;
+  }
+> {
   if (!isConfigured) throw notConfiguredError();
   const query: Record<string, unknown> = {};
   if (params.limit !== undefined) query.limit = params.limit;
+  if (params.offset !== undefined) query.offset = params.offset;
   const body = await authedFetch<{
     items: RawAckRow[];
     total: number;
     returned: number;
     has_more: boolean;
+    aggregates: { accepted_count: number; rejected_count: number; received_count: number };
   }>(`/api/acks${qs(query)}`);
   return {
     items: body.items.map(mapAck),
     total: body.total,
     returned: body.returned,
     has_more: body.has_more,
+    // Adapt the wire-format `*_count` keys to the in-page `totals` shape
+    // so the page can treat server-side and client-side-fallback objects
+    // interchangeably. See useAcks.ts for the matching AckAggregates type.
+    aggregates: {
+      accepted: body.aggregates.accepted_count,
+      rejected: body.aggregates.rejected_count,
+      received: body.aggregates.received_count,
+    },
   };
 }
 

src/pages/Acks.tsx

@@ -16,6 +16,7 @@ import { KpiCard } from "@/components/KpiCard";
 import { PageHeader } from "@/components/PageHeader";
 import { KeyboardCheatsheet } from "@/components/KeyboardCheatsheet";
 import { AckDrawer } from "@/components/AckDrawer";
+import { Pagination } from "@/components/ui/pagination";
 import { useAckDrawerUrlState } from "@/hooks/useAckDrawerUrlState";
 import { useAcks } from "@/hooks/useAcks";
 import { useTa1Acks } from "@/hooks/useTa1Acks";
@@ -25,6 +26,8 @@ import { fmt } from "@/lib/format";
 import { cn } from "@/lib/utils";
 import type { Ack, Ta1Ack } from "@/types";
 
+const PAGE_SIZE = 50;
+
 /**
  * 999 ACK register. The page reads the persisted 999 Implementation
  * Acknowledgments produced in response to 837P ingests (or parsed
@@ -39,8 +42,18 @@ import type { Ack, Ta1Ack } from "@/types";
  * instrument view of the same data.
  */
 export function Acks() {
-  const { data, isLoading, isError, error, refetch } = useAcks({ limit: 100 });
+  const [page, setPage] = useState(1);
+  const { data, isLoading, isError, error, refetch } = useAcks({
+    limit: PAGE_SIZE,
+    offset: (page - 1) * PAGE_SIZE,
+  });
   const items = data?.items ?? [];
+  const totalCount = data?.total ?? 0;
+  // Server-side aggregates — sum over the *full* ACK set, not just the
+  // visible page. Without this, the KPI strip silently under-reports
+  // once the row count exceeds PAGE_SIZE (the "silent failure" the
+  // operator flagged on 2026-06-29 when 1056 acks showed as 100).
+  const aggregates = data?.aggregates;
   // SP21 Phase 5 Task 5.3: drill-down from an acks row into
   // AckDrawer. The hook reads `?ack=` off `window.location.search`
   // so deep links restore the open ack on reload.
@@ -75,15 +88,16 @@ export function Acks() {
 
   // -----------------------------------------------------------------
   // Aggregate metrics for the KPI strip + hero copy.
+  // Sourced from the server-side `aggregates` field so the KPI strip
+  // reflects every persisted 999, not just the visible page. If
+  // `aggregates` hasn't loaded yet (first page), fall back to summing
+  // the visible items so the cards still display a meaningful value.
   // -----------------------------------------------------------------
-  const totals = items.reduce(
-    (acc, a) => ({
-      accepted: acc.accepted + a.acceptedCount,
-      rejected: acc.rejected + a.rejectedCount,
-      received: acc.received + a.receivedCount,
-    }),
-    { accepted: 0, rejected: 0, received: 0 },
-  );
+  const totals = aggregates ?? {
+    accepted: items.reduce((s, a) => s + a.acceptedCount, 0),
+    rejected: items.reduce((s, a) => s + a.rejectedCount, 0),
+    received: items.reduce((s, a) => s + a.receivedCount, 0),
+  };
   const acceptRate =
     totals.received > 0
       ? Math.round((totals.accepted / totals.received) * 1000) / 10
@@ -91,11 +105,16 @@ export function Acks() {
 
   // The ghost watermark carries the on-file count, scaled like the
   // Dashboard/Upload/Reconciliation watermarks (clamp 72–140px, 4.5%
-  // opacity, right-anchored).
-  const watermark = items.length > 0 ? items.length.toLocaleString() : "999";
+  // opacity, right-anchored). Use the server-reported total (not the
+  // page length) so the watermark tells the truth when there are more
+  // than PAGE_SIZE rows on file.
+  const watermark = totalCount > 0 ? totalCount.toLocaleString() : "999";
 
   // Tone for the status pill: green when nothing rejected, amber when
   // the register holds a partial/rejected payload.
+  // `anyRejected` is a "page" property, not a "totals" property — the
+  // status pill summarizes the visible register, so it's OK to scope
+  // it to the current page.
   const anyRejected = items.some(
     (a) => a.ackCode === "R" || a.ackCode === "E",
   );
@@ -147,7 +166,7 @@ export function Acks() {
           <div className="relative z-10 flex items-end justify-between gap-4 sm:gap-6 flex-wrap">
             <div className="min-w-0">
               <PageHeader
-                eyebrow={`999 ACKs · EDI reference · ${items.length} on file`}
+                eyebrow={`999 ACKs · EDI reference · ${totalCount.toLocaleString()} on file`}
                 title={
                   <>
                     Acknowledgments,{" "}
@@ -407,6 +426,14 @@ export function Acks() {
                     </Table>
                   </div>
                 )}
+                {totalCount > PAGE_SIZE ? (
+                  <Pagination
+                    page={page}
+                    pageSize={PAGE_SIZE}
+                    total={totalCount}
+                    onPageChange={setPage}
+                  />
+                ) : null}
               </div>
             </CardContent>
           </Card>
@@ -441,7 +468,8 @@ export function Acks() {
           </div>
           <div className="flex items-center gap-3 mono text-[10.5px] uppercase tracking-[0.18em] text-muted-foreground/60">
             <span>
-              {items.length} {items.length === 1 ? "row" : "rows"}
+              {totalCount.toLocaleString()}{" "}
+              {totalCount === 1 ? "row" : "rows"} on file
             </span>
             <span className="text-muted-foreground/30" aria-hidden>
               ·

src/pages/ActivityLog.tsx

@@ -68,7 +68,13 @@ export function ActivityLog() {
   const { data, isLoading, isError, error, refetch } = useActivity({
     kind: apiKind,
     since: sinceIso,
-    limit: 200,
+    // 500 keeps the wire size manageable (and the operator can rely
+    // on the live tail to surface new events as they land). The
+    // activity list endpoint doesn't expose a true total — `data.total`
+    // reflects events matching the current kind/since filter, capped
+    // at the request limit — so the eyebrow below uses "Showing N
+    // most recent" instead of "X of Y" to avoid a misleading ratio.
+    limit: 500,
   });
 
   const allItems = data?.items ?? [];
@@ -127,7 +133,11 @@ export function ActivityLog() {
   return (
     <div className="space-y-6 lg:space-y-8 animate-fade-in">
       <PageHeader
-        eyebrow="Activity"
+        eyebrow={
+          allItems.length > 0
+            ? `Activity · showing ${allItems.length.toLocaleString()} most recent`
+            : "Activity"
+        }
         title={<>Activity <span className="display italic text-muted-foreground">log</span></>}
         subtitle="Every claim submission, denial, payment, and provider event, in reverse chronological order. Auto-refreshes every 30s."
         actions={