cleanup captcha step
This commit is contained in:
@@ -1,5 +1,4 @@
|
||||
import React, {useEffect, useRef} from 'react'
|
||||
import {StyleSheet} from 'react-native'
|
||||
import {useEffect, useMemo, useRef} from 'react'
|
||||
import {WebView, type WebViewNavigation} from 'react-native-webview'
|
||||
import {type ShouldStartLoadRequest} from 'react-native-webview/lib/WebViewTypes'
|
||||
|
||||
@@ -43,7 +42,7 @@ export function CaptchaWebView({
|
||||
}
|
||||
}, [])
|
||||
|
||||
const redirectHost = React.useMemo(() => {
|
||||
const redirectHost = useMemo(() => {
|
||||
if (!state?.serviceUrl) return 'bsky.app'
|
||||
|
||||
return state?.serviceUrl &&
|
||||
@@ -52,49 +51,47 @@ export function CaptchaWebView({
|
||||
: 'bsky.app'
|
||||
}, [state?.serviceUrl])
|
||||
|
||||
const wasSuccessful = React.useRef(false)
|
||||
const wasSuccessful = useRef(false)
|
||||
|
||||
const onShouldStartLoadWithRequest = React.useCallback(
|
||||
(event: ShouldStartLoadRequest) => {
|
||||
const urlp = new URL(event.url)
|
||||
return ALLOWED_HOSTS.includes(urlp.host)
|
||||
},
|
||||
[],
|
||||
)
|
||||
const onShouldStartLoadWithRequest = (event: ShouldStartLoadRequest) => {
|
||||
const urlp = new URL(event.url)
|
||||
return ALLOWED_HOSTS.includes(urlp.host)
|
||||
}
|
||||
|
||||
const onNavigationStateChange = React.useCallback(
|
||||
(e: WebViewNavigation) => {
|
||||
if (wasSuccessful.current) return
|
||||
const onNavigationStateChange = (e: WebViewNavigation) => {
|
||||
if (wasSuccessful.current) return
|
||||
|
||||
const urlp = new URL(e.url)
|
||||
if (urlp.host !== redirectHost || urlp.pathname === '/gate/signup') return
|
||||
const urlp = new URL(e.url)
|
||||
if (urlp.host !== redirectHost || urlp.pathname === '/gate/signup') return
|
||||
|
||||
const code = urlp.searchParams.get('code')
|
||||
if (urlp.searchParams.get('state') !== stateParam || !code) {
|
||||
onError({error: 'Invalid state or code'})
|
||||
return
|
||||
}
|
||||
const code = urlp.searchParams.get('code')
|
||||
if (urlp.searchParams.get('state') !== stateParam || !code) {
|
||||
onError({error: 'Invalid state or code'})
|
||||
return
|
||||
}
|
||||
|
||||
// We want to delay the completion of this screen ever so slightly so that it doesn't appear to be a glitch if it completes too fast
|
||||
wasSuccessful.current = true
|
||||
const now = Date.now()
|
||||
const timeTaken = now - startedAt.current
|
||||
if (timeTaken < MIN_DELAY) {
|
||||
successTo.current = setTimeout(() => {
|
||||
onSuccess(code)
|
||||
}, MIN_DELAY - timeTaken)
|
||||
} else {
|
||||
// We want to delay the completion of this screen ever so slightly so that it doesn't appear to be a glitch if it completes too fast
|
||||
wasSuccessful.current = true
|
||||
const now = Date.now()
|
||||
const timeTaken = now - startedAt.current
|
||||
if (timeTaken < MIN_DELAY) {
|
||||
successTo.current = setTimeout(() => {
|
||||
onSuccess(code)
|
||||
}
|
||||
},
|
||||
[redirectHost, stateParam, onSuccess, onError],
|
||||
)
|
||||
}, MIN_DELAY - timeTaken)
|
||||
} else {
|
||||
onSuccess(code)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<WebView
|
||||
source={{uri: url}}
|
||||
javaScriptEnabled
|
||||
style={styles.webview}
|
||||
style={{
|
||||
flex: 1,
|
||||
backgroundColor: 'transparent',
|
||||
borderRadius: 10,
|
||||
}}
|
||||
onShouldStartLoadWithRequest={onShouldStartLoadWithRequest}
|
||||
onNavigationStateChange={onNavigationStateChange}
|
||||
scrollEnabled={false}
|
||||
@@ -107,11 +104,3 @@ export function CaptchaWebView({
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
webview: {
|
||||
flex: 1,
|
||||
backgroundColor: 'transparent',
|
||||
borderRadius: 10,
|
||||
},
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user