feat(admin): shared table shell

src/components/admin/admin-table.tsx

@@ -0,0 +1,70 @@
+import { cn } from "@/lib/cn";
+
+export function AdminTable({
+  headers,
+  children,
+  empty,
+}: {
+  headers: string[];
+  children: React.ReactNode;
+  empty?: string;
+}) {
+  const hasRows = Array.isArray(children)
+    ? children.length > 0
+    : Boolean(children);
+
+  if (!hasRows && empty) {
+    return (
+      <p className="rounded-[var(--radius-tile)] border border-dashed border-border-subtle p-8 text-center text-sm text-text-muted">
+        {empty}
+      </p>
+    );
+  }
+
+  return (
+    <div className="overflow-hidden rounded-[var(--radius-tile)] border border-border-subtle">
+      <table className="w-full text-left text-sm">
+        <thead className="bg-surface">
+          <tr>
+            {headers.map((header, index) => (
+              <th
+                key={header}
+                className={cn(
+                  "px-4 py-2.5 text-[11px] font-semibold uppercase tracking-wide text-text-muted",
+                  index === headers.length - 1 && "text-right"
+                )}
+              >
+                {header}
+              </th>
+            ))}
+          </tr>
+        </thead>
+        <tbody className="divide-y divide-[var(--border-subtle)]">
+          {children}
+        </tbody>
+      </table>
+    </div>
+  );
+}
+
+export function AdminCell({
+  children,
+  align = "left",
+  className,
+}: {
+  children: React.ReactNode;
+  align?: "left" | "right";
+  className?: string;
+}) {
+  return (
+    <td
+      className={cn(
+        "px-4 py-3 align-middle text-text-secondary",
+        align === "right" && "text-right",
+        className
+      )}
+    >
+      {children}
+    </td>
+  );
+}