feat : update

app/auth/forgot-password/page.tsx

@@ -1,8 +1,17 @@
 import { SiteHeader } from "@/components/public/site-header";
 import { EmailActionForm } from "@/components/auth/email-action-form";
+import { connection } from "next/server";
+import { safeAuthReturnPath } from "@/lib/auth/return-path";
+import { isSudlohOidcEnabled } from "@/lib/auth/server";
 
-export default function ForgotPasswordPage() {
+export const instant = false;
+
+export default async function ForgotPasswordPage({ searchParams }: PageProps<"/auth/forgot-password">) {
+  await connection();
+  const { next } = await searchParams;
+  const oidcEnabled = isSudlohOidcEnabled();
+  const oidcOnly = oidcEnabled && process.env.SUDLOH_OIDC_ONLY === "true";
   return <div className="min-h-svh"><SiteHeader /><main className="grid min-h-[calc(100svh-4rem)] place-items-center p-4">
-    <EmailActionForm mode="forgot" />
+    <EmailActionForm mode="forgot" nextPath={safeAuthReturnPath(next)} oidcEnabled={oidcEnabled} oidcOnly={oidcOnly} />
   </main></div>;
 }

app/auth/password-reset/page.tsx

@@ -1,13 +1,18 @@
 import { connection } from "next/server";
 import { SiteHeader } from "@/components/public/site-header";
 import { EmailActionForm } from "@/components/auth/email-action-form";
+import { safeAuthReturnPath } from "@/lib/auth/return-path";
+import { isSudlohOidcEnabled } from "@/lib/auth/server";
 
 export const instant = false;
 
 export default async function ResetPasswordPage({ searchParams }: PageProps<"/auth/password-reset">) {
   await connection();
-  const { token, error } = await searchParams;
+  const { token, error, next } = await searchParams;
+  const oidcEnabled = isSudlohOidcEnabled();
+  const oidcOnly = oidcEnabled && process.env.SUDLOH_OIDC_ONLY === "true";
   return <div className="min-h-svh"><SiteHeader /><main className="grid min-h-[calc(100svh-4rem)] place-items-center p-4">
-    <EmailActionForm mode="reset" token={typeof token === "string" ? token : ""} invalidToken={typeof error === "string"} />
+    <EmailActionForm mode="reset" token={typeof token === "string" ? token : ""} invalidToken={typeof error === "string"}
+      nextPath={safeAuthReturnPath(next)} oidcEnabled={oidcEnabled} oidcOnly={oidcOnly} />
   </main></div>;
 }

app/commission/page.tsx

@@ -3,8 +3,11 @@ import { Suspense } from "react";
 import { connection } from "next/server";
 import { SiteHeader } from "@/components/public/site-header";
 import { CommissionRequestForm } from "@/components/commission/request-form";
+import { CommissionIntro } from "@/components/commission/commission-intro";
 import { CommissionPushEntryPrompt } from "@/components/commission/push-entry-prompt";
 import { Button } from "@/components/ui/button";
+import { Card, CardHeader } from "@/components/ui/card";
+import { Skeleton } from "@/components/ui/skeleton";
 import { getCustomerSession } from "@/lib/auth/server";
 import { getCatalogOptions } from "@/lib/guides/queries";
 import { getCommissionAvailability } from "@/lib/commission/availability";
@@ -14,21 +17,21 @@ export const instant = false;
 async function CommissionContent() {
   await connection();
   const availability = await getCommissionAvailability();
-  if (!availability.isOpen) return <div className="flex flex-col gap-4 rounded-xl border p-6">
+  if (!availability.isOpen) return <div className="flex flex-col gap-8"><div className="flex flex-col gap-4 rounded-xl border p-6">
     <h2 className="font-heading text-xl font-semibold">ปิดรับ Commission ชั่วคราว</h2>
     <p className="whitespace-pre-wrap">{availability.closureMessage}</p>
     <Button variant="outline" nativeButton={false} render={<Link href="/commission/tickets" />}>
       ดู Ticket และคำขอที่มีอยู่
     </Button>
-  </div>;
+  </div><CommissionIntro /></div>;
   const session = await getCustomerSession();
-  if (!session) return <div className="flex flex-col gap-4 rounded-xl border p-6">
+  if (!session) return <div className="flex flex-col gap-8"><CommissionIntro /><div className="flex flex-col gap-4 rounded-xl border p-6">
     <p>เข้าสู่ระบบหรือสมัครสมาชิกก่อนเริ่มคำขอ</p>
     <div className="flex flex-wrap gap-2">
       <Button nativeButton={false} render={<Link href="/auth/login?next=%2Fcommission" />}>เข้าสู่ระบบ</Button>
       <Button variant="outline" nativeButton={false} render={<Link href="/auth/register?next=%2Fcommission" />}>สมัครสมาชิก</Button>
     </div>
-  </div>;
+  </div></div>;
   const catalog = await getCatalogOptions();
   if (!catalog) return <p>ยังไม่มีข้อมูลตัวละครสำหรับสร้างคำขอ</p>;
   return <div className="flex flex-col gap-6">
@@ -43,7 +46,7 @@ export default function CommissionPage() {
     <main className="mx-auto flex w-full max-w-5xl flex-col gap-6 p-4 py-10 sm:p-8">
       <header><h1 className="font-heading text-3xl font-semibold">Commission</h1>
         <p className="text-muted-foreground">ขอทีม เปรียบเทียบอาวุธหรือกลุ่มดาวตามที่ต้องการ</p></header>
-      <Suspense fallback={null}><CommissionContent /></Suspense>
+      <Suspense fallback={<Card><CardHeader><Skeleton className="h-6 w-48" /><Skeleton className="h-4 w-full max-w-md" /></CardHeader></Card>}><CommissionContent /></Suspense>
     </main>
   </div>;
 }

app/page.tsx

@@ -3,6 +3,7 @@ import { Suspense } from "react";
 
 import { LiveRefresh } from "@/components/live-refresh";
 import { GoogleAdsense } from "@/components/public/google-adsense";
+import { DirectorySkeleton } from "@/components/public/directory-skeleton";
 import { SiteFooter } from "@/components/public/site-footer";
 import { StructuredDirectory } from "@/components/public/structured-directory";
 import { SiteHeader } from "@/components/public/site-header";
@@ -23,13 +24,13 @@ export default function HomePage() {
       <main className="mx-auto flex w-full max-w-7xl flex-col gap-8 px-4 pt-4 pb-10 sm:px-6 sm:pt-6 sm:pb-14">
         <header className="max-w-3xl">
           <h1 className="font-heading text-4xl font-semibold">
-            เลือกตัวละครแล้วส่องดูได้เลย
+            เลือกตัวละครแล้วส่องดู
           </h1>
           <p className="mt-3 text-lg leading-8 text-muted-foreground">
             ไกด์ตัวละคร อาวุธ อาร์ติแฟกต์ กลุ่มดาว ดาเมทแต่ละทีม และ ส่วนเสริมเล็กๆน้อยๆ
           </p>
         </header>
-        <Suspense fallback={<div className="min-h-svh" aria-hidden="true" />}>
+        <Suspense fallback={<DirectorySkeleton />}>
           <DirectoryContent />
         </Suspense>
       </main>