Implement Monlet MVP stack and UI updates

web/src/components/Pager.tsx

@@ -0,0 +1,33 @@
+import Link from "next/link";
+
+export function Pager({
+  basePath,
+  cursor,
+  nextCursor,
+  extra = {},
+}: {
+  basePath: string;
+  cursor?: string;
+  nextCursor?: string | null;
+  extra?: Record<string, string | undefined>;
+}) {
+  const make = (c?: string) => {
+    const sp = new URLSearchParams();
+    for (const [k, v] of Object.entries(extra)) if (v) sp.set(k, v);
+    if (c) sp.set("cursor", c);
+    const qs = sp.toString();
+    return qs ? `${basePath}?${qs}` : basePath;
+  };
+  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">
+          next →
+        </Link>
+      ) : (
+        <span className="text-neutral-600">end</span>
+      )}
+    </div>
+  );
+}