feat: email verification for registration (#599)

apps/web/src/app/(unauthenticated)/verify-email/[token]/page.tsx

@@ -0,0 +1,97 @@
+import Link from 'next/link';
+
+import { AlertTriangle, CheckCircle2, XCircle, XOctagon } from 'lucide-react';
+
+import { verifyEmail } from '@documenso/lib/server-only/user/verify-email';
+import { Button } from '@documenso/ui/primitives/button';
+
+export type PageProps = {
+  params: {
+    token: string;
+  };
+};
+
+export default async function VerifyEmailPage({ params: { token } }: PageProps) {
+  if (!token) {
+    return (
+      <div className="w-full">
+        <div className="mb-4 text-red-300">
+          <XOctagon />
+        </div>
+
+        <h2 className="text-4xl font-semibold">No token provided</h2>
+        <p className="text-muted-foreground mt-2 text-base">
+          It seems that there is no token provided. Please check your email and try again.
+        </p>
+      </div>
+    );
+  }
+
+  const verified = await verifyEmail({ token });
+
+  if (verified === null) {
+    return (
+      <div className="flex w-full items-start">
+        <div className="mr-4 mt-1 hidden md:block">
+          <AlertTriangle className="h-10 w-10 text-yellow-500" strokeWidth={2} />
+        </div>
+
+        <div>
+          <h2 className="text-2xl font-bold md:text-4xl">Something went wrong</h2>
+
+          <p className="text-muted-foreground mt-4">
+            We were unable to verify your email. If your email is not verified already, please try
+            again.
+          </p>
+
+          <Button className="mt-4" asChild>
+            <Link href="/">Go back home</Link>
+          </Button>
+        </div>
+      </div>
+    );
+  }
+
+  if (!verified) {
+    return (
+      <div className="flex w-full items-start">
+        <div className="mr-4 mt-1 hidden md:block">
+          <XCircle className="text-destructive h-10 w-10" strokeWidth={2} />
+        </div>
+
+        <div>
+          <h2 className="text-2xl font-bold md:text-4xl">Your token has expired!</h2>
+
+          <p className="text-muted-foreground mt-4">
+            It seems that the provided token has expired. We've just sent you another token, please
+            check your email and try again.
+          </p>
+
+          <Button className="mt-4" asChild>
+            <Link href="/">Go back home</Link>
+          </Button>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex w-full items-start">
+      <div className="mr-4 mt-1 hidden md:block">
+        <CheckCircle2 className="h-10 w-10 text-green-500" strokeWidth={2} />
+      </div>
+
+      <div>
+        <h2 className="text-2xl font-bold md:text-4xl">Email Confirmed!</h2>
+
+        <p className="text-muted-foreground mt-4">
+          Your email has been successfully confirmed! You can now use all features of Documenso.
+        </p>
+
+        <Button className="mt-4" asChild>
+          <Link href="/">Go back home</Link>
+        </Button>
+      </div>
+    </div>
+  );
+}