@questpie/admin 1.1.1 → 3.0.0

package/dist/client/views/auth/setup-form.mjs

@@ -0,0 +1,526 @@
+import { useTranslation } from "../../i18n/hooks.mjs";
+import { cn } from "../../lib/utils.mjs";
+import { Button } from "../../components/ui/button.mjs";
+import { Input } from "../../components/ui/input.mjs";
+import { Field, FieldContent, FieldError, FieldGroup, FieldLabel } from "../../components/ui/field.mjs";
+import { Alert, AlertDescription } from "../../components/ui/alert.mjs";
+import { c } from "react/compiler-runtime";
+import { Icon } from "@iconify/react";
+import "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useForm, useWatch } from "react-hook-form";
+
+//#region src/client/views/auth/setup-form.tsx
+/**
+* Setup Form - create first admin account
+*/
+/**
+* Setup form for creating the first admin account.
+*
+* @example
+* ```tsx
+* function SetupPage() {
+*   const [error, setError] = useState<string | null>(null)
+*
+*   const handleSetup = async (values: SetupFormValues) => {
+*     const result = await client.routes.createFirstAdmin({
+*       email: values.email,
+*       password: values.password,
+*       name: values.name,
+*     })
+*     if (!result.success) {
+*       setError(result.error)
+*     }
+*   }
+*
+*   return (
+*     <AuthLayout title="Welcome">
+*       <SetupForm onSubmit={handleSetup} error={error} />
+*     </AuthLayout>
+*   )
+* }
+* ```
+*/
+function SetupForm(t0) {
+	const $ = c(128);
+	const { onSubmit, defaultValues, className, error, minPasswordLength: t1 } = t0;
+	const minPasswordLength = t1 === void 0 ? 8 : t1;
+	const { t } = useTranslation();
+	let t2;
+	if ($[0] !== defaultValues) {
+		t2 = { defaultValues: {
+			name: "",
+			email: "",
+			password: "",
+			confirmPassword: "",
+			...defaultValues
+		} };
+		$[0] = defaultValues;
+		$[1] = t2;
+	} else t2 = $[1];
+	const { register, handleSubmit, control, formState: t3 } = useForm(t2);
+	const { errors, isSubmitting } = t3;
+	let t4;
+	if ($[2] !== control) {
+		t4 = {
+			control,
+			name: "password"
+		};
+		$[2] = control;
+		$[3] = t4;
+	} else t4 = $[3];
+	const password = useWatch(t4);
+	let t5;
+	if ($[4] !== onSubmit) {
+		t5 = async (values) => {
+			await onSubmit(values);
+		};
+		$[4] = onSubmit;
+		$[5] = t5;
+	} else t5 = $[5];
+	let t6;
+	if ($[6] !== handleSubmit || $[7] !== t5) {
+		t6 = handleSubmit(t5);
+		$[6] = handleSubmit;
+		$[7] = t5;
+		$[8] = t6;
+	} else t6 = $[8];
+	const handleFormSubmit = t6;
+	let t7;
+	if ($[9] !== className) {
+		t7 = cn("qa-setup-form space-y-4", className);
+		$[9] = className;
+		$[10] = t7;
+	} else t7 = $[10];
+	const t8 = !!errors.name;
+	let t9;
+	if ($[11] !== t) {
+		t9 = t("auth.name");
+		$[11] = t;
+		$[12] = t9;
+	} else t9 = $[12];
+	let t10;
+	if ($[13] !== t9) {
+		t10 = /* @__PURE__ */ jsx(FieldLabel, {
+			htmlFor: "name",
+			children: t9
+		});
+		$[13] = t9;
+		$[14] = t10;
+	} else t10 = $[14];
+	let t11;
+	if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+		t11 = /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:user-duotone",
+			className: "text-muted-foreground absolute top-1/2 left-2 size-4 -translate-y-1/2"
+		});
+		$[15] = t11;
+	} else t11 = $[15];
+	let t12;
+	if ($[16] !== t) {
+		t12 = t("auth.namePlaceholder");
+		$[16] = t;
+		$[17] = t12;
+	} else t12 = $[17];
+	const t13 = !!errors.name;
+	let t14;
+	if ($[18] !== register || $[19] !== t) {
+		t14 = register("name", {
+			required: t("auth.nameRequired"),
+			minLength: {
+				value: 2,
+				message: t("auth.nameMinLength", { min: 2 })
+			}
+		});
+		$[18] = register;
+		$[19] = t;
+		$[20] = t14;
+	} else t14 = $[20];
+	let t15;
+	if ($[21] !== t12 || $[22] !== t13 || $[23] !== t14) {
+		t15 = /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [t11, /* @__PURE__ */ jsx(Input, {
+				id: "name",
+				type: "text",
+				placeholder: t12,
+				className: "pl-8",
+				autoComplete: "name",
+				"aria-invalid": t13,
+				...t14
+			})]
+		});
+		$[21] = t12;
+		$[22] = t13;
+		$[23] = t14;
+		$[24] = t15;
+	} else t15 = $[24];
+	const t16 = errors.name?.message;
+	let t17;
+	if ($[25] !== t16) {
+		t17 = /* @__PURE__ */ jsx(FieldError, { children: t16 });
+		$[25] = t16;
+		$[26] = t17;
+	} else t17 = $[26];
+	let t18;
+	if ($[27] !== t15 || $[28] !== t17) {
+		t18 = /* @__PURE__ */ jsxs(FieldContent, { children: [t15, t17] });
+		$[27] = t15;
+		$[28] = t17;
+		$[29] = t18;
+	} else t18 = $[29];
+	let t19;
+	if ($[30] !== t10 || $[31] !== t18 || $[32] !== t8) {
+		t19 = /* @__PURE__ */ jsxs(Field, {
+			"data-invalid": t8,
+			children: [t10, t18]
+		});
+		$[30] = t10;
+		$[31] = t18;
+		$[32] = t8;
+		$[33] = t19;
+	} else t19 = $[33];
+	const t20 = !!errors.email;
+	let t21;
+	if ($[34] !== t) {
+		t21 = t("auth.email");
+		$[34] = t;
+		$[35] = t21;
+	} else t21 = $[35];
+	let t22;
+	if ($[36] !== t21) {
+		t22 = /* @__PURE__ */ jsx(FieldLabel, {
+			htmlFor: "email",
+			children: t21
+		});
+		$[36] = t21;
+		$[37] = t22;
+	} else t22 = $[37];
+	let t23;
+	if ($[38] === Symbol.for("react.memo_cache_sentinel")) {
+		t23 = /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:envelope-duotone",
+			className: "text-muted-foreground absolute top-1/2 left-2 size-4 -translate-y-1/2"
+		});
+		$[38] = t23;
+	} else t23 = $[38];
+	let t24;
+	if ($[39] !== t) {
+		t24 = t("auth.emailPlaceholder");
+		$[39] = t;
+		$[40] = t24;
+	} else t24 = $[40];
+	const t25 = !!errors.email;
+	let t26;
+	if ($[41] !== register || $[42] !== t) {
+		let t27$1;
+		if ($[44] === Symbol.for("react.memo_cache_sentinel")) {
+			t27$1 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+			$[44] = t27$1;
+		} else t27$1 = $[44];
+		t26 = register("email", {
+			required: t("auth.emailRequired"),
+			pattern: {
+				value: t27$1,
+				message: t("auth.invalidEmail")
+			}
+		});
+		$[41] = register;
+		$[42] = t;
+		$[43] = t26;
+	} else t26 = $[43];
+	let t27;
+	if ($[45] !== t24 || $[46] !== t25 || $[47] !== t26) {
+		t27 = /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [t23, /* @__PURE__ */ jsx(Input, {
+				id: "email",
+				type: "email",
+				placeholder: t24,
+				className: "pl-8",
+				autoComplete: "email",
+				"aria-invalid": t25,
+				...t26
+			})]
+		});
+		$[45] = t24;
+		$[46] = t25;
+		$[47] = t26;
+		$[48] = t27;
+	} else t27 = $[48];
+	const t28 = errors.email?.message;
+	let t29;
+	if ($[49] !== t28) {
+		t29 = /* @__PURE__ */ jsx(FieldError, { children: t28 });
+		$[49] = t28;
+		$[50] = t29;
+	} else t29 = $[50];
+	let t30;
+	if ($[51] !== t27 || $[52] !== t29) {
+		t30 = /* @__PURE__ */ jsxs(FieldContent, { children: [t27, t29] });
+		$[51] = t27;
+		$[52] = t29;
+		$[53] = t30;
+	} else t30 = $[53];
+	let t31;
+	if ($[54] !== t20 || $[55] !== t22 || $[56] !== t30) {
+		t31 = /* @__PURE__ */ jsxs(Field, {
+			"data-invalid": t20,
+			children: [t22, t30]
+		});
+		$[54] = t20;
+		$[55] = t22;
+		$[56] = t30;
+		$[57] = t31;
+	} else t31 = $[57];
+	const t32 = !!errors.password;
+	let t33;
+	if ($[58] !== t) {
+		t33 = t("auth.password");
+		$[58] = t;
+		$[59] = t33;
+	} else t33 = $[59];
+	let t34;
+	if ($[60] !== t33) {
+		t34 = /* @__PURE__ */ jsx(FieldLabel, {
+			htmlFor: "password",
+			children: t33
+		});
+		$[60] = t33;
+		$[61] = t34;
+	} else t34 = $[61];
+	let t35;
+	if ($[62] === Symbol.for("react.memo_cache_sentinel")) {
+		t35 = /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:lock-duotone",
+			className: "text-muted-foreground absolute top-1/2 left-2 size-4 -translate-y-1/2"
+		});
+		$[62] = t35;
+	} else t35 = $[62];
+	let t36;
+	if ($[63] !== t) {
+		t36 = t("auth.passwordPlaceholder");
+		$[63] = t;
+		$[64] = t36;
+	} else t36 = $[64];
+	const t37 = !!errors.password;
+	let t38;
+	if ($[65] !== minPasswordLength || $[66] !== register || $[67] !== t) {
+		t38 = register("password", {
+			required: t("auth.passwordRequired"),
+			minLength: {
+				value: minPasswordLength,
+				message: t("auth.passwordMinLength", { min: minPasswordLength })
+			}
+		});
+		$[65] = minPasswordLength;
+		$[66] = register;
+		$[67] = t;
+		$[68] = t38;
+	} else t38 = $[68];
+	let t39;
+	if ($[69] !== t36 || $[70] !== t37 || $[71] !== t38) {
+		t39 = /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [t35, /* @__PURE__ */ jsx(Input, {
+				id: "password",
+				type: "password",
+				placeholder: t36,
+				className: "pl-8",
+				autoComplete: "new-password",
+				"aria-invalid": t37,
+				...t38
+			})]
+		});
+		$[69] = t36;
+		$[70] = t37;
+		$[71] = t38;
+		$[72] = t39;
+	} else t39 = $[72];
+	const t40 = errors.password?.message;
+	let t41;
+	if ($[73] !== t40) {
+		t41 = /* @__PURE__ */ jsx(FieldError, { children: t40 });
+		$[73] = t40;
+		$[74] = t41;
+	} else t41 = $[74];
+	let t42;
+	if ($[75] !== t39 || $[76] !== t41) {
+		t42 = /* @__PURE__ */ jsxs(FieldContent, { children: [t39, t41] });
+		$[75] = t39;
+		$[76] = t41;
+		$[77] = t42;
+	} else t42 = $[77];
+	let t43;
+	if ($[78] !== t32 || $[79] !== t34 || $[80] !== t42) {
+		t43 = /* @__PURE__ */ jsxs(Field, {
+			"data-invalid": t32,
+			children: [t34, t42]
+		});
+		$[78] = t32;
+		$[79] = t34;
+		$[80] = t42;
+		$[81] = t43;
+	} else t43 = $[81];
+	const t44 = !!errors.confirmPassword;
+	let t45;
+	if ($[82] !== t) {
+		t45 = t("auth.confirmPassword");
+		$[82] = t;
+		$[83] = t45;
+	} else t45 = $[83];
+	let t46;
+	if ($[84] !== t45) {
+		t46 = /* @__PURE__ */ jsx(FieldLabel, {
+			htmlFor: "confirmPassword",
+			children: t45
+		});
+		$[84] = t45;
+		$[85] = t46;
+	} else t46 = $[85];
+	let t47;
+	if ($[86] === Symbol.for("react.memo_cache_sentinel")) {
+		t47 = /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:lock-duotone",
+			className: "text-muted-foreground absolute top-1/2 left-2 size-4 -translate-y-1/2"
+		});
+		$[86] = t47;
+	} else t47 = $[86];
+	let t48;
+	if ($[87] !== t) {
+		t48 = t("auth.confirmPasswordPlaceholder");
+		$[87] = t;
+		$[88] = t48;
+	} else t48 = $[88];
+	const t49 = !!errors.confirmPassword;
+	let t50;
+	if ($[89] !== password || $[90] !== register || $[91] !== t) {
+		let t51$1;
+		if ($[93] !== password || $[94] !== t) {
+			t51$1 = (value) => value === password || t("auth.passwordMismatch");
+			$[93] = password;
+			$[94] = t;
+			$[95] = t51$1;
+		} else t51$1 = $[95];
+		t50 = register("confirmPassword", {
+			required: t("auth.passwordRequired"),
+			validate: t51$1
+		});
+		$[89] = password;
+		$[90] = register;
+		$[91] = t;
+		$[92] = t50;
+	} else t50 = $[92];
+	let t51;
+	if ($[96] !== t48 || $[97] !== t49 || $[98] !== t50) {
+		t51 = /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [t47, /* @__PURE__ */ jsx(Input, {
+				id: "confirmPassword",
+				type: "password",
+				placeholder: t48,
+				className: "pl-8",
+				autoComplete: "new-password",
+				"aria-invalid": t49,
+				...t50
+			})]
+		});
+		$[96] = t48;
+		$[97] = t49;
+		$[98] = t50;
+		$[99] = t51;
+	} else t51 = $[99];
+	const t52 = errors.confirmPassword?.message;
+	let t53;
+	if ($[100] !== t52) {
+		t53 = /* @__PURE__ */ jsx(FieldError, { children: t52 });
+		$[100] = t52;
+		$[101] = t53;
+	} else t53 = $[101];
+	let t54;
+	if ($[102] !== t51 || $[103] !== t53) {
+		t54 = /* @__PURE__ */ jsxs(FieldContent, { children: [t51, t53] });
+		$[102] = t51;
+		$[103] = t53;
+		$[104] = t54;
+	} else t54 = $[104];
+	let t55;
+	if ($[105] !== t44 || $[106] !== t46 || $[107] !== t54) {
+		t55 = /* @__PURE__ */ jsxs(Field, {
+			"data-invalid": t44,
+			children: [t46, t54]
+		});
+		$[105] = t44;
+		$[106] = t46;
+		$[107] = t54;
+		$[108] = t55;
+	} else t55 = $[108];
+	let t56;
+	if ($[109] !== t19 || $[110] !== t31 || $[111] !== t43 || $[112] !== t55) {
+		t56 = /* @__PURE__ */ jsxs(FieldGroup, { children: [
+			t19,
+			t31,
+			t43,
+			t55
+		] });
+		$[109] = t19;
+		$[110] = t31;
+		$[111] = t43;
+		$[112] = t55;
+		$[113] = t56;
+	} else t56 = $[113];
+	let t57;
+	if ($[114] !== error) {
+		t57 = error && /* @__PURE__ */ jsxs(Alert, {
+			variant: "destructive",
+			children: [/* @__PURE__ */ jsx(Icon, { icon: "ph:warning-circle" }), /* @__PURE__ */ jsx(AlertDescription, { children: error })]
+		});
+		$[114] = error;
+		$[115] = t57;
+	} else t57 = $[115];
+	let t58;
+	if ($[116] !== isSubmitting || $[117] !== t) {
+		t58 = isSubmitting ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Icon, {
+			icon: "ph:spinner-gap-bold",
+			className: "animate-spin"
+		}), t("auth.creatingAdmin")] }) : t("auth.createFirstAdmin");
+		$[116] = isSubmitting;
+		$[117] = t;
+		$[118] = t58;
+	} else t58 = $[118];
+	let t59;
+	if ($[119] !== isSubmitting || $[120] !== t58) {
+		t59 = /* @__PURE__ */ jsx(Button, {
+			type: "submit",
+			className: "w-full",
+			size: "lg",
+			disabled: isSubmitting,
+			children: t58
+		});
+		$[119] = isSubmitting;
+		$[120] = t58;
+		$[121] = t59;
+	} else t59 = $[121];
+	let t60;
+	if ($[122] !== handleFormSubmit || $[123] !== t56 || $[124] !== t57 || $[125] !== t59 || $[126] !== t7) {
+		t60 = /* @__PURE__ */ jsxs("form", {
+			onSubmit: handleFormSubmit,
+			className: t7,
+			children: [
+				t56,
+				t57,
+				t59
+			]
+		});
+		$[122] = handleFormSubmit;
+		$[123] = t56;
+		$[124] = t57;
+		$[125] = t59;
+		$[126] = t7;
+		$[127] = t60;
+	} else t60 = $[127];
+	return t60;
+}
+
+//#endregion
+export { SetupForm };