diff --git a/src/app/features/ledger/flows/bitcoin-tx-signing/ledger-bitcoin-sign-tx-container.tsx b/src/app/features/ledger/flows/bitcoin-tx-signing/ledger-bitcoin-sign-tx-container.tsx index 3058be4d787..c56230b82d7 100644 --- a/src/app/features/ledger/flows/bitcoin-tx-signing/ledger-bitcoin-sign-tx-container.tsx +++ b/src/app/features/ledger/flows/bitcoin-tx-signing/ledger-bitcoin-sign-tx-container.tsx @@ -26,7 +26,7 @@ import { getBitcoinAppVersion, isBitcoinAppOpen, } from '@app/features/ledger/utils/bitcoin-ledger-utils'; -import { useActionCancellableByUser } from '@app/features/ledger/utils/stacks-ledger-utils'; +import { useCanCloseLedgerDialog } from '@app/features/ledger/utils/generic-ledger-utils'; import { useToast } from '@app/features/toasts/use-toast'; import { useSignLedgerBitcoinTx } from '@app/store/accounts/blockchain/bitcoin/bitcoin.hooks'; import { useCurrentNetwork } from '@app/store/networks/networks.selectors'; @@ -43,7 +43,6 @@ function LedgerSignBitcoinTxContainer() { const location = useLocation(); const ledgerNavigate = useLedgerNavigate(); const ledgerAnalytics = useLedgerAnalytics(); - const canUserCancelAction = useActionCancellableByUser(); useScrollLock(true); const [unsignedTransactionRaw, setUnsignedTransactionRaw] = useState(null); @@ -113,12 +112,12 @@ function LedgerSignBitcoinTxContainer() { latestDeviceResponse, awaitingDeviceConnection, }; + const canCloseLedgerDialog = useCanCloseLedgerDialog(awaitingDeviceConnection); - const canClose = !awaitingDeviceConnection && canUserCancelAction; return ( ); } diff --git a/src/app/features/ledger/flows/jwt-signing/ledger-sign-jwt-container.tsx b/src/app/features/ledger/flows/jwt-signing/ledger-sign-jwt-container.tsx index 80896ab4480..2d871e29384 100644 --- a/src/app/features/ledger/flows/jwt-signing/ledger-sign-jwt-container.tsx +++ b/src/app/features/ledger/flows/jwt-signing/ledger-sign-jwt-container.tsx @@ -15,10 +15,10 @@ import { useDefaultRequestParams } from '@app/common/hooks/use-default-request-s import { useKeyActions } from '@app/common/hooks/use-key-actions'; import { useScrollLock } from '@app/common/hooks/use-scroll-lock'; import { makeLedgerCompatibleUnsignedAuthResponsePayload } from '@app/common/unsafe-auth-response'; +import { useCanCloseLedgerDialog } from '@app/features/ledger/utils/generic-ledger-utils'; import { getStacksAppVersion, prepareLedgerDeviceStacksAppConnection, - useActionCancellableByUser, } from '@app/features/ledger/utils/stacks-ledger-utils'; import { useCurrentStacksAccount, @@ -47,7 +47,6 @@ export function LedgerSignJwtContainer() { const getBitcoinAddressesLegacyFormat = useGetLegacyAuthBitcoinAddresses(); const keyActions = useKeyActions(); - const canUserCancelAction = useActionCancellableByUser(); const { decodedAuthRequest, authRequest } = useOnboardingState(); const [accountIndex, setAccountIndex] = useState(null); @@ -178,13 +177,14 @@ export function LedgerSignJwtContainer() { awaitingDeviceConnection, }; - const canClose = !awaitingDeviceConnection && canUserCancelAction; + const canCloseLedgerDialog = useCanCloseLedgerDialog(awaitingDeviceConnection); + return ( } - onClose={canClose ? () => onCancelConnectLedger() : undefined} + onClose={canCloseLedgerDialog ? () => onCancelConnectLedger() : undefined} > diff --git a/src/app/features/ledger/flows/request-bitcoin-keys/ledger-request-bitcoin-keys.tsx b/src/app/features/ledger/flows/request-bitcoin-keys/ledger-request-bitcoin-keys.tsx index e7aab358f7e..07729d3eaa1 100644 --- a/src/app/features/ledger/flows/request-bitcoin-keys/ledger-request-bitcoin-keys.tsx +++ b/src/app/features/ledger/flows/request-bitcoin-keys/ledger-request-bitcoin-keys.tsx @@ -19,7 +19,7 @@ import { getBitcoinAppVersion, isBitcoinAppOpen, } from '@app/features/ledger/utils/bitcoin-ledger-utils'; -import { useActionCancellableByUser } from '@app/features/ledger/utils/stacks-ledger-utils'; +import { useCanCloseLedgerDialog } from '@app/features/ledger/utils/generic-ledger-utils'; import { bitcoinKeysSlice } from '@app/store/ledger/bitcoin/bitcoin-key.slice'; import { useCurrentNetwork } from '@app/store/networks/networks.selectors'; @@ -27,7 +27,6 @@ function LedgerRequestBitcoinKeys() { const navigate = useNavigate(); const dispatch = useDispatch(); - const canUserCancelAction = useActionCancellableByUser(); const ledgerNavigate = useLedgerNavigate(); const network = useCurrentNetwork(); @@ -69,10 +68,11 @@ function LedgerRequestBitcoinKeys() { outdatedAppVersionWarning: false, }; + const canCloseLedgerDialog = useCanCloseLedgerDialog(awaitingDeviceConnection); return ( ); } diff --git a/src/app/features/ledger/flows/request-stacks-keys/ledger-request-stacks-keys.tsx b/src/app/features/ledger/flows/request-stacks-keys/ledger-request-stacks-keys.tsx index 53e946ff5fa..d45c430ee82 100644 --- a/src/app/features/ledger/flows/request-stacks-keys/ledger-request-stacks-keys.tsx +++ b/src/app/features/ledger/flows/request-stacks-keys/ledger-request-stacks-keys.tsx @@ -14,11 +14,11 @@ import { useRequestLedgerKeys, } from '@app/features/ledger/generic-flows/request-keys/use-request-ledger-keys'; import { useLedgerNavigate } from '@app/features/ledger/hooks/use-ledger-navigate'; +import { useCanCloseLedgerDialog } from '@app/features/ledger/utils/generic-ledger-utils'; import { connectLedgerStacksApp, getStacksAppVersion, isStacksAppOpen, - useActionCancellableByUser, } from '@app/features/ledger/utils/stacks-ledger-utils'; import { useToast } from '@app/features/toasts/use-toast'; import { stacksKeysSlice } from '@app/store/ledger/stacks/stacks-key.slice'; @@ -27,7 +27,6 @@ function LedgerRequestStacksKeys() { const toast = useToast(); const navigate = useNavigate(); const ledgerNavigate = useLedgerNavigate(); - const canUserCancelAction = useActionCancellableByUser(); const dispatch = useDispatch(); @@ -76,10 +75,11 @@ function LedgerRequestStacksKeys() { outdatedAppVersionWarning, }; + const canCloseLedgerDialog = useCanCloseLedgerDialog(awaitingDeviceConnection); return ( ); } diff --git a/src/app/features/ledger/flows/stacks-message-signing/ledger-stacks-sign-msg-container.tsx b/src/app/features/ledger/flows/stacks-message-signing/ledger-stacks-sign-msg-container.tsx index 398bf4a9308..8e202fbb37c 100644 --- a/src/app/features/ledger/flows/stacks-message-signing/ledger-stacks-sign-msg-container.tsx +++ b/src/app/features/ledger/flows/stacks-message-signing/ledger-stacks-sign-msg-container.tsx @@ -10,12 +10,12 @@ import { delay, isError } from '@shared/utils'; import { useScrollLock } from '@app/common/hooks/use-scroll-lock'; import { appEvents } from '@app/common/publish-subscribe'; +import { useCanCloseLedgerDialog } from '@app/features/ledger/utils/generic-ledger-utils'; import { getStacksAppVersion, prepareLedgerDeviceStacksAppConnection, signLedgerStacksStructuredMessage, signLedgerStacksUtf8Message, - useActionCancellableByUser, } from '@app/features/ledger/utils/stacks-ledger-utils'; import { useCurrentStacksAccount } from '@app/store/accounts/blockchain/stacks/stacks-account.hooks'; import { StacksAccount } from '@app/store/accounts/blockchain/stacks/stacks-account.models'; @@ -54,7 +54,6 @@ function LedgerSignStacksMsg({ account, unsignedMessage }: LedgerSignMsgProps) { const verifyLedgerPublicKey = useVerifyMatchingLedgerStacksPublicKey(); const [latestDeviceResponse, setLatestDeviceResponse] = useLedgerResponseState(); - const canUserCancelAction = useActionCancellableByUser(); const [awaitingDeviceConnection, setAwaitingDeviceConnection] = useState(false); @@ -142,14 +141,14 @@ function LedgerSignStacksMsg({ account, unsignedMessage }: LedgerSignMsgProps) { latestDeviceResponse, awaitingDeviceConnection, }; + const canCloseLedgerDialog = useCanCloseLedgerDialog(awaitingDeviceConnection); - const canClose = !awaitingDeviceConnection && canUserCancelAction; return ( } - onClose={canClose ? () => ledgerNavigate.cancelLedgerAction() : undefined} + onClose={canCloseLedgerDialog ? () => ledgerNavigate.cancelLedgerAction() : undefined} > diff --git a/src/app/features/ledger/flows/stacks-tx-signing/ledger-sign-stacks-tx-container.tsx b/src/app/features/ledger/flows/stacks-tx-signing/ledger-sign-stacks-tx-container.tsx index e589a64de74..38f7138b3fa 100644 --- a/src/app/features/ledger/flows/stacks-tx-signing/ledger-sign-stacks-tx-container.tsx +++ b/src/app/features/ledger/flows/stacks-tx-signing/ledger-sign-stacks-tx-container.tsx @@ -11,6 +11,7 @@ import { delay, isError } from '@shared/utils'; import { useScrollLock } from '@app/common/hooks/use-scroll-lock'; import { appEvents } from '@app/common/publish-subscribe'; import { LedgerTxSigningContext } from '@app/features/ledger/generic-flows/tx-signing/ledger-sign-tx.context'; +import { useCanCloseLedgerDialog } from '@app/features/ledger/utils/generic-ledger-utils'; import { connectLedgerStacksApp, getStacksAppVersion, @@ -18,7 +19,6 @@ import { isVersionOfLedgerStacksAppWithContractPrincipalBug, signLedgerStacksTransaction, signStacksTransactionWithSignature, - useActionCancellableByUser, } from '@app/features/ledger/utils/stacks-ledger-utils'; import { useCurrentStacksAccount } from '@app/store/accounts/blockchain/stacks/stacks-account.hooks'; @@ -46,7 +46,6 @@ function LedgerSignStacksTxContainer() { const verifyLedgerPublicKey = useVerifyMatchingLedgerStacksPublicKey(); const [unsignedTx, setUnsignedTx] = useState(null); const navigate = useNavigate(); - const canUserCancelAction = useActionCancellableByUser(); const chain = 'stacks' as const; @@ -149,10 +148,12 @@ function LedgerSignStacksTxContainer() { awaitingDeviceConnection, hasUserSkippedBuggyAppWarning, }; - - const canClose = !awaitingDeviceConnection && canUserCancelAction; + const canCloseLedgerDialog = useCanCloseLedgerDialog(awaitingDeviceConnection); return ( - + ); } diff --git a/src/app/features/ledger/generic-flows/tx-signing/use-ledger-sign-tx.ts b/src/app/features/ledger/generic-flows/tx-signing/use-ledger-sign-tx.ts index d2fe32957dc..a00b0b3fb26 100644 --- a/src/app/features/ledger/generic-flows/tx-signing/use-ledger-sign-tx.ts +++ b/src/app/features/ledger/generic-flows/tx-signing/use-ledger-sign-tx.ts @@ -37,7 +37,7 @@ export function useLedgerSignTx({ }: UseLedgerSignTxArgs) { const [outdatedAppVersionWarning, setAppVersionOutdatedWarning] = useState(false); const [latestDeviceResponse, setLatestDeviceResponse] = useLedgerResponseState(); - const [awaitingDeviceConnection, setAwaitingDeviceConnection] = useState(false); + const [awaitingDeviceConnection, setAwaitingDeviceConnection] = useState(false); > Peter - probably cleaner to just return canClose in here instead? const ledgerNavigate = useLedgerNavigate(); const hasUserSkippedBuggyAppWarning = useMemo(() => createWaitForUserToSeeWarningScreen(), []); async function checkCorrectAppIsOpenWithFailState(app: App) { diff --git a/src/app/features/ledger/utils/generic-ledger-utils.ts b/src/app/features/ledger/utils/generic-ledger-utils.ts index 33504c50a4d..cd512dbd187 100644 --- a/src/app/features/ledger/utils/generic-ledger-utils.ts +++ b/src/app/features/ledger/utils/generic-ledger-utils.ts @@ -1,8 +1,10 @@ import { useState } from 'react'; +import { useLocation } from 'react-router-dom'; import TransportWebUSB from '@ledgerhq/hw-transport-webusb'; import BitcoinApp from 'ledger-bitcoin'; +import { RouteUrls } from '@shared/route-urls'; import { delay } from '@shared/utils'; import { safeAwait } from '@app/common/utils/safe-await'; @@ -120,3 +122,19 @@ export function checkLockedDeviceError(e: Error) { e?.message === LedgerConnectionErrors.DeviceLocked ); } + +function useActionCancellableByUser() { + const { pathname } = useLocation(); + return ( + pathname.includes(RouteUrls.ConnectLedger) || + pathname.includes(RouteUrls.ConnectLedgerSuccess) || + pathname.includes(RouteUrls.ConnectLedgerError) || + pathname.includes(RouteUrls.AwaitingDeviceUserAction) + ); +} + +export function useCanCloseLedgerDialog(awaitingDeviceConnection: boolean) { + const canUserCancelAction = useActionCancellableByUser(); + + return !awaitingDeviceConnection && canUserCancelAction; +} diff --git a/src/app/features/ledger/utils/stacks-ledger-utils.ts b/src/app/features/ledger/utils/stacks-ledger-utils.ts index 7aaaf5c240e..bb4416fd7e8 100644 --- a/src/app/features/ledger/utils/stacks-ledger-utils.ts +++ b/src/app/features/ledger/utils/stacks-ledger-utils.ts @@ -1,5 +1,3 @@ -import { useLocation } from 'react-router-dom'; - import Transport from '@ledgerhq/hw-transport-webusb'; import { AddressVersion, @@ -11,7 +9,6 @@ import StacksApp, { LedgerError, ResponseSign, ResponseVersion } from '@zondax/l import { compare } from 'compare-versions'; import { getStxDerivationPath, stxDerivationWithAccount } from '@shared/crypto/stacks/stacks.utils'; -import { RouteUrls } from '@shared/route-urls'; import { LEDGER_APPS_MAP, @@ -85,16 +82,6 @@ export function signStacksTransactionWithSignature(transaction: string, signatur return deserializedTx; } -export function useActionCancellableByUser() { - const { pathname } = useLocation(); - return ( - pathname.includes(RouteUrls.ConnectLedger) || - pathname.includes(RouteUrls.ConnectLedgerSuccess) || - pathname.includes(RouteUrls.ConnectLedgerError) || - pathname.includes(RouteUrls.AwaitingDeviceUserAction) - ); -} - export function isStacksLedgerAppClosed(response: ResponseVersion) { const anotherUnknownErrorCodeMeaningAppClosed = 28161; return (