feat(platform): residential module + admin UI + reliability fixes

Residential platform
- New schema: residentialClients, residentialInterests (separate from
  marina/yacht clients) with migration 0010
- Service layer with CRUD + audit + sockets + per-port portal toggle
- v1 + public API routes (/api/v1/residential/*, /api/public/residential-inquiries)
- List + detail pages with inline editing for clients and interests
- Per-user residentialAccess toggle on userPortRoles (migration 0011)
- Permission keys: residential_clients, residential_interests
- Sidebar nav + role form integration
- Smoke spec covering page loads, UI create flow, public endpoint

Admin & shared UI
- Admin → Forms (form templates CRUD) with validators + service
- Notification preferences page (in-app + email per type)
- Email composition + accounts list + threads view
- Branded auth shell shared across CRM + portal auth surfaces
- Inline editing extended to yacht/company/interest detail pages
- InlineTagEditor + per-entity tags endpoints (yachts, companies)
- Notes service polymorphic across clients/interests/yachts/companies
- Client list columns: yachtCount + companyCount badges
- Reservation file-download via presigned URL (replaces stale <a href>)

Route handler refactor
- Extracted yachts/companies/berths reservation handlers to sibling
  handlers.ts files (Next.js 15 route.ts only allows specific exports)

Reliability fixes
- apiFetch double-stringify bug fixed across 13 components
  (apiFetch already JSON.stringifies its body; passing a stringified
  body produced double-encoded JSON which failed zod validation)
- SocketProvider gated behind useSyncExternalStore-based mount check
  to avoid useSession() SSR crashes under React 19 + Next 15
- apiFetch falls back to URL-pathname → port-id resolution when the
  Zustand store hasn't hydrated yet (fresh contexts, e2e tests)
- CRM invite flow (schema, service, route, email, dev script)
- Dashboard route → [portSlug]/dashboard/page.tsx + redirect
- Document the dev-server restart-after-migration gotcha in CLAUDE.md

Tests
- 5-case residential smoke spec
- Integration test updates for new service signatures

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/app/(dashboard)/[portSlug]/admin/forms/page.tsx

@@ -1,16 +1,5 @@
+import { FormTemplateList } from '@/components/admin/forms/form-template-list';
+
 export default function FormTemplatesPage() {
-  return (
-    <div className="space-y-6">
-      <div>
-        <h1 className="text-2xl font-bold text-foreground">Form Templates</h1>
-        <p className="text-muted-foreground">Create and manage intake form templates</p>
-      </div>
-      <div className="flex flex-col items-center justify-center rounded-lg border border-dashed p-12">
-        <p className="text-lg font-medium text-muted-foreground">Coming in Layer 3</p>
-        <p className="text-sm text-muted-foreground">
-          This feature will be implemented in the next phase.
-        </p>
-      </div>
-    </div>
-  );
+  return <FormTemplateList />;
 }

src/app/(dashboard)/[portSlug]/dashboard/page.tsx

@@ -0,0 +1,5 @@
+import { DashboardShell } from '@/components/dashboard/dashboard-shell';
+
+export default function DashboardPage() {
+  return <DashboardShell />;
+}

src/app/(dashboard)/[portSlug]/email/page.tsx

@@ -1,16 +1,47 @@
+'use client';
+
+import { useState } from 'react';
+import { Send } from 'lucide-react';
+
+import { Button } from '@/components/ui/button';
+import { Tabs, TabsList, TabsTrigger, TabsContent } from '@/components/ui/tabs';
+import { EmailAccountsList } from '@/components/email/email-accounts-list';
+import { EmailThreadsList } from '@/components/email/email-threads-list';
+import { ComposeDialog } from '@/components/email/compose-dialog';
+
 export default function EmailPage() {
+  const [tab, setTab] = useState('threads');
+  const [composeOpen, setComposeOpen] = useState(false);
+
   return (
     <div className="space-y-6">
-      <div>
-        <h1 className="text-2xl font-bold text-foreground">Email</h1>
-        <p className="text-muted-foreground">Send and manage client communications</p>
-      </div>
-      <div className="flex flex-col items-center justify-center rounded-lg border border-dashed p-12">
-        <p className="text-lg font-medium text-muted-foreground">Coming in Layer 3</p>
-        <p className="text-sm text-muted-foreground">
-          This feature will be implemented in the next phase.
-        </p>
+      <div className="flex items-start justify-between gap-4">
+        <div>
+          <h1 className="text-2xl font-bold text-foreground">Email</h1>
+          <p className="text-muted-foreground">Send and manage client communications</p>
+        </div>
+        <Button onClick={() => setComposeOpen(true)}>
+          <Send className="h-4 w-4 mr-1.5" />
+          Compose
+        </Button>
       </div>
+
+      <Tabs value={tab} onValueChange={setTab}>
+        <TabsList>
+          <TabsTrigger value="threads">Inbox</TabsTrigger>
+          <TabsTrigger value="accounts">Accounts</TabsTrigger>
+        </TabsList>
+
+        <TabsContent value="threads" className="pt-4">
+          <EmailThreadsList />
+        </TabsContent>
+
+        <TabsContent value="accounts" className="pt-4">
+          <EmailAccountsList />
+        </TabsContent>
+      </Tabs>
+
+      <ComposeDialog open={composeOpen} onOpenChange={setComposeOpen} />
     </div>
   );
 }

src/app/(dashboard)/[portSlug]/notifications/preferences/page.tsx

@@ -0,0 +1,15 @@
+import { NotificationPreferencesForm } from '@/components/notifications/notification-preferences-form';
+
+export default function NotificationPreferencesPage() {
+  return (
+    <div className="max-w-2xl mx-auto py-6">
+      <div className="mb-6">
+        <h1 className="text-2xl font-bold">Notification Preferences</h1>
+        <p className="text-sm text-muted-foreground">
+          Choose which notifications you receive and how.
+        </p>
+      </div>
+      <NotificationPreferencesForm />
+    </div>
+  );
+}

src/app/(dashboard)/[portSlug]/page.tsx

@@ -1,5 +1,7 @@
-import { DashboardShell } from '@/components/dashboard/dashboard-shell';
+import { redirect } from 'next/navigation';
 
-export default function DashboardPage() {
-  return <DashboardShell />;
+export default async function PortIndexPage({ params }: { params: Promise<{ portSlug: string }> }) {
+  const { portSlug } = await params;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  redirect(`/${portSlug}/dashboard` as any);
 }

src/app/(dashboard)/[portSlug]/residential/clients/[id]/page.tsx

@@ -0,0 +1,10 @@
+import { ResidentialClientDetail } from '@/components/residential/residential-client-detail';
+
+interface Props {
+  params: Promise<{ id: string }>;
+}
+
+export default async function ResidentialClientDetailPage({ params }: Props) {
+  const { id } = await params;
+  return <ResidentialClientDetail clientId={id} />;
+}

src/app/(dashboard)/[portSlug]/residential/clients/page.tsx

@@ -0,0 +1,5 @@
+import { ResidentialClientsList } from '@/components/residential/residential-clients-list';
+
+export default function ResidentialClientsPage() {
+  return <ResidentialClientsList />;
+}

src/app/(dashboard)/[portSlug]/residential/interests/[id]/page.tsx

@@ -0,0 +1,10 @@
+import { ResidentialInterestDetail } from '@/components/residential/residential-interest-detail';
+
+interface Props {
+  params: Promise<{ id: string }>;
+}
+
+export default async function ResidentialInterestDetailPage({ params }: Props) {
+  const { id } = await params;
+  return <ResidentialInterestDetail interestId={id} />;
+}

src/app/(dashboard)/[portSlug]/residential/interests/page.tsx

@@ -0,0 +1,5 @@
+import { ResidentialInterestsList } from '@/components/residential/residential-interests-list';
+
+export default function ResidentialInterestsPage() {
+  return <ResidentialInterestsList />;
+}

src/app/(dashboard)/layout.tsx

@@ -4,7 +4,8 @@ import { eq } from 'drizzle-orm';
 
 import { auth } from '@/lib/auth';
 import { db } from '@/lib/db';
-import { userPortRoles } from '@/lib/db/schema/users';
+import { ports as portsTable } from '@/lib/db/schema/ports';
+import { userPortRoles, userProfiles } from '@/lib/db/schema/users';
 import { QueryProvider } from '@/providers/query-provider';
 import { SocketProvider } from '@/providers/socket-provider';
 import { PortProvider } from '@/providers/port-provider';
@@ -16,26 +17,31 @@ export default async function DashboardLayout({ children }: { children: React.Re
   const session = await auth.api.getSession({ headers: await headers() });
   if (!session?.user) redirect('/login');
 
-  // Load user's port assignments for PortProvider
+  // Super admins have implicit access to every port; everyone else only sees
+  // ports they have an explicit user_port_roles row for.
+  const profile = await db.query.userProfiles.findFirst({
+    where: eq(userProfiles.userId, session.user.id),
+  });
+
   const portRoles = await db.query.userPortRoles.findMany({
     where: eq(userPortRoles.userId, session.user.id),
     with: { port: true, role: true },
   });
 
-  const ports = portRoles.map((pr) => pr.port);
+  const ports = profile?.isSuperAdmin
+    ? await db.query.ports.findMany({ orderBy: portsTable.name })
+    : portRoles.map((pr) => pr.port);
 
   return (
     <QueryProvider>
-      <PortProvider ports={ports} defaultPortId={portRoles[0]?.port.id ?? null}>
+      <PortProvider ports={ports} defaultPortId={ports[0]?.id ?? null}>
         <PermissionsProvider>
           <SocketProvider>
             <div className="flex h-screen overflow-hidden bg-background">
-              <Sidebar portRoles={portRoles} />
+              <Sidebar portRoles={portRoles} isSuperAdmin={profile?.isSuperAdmin ?? false} />
               <div className="flex-1 flex flex-col overflow-hidden min-w-0">
                 <Topbar ports={ports} />
-                <main className="flex-1 overflow-y-auto bg-background p-6">
-                  {children}
-                </main>
+                <main className="flex-1 overflow-y-auto bg-background p-6">{children}</main>
               </div>
             </div>
           </SocketProvider>