From e30b444f8be5453f640b6dceca0ab44d515dc519 Mon Sep 17 00:00:00 2001 From: Christopher Howard Date: Tue, 3 Dec 2024 13:23:50 -0500 Subject: [PATCH] fix: present hw pairing sheet during swap (#6275) --- .../Swap/components/SwapBottomPanel.tsx | 38 +++++++++++++++++-- .../screens/Swap/providers/swap-provider.tsx | 12 ++++-- 2 files changed, 43 insertions(+), 7 deletions(-) diff --git a/src/__swaps__/screens/Swap/components/SwapBottomPanel.tsx b/src/__swaps__/screens/Swap/components/SwapBottomPanel.tsx index 5f85f146be7..453f9874097 100644 --- a/src/__swaps__/screens/Swap/components/SwapBottomPanel.tsx +++ b/src/__swaps__/screens/Swap/components/SwapBottomPanel.tsx @@ -2,10 +2,18 @@ import { LIGHT_SEPARATOR_COLOR, SEPARATOR_COLOR, THICK_BORDER_WIDTH } from '@/__ import { NavigationSteps, useSwapContext } from '@/__swaps__/screens/Swap/providers/swap-provider'; import { opacity } from '@/__swaps__/utils/swaps'; import { Box, Separator, globalColors, useColorMode } from '@/design-system'; -import React from 'react'; +import React, { useCallback } from 'react'; import { StyleSheet } from 'react-native'; import { PanGestureHandler } from 'react-native-gesture-handler'; -import Animated, { Easing, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring, withTiming } from 'react-native-reanimated'; +import Animated, { + Easing, + runOnJS, + useAnimatedStyle, + useDerivedValue, + useSharedValue, + withSpring, + withTiming, +} from 'react-native-reanimated'; import { triggerHaptics } from 'react-native-turbo-haptics'; import { useBottomPanelGestureHandler } from '../hooks/useBottomPanelGestureHandler'; import { GasButton } from './GasButton'; @@ -14,6 +22,10 @@ import { ReviewPanel } from './ReviewPanel'; import { SwapActionButton } from './SwapActionButton'; import { SettingsPanel } from './SettingsPanel'; import { SPRING_CONFIGS } from '@/components/animations/animationConfigs'; +import { useWallets } from '@/hooks'; +import { useNavigation } from '@/navigation'; +import Routes from '@/navigation/routesNames'; +import { logger, RainbowError } from '@/logger'; const HOLD_TO_SWAP_DURATION_MS = 400; @@ -56,6 +68,24 @@ export function SwapBottomPanel() { const opacity = useDerivedValue(() => confirmButtonProps.value.opacity); const type = useDerivedValue(() => confirmButtonProps.value.type); + const { isHardwareWallet } = useWallets(); + const { navigate } = useNavigation(); + const handleHwConnectionAndSwap = useCallback(() => { + try { + if (isHardwareWallet && configProgress.value === NavigationSteps.SHOW_REVIEW) { + navigate(Routes.HARDWARE_WALLET_TX_NAVIGATOR, { + submit: SwapNavigation.handleSwapAction, + }); + } else { + SwapNavigation.handleSwapAction(); + } + } catch (e) { + logger.error(new RainbowError('[SwapBottomPanel.tsx]: handleHwConnectionAndSwap Error: '), { + message: (e as Error).message, + }); + } + }, [configProgress.value, navigate, isHardwareWallet, SwapNavigation]); + return ( { 'worklet'; if (type.value !== 'hold') { - SwapNavigation.handleSwapAction(); + runOnJS(handleHwConnectionAndSwap)(); } }} onLongPressEndWorklet={success => { @@ -116,7 +146,7 @@ export function SwapBottomPanel() { 'worklet'; if (type.value === 'hold') { triggerHaptics('notificationSuccess'); - SwapNavigation.handleSwapAction(); + runOnJS(handleHwConnectionAndSwap)(); } }} onPressStartWorklet={() => { diff --git a/src/__swaps__/screens/Swap/providers/swap-provider.tsx b/src/__swaps__/screens/Swap/providers/swap-provider.tsx index 9d82264a1d5..3f3bbcf6d55 100644 --- a/src/__swaps__/screens/Swap/providers/swap-provider.tsx +++ b/src/__swaps__/screens/Swap/providers/swap-provider.tsx @@ -238,6 +238,7 @@ export const SwapProvider = ({ children }: SwapProviderProps) => { }, }, }); + const isHardwareWallet = wallet instanceof LedgerSigner; if (!wallet) { isSwapping.value = false; @@ -306,7 +307,7 @@ export const SwapProvider = ({ children }: SwapProviderProps) => { degenMode: isDegenModeEnabled, isSwappingToPopularAsset, errorMessage, - isHardwareWallet: wallet instanceof LedgerSigner, + isHardwareWallet, }); if (errorMessage !== 'handled') { @@ -338,7 +339,12 @@ export const SwapProvider = ({ children }: SwapProviderProps) => { performanceTracking.getState().executeFn({ fn: () => { const { routes, index } = Navigation.getState(); - if (index === 0 || routes[index - 1].name === Routes.EXPANDED_ASSET_SHEET) { + const activeRoute = Navigation.getActiveRoute(); + if ( + index === 0 || + routes[index - 1].name === Routes.EXPANDED_ASSET_SHEET || + activeRoute.name === Routes.PAIR_HARDWARE_WALLET_AGAIN_SHEET + ) { Navigation.handleAction(Routes.WALLET_SCREEN, {}); } else { Navigation.goBack(); @@ -372,7 +378,7 @@ export const SwapProvider = ({ children }: SwapProviderProps) => { tradeAmountUSD: parameters.quote.tradeAmountUSD, degenMode: isDegenModeEnabled, isSwappingToPopularAsset, - isHardwareWallet: wallet instanceof LedgerSigner, + isHardwareWallet, }); } catch (error) { isSwapping.value = false;