Add Discord verification option for users without email

src/app/verify/page.tsx

@@ -2,31 +2,43 @@ import Link from "next/link";
 import { getTranslations } from "next-intl/server";
 import { isValidVerificationToken } from "@/actions/email-verify";
 import { ContentCard, EmptyState } from "@/components/public/ui";
+import { DiscordVerifyForm } from "@/components/auth/discord-verify-form";
+import { auth } from "@/lib/auth";
 import { prisma } from "@/lib/prisma";
 
-// Reads + writes the live users table — must never be statically rendered.
 export const dynamic = "force-dynamic";
 
-type Status = "verified" | "already" | "invalid" | "unavailable";
+type Status = "verified" | "already" | "invalid" | "unavailable" | "discord";
 
 export default async function VerifyPage({
   searchParams,
 }: {
-  searchParams: Promise<{ token?: string; email?: string }>;
+  searchParams: Promise<{ token?: string; email?: string; method?: string; linked?: string }>;
 }) {
   const t = await getTranslations("pages.verify");
-  // Next 16: searchParams is a Promise.
-  const { token = "", email = "" } = await searchParams;
+  const { token = "", email = "", method = "", linked = "" } = await searchParams;
   const normalisedEmail = email.trim().toLowerCase();
 
   let status: Status = "invalid";
+  let discordAlreadyLinked = false;
 
-  if (normalisedEmail && token) {
+  if (method === "discord" || linked === "1") {
+    status = "discord";
+    const session = await auth();
+    if (session?.user?.id) {
+      const userId = Number(session.user.id);
+      try {
+        const linkedRow = await prisma.socialAccounts.findFirst({
+          where: { userId: BigInt(userId), provider: "discord" },
+          select: { id: true },
+        });
+        discordAlreadyLinked = !!linkedRow;
+      } catch {}
+    }
+  } else if (normalisedEmail && token) {
     const ok = await isValidVerificationToken(normalisedEmail, token);
     if (ok) {
       try {
-        // mail is VARCHAR(500) and not unique in the emulator schema, so match
-        // on the email and flip any matching unverified account(s).
         const user = await prisma.user.findFirst({
           where: { mail: normalisedEmail },
           select: { id: true, mailVerified: true },
@@ -38,55 +50,65 @@ export default async function VerifyPage({
         } else {
           await prisma.user.update({
             where: { id: user.id },
-            // users.mail_verified is a String flag ('0' / '1').
             data: { mailVerified: "1" },
           });
           status = "verified";
         }
       } catch {
-        // DB unreachable — don't claim success.
         status = "unavailable";
       }
-    } else {
-      status = "invalid";
     }
   }
 
   return (
     <main style={{ maxWidth: 480, margin: "2rem auto" }}>
-      {status === "verified" ? (
+      {status === "verified" && (
         <ContentCard icon="✅" title={t("verifiedTitle")} subtitle={t("verifiedSubtitle")}>
-          <p className="muted" style={{ marginTop: 0 }}>
-            {t("verifiedBody")}
-          </p>
-          <Link href="/login" className="btn btn-primary">
-            {t("goToLogin")}
-          </Link>
+          <p className="muted" style={{ marginTop: 0 }}>{t("verifiedBody")}</p>
+          <Link href="/login" className="btn btn-primary">{t("goToLogin")}</Link>
         </ContentCard>
-      ) : status === "already" ? (
+      )}
+
+      {status === "already" && (
         <ContentCard icon="✅" title={t("alreadyTitle")} subtitle={t("alreadySubtitle")}>
-          <p className="muted" style={{ marginTop: 0 }}>
-            {t("alreadyBody")}
-          </p>
-          <Link href="/login" className="btn btn-primary">
-            {t("goToLogin")}
-          </Link>
+          <p className="muted" style={{ marginTop: 0 }}>{t("alreadyBody")}</p>
+          <Link href="/login" className="btn btn-primary">{t("goToLogin")}</Link>
         </ContentCard>
-      ) : status === "unavailable" ? (
+      )}
+
+      {status === "unavailable" && (
         <ContentCard icon="⏳" title={t("unavailableTitle")} subtitle={t("unavailableSubtitle")}>
-          <p className="muted" style={{ margin: 0 }}>
-            {t("unavailableBody")}
-          </p>
+          <p className="muted" style={{ margin: 0 }}>{t("unavailableBody")}</p>
         </ContentCard>
-      ) : (
+      )}
+
+      {status === "invalid" && (
         <ContentCard icon="📧" title={t("invalidTitle")} subtitle={t("invalidSubtitle")}>
-          <EmptyState icon="🔗">
-            {t("invalidBody")}
-          </EmptyState>
+          <EmptyState icon="🔗">{t("invalidBody")}</EmptyState>
           <div style={{ textAlign: "center" }}>
-            <Link href="/login" className="btn btn-outline">
-              {t("backToLogin")}
-            </Link>
+            <Link href="/login" className="btn btn-outline">{t("backToLogin")}</Link>
+          </div>
+        </ContentCard>
+      )}
+
+      {status === "discord" && (
+        <ContentCard icon="🎮" title="Verifieer via Discord" subtitle="Koppel je Discord account">
+          {linked === "1" && (
+            <div className="rounded-md p-4 text-center mb-4" style={{ backgroundColor: "#14532d", color: "white" }}>
+              <p className="text-lg font-bold mb-1">Gelinkt!</p>
+              <p className="text-sm opacity-90">Je Discord account is gekoppeld. Je kunt nu verder.</p>
+            </div>
+          )}
+          {discordAlreadyLinked ? (
+            <div className="rounded-md p-4 text-center" style={{ backgroundColor: "#14532d", color: "white" }}>
+              <p className="text-lg font-bold mb-1">Al geverifieerd!</p>
+              <p className="text-sm opacity-90">Je Discord account is al gekoppeld aan dit account.</p>
+            </div>
+          ) : (
+            <DiscordVerifyForm />
+          )}
+          <div style={{ textAlign: "center", marginTop: "1rem" }}>
+            <Link href="/" className="btn btn-primary">Naar home</Link>
           </div>
         </ContentCard>
       )}