Skip to content

Commit d622987

Browse files
committed
addressed pr comments
1 parent 6ef7f0c commit d622987

File tree

15 files changed

+558
-402
lines changed

15 files changed

+558
-402
lines changed

packages/core-mobile/app/new/features/ledger/components/AnimatedIconWithText.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,11 @@ interface AnimatedIconWithTextProps {
1515
subtitle: string
1616
/** Whether to show the animation behind the icon */
1717
showAnimation?: boolean
18-
/** Custom animation source (defaults to connect-waves.json) */
19-
animationSource?: any
18+
/** Custom animation source (defaults to connect-waves.json) - Lottie animation JSON
19+
* In React Native, require() for a Lottie JSON returns either a number (asset reference) or an object (parsed JSON).
20+
* This union type matches what LottieView expects and removes the any lint error.
21+
*/
22+
animationSource?: number | object
2023
/** Custom animation size (defaults to 220x220) */
2124
animationSize?: { width: number; height: number }
2225
/** Custom icon positioning offset for animation centering */
@@ -63,7 +66,6 @@ export const AnimatedIconWithText: React.FC<AnimatedIconWithTextProps> = ({
6366
<View
6467
style={{
6568
marginTop: baseTopPosition,
66-
marginBottom: 0,
6769
alignItems: 'center',
6870
justifyContent: 'center'
6971
}}>

packages/core-mobile/app/new/features/ledger/components/DerivationPathSelector.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -138,9 +138,7 @@ const OptionCard: React.FC<OptionCardProps> = ({ option, onPress }) => {
138138
</Text>
139139
</View>
140140
</View>
141-
{onPress && (
142-
<Icons.Navigation.ChevronRight color={colors.$textSecondary} />
143-
)}
141+
<Icons.Navigation.ChevronRight color={colors.$textSecondary} />
144142
</View>
145143

146144
{/* Divider that spans from text start to card end */}
@@ -236,7 +234,7 @@ export const DerivationPathSelector: React.FC<DerivationPathSelectorProps> = ({
236234
}) => {
237235
return (
238236
<ScrollScreen
239-
title="First, choose your setup Method"
237+
title="First, choose your setup method"
240238
subtitle="Select how you would like to set up your Ledger wallet. Both options are secure"
241239
isModal
242240
contentContainerStyle={{

packages/core-mobile/app/new/features/ledger/components/LedgerAppConnection.tsx

Lines changed: 63 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ interface LedgerAppConnectionProps {
2222
getAvalancheKeys: () => Promise<void>
2323
deviceName: string
2424
selectedDerivationPath: LedgerDerivationPathType | null
25+
isCreatingWallet?: boolean
2526
}
2627

2728
export const LedgerAppConnection: React.FC<LedgerAppConnectionProps> = ({
@@ -30,7 +31,8 @@ export const LedgerAppConnection: React.FC<LedgerAppConnectionProps> = ({
3031
getSolanaKeys,
3132
getAvalancheKeys,
3233
deviceName,
33-
selectedDerivationPath
34+
selectedDerivationPath,
35+
isCreatingWallet = false
3436
}) => {
3537
const {
3638
theme: { colors }
@@ -57,9 +59,12 @@ export const LedgerAppConnection: React.FC<LedgerAppConnectionProps> = ({
5759
}, 2000)
5860
break
5961
case AppConnectionStep.COMPLETE:
60-
timeoutId = setTimeout(() => {
61-
onComplete()
62-
}, 1500)
62+
// Don't auto-navigate if wallet is being created
63+
if (!isCreatingWallet) {
64+
timeoutId = setTimeout(() => {
65+
onComplete()
66+
}, 1500)
67+
}
6368
break
6469
}
6570

@@ -68,7 +73,7 @@ export const LedgerAppConnection: React.FC<LedgerAppConnectionProps> = ({
6873
clearTimeout(timeoutId)
6974
}
7075
}
71-
}, [currentStep, onComplete])
76+
}, [currentStep, onComplete, isCreatingWallet])
7277

7378
const handleConnectAvalanche = useCallback(async () => {
7479
try {
@@ -327,37 +332,59 @@ export const LedgerAppConnection: React.FC<LedgerAppConnectionProps> = ({
327332
case AppConnectionStep.COMPLETE:
328333
return (
329334
<View style={{ alignItems: 'center', paddingVertical: 48 }}>
330-
<View
331-
style={{
332-
width: 64,
333-
height: 64,
334-
borderRadius: 32,
335-
backgroundColor: colors.$textSuccess,
336-
alignItems: 'center',
337-
justifyContent: 'center',
338-
marginBottom: 24
339-
}}>
340-
<Icons.Action.CheckCircle
341-
color={colors.$white}
342-
width={32}
343-
height={32}
344-
/>
345-
</View>
346-
<Text
347-
variant="heading4"
348-
style={{ textAlign: 'center', marginBottom: 16 }}>
349-
Apps Connected!
350-
</Text>
351-
<Text
352-
variant="body1"
353-
style={{
354-
textAlign: 'center',
355-
color: colors.$textSecondary,
356-
maxWidth: 320
357-
}}>
358-
Both Avalanche and Solana apps are connected. Proceeding to wallet
359-
setup...
360-
</Text>
335+
{isCreatingWallet ? (
336+
<>
337+
<LoadingState sx={{ marginBottom: 24 }} />
338+
<Text
339+
variant="heading4"
340+
style={{ textAlign: 'center', marginBottom: 16 }}>
341+
Creating Wallet...
342+
</Text>
343+
<Text
344+
variant="body1"
345+
style={{
346+
textAlign: 'center',
347+
color: colors.$textSecondary,
348+
maxWidth: 320
349+
}}>
350+
Setting up your Ledger wallet. This may take a moment...
351+
</Text>
352+
</>
353+
) : (
354+
<>
355+
<View
356+
style={{
357+
width: 64,
358+
height: 64,
359+
borderRadius: 32,
360+
backgroundColor: colors.$textSuccess,
361+
alignItems: 'center',
362+
justifyContent: 'center',
363+
marginBottom: 24
364+
}}>
365+
<Icons.Action.CheckCircle
366+
color={colors.$white}
367+
width={32}
368+
height={32}
369+
/>
370+
</View>
371+
<Text
372+
variant="heading4"
373+
style={{ textAlign: 'center', marginBottom: 16 }}>
374+
Apps Connected!
375+
</Text>
376+
<Text
377+
variant="body1"
378+
style={{
379+
textAlign: 'center',
380+
color: colors.$textSecondary,
381+
maxWidth: 320
382+
}}>
383+
Both Avalanche and Solana apps are connected. Proceeding to wallet
384+
setup...
385+
</Text>
386+
</>
387+
)}
361388
</View>
362389
)
363390

packages/core-mobile/app/new/features/ledger/contexts/LedgerSetupContext.tsx

Lines changed: 82 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -8,38 +8,43 @@ import React, {
88
} from 'react'
99
import {
1010
LedgerDerivationPathType,
11-
WalletCreationOptions
11+
WalletCreationOptions,
12+
LedgerDevice,
13+
SetupProgress,
14+
LedgerTransportState
1215
} from 'services/ledger/types'
13-
import { useLedgerWallet } from '../hooks/useLedgerWallet'
16+
import {
17+
useLedgerWallet,
18+
UseLedgerWalletReturn
19+
} from '../hooks/useLedgerWallet'
1420

15-
interface LedgerSetupState {
21+
interface LedgerSetupContextValue {
22+
// State values
1623
selectedDerivationPath: LedgerDerivationPathType | null
1724
connectedDeviceId: string | null
1825
connectedDeviceName: string
1926
isCreatingWallet: boolean
2027
hasStartedSetup: boolean
21-
}
2228

23-
interface LedgerSetupContextValue extends LedgerSetupState {
2429
// State setters
2530
setSelectedDerivationPath: (path: LedgerDerivationPathType) => void
2631
setConnectedDevice: (deviceId: string, deviceName: string) => void
2732
setIsCreatingWallet: (creating: boolean) => void
2833
setHasStartedSetup: (started: boolean) => void
2934

3035
// Ledger wallet hook values
31-
devices: any[]
36+
devices: LedgerDevice[]
3237
isScanning: boolean
3338
isConnecting: boolean
34-
transportState: unknown
39+
transportState: LedgerTransportState
3540
scanForDevices: () => void
3641
connectToDevice: (deviceId: string) => Promise<void>
3742
disconnectDevice: () => Promise<void>
3843
getSolanaKeys: () => Promise<void>
3944
getAvalancheKeys: () => Promise<void>
4045
createLedgerWallet: (options: WalletCreationOptions) => Promise<string>
41-
setupProgress: any
42-
keys: any
46+
setupProgress: SetupProgress | null
47+
keys: UseLedgerWalletReturn['keys']
4348

4449
// Helper methods
4550
resetSetup: () => void
@@ -54,70 +59,92 @@ interface LedgerSetupProviderProps {
5459
export const LedgerSetupProvider: React.FC<LedgerSetupProviderProps> = ({
5560
children
5661
}) => {
57-
const [state, setState] = useState<LedgerSetupState>({
58-
selectedDerivationPath: null,
59-
connectedDeviceId: null,
60-
connectedDeviceName: 'Ledger Device',
61-
isCreatingWallet: false,
62-
hasStartedSetup: false
63-
})
64-
65-
// Use the existing ledger wallet hook
66-
const ledgerWallet = useLedgerWallet()
67-
68-
const setSelectedDerivationPath = useCallback(
69-
(path: LedgerDerivationPathType) => {
70-
setState(prev => ({ ...prev, selectedDerivationPath: path }))
71-
},
72-
[]
62+
const [selectedDerivationPath, setSelectedDerivationPath] =
63+
useState<LedgerDerivationPathType | null>(null)
64+
const [connectedDeviceId, setConnectedDeviceId] = useState<string | null>(
65+
null
7366
)
67+
const [connectedDeviceName, setConnectedDeviceName] =
68+
useState<string>('Ledger Device')
69+
const [isCreatingWallet, setIsCreatingWallet] = useState<boolean>(false)
70+
const [hasStartedSetup, setHasStartedSetup] = useState<boolean>(false)
7471

75-
const setConnectedDevice = useCallback(
72+
// Use the existing ledger wallet hook
73+
const {
74+
devices,
75+
isScanning,
76+
isConnecting,
77+
transportState,
78+
scanForDevices,
79+
connectToDevice,
80+
disconnectDevice,
81+
getSolanaKeys,
82+
getAvalancheKeys,
83+
createLedgerWallet,
84+
setupProgress,
85+
keys
86+
} = useLedgerWallet()
87+
88+
const handleSetConnectedDevice = useCallback(
7689
(deviceId: string, deviceName: string) => {
77-
setState(prev => ({
78-
...prev,
79-
connectedDeviceId: deviceId,
80-
connectedDeviceName: deviceName
81-
}))
90+
setConnectedDeviceId(deviceId)
91+
setConnectedDeviceName(deviceName)
8292
},
8393
[]
8494
)
8595

86-
const setIsCreatingWallet = useCallback((creating: boolean) => {
87-
setState(prev => ({ ...prev, isCreatingWallet: creating }))
88-
}, [])
89-
90-
const setHasStartedSetup = useCallback((started: boolean) => {
91-
setState(prev => ({ ...prev, hasStartedSetup: started }))
92-
}, [])
93-
9496
const resetSetup = useCallback(() => {
95-
setState({
96-
selectedDerivationPath: null,
97-
connectedDeviceId: null,
98-
connectedDeviceName: 'Ledger Device',
99-
isCreatingWallet: false,
100-
hasStartedSetup: false
101-
})
97+
setSelectedDerivationPath(null)
98+
setConnectedDeviceId(null)
99+
setConnectedDeviceName('Ledger Device')
100+
setIsCreatingWallet(false)
101+
setHasStartedSetup(false)
102102
}, [])
103103

104104
const contextValue: LedgerSetupContextValue = useMemo(
105105
() => ({
106-
...state,
107-
...ledgerWallet,
106+
selectedDerivationPath,
107+
connectedDeviceId,
108+
connectedDeviceName,
109+
isCreatingWallet,
110+
hasStartedSetup,
111+
devices,
112+
isScanning,
113+
isConnecting,
114+
transportState,
115+
scanForDevices,
116+
connectToDevice,
117+
disconnectDevice,
118+
getSolanaKeys,
119+
getAvalancheKeys,
120+
createLedgerWallet,
121+
setupProgress,
122+
keys,
108123
setSelectedDerivationPath,
109-
setConnectedDevice,
124+
setConnectedDevice: handleSetConnectedDevice,
110125
setIsCreatingWallet,
111126
setHasStartedSetup,
112127
resetSetup
113128
}),
114129
[
115-
state,
116-
ledgerWallet,
117-
setSelectedDerivationPath,
118-
setConnectedDevice,
119-
setIsCreatingWallet,
120-
setHasStartedSetup,
130+
selectedDerivationPath,
131+
connectedDeviceId,
132+
connectedDeviceName,
133+
isCreatingWallet,
134+
hasStartedSetup,
135+
devices,
136+
isScanning,
137+
isConnecting,
138+
transportState,
139+
scanForDevices,
140+
connectToDevice,
141+
disconnectDevice,
142+
getSolanaKeys,
143+
getAvalancheKeys,
144+
createLedgerWallet,
145+
setupProgress,
146+
keys,
147+
handleSetConnectedDevice,
121148
resetSetup
122149
]
123150
)

packages/core-mobile/app/new/features/ledger/hooks/useLedgerWallet.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -484,8 +484,11 @@ export function useLedgerWallet(): UseLedgerWalletReturn {
484484
`Creating ${derivationPathType} Ledger wallet with generated keys...`
485485
)
486486

487-
if (!avalancheKeys || solanaKeys.length === 0 || !bitcoinAddress) {
488-
throw new Error('Missing required keys for wallet creation')
487+
if (!avalancheKeys) {
488+
throw new Error('Missing Avalanche keys for wallet creation')
489+
}
490+
if (solanaKeys.length === 0) {
491+
throw new Error('Missing Solana keys for wallet creation')
489492
}
490493

491494
updateProgress('Generating wallet ID...')

0 commit comments

Comments
 (0)