backoffice nextJs replaces admin in rust

apps/backoffice/app/tokens/page.tsx

@@ -0,0 +1,66 @@
+import { listTokens } from "../../lib/api";
+
+export const dynamic = "force-dynamic";
+
+export default async function TokensPage({
+  searchParams
+}: {
+  searchParams: Promise<{ created?: string }>;
+}) {
+  const params = await searchParams;
+  const tokens = await listTokens().catch(() => []);
+
+  return (
+    <>
+      <h1>API Tokens</h1>
+
+      {params.created ? (
+        <div className="card">
+          <strong>Token created:</strong>
+          <pre>{params.created}</pre>
+        </div>
+      ) : null}
+
+      <div className="card">
+        <form action="/tokens/create" method="post">
+          <input name="name" placeholder="token name" required />
+          <select name="scope" defaultValue="read">
+            <option value="read">read</option>
+            <option value="admin">admin</option>
+          </select>
+          <button type="submit">Create Token</button>
+        </form>
+      </div>
+
+      <table>
+        <thead>
+          <tr>
+            <th>Name</th>
+            <th>Scope</th>
+            <th>Prefix</th>
+            <th>Revoked</th>
+            <th>Actions</th>
+          </tr>
+        </thead>
+        <tbody>
+          {tokens.map((token) => (
+            <tr key={token.id}>
+              <td>{token.name}</td>
+              <td>{token.scope}</td>
+              <td>
+                <code>{token.prefix}</code>
+              </td>
+              <td>{token.revoked_at ? "yes" : "no"}</td>
+              <td>
+                <form className="inline" action="/tokens/revoke" method="post">
+                  <input type="hidden" name="id" value={token.id} />
+                  <button type="submit">Revoke</button>
+                </form>
+              </td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </>
+  );
+}