Leahnaya/hackdex-website
1
0
Fork 0
mirror of https://github.com/Hackdex-App/hackdex-website.git synced 2026-09-08 00:46:38 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

Require invite code to create account

Browse Source
This commit is contained in:
Jared Schoeny
2025-10-21 13:44:02 -10:00
parent dd8a1013ba
commit be8a073329
3 changed files with 88 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/components/Auth/SignupForm.tsx
View File

@@ -11,13 +11,14 @@ export default function SignupForm() {
const [email, setEmail] = React.useState("");
const [password, setPassword] = React.useState("");
const [confirm, setConfirm] = React.useState("");
const [invite, setInvite] = React.useState<string>("");
const [showPassword, setShowPassword] = React.useState(false);
const [emailError, setEmailError] = React.useState<string | null>(null);
const [passwordError, setPasswordError] = React.useState<string | null>(null);
const [state, formAction] = useActionState<AuthActionState, FormData>(signup, { error: null });
const [state, formAction, isPending] = useActionState<AuthActionState, FormData>(signup, { error: null });
const passwordsMatch = password === confirm;
const isValid = !emailError && !passwordError && passwordsMatch;
const isValid = !emailError && !passwordError && passwordsMatch && Boolean(invite);
useEffect(() => {
const { error } = validateEmail(email);
@@ -31,16 +32,44 @@ export default function SignupForm() {
const redirectTo = searchParams.get("redirectTo");
useEffect(() => {
const inviteFromParams = searchParams.get("invite") || "";
if (inviteFromParams) {
setInvite(inviteFromParams);
}
}, []);
return (
<form className="grid gap-5 group">
{redirectTo && (
<input type="hidden" name="redirectTo" value={redirectTo} />
)}
{(state?.error) && (
{(state?.error && !isPending) && (
<div className="rounded-md bg-red-500/10 ring-1 ring-red-600/40 px-3 py-2 text-sm text-red-300">
{state?.error}
</div>
)}
<div className="grid gap-2">
<label htmlFor="inviteCode" className="text-sm text-foreground/80">Invite code</label>
<input
id="inviteCode"
name="inviteCode"
type="text"
value={invite}
onChange={(e) => setInvite(e.target.value)}
placeholder="Enter your invite code"
className={`h-11 rounded-md bg-[var(--surface-2)] px-3 text-sm ring-1 ring-inset ring-[var(--border)] focus:outline-none focus:ring-2 focus:ring-[var(--ring)] ${
invite ? "bg-[var(--surface-2)] ring-[var(--border)]" : "bg-[var(--surface-2)] ring-[var(--border)]"
}`}
required
inputMode="text"
autoComplete="off"
spellCheck={false}
/>
{!invite && (
<span className="text-xs text-foreground/60">An invite code is required to create an account.</span>
)}
</div>
<div className="grid gap-2">
<label htmlFor="email" className="text-sm text-foreground/80">Email</label>
<input
@@ -130,7 +159,7 @@ export default function SignupForm() {
<button
type="submit"
formAction={formAction}
disabled={!isValid}
disabled={!isValid || isPending}
className="shine-wrap btn-premium h-11 min-w-[7.5rem] text-sm font-semibold hover:cursor-pointer dark:disabled:opacity-70 disabled:cursor-not-allowed disabled:[box-shadow:0_0_0_1px_var(--border)]"
>
<span>Sign up</span>