Add accounts UI with list, create, edit, detail tabs for all sub-entities

Accounts list with paginated table, search, sort. Account detail page with
tabs for members, payment methods, tax exemptions, and processor links.
All sub-entities have create/edit dialogs and delete actions. Forms use
shared Zod schemas via react-hook-form.

packages/admin/src/routes/_authenticated/accounts/$accountId/members.tsx

@@ -0,0 +1,128 @@
+import { useState } from 'react'
+import { createFileRoute, useParams } from '@tanstack/react-router'
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
+import { memberListOptions, memberMutations, memberKeys } from '@/api/members'
+import { MemberForm } from '@/components/accounts/member-form'
+import { Button } from '@/components/ui/button'
+import { Badge } from '@/components/ui/badge'
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog'
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'
+import { Plus, Trash2 } from 'lucide-react'
+import { toast } from 'sonner'
+import type { Member } from '@/types/account'
+
+export const Route = createFileRoute('/_authenticated/accounts/$accountId/members')({
+  component: MembersTab,
+})
+
+function MembersTab() {
+  const { accountId } = useParams({ from: '/_authenticated/accounts/$accountId/members' })
+  const queryClient = useQueryClient()
+  const [dialogOpen, setDialogOpen] = useState(false)
+  const [editingMember, setEditingMember] = useState<Member | null>(null)
+
+  const { data, isLoading } = useQuery(memberListOptions(accountId, { page: 1, limit: 100, order: 'asc' }))
+
+  const createMutation = useMutation({
+    mutationFn: (data: Record<string, unknown>) => memberMutations.create(accountId, data),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: memberKeys.all(accountId) })
+      toast.success('Member added')
+      setDialogOpen(false)
+    },
+    onError: (err) => toast.error(err.message),
+  })
+
+  const updateMutation = useMutation({
+    mutationFn: (data: Record<string, unknown>) => memberMutations.update(editingMember!.id, data),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: memberKeys.all(accountId) })
+      toast.success('Member updated')
+      setEditingMember(null)
+    },
+    onError: (err) => toast.error(err.message),
+  })
+
+  const deleteMutation = useMutation({
+    mutationFn: memberMutations.delete,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: memberKeys.all(accountId) })
+      toast.success('Member removed')
+    },
+    onError: (err) => toast.error(err.message),
+  })
+
+  const members = data?.data ?? []
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between">
+        <h2 className="text-lg font-semibold">Members</h2>
+        <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
+          <DialogTrigger asChild>
+            <Button size="sm"><Plus className="mr-2 h-4 w-4" />Add Member</Button>
+          </DialogTrigger>
+          <DialogContent>
+            <DialogHeader><DialogTitle>Add Member</DialogTitle></DialogHeader>
+            <MemberForm accountId={accountId} onSubmit={createMutation.mutate} loading={createMutation.isPending} />
+          </DialogContent>
+        </Dialog>
+      </div>
+
+      {/* Edit dialog */}
+      <Dialog open={!!editingMember} onOpenChange={(open) => !open && setEditingMember(null)}>
+        <DialogContent>
+          <DialogHeader><DialogTitle>Edit Member</DialogTitle></DialogHeader>
+          {editingMember && (
+            <MemberForm
+              accountId={accountId}
+              defaultValues={editingMember}
+              onSubmit={updateMutation.mutate}
+              loading={updateMutation.isPending}
+            />
+          )}
+        </DialogContent>
+      </Dialog>
+
+      {isLoading ? (
+        <p className="text-muted-foreground">Loading...</p>
+      ) : members.length === 0 ? (
+        <p className="text-muted-foreground py-8 text-center">No members yet</p>
+      ) : (
+        <div className="rounded-md border">
+          <Table>
+            <TableHeader>
+              <TableRow>
+                <TableHead>Name</TableHead>
+                <TableHead>Email</TableHead>
+                <TableHead>Date of Birth</TableHead>
+                <TableHead>Status</TableHead>
+                <TableHead className="w-24">Actions</TableHead>
+              </TableRow>
+            </TableHeader>
+            <TableBody>
+              {members.map((m) => (
+                <TableRow key={m.id}>
+                  <TableCell className="font-medium">{m.firstName} {m.lastName}</TableCell>
+                  <TableCell>{m.email ?? '-'}</TableCell>
+                  <TableCell>{m.dateOfBirth ?? '-'}</TableCell>
+                  <TableCell>
+                    {m.isMinor ? <Badge variant="secondary">Minor</Badge> : <Badge>Adult</Badge>}
+                  </TableCell>
+                  <TableCell>
+                    <div className="flex gap-1">
+                      <Button variant="ghost" size="sm" onClick={() => setEditingMember(m)}>Edit</Button>
+                      <Button variant="ghost" size="sm" onClick={() => deleteMutation.mutate(m.id)}>
+                        <Trash2 className="h-4 w-4 text-destructive" />
+                      </Button>
+                    </div>
+                  </TableCell>
+                </TableRow>
+              ))}
+            </TableBody>
+          </Table>
+        </div>
+      )}
+    </div>
+  )
+}