From c0749d1af0c761230156649a767be49d45d98238 Mon Sep 17 00:00:00 2001
From: yiekheng <yiekheng@04080616.xyz>
Date: Sat, 2 May 2026 20:56:56 +0800
Subject: [PATCH] feat(web): add Server Component entry pages for / and /users

---
 web/app/page.tsx       | 81 ++++--------------------------------------
 web/app/users/page.tsx |  9 +++++
 2 files changed, 15 insertions(+), 75 deletions(-)
 create mode 100644 web/app/users/page.tsx

diff --git a/web/app/page.tsx b/web/app/page.tsx
index 24631a2..88a6007 100644
--- a/web/app/page.tsx
+++ b/web/app/page.tsx
@@ -1,78 +1,9 @@
-export default function Home() {
-  const hazardStripe = {
-    backgroundImage:
-      "repeating-linear-gradient(45deg, #facc15 0 24px, #18181b 24px 48px)",
-  };
+import { getAccounts } from "@/lib/api";
+import AccountsTable from "@/components/accounts-table";
 
-  return (
-    <main className="min-h-screen bg-white font-mono text-black">
-      {/* Top hazard stripe */}
-      <div className="h-6 w-full" style={hazardStripe} aria-hidden="true" />
+const PREFIX_PATTERN = process.env.NEXT_PUBLIC_CM_PREFIX_PATTERN ?? "13c";
 
-      <div className="mx-auto max-w-3xl px-6 py-16 sm:py-24">
-        {/* Status pill */}
-        <div className="mb-10 inline-flex items-center gap-2 border-2 border-black bg-yellow-300 px-3 py-1.5 text-[11px] font-black uppercase tracking-[0.2em] text-black">
-          <span className="h-1.5 w-1.5 bg-black" aria-hidden="true" />
-          Status: Scaffold
-        </div>
-
-        {/* Headline */}
-        <h1 className="text-5xl font-black uppercase tracking-tight text-black sm:text-7xl">
-          CM Bot V2
-        </h1>
-
-        {/* Subhead */}
-        <div className="mt-4 flex items-baseline gap-3">
-          <span className="text-xs font-bold uppercase tracking-[0.2em] text-zinc-400">
-            //
-          </span>
-          <p className="text-sm font-bold uppercase tracking-[0.2em] text-zinc-700 sm:text-base">
-            cm-web-next scaffold
-          </p>
-        </div>
-
-        {/* Notice */}
-        <div className="mt-14 border-2 border-black bg-white p-6 sm:p-8">
-          <div className="mb-3 text-[10px] font-black uppercase tracking-[0.25em] text-zinc-400">
-            Notice
-          </div>
-          <p className="text-base sm:text-xl">
-            This is a placeholder. The real dashboard lands in{" "}
-            <span className="bg-yellow-300 px-1.5 font-black">B2</span>.
-          </p>
-        </div>
-
-        {/* Architecture note */}
-        <div className="mt-6 border-2 border-dashed border-black/50 bg-zinc-50 p-6 sm:p-8">
-          <div className="mb-4 text-[10px] font-black uppercase tracking-[0.25em] text-zinc-400">
-            Architecture
-          </div>
-          <p className="text-sm text-zinc-800 sm:text-base">
-            No public{" "}
-            <code className="bg-black px-1.5 py-0.5 font-mono text-xs text-yellow-300">
-              /api
-            </code>{" "}
-            surface. Reads come from{" "}
-            <span className="font-bold">React Server Components</span> fetching{" "}
-            <code className="bg-black px-1.5 py-0.5 font-mono text-xs text-yellow-300">
-              api-server:3000
-            </code>{" "}
-            inside the docker network; mutations go through{" "}
-            <span className="font-bold">Server Actions</span>. The browser
-            never calls a JSON endpoint.
-          </p>
-        </div>
-
-        {/* Footer marker */}
-        <div className="mt-20 flex items-center gap-4 text-[10px] font-black uppercase tracking-[0.25em] text-zinc-500">
-          <span>B1</span>
-          <span className="h-px flex-1 bg-zinc-300" aria-hidden="true" />
-          <span>not for production</span>
-        </div>
-      </div>
-
-      {/* Bottom hazard stripe */}
-      <div className="h-6 w-full" style={hazardStripe} aria-hidden="true" />
-    </main>
-  );
+export default async function AccountsPage() {
+  const accounts = await getAccounts();
+  return <AccountsTable initial={accounts} prefixPattern={PREFIX_PATTERN} />;
 }
diff --git a/web/app/users/page.tsx b/web/app/users/page.tsx
new file mode 100644
index 0000000..da8c03e
--- /dev/null
+++ b/web/app/users/page.tsx
@@ -0,0 +1,9 @@
+import { getUsers } from "@/lib/api";
+import UsersTable from "@/components/users-table";
+
+const PREFIX_PATTERN = process.env.NEXT_PUBLIC_CM_PREFIX_PATTERN ?? "13c";
+
+export default async function UsersPage() {
+  const users = await getUsers();
+  return <UsersTable initial={users} prefixPattern={PREFIX_PATTERN} />;
+}