Phase1

apps/web/src/app/[locale]/dashboard/layout.tsx

@@ -1,6 +1,7 @@
 import { getTranslations, setRequestLocale } from "next-intl/server";
 import type { ReactNode } from "react";
 import { Link } from "@/i18n/navigation";
+import { DashboardUserInfo } from "@/components/dashboard/dashboard-user-info";
 
 interface DashboardLayoutProps {
   children: ReactNode;
@@ -31,9 +32,7 @@ export default async function DashboardLayout({
             </li>
           </ul>
         </nav>
-        <p className="font-mono text-xs text-zinc-500">
-          auth: pending · session: none
-        </p>
+        <DashboardUserInfo />
       </div>
       {children}
     </div>

apps/web/src/app/[locale]/forgot-password/page.tsx

@@ -0,0 +1,20 @@
+import { Suspense } from "react";
+import { setRequestLocale } from "next-intl/server";
+import { ForgotPasswordForm } from "@/components/auth/forgot-password-form";
+
+interface ForgotPasswordPageProps {
+  params: Promise<{ locale: string }>;
+}
+
+export default async function ForgotPasswordPage({ params }: ForgotPasswordPageProps) {
+  const { locale } = await params;
+  setRequestLocale(locale);
+
+  return (
+    <div className="mx-auto flex min-h-[calc(100vh-8rem)] max-w-6xl items-center justify-center px-4 py-12 sm:px-6">
+      <Suspense>
+        <ForgotPasswordForm />
+      </Suspense>
+    </div>
+  );
+}

apps/web/src/app/[locale]/layout.tsx

@@ -3,6 +3,7 @@ import { getMessages, setRequestLocale } from "next-intl/server";
 import { notFound } from "next/navigation";
 import type { ReactNode } from "react";
 import { SiteLayout } from "@/components/layout/site-layout";
+import { AuthProvider } from "@/components/providers/auth-provider";
 import { QueryProvider } from "@/components/providers/query-provider";
 import { ThemeProvider } from "@/components/providers/theme-provider";
 import { routing, type Locale } from "@/i18n/routing";
@@ -30,7 +31,9 @@ export default async function LocaleLayout({ children, params }: LocaleLayoutPro
     <NextIntlClientProvider messages={messages}>
       <ThemeProvider>
         <QueryProvider>
-          <SiteLayout>{children}</SiteLayout>
+          <AuthProvider>
+            <SiteLayout>{children}</SiteLayout>
+          </AuthProvider>
         </QueryProvider>
       </ThemeProvider>
     </NextIntlClientProvider>

apps/web/src/app/[locale]/login/2fa/page.tsx

@@ -0,0 +1,20 @@
+import { Suspense } from "react";
+import { setRequestLocale } from "next-intl/server";
+import { Login2FaForm } from "@/components/auth/login-2fa-form";
+
+interface Login2FaPageProps {
+  params: Promise<{ locale: string }>;
+}
+
+export default async function Login2FaPage({ params }: Login2FaPageProps) {
+  const { locale } = await params;
+  setRequestLocale(locale);
+
+  return (
+    <div className="mx-auto flex min-h-[calc(100vh-8rem)] max-w-6xl items-center justify-center px-4 py-12 sm:px-6">
+      <Suspense>
+        <Login2FaForm />
+      </Suspense>
+    </div>
+  );
+}

apps/web/src/app/[locale]/login/page.tsx

@@ -1,3 +1,4 @@
+import { Suspense } from "react";
 import { setRequestLocale } from "next-intl/server";
 import { LoginForm } from "@/components/auth/login-form";
 
@@ -11,7 +12,9 @@ export default async function LoginPage({ params }: LoginPageProps) {
 
   return (
     <div className="mx-auto flex min-h-[calc(100vh-8rem)] max-w-6xl items-center justify-center px-4 py-12 sm:px-6">
-      <LoginForm />
+      <Suspense>
+        <LoginForm />
+      </Suspense>
     </div>
   );
 }

apps/web/src/app/[locale]/reset-password/page.tsx

@@ -0,0 +1,20 @@
+import { Suspense } from "react";
+import { setRequestLocale } from "next-intl/server";
+import { ResetPasswordForm } from "@/components/auth/reset-password-form";
+
+interface ResetPasswordPageProps {
+  params: Promise<{ locale: string }>;
+}
+
+export default async function ResetPasswordPage({ params }: ResetPasswordPageProps) {
+  const { locale } = await params;
+  setRequestLocale(locale);
+
+  return (
+    <div className="mx-auto flex min-h-[calc(100vh-8rem)] max-w-6xl items-center justify-center px-4 py-12 sm:px-6">
+      <Suspense>
+        <ResetPasswordForm />
+      </Suspense>
+    </div>
+  );
+}

apps/web/src/app/[locale]/security/page.tsx

@@ -0,0 +1,17 @@
+import { setRequestLocale } from "next-intl/server";
+import { SecurityContent } from "@/components/auth/security-content";
+
+interface SecurityPageProps {
+  params: Promise<{ locale: string }>;
+}
+
+export default async function SecurityPage({ params }: SecurityPageProps) {
+  const { locale } = await params;
+  setRequestLocale(locale);
+
+  return (
+    <div className="mx-auto max-w-6xl px-4 py-8 sm:px-6">
+      <SecurityContent />
+    </div>
+  );
+}

apps/web/src/app/[locale]/verify-email/page.tsx

@@ -0,0 +1,20 @@
+import { Suspense } from "react";
+import { setRequestLocale } from "next-intl/server";
+import { VerifyEmailContent } from "@/components/auth/verify-email-content";
+
+interface VerifyEmailPageProps {
+  params: Promise<{ locale: string }>;
+}
+
+export default async function VerifyEmailPage({ params }: VerifyEmailPageProps) {
+  const { locale } = await params;
+  setRequestLocale(locale);
+
+  return (
+    <div className="mx-auto flex min-h-[calc(100vh-8rem)] max-w-6xl items-center justify-center px-4 py-12 sm:px-6">
+      <Suspense>
+        <VerifyEmailContent />
+      </Suspense>
+    </div>
+  );
+}