Extension login infinite loading #198
@ -18,12 +18,16 @@ import {
|
|||||||
} from '../../store/actions'
|
} from '../../store/actions'
|
||||||
import { LoginMethods } from '../../store/auth/types'
|
import { LoginMethods } from '../../store/auth/types'
|
||||||
import { Dispatch } from '../../store/store'
|
import { Dispatch } from '../../store/store'
|
||||||
import { npubToHex, queryNip05 } from '../../utils'
|
import { npubToHex, queryNip05, timeout } from '../../utils'
|
||||||
import { hexToBytes } from '@noble/hashes/utils'
|
import { hexToBytes } from '@noble/hashes/utils'
|
||||||
import { NIP05_REGEX } from '../../constants'
|
import { NIP05_REGEX } from '../../constants'
|
||||||
|
|
||||||
import styles from './styles.module.scss'
|
import styles from './styles.module.scss'
|
||||||
|
|
||||||
|
import { TimeoutError } from '../../types/errors/TimeoutError'
|
||||||
|
const EXTENSION_LOGIN_DELAY_SECONDS = 2
|
||||||
|
const EXTENSION_LOGIN_TIMEOUT_SECONDS = EXTENSION_LOGIN_DELAY_SECONDS + 10
|
||||||
|
|
||||||
export const Nostr = () => {
|
export const Nostr = () => {
|
||||||
const [searchParams] = useSearchParams()
|
const [searchParams] = useSearchParams()
|
||||||
|
|
||||||
@ -36,6 +40,7 @@ export const Nostr = () => {
|
|||||||
|
|
||||||
const [isLoading, setIsLoading] = useState(false)
|
const [isLoading, setIsLoading] = useState(false)
|
||||||
const [loadingSpinnerDesc, setLoadingSpinnerDesc] = useState('')
|
const [loadingSpinnerDesc, setLoadingSpinnerDesc] = useState('')
|
||||||
|
const [isExtensionSlow, setIsExtensionSlow] = useState(false)
|
||||||
const [inputValue, setInputValue] = useState('')
|
const [inputValue, setInputValue] = useState('')
|
||||||
const [authUrl, setAuthUrl] = useState<string>()
|
const [authUrl, setAuthUrl] = useState<string>()
|
||||||
|
|
||||||
@ -72,27 +77,39 @@ export const Nostr = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const loginWithExtension = async () => {
|
const loginWithExtension = async () => {
|
||||||
setIsLoading(true)
|
try {
|
||||||
setLoadingSpinnerDesc('Capturing pubkey from nostr extension')
|
// Wait EXTENSION_LOGIN_DELAY_SECONDS before showing extension delay message
|
||||||
|
const waitTimeout = window.setTimeout(() => {
|
||||||
|
setIsExtensionSlow(true)
|
||||||
|
}, 2000)
|
||||||
|
|
||||||
nostrController
|
setIsLoading(true)
|
||||||
.capturePublicKey()
|
setLoadingSpinnerDesc('Capturing pubkey from nostr extension')
|
||||||
.then(async (pubkey) => {
|
|
||||||
dispatch(updateLoginMethod(LoginMethods.extension))
|
|
||||||
|
|
||||||
setLoadingSpinnerDesc('Authenticating and finding metadata')
|
const pubkey = await nostrController.capturePublicKey()
|
||||||
const redirectPath =
|
dispatch(updateLoginMethod(LoginMethods.extension))
|
||||||
await authController.authAndGetMetadataAndRelaysMap(pubkey)
|
|
||||||
|
|
||||||
if (redirectPath) navigateAfterLogin(redirectPath)
|
setLoadingSpinnerDesc('Authenticating and finding metadata')
|
||||||
})
|
const redirectPath = await Promise.race([
|
||||||
.catch((err) => {
|
authController.authAndGetMetadataAndRelaysMap(pubkey),
|
||||||
toast.error('Error capturing public key from nostr extension: ' + err)
|
timeout(EXTENSION_LOGIN_TIMEOUT_SECONDS * 1000)
|
||||||
})
|
])
|
||||||
.finally(() => {
|
|
||||||
setIsLoading(false)
|
if (redirectPath) {
|
||||||
setLoadingSpinnerDesc('')
|
window.clearTimeout(waitTimeout)
|
||||||
})
|
navigateAfterLogin(redirectPath)
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
if (error instanceof TimeoutError) {
|
||||||
|
toast.error("Extension didn't respond in time")
|
||||||
|
} else {
|
||||||
|
toast.error('Error capturing public key from nostr extension: ' + error)
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
setIsLoading(false)
|
||||||
|
setLoadingSpinnerDesc('')
|
||||||
|
setIsExtensionSlow(false)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -354,7 +371,25 @@ export const Nostr = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{isLoading && <LoadingSpinner desc={loadingSpinnerDesc} />}
|
{isLoading && (
|
||||||
|
<LoadingSpinner desc={loadingSpinnerDesc}>
|
||||||
|
{isExtensionSlow && (
|
||||||
|
<>
|
||||||
|
<p>Extension is not responding</p>
|
||||||
|
<Button
|
||||||
|
fullWidth
|
||||||
|
variant="contained"
|
||||||
|
onClick={() => {
|
||||||
|
setLoadingSpinnerDesc('')
|
||||||
|
setIsLoading(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Close
|
||||||
|
</Button>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</LoadingSpinner>
|
||||||
|
)}
|
||||||
|
|
||||||
{isNostrExtensionAvailable && (
|
{isNostrExtensionAvailable && (
|
||||||
<>
|
<>
|
||||||
|
Loading…
Reference in New Issue
Block a user