added footer links, added email alias check

apps/hub/app/(app)/settings/_components/forms.tsx

@@ -23,16 +23,29 @@ import toast from "react-hot-toast";
 import { UserOptionalDefaults, UserOptionalDefaultsSchema } from "@repo/db/zod";
 import { Bell, Plane } from "lucide-react";
 import Link from "next/link";
+import { sendVerificationLink } from "(app)/admin/user/action";
 
 export const ProfileForm = ({ user }: { user: User }): React.JSX.Element => {
 	const schema = z.object({
 		firstname: z.string().min(2).max(30),
 		lastname: z.string().min(2).max(30),
-		email: z.string().email({
-			message: "Bitte gebe eine gültige E-Mail Adresse ein",
-		}),
+		email: z
+			.string()
+			.email({
+				message: "Bitte gebe eine gültige E-Mail Adresse ein",
+			})
+			.refine(
+				(value) => {
+					// Regex to check for email aliases like + or %
+					const emailAliasRegex = /[+%]/;
+					return !emailAliasRegex.test(value);
+				},
+				{
+					message: "Email-Aliase (wie + oder %) sind nicht erlaubt",
+				},
+			),
 		settingsHideLastname: z.boolean(),
-		emailVerified: z.boolean(),
+		emailVerified: z.boolean().optional(),
 	});
 	const [isLoading, setIsLoading] = useState(false);
 	type IFormInput = z.infer<typeof schema>;
@@ -46,6 +59,7 @@ export const ProfileForm = ({ user }: { user: User }): React.JSX.Element => {
 		},
 		resolver: zodResolver(schema),
 	});
+	console.log(form.formState.errors);
 	return (
 		<form
 			className="card-body"
@@ -53,13 +67,20 @@ export const ProfileForm = ({ user }: { user: User }): React.JSX.Element => {
 				setIsLoading(true);
 				await updateUser(values);
 				form.reset(values);
+				if (user.email !== values.email) {
+					await sendVerificationLink(user.id);
+					toast.success(
+						"Deine E-Mail Addresse hat sich geändert, wir haben die einen Link gesendet!",
+					);
+				} else {
+					toast.success("Deine Änderungen wurden gespeichert!", {
+						style: {
+							background: "var(--color-base-100)",
+							color: "var(--color-base-content)",
+						},
+					});
+				}
 				setIsLoading(false);
-				toast.success("Deine Änderungen wurden gespeichert!", {
-					style: {
-						background: "var(--color-base-100)",
-						color: "var(--color-base-content)",
-					},
-				});
 			})}
 		>
 			<h2 className="card-title">
@@ -105,12 +126,13 @@ export const ProfileForm = ({ user }: { user: User }): React.JSX.Element => {
 						<EnvelopeClosedIcon /> E-Mail
 					</span>
 					<input
-						{...form.register("email")}
+						value={form.watch("email")}
 						type="text"
 						className="input input-bordered w-full"
-						defaultValue={user.email}
 						onChange={(e) => {
-							form.setValue("email", e.target.value.trim());
+							form.setValue("email", e.target.value.trim(), {
+								shouldDirty: true,
+							});
 							form.setValue("emailVerified", false);
 						}}
 						placeholder="E-Mail"