pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-20 06:31:13 -05:00
Code Issues Packages Projects Releases Wiki Activity

Refactor: Optimize Captcha Loading

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-10 15:40:21 +00:00
parent a3d3d9cf48
commit 8fb7c5c988
2 changed files with 14 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
index.html
View File

@@ -24,6 +24,9 @@
<!-- Cloudflare Turnstile - Preconnect for faster captcha loading -->
<link rel="dns-prefetch" href="https://challenges.cloudflare.com">
<link rel="preconnect" href="https://challenges.cloudflare.com" crossorigin>
<link rel="modulepreload" href="https://challenges.cloudflare.com/turnstile/v0/api.js" as="script">
<link rel="dns-prefetch" href="https://cloudflare.com">
<link rel="preconnect" href="https://cloudflare.com" crossorigin>
<!-- Uppy CSS for photo upload functionality -->
<link href="https://releases.transloadit.com/uppy/v3.25.3/uppy.min.css" rel="stylesheet">

24
src/components/auth/TurnstileCaptcha.tsx
View File

@@ -77,7 +77,7 @@ export function TurnstileCaptcha({
if (loading) {
const timeout = setTimeout(() => {
setLoading(false);
}, 10000); // 10 second timeout
}, 5000); // 5 second timeout
return () => clearTimeout(timeout);
}
}, [loading]);
@@ -95,13 +95,18 @@ export function TurnstileCaptcha({
return (
<div className={`space-y-3 ${className}`}>
<div className="flex flex-col items-center min-h-[65px]">
<div className="flex flex-col items-center">
{loading && (
<div className="w-[300px] h-[65px] flex items-center justify-center border border-dashed border-muted-foreground/30 rounded-lg bg-muted/10 animate-pulse">
<span className="text-xs text-muted-foreground">Loading CAPTCHA...</span>
</div>
)}
<div
className="transition-opacity duration-300"
className="transition-opacity duration-100"
style={{
visibility: loading ? 'hidden' : 'visible',
opacity: loading ? 0 : 1,
height: loading ? 0 : 'auto'
display: loading ? 'none' : 'block',
opacity: loading ? 0 : 1
}}
>
<Turnstile
@@ -121,13 +126,6 @@ export function TurnstileCaptcha({
}}
/>
</div>
{loading && (
<div className="flex items-center justify-center p-4 border border-dashed border-muted-foreground/30 rounded-lg bg-muted/20">
<RefreshCw className="w-4 h-4 animate-spin mr-2 text-muted-foreground" />
<span className="text-sm text-muted-foreground">Loading CAPTCHA...</span>
</div>
)}
</div>
{error && (