feat: user activation and emails

components/pages/confirmation.tsx

@@ -0,0 +1,58 @@
+'use client';
+import { useRouter, useSearchParams } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { z } from 'zod';
+import { ResponseSchema } from '../../utils/types';
+import { HomeLink } from '../elements/homeLink';
+
+export const ConfirmationPage = () => {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+  const [loading, setLoading] = useState(true);
+  const [message, setMessage] = useState('');
+
+  const code = searchParams.get('code');
+
+  useEffect(() => {
+    if (!code) {
+      router.push('/');
+    }
+
+    fetch('/api/confirmation', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        code: code,
+      }),
+    })
+      .then(async (res) => {
+        if (!res.ok) {
+          router.push('/');
+        }
+        const response: z.infer<typeof ResponseSchema> = await res.json();
+        return response;
+      })
+      .then((response) => {
+        setMessage(response.message);
+        setLoading(false);
+      });
+  }, [code, router]);
+
+  if (!loading) {
+    return (
+      <div>
+        <h1>{message}</h1>
+        <HomeLink />
+      </div>
+    );
+  }
+
+  return (
+    <div>
+      <h1>Verifying...</h1>
+      <HomeLink />
+    </div>
+  );
+};