Harden production workflows and agent admission

web/src/components/Pager.tsx

@@ -2,27 +2,55 @@ import Link from "next/link";
 
 export function Pager({
   basePath,
-  cursor,
+  prevCursor,
   nextCursor,
+  page = 1,
   extra = {},
 }: {
   basePath: string;
-  cursor?: string;
+  prevCursor?: string | null;
   nextCursor?: string | null;
+  page?: number;
   extra?: Record<string, string | undefined>;
 }) {
-  const make = (c?: string) => {
+  const make = ({
+    nextPage,
+    nextPageCursor,
+    back,
+  }: {
+    nextPage: number;
+    nextPageCursor?: string;
+    back?: boolean;
+  }) => {
     const sp = new URLSearchParams();
     for (const [k, v] of Object.entries(extra)) if (v) sp.set(k, v);
-    if (c) sp.set("cursor", c);
+    if (nextPageCursor) sp.set("cursor", nextPageCursor);
+    if (back) sp.set("back", "1");
+    if (nextPage > 1) sp.set("page", String(nextPage));
     const qs = sp.toString();
     return qs ? `${basePath}?${qs}` : basePath;
   };
+
+  const previousHref =
+    page > 1 && prevCursor
+      ? make({ nextPage: page - 1, nextPageCursor: prevCursor, back: true })
+      : null;
+  const nextHref = nextCursor
+    ? make({ nextPage: page + 1, nextPageCursor: nextCursor })
+    : null;
+
   return (
     <div className="mt-4 flex justify-between text-sm">
-      <span className="text-neutral-500">{cursor ? `cursor: ${cursor.slice(0, 12)}…` : ""}</span>
-      {nextCursor ? (
-        <Link href={make(nextCursor)} className="text-blue-300 hover:text-blue-200">
+      {previousHref ? (
+        <Link href={previousHref} className="text-blue-300 hover:text-blue-200">
+          ← prev
+        </Link>
+      ) : (
+        <span className="text-neutral-600">← prev</span>
+      )}
+      <span className="text-neutral-500">page {page}</span>
+      {nextHref ? (
+        <Link href={nextHref} className="text-blue-300 hover:text-blue-200">
           next →
         </Link>
       ) : (