From 2e0e43b5e2ecfba907ca8d305b10ac1fcf20c65e Mon Sep 17 00:00:00 2001
From: Jared Schoeny <jared@schoeny.com>
Date: Mon, 15 Dec 2025 16:52:19 -1000
Subject: [PATCH] Require agreeing to Terms of Service before signup

---
 src/components/Auth/SignupForm.tsx | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/src/components/Auth/SignupForm.tsx b/src/components/Auth/SignupForm.tsx
index 4247f47..ec65269 100644
--- a/src/components/Auth/SignupForm.tsx
+++ b/src/components/Auth/SignupForm.tsx
@@ -15,6 +15,7 @@ export default function SignupForm() {
   const [email, setEmail] = React.useState("");
   const [password, setPassword] = React.useState("");
   const [confirm, setConfirm] = React.useState("");
+  const [acceptedTerms, setAcceptedTerms] = React.useState(false);
   const [showPassword, setShowPassword] = React.useState(false);
   const [emailError, setEmailError] = React.useState<string | null>(null);
   const [passwordError, setPasswordError] = React.useState<string | null>(null);
@@ -24,7 +25,7 @@ export default function SignupForm() {
 
   const [state, formAction, isPending] = useActionState<AuthActionState, FormData>(signup, { error: null });
   const passwordsMatch = password === confirm;
-  const isValid = !emailError && !passwordError && passwordsMatch;
+  const isValid = !emailError && !passwordError && passwordsMatch && acceptedTerms;
 
   // Reset Turnstile token and widget on error to allow retry
   useEffect(() => {
@@ -156,7 +157,30 @@ export default function SignupForm() {
         )}
       </div>
 
-      <div className="flex flex-col items-center gap-3">
+      <div className="flex items-center gap-2 text-xs text-foreground/80">
+        <input
+          id="accept-terms"
+          name="acceptTerms"
+          type="checkbox"
+          checked={acceptedTerms}
+          onChange={(e) => setAcceptedTerms(e.target.checked)}
+          className="mt-0.5 h-4 w-4 rounded border-[var(--border)] bg-[var(--surface-2)] text-[var(--ring)] focus:outline-none focus:ring-2 focus:ring-[var(--ring)]"
+          required
+        />
+        <label htmlFor="accept-terms" className="space-x-1">
+          <span>I agree to the</span>
+          <a
+            href="/terms"
+            className="font-medium text-sky-500 hover:text-sky-400 underline underline-offset-2"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            Terms of Service
+          </a>
+        </label>
+      </div>
+
+      <div className="flex flex-col items-center gap-3 mt-2">
         <Turnstile
           key={turnstileKey}
           siteKey={process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY!}