Lock the e-mail on input if the code has an e-mail associated

src/pages/(register)/RegisterIndividual.tsx

@@ -4,21 +4,22 @@ import Input from "@/components/Low/Input";
 import {User} from "@/interfaces/user";
 import {sendEmailVerification} from "@/utils/email";
 import axios from "axios";
-import {useState} from "react";
+import {useEffect, useState} from "react";
 import {toast} from "react-toastify";
 import {KeyedMutator} from "swr";
 
 interface Props {
 	queryCode?: string;
+	defaultEmail?: string;
 	isLoading: boolean;
 	setIsLoading: (isLoading: boolean) => void;
 	mutateUser: KeyedMutator<User>;
 	sendEmailVerification: typeof sendEmailVerification;
 }
 
-export default function RegisterIndividual({queryCode, isLoading, setIsLoading, mutateUser, sendEmailVerification}: Props) {
+export default function RegisterIndividual({queryCode, defaultEmail, isLoading, setIsLoading, mutateUser, sendEmailVerification}: Props) {
 	const [name, setName] = useState("");
-	const [email, setEmail] = useState("");
+	const [email, setEmail] = useState(defaultEmail || "");
 	const [password, setPassword] = useState("");
 	const [confirmPassword, setConfirmPassword] = useState("");
 	const [code, setCode] = useState(queryCode || "");
@@ -73,7 +74,15 @@ export default function RegisterIndividual({queryCode, isLoading, setIsLoading,
 	return (
 		<form className="flex flex-col items-center gap-6 w-full" onSubmit={register}>
 			<Input type="text" name="name" onChange={(e) => setName(e)} placeholder="Enter your name" defaultValue={name} required />
-			<Input type="email" name="email" onChange={(e) => setEmail(e)} placeholder="Enter email address" defaultValue={email} required />
+			<Input
+				type="email"
+				name="email"
+				onChange={(e) => setEmail(e)}
+				placeholder="Enter email address"
+				value={email}
+				disabled={!!defaultEmail}
+				required
+			/>
 			<Input
 				type="password"
 				name="password"

src/pages/api/code/[id].ts

@@ -0,0 +1,23 @@
+// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
+import type {NextApiRequest, NextApiResponse} from "next";
+import {app} from "@/firebase";
+import {getFirestore, collection, getDocs, query, where, setDoc, doc, getDoc, deleteDoc} from "firebase/firestore";
+import {withIronSessionApiRoute} from "iron-session/next";
+import {sessionOptions} from "@/lib/session";
+import {uuidv4} from "@firebase/util";
+
+const db = getFirestore(app);
+
+export default async function handler(req: NextApiRequest, res: NextApiResponse) {
+	if (req.method === "GET") return GET(req, res);
+
+	res.status(404).json({ok: false});
+}
+
+async function GET(req: NextApiRequest, res: NextApiResponse) {
+	const {id} = req.query;
+
+	const snapshot = await getDoc(doc(db, "codes", id as string));
+
+	res.status(200).json({...snapshot.data(), id: snapshot.id});
+}

src/pages/api/code/index.ts

@@ -48,6 +48,8 @@ async function handler(req: NextApiRequest, res: NextApiResponse) {
 		await setDoc(codeRef, {type, code, creator: req.session.user!.id, expiryDate});
 
 		if (emails && emails.length > index) {
+			await setDoc(codeRef, {email: emails[index]}, {merge: true});
+
 			const transport = prepareMailer();
 			const mailOptions = prepareMailOptions(
 				{

src/pages/register.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable @next/next/no-img-element */
 import {ToastContainer} from "react-toastify";
-import {useState} from "react";
+import {useEffect, useState} from "react";
 import Head from "next/head";
 import useUser from "@/hooks/useUser";
 import Link from "next/link";
@@ -11,6 +11,7 @@ import RegisterCorporate from "./(register)/RegisterCorporate";
 import EmailVerification from "./(auth)/EmailVerification";
 import {sendEmailVerification} from "@/utils/email";
 import useUsers from "@/hooks/useUsers";
+import axios from "axios";
 
 export const getServerSideProps = (context: any) => {
 	const {code} = context.query;
@@ -21,8 +22,17 @@ export const getServerSideProps = (context: any) => {
 };
 
 export default function Register({code: queryCode}: {code: string}) {
+	const [defaultEmail, setDefaultEmail] = useState<string>();
 	const [isLoading, setIsLoading] = useState(false);
 
+	useEffect(() => {
+		if (queryCode) {
+			(async () => {
+				axios.get<{email?: string}>(`/api/code/${queryCode}`).then((result) => setDefaultEmail(result.data.email));
+			})();
+		}
+	}, [queryCode]);
+
 	const {user, mutateUser} = useUser({
 		redirectTo: "/",
 		redirectIfFound: true,
@@ -79,11 +89,13 @@ export default function Register({code: queryCode}: {code: string}) {
 									<Tab.Panels>
 										<Tab.Panel>
 											<RegisterIndividual
+												key={defaultEmail || "individual"}
 												isLoading={isLoading}
 												setIsLoading={setIsLoading}
 												mutateUser={mutateUser}
 												sendEmailVerification={sendEmailVerification}
 												queryCode={queryCode}
+												defaultEmail={defaultEmail}
 											/>
 										</Tab.Panel>
 										<Tab.Panel>