diff --git a/src/components/create/CreateStepVerifyMnemonic.tsx b/src/components/create/CreateStepVerifyMnemonic.tsx index f88df347..e7022a54 100644 --- a/src/components/create/CreateStepVerifyMnemonic.tsx +++ b/src/components/create/CreateStepVerifyMnemonic.tsx @@ -1,4 +1,4 @@ -import { useCallback, useMemo, useState } from 'react' +import { useCallback, useEffect, useMemo, useState } from 'react' import { useMutation } from '@tanstack/react-query' import { CheckCircle2Icon, ChevronLeftIcon } from 'lucide-react' import { useTranslation } from 'react-i18next' @@ -7,6 +7,7 @@ import { isDebugFeatureEnabled } from '@/constants/debugFeatures' import { cn } from '@/lib/utils' import type { MnemonicPhrase } from '@/types/global' import { DevBadge } from '../dev/DevBadge' +import { MaskedText } from '../ui/jam/MaskedText' import { Spinner } from '../ui/spinner' const skipWalletBackupVerification = isDebugFeatureEnabled('skipWalletBackupVerification') @@ -45,7 +46,6 @@ export const CreateStepVerifyMnemonic = ({ mnemonicPhrase, onVerified, onBack }: if (word !== expectedWord) { setWrongButtonIndex(shuffledIndex) - setTimeout(() => setWrongButtonIndex(undefined), 600) return } @@ -55,6 +55,12 @@ export const CreateStepVerifyMnemonic = ({ mnemonicPhrase, onVerified, onBack }: [mnemonicPhrase, selectedWords, pickedIndicesSet, wrongButtonIndex], ) + useEffect(() => { + if (wrongButtonIndex === undefined) return + const timerId = setTimeout(() => setWrongButtonIndex(undefined), 600) + return () => clearTimeout(timerId) + }, [wrongButtonIndex]) + const progress = selectedWords.length const total = mnemonicPhrase.length const allSelected = progress === total @@ -81,7 +87,7 @@ export const CreateStepVerifyMnemonic = ({ mnemonicPhrase, onVerified, onBack }: