fix: added captcha support for email otp form

src/components/auth/forms/email-otp-form.tsx

@@ -6,11 +6,14 @@ import { useContext, useEffect, useState } from "react"
 import { useForm } from "react-hook-form"
 import * as z from "zod"
 
+import type { BetterFetchOption } from "better-auth/react"
+import { useCaptcha } from "../../../hooks/use-captcha"
 import { useIsHydrated } from "../../../hooks/use-hydrated"
 import { useOnSuccessTransition } from "../../../hooks/use-success-transition"
 import { AuthUIContext } from "../../../lib/auth-ui-provider"
 import { cn, getLocalizedError } from "../../../lib/utils"
 import type { AuthLocalization } from "../../../localization/auth-localization"
+import { Captcha } from "../../captcha/captcha"
 import { Button } from "../../ui/button"
 import {
     Form,
@@ -57,6 +60,7 @@ function EmailForm({
     setEmail: (email: string) => void
 }) {
     const isHydrated = useIsHydrated()
+    const { captchaRef, getCaptchaHeaders } = useCaptcha({ localization })
 
     const {
         authClient,
@@ -91,11 +95,16 @@ function EmailForm({
     }, [form.formState.isSubmitting, setIsSubmitting])
 
     async function sendEmailOTP({ email }: z.infer<typeof formSchema>) {
+        const fetchOptions: BetterFetchOption = {
+            throw: true,
+            headers: await getCaptchaHeaders("/email-otp/send-verification-otp")
+        }
+
         try {
             await authClient.emailOtp.sendVerificationOtp({
                 email,
                 type: "sign-in",
-                fetchOptions: { throw: true }
+                fetchOptions
             })
 
             toast({
@@ -143,6 +152,12 @@ function EmailForm({
                     )}
                 />
 
+                <Captcha
+                    ref={captchaRef}
+                    localization={localization}
+                    action="/email-otp/send-verification-otp"
+                />
+
                 <Button
                     type="submit"
                     disabled={isSubmitting}