songtianlun/prmbr-image-mksaas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: update Captcha component

Browse Source
This commit is contained in:
javayhu 2025-07-18 20:37:59 +08:00
parent cb7743fe07
commit 2c4db1e744
2 changed files with 20 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/auth/register-form.tsx
View File

@ -54,7 +54,9 @@ export const RegisterForm = ({
// turnstile captcha schema // turnstile captcha schema
const turnstileEnabled = websiteConfig.features.enableTurnstileCaptcha; const turnstileEnabled = websiteConfig.features.enableTurnstileCaptcha;
const captchaSchema = turnstileEnabled const captchaSiteKey = process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY;
const captchaConfigured = turnstileEnabled && !!captchaSiteKey;
const captchaSchema = captchaConfigured
? z.string().min(1, 'Please complete the captcha') ? z.string().min(1, 'Please complete the captcha')
: z.string().optional(); : z.string().optional();
@ -87,8 +89,8 @@ export const RegisterForm = ({
}); });
const onSubmit = async (values: z.infer<typeof RegisterSchema>) => { const onSubmit = async (values: z.infer<typeof RegisterSchema>) => {
// Validate captcha token if turnstile is enabled // Validate captcha token if turnstile is enabled and site key is available
if (turnstileEnabled && values.captchaToken) { if (captchaConfigured && values.captchaToken) {
const captchaResult = await validateCaptchaAction({ const captchaResult = await validateCaptchaAction({
captchaToken: values.captchaToken, captchaToken: values.captchaToken,
}); });
@ -229,14 +231,14 @@ export const RegisterForm = ({
</div> </div>
<FormError message={error} /> <FormError message={error} />
<FormSuccess message={success} /> <FormSuccess message={success} />
{turnstileEnabled && ( {captchaConfigured && (
<Captcha <Captcha
onSuccess={(token) => form.setValue('captchaToken', token)} onSuccess={(token) => form.setValue('captchaToken', token)}
validationError={form.formState.errors.captchaToken?.message} validationError={form.formState.errors.captchaToken?.message}
/> />
)} )}
<Button <Button
disabled={isPending || (turnstileEnabled && !captchaToken)} disabled={isPending || (captchaConfigured && !captchaToken)}
size="lg" size="lg"
type="submit" type="submit"
className="cursor-pointer w-full flex items-center justify-center gap-2" className="cursor-pointer w-full flex items-center justify-center gap-2"

18
src/components/shared/captcha.tsx
View File

@ -23,15 +23,23 @@ type Props = Omit<ComponentProps<typeof Turnstile>, 'siteKey'> & {
*/ */
export const Captcha = ({ validationError, ...props }: Props) => { export const Captcha = ({ validationError, ...props }: Props) => {
const turnstileEnabled = websiteConfig.features.enableTurnstileCaptcha; const turnstileEnabled = websiteConfig.features.enableTurnstileCaptcha;
if (!turnstileEnabled || !process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY) { const siteKey = process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY;
console.error('Captcha, NEXT_PUBLIC_TURNSTILE_SITE_KEY is not set');
// If turnstile is disabled in config, don't render anything
if (!turnstileEnabled) {
return null;
}
// If turnstile is enabled but site key is missing, show error message
if (!siteKey) {
console.error('Captcha: NEXT_PUBLIC_TURNSTILE_SITE_KEY is not set');
return null; return null;
} }
const theme = useTheme(); const theme = useTheme();
const locale = useLocale(); const locale = useLocale();
return turnstileEnabled ? ( return (
<> <>
<Turnstile <Turnstile
options={{ options={{
@ -40,7 +48,7 @@ export const Captcha = ({ validationError, ...props }: Props) => {
theme: theme.theme === 'dark' ? 'dark' : 'light', theme: theme.theme === 'dark' ? 'dark' : 'light',
}} }}
{...props} {...props}
siteKey={process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY || ''} siteKey={siteKey}
/> />
{validationError && ( {validationError && (
@ -49,5 +57,5 @@ export const Captcha = ({ validationError, ...props }: Props) => {
</FormMessage> </FormMessage>
)} )}
</> </>
) : null; );
}; };