feat: add captcha validation on session creation

src/actions/init-session.ts

@@ -1,21 +1,40 @@
-import { app } from "@/firebase/server";
+import { app } from "@/lib/firebase/server";
 import { defineAction } from "astro:actions";
 import { getAuth } from "firebase-admin/auth";
 import { z } from "astro:schema";
-import { initUserSubmission } from "@/firebase/database";
+import { initUserSubmission } from "@/lib/firebase/database";
+import { isCaptchaValid } from "@/lib/captcha";
 
 export const initSession = defineAction({
   accept: "json",
   input: z.object({
-    idToken: z.string()
+    idToken: z.string(),
+    captchaToken: z.string().optional()
   }),
-  handler: async ({ idToken }, { cookies }) => {
+  handler: async ({ idToken, captchaToken }, { cookies }) => {
     const auth = getAuth(app);
+    /* Validate inputs */
+    if (!captchaToken && import.meta.env.CAPTCHA_ENABLED === "true") {
+      return {
+        error: "Captcha token is required"
+      };
+    }
     if (!idToken) {
       return {
         error: "No idToken provided"
       };
     }
+
+    /* Validate captcha */
+    if (captchaToken && import.meta.env.CAPTCHA_ENABLED === "true") {
+      const isValid = await isCaptchaValid(captchaToken);
+      if (!isValid) {
+        return {
+          error: "Invalid captcha"
+        };
+      }
+    }
+
     /* Verify id token and save user to database */
     try {
       const decodedToken = await auth.verifyIdToken(idToken);

src/actions/submit-answers.ts

@@ -1,8 +1,8 @@
-import { app } from "@/firebase/server";
+import { app } from "@/lib/firebase/server";
 import { defineAction } from "astro:actions";
 import { getAuth } from "firebase-admin/auth";
 import { z } from "astro:schema";
-import { saveAnswers } from "@/firebase/database";
+import { saveAnswers } from "@/lib/firebase/database";
 
 export const submitAnswers = defineAction({
   accept: "json",

src/components/survey/section.tsx

@@ -19,7 +19,6 @@ export const ERRORS = {
 const convertAnswersToNumber = (
   answers: Record<string, string | string[] | null | boolean>
 ) => {
-  console.log(answers);
   const convertedAnswers: Record<string, number | number[] | null> = {};
 
   for (const [key, value] of Object.entries(answers)) {
@@ -131,7 +130,7 @@ export default React.memo(({ section, next, setProgress }: SectionProps) => {
           <button
             data-testid="next-button"
             type="button"
-            className="px-4 py-2 bg-emerald-500 text-white rounded transition hover:bg-emerald-600"
+            className="px-4 py-2 min-w-[120px] bg-emerald-500 text-white rounded transition hover:bg-emerald-600"
             onClick={() => nextQuestion()}
           >
             {loading ? "Loading..." : "Next"}

src/lib/captcha.ts

@@ -0,0 +1,25 @@
+const CLOUDFLARE_CAPTCHA_URL =
+  "https://challenges.cloudflare.com/turnstile/v0/siteverify";
+
+export const isCaptchaValid = async (token: string) => {
+  if (import.meta.env.CAPTCHA_ENABLED === "false") return true;
+  if (!import.meta.env.PUBLIC_TURNSTILE_SECRET_KEY) return true;
+  try {
+    const response = await fetch(CLOUDFLARE_CAPTCHA_URL, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/x-www-form-urlencoded"
+      },
+      body: JSON.stringify({
+        secret: import.meta.env.PUBLIC_TURNSTILE_SECRET_KEY,
+        response: token
+      })
+    });
+
+    const data = await response.json();
+    return data.success;
+  } catch (error) {
+    console.error("Error validating captcha:", error);
+    return false;
+  }
+};