Improve the way this is hidden
This commit is contained in:
@@ -20,33 +20,34 @@ export default function CaptchaCodePage () {
|
|||||||
<p className='mb-4 px-8 -mt-2 text-center'>
|
<p className='mb-4 px-8 -mt-2 text-center'>
|
||||||
Verify you are human to get a code
|
Verify you are human to get a code
|
||||||
</p>
|
</p>
|
||||||
<Turnstile
|
{result == -1 && (
|
||||||
siteKey={process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY ?? ''}
|
<Turnstile
|
||||||
onSuccess={async token => {
|
siteKey={process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY ?? ''}
|
||||||
setToken(token)
|
onSuccess={async token => {
|
||||||
setResult(0)
|
setToken(token)
|
||||||
try {
|
setResult(0)
|
||||||
const result = await axios.post('/api/get-verify-code', {
|
try {
|
||||||
token
|
const result = await axios.post('/api/get-verify-code', {
|
||||||
})
|
token
|
||||||
if (result.data.success) {
|
})
|
||||||
setCode(result.data.data)
|
if (result.data.success) {
|
||||||
setResult(2)
|
setCode(result.data.data)
|
||||||
} else {
|
setResult(2)
|
||||||
if (result.data.message) {
|
|
||||||
setResultMsg(result.data.message)
|
|
||||||
} else {
|
} else {
|
||||||
setResult(3)
|
if (result.data.message) {
|
||||||
|
setResultMsg(result.data.message)
|
||||||
|
} else {
|
||||||
|
setResult(3)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
} catch {
|
||||||
|
setResult(3)
|
||||||
}
|
}
|
||||||
} catch {
|
}}
|
||||||
setResult(3)
|
onError={() => setResult(1)}
|
||||||
}
|
className='flex justify-center'
|
||||||
}}
|
/>
|
||||||
onError={() => setResult(1)}
|
)}
|
||||||
hidden={result != -1}
|
|
||||||
className='flex justify-center'
|
|
||||||
/>
|
|
||||||
<p className='mt-2 -mb-2 text-center text-sm' hidden={result == -1}>
|
<p className='mt-2 -mb-2 text-center text-sm' hidden={result == -1}>
|
||||||
{result == 0
|
{result == 0
|
||||||
? 'Getting verification code...'
|
? 'Getting verification code...'
|
||||||
@@ -57,26 +58,29 @@ export default function CaptchaCodePage () {
|
|||||||
: resultMsg ??
|
: resultMsg ??
|
||||||
'Failed to get verification code. Please try again later.'}
|
'Failed to get verification code. Please try again later.'}
|
||||||
</p>
|
</p>
|
||||||
<p
|
{result == 2 && (
|
||||||
className='bg-[rgb(64,64,88)] border border-[rgb(88,88,112)] hover:bg-[rgb(88,88,112)] hover:border-[rgb(112,112,136)] rounded-md px-2 py-1 mt-4 transition-colors text-center cursor-pointer'
|
<>
|
||||||
hidden={result != 2}
|
<p
|
||||||
onClick={async () => {
|
className='bg-[rgb(64,64,88)] border border-[rgb(88,88,112)] hover:bg-[rgb(88,88,112)] hover:border-[rgb(112,112,136)] rounded-md px-2 py-1 mt-4 transition-colors text-center cursor-pointer'
|
||||||
navigator.clipboard.writeText(code ?? '')
|
onClick={async () => {
|
||||||
if (showCopied) return
|
navigator.clipboard.writeText(code ?? '')
|
||||||
setShowCopied(true)
|
if (showCopied) return
|
||||||
setTimeout(() => {
|
setShowCopied(true)
|
||||||
setShowCopied(false)
|
setTimeout(() => {
|
||||||
}, 3000)
|
setShowCopied(false)
|
||||||
}}
|
}, 3000)
|
||||||
>
|
}}
|
||||||
{code ?? 'N/A'}
|
>
|
||||||
</p>
|
{code ?? 'N/A'}
|
||||||
<p
|
</p>
|
||||||
className='text-blue-500 text-center mt-2 -mb-4'
|
<p
|
||||||
hidden={!showCopied || result != 2}
|
className='text-blue-500 text-center mt-2 -mb-4'
|
||||||
>
|
hidden={!showCopied}
|
||||||
Copied to clipboard!
|
>
|
||||||
</p>
|
Copied to clipboard!
|
||||||
|
</p>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user