Skip to content

Commit 21a40e7

Browse files
fmsouzafmsouza
authored
feat: completing the add account flow [PERA-3404] (#292)
1 parent 89a2569 commit 21a40e7

14 files changed

Lines changed: 838 additions & 214 deletions

File tree

‎apps/mobile/src/i18n/locales/en.json‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -736,6 +736,19 @@
736736
"create_joint_account_option_description": "Create a shared multisig account with multiple participants",
737737
"see_other_options": "See other options"
738738
},
739+
"import_account_options": {
740+
"title": "Import an\naccount",
741+
"recover_wallet_title": "Recover a wallet",
742+
"recover_wallet_description": "I want to recover an Algorand wallet",
743+
"recover_qr_title": "Recover an account with QR code",
744+
"recover_qr_description": "I want to recover an Algorand account using a QR code",
745+
"pair_ledger_title": "Pair Ledger Device",
746+
"pair_ledger_description": "I want to recover an Algorand account that is backed by my Ledger hardware wallet",
747+
"pera_web_title": "Import from Pera Web",
748+
"pera_web_description": "I want to import Algorand accounts from Pera Web",
749+
"asb_title": "Algorand Secure Backup",
750+
"asb_description": "I want to restore my accounts using an Algorand Secure Backup file and 12-word key"
751+
},
739752
"select_hd_wallet": {
740753
"title": "Select Universal Wallet",
741754
"description": "Create your new account under a Universal Wallet you already have",

‎apps/mobile/src/modules/onboarding/routes/add-account.tsx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import {
1717
NativeStackHeaderProps,
1818
} from '@react-navigation/native-stack'
1919
import { AddAccountScreen } from '@modules/onboarding/screens/AddAccountScreen'
20+
import { ImportAccountOptionsScreen } from '@modules/onboarding/screens/ImportAccountOptionsScreen'
2021
import { WatchInfoScreen } from '@modules/onboarding/screens/WatchInfoScreen'
2122
import { WatchAccountScreen } from '@modules/onboarding/screens/WatchAccountScreen'
2223
import { NameAccountScreen } from '@modules/onboarding/screens/NameAccountScreen'
@@ -57,6 +58,9 @@ const withAccountErrorBoundary = <P extends object>(
5758

5859
const AddAccountScreenWithErrorBoundary =
5960
withAccountErrorBoundary(AddAccountScreen)
61+
const ImportAccountOptionsScreenWithErrorBoundary = withAccountErrorBoundary(
62+
ImportAccountOptionsScreen,
63+
)
6064
const WatchInfoScreenWithErrorBoundary =
6165
withAccountErrorBoundary(WatchInfoScreen)
6266
const WatchAccountScreenWithErrorBoundary =
@@ -112,6 +116,11 @@ export const AddAccountStackNavigator = () => {
112116
layout={fullScreenLayout}
113117
component={AddAccountScreenWithErrorBoundary}
114118
/>
119+
<AddAccountStack.Screen
120+
name='ImportAccountOptions'
121+
options={{ title: '' }}
122+
component={ImportAccountOptionsScreenWithErrorBoundary}
123+
/>
115124
<AddAccountStack.Screen
116125
name='SelectHDWallet'
117126
options={{

‎apps/mobile/src/modules/onboarding/routes/types.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ export type OnboardingStackParamList = {
6161

6262
export type AddAccountStackParamList = {
6363
AddAccountHome: undefined
64+
ImportAccountOptions: undefined
6465
SelectHDWallet: undefined
6566
WatchInfo: undefined
6667
WatchAccount: undefined

‎apps/mobile/src/modules/onboarding/screens/AddAccountScreen/AddAccountScreen.tsx‎

Lines changed: 0 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -23,8 +23,6 @@ import {
2323
PWView,
2424
} from '@components/core'
2525
import { PanelButton } from '@components/PanelButton'
26-
import { ImportOptionsBottomSheet } from '../../components/ImportOptionsBottomSheet'
27-
import { QRScannerView } from '@components/QRScannerView'
2826
import { useAddAccountScreen } from './useAddAccountScreen'
2927
import { useStyles } from './styles'
3028
import { useLanguage } from '@hooks/useLanguage'
@@ -38,20 +36,13 @@ export const AddAccountScreen = () => {
3836
const insets = useSafeAreaInsets()
3937
const {
4038
isCreatingAccount,
41-
isImportOptionsVisible,
4239
mainOptions,
4340
otherOptions,
4441
handleClose,
45-
handleCloseImportOptions,
46-
handleHDWalletPress,
47-
handleAlgo25Press,
4842
handleTermsPress,
4943
handlePrivacyPress,
5044
isOtherOptionsVisible,
5145
handleToggleOtherOptions,
52-
isQRScannerVisible,
53-
handleCloseQRScanner,
54-
handleQRScannerSuccess,
5546
} = useAddAccountScreen()
5647

5748
return (
@@ -149,20 +140,6 @@ export const AddAccountScreen = () => {
149140
</PWScrollView>
150141
</PWView>
151142

152-
<ImportOptionsBottomSheet
153-
isVisible={isImportOptionsVisible}
154-
onClose={handleCloseImportOptions}
155-
onHDWalletPress={handleHDWalletPress}
156-
onAlgo25Press={handleAlgo25Press}
157-
/>
158-
159-
<QRScannerView
160-
isVisible={isQRScannerVisible}
161-
onClose={handleCloseQRScanner}
162-
onSuccess={handleQRScannerSuccess}
163-
animationType='slide'
164-
/>
165-
166143
<PWLoadingOverlay
167144
isVisible={isCreatingAccount}
168145
title={t('onboarding.create_account.processing')}

‎apps/mobile/src/modules/onboarding/screens/AddAccountScreen/__tests__/AddAccountScreen.spec.tsx‎

Lines changed: 11 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -194,51 +194,28 @@ describe('AddAccountScreen', () => {
194194
expect(mockGoBack).toHaveBeenCalledTimes(1)
195195
})
196196

197-
it('opens ImportOptionsBottomSheet when Import Account is pressed', () => {
197+
it('navigates to ImportAccountOptions when Import Account is pressed', () => {
198198
render(<AddAccountScreen />)
199199

200200
const importButton = screen.getByText(
201201
'onboarding.add_account.import_account_option_title',
202202
)
203203
fireEvent.click(importButton)
204204

205-
expect(screen.getByText('onboarding.import_options.title')).toBeTruthy()
205+
expect(mockPush).toHaveBeenCalledWith('ImportAccountOptions')
206206
})
207207

208-
it('navigates to ImportInfo when HD Wallet import option is selected', () => {
208+
it('does not render Pair Ledger or Scan QR options on the main screen', () => {
209209
render(<AddAccountScreen />)
210210

211-
const importButton = screen.getByText(
212-
'onboarding.add_account.import_account_option_title',
213-
)
214-
fireEvent.click(importButton)
215-
216-
const hdWalletOption = screen.getByText(
217-
'onboarding.import_options.hd_wallet.title',
218-
)
219-
fireEvent.click(hdWalletOption)
220-
221-
expect(mockPush).toHaveBeenCalledWith('ImportInfo', {
222-
accountType: 'hdWallet',
223-
})
224-
})
225-
226-
it('navigates to ImportInfo when Algo25 import option is selected', () => {
227-
render(<AddAccountScreen />)
228-
229-
const importButton = screen.getByText(
230-
'onboarding.add_account.import_account_option_title',
231-
)
232-
fireEvent.click(importButton)
233-
234-
const algo25Option = screen.getByText(
235-
'onboarding.import_options.algo25.title',
236-
)
237-
fireEvent.click(algo25Option)
238-
239-
expect(mockPush).toHaveBeenCalledWith('ImportInfo', {
240-
accountType: 'algo25',
241-
})
211+
expect(
212+
screen.queryByText(
213+
'onboarding.add_account.pair_ledger_option_title',
214+
),
215+
).toBeNull()
216+
expect(
217+
screen.queryByText('onboarding.add_account.scan_qr_option_title'),
218+
).toBeNull()
242219
})
243220

244221
it('navigates to WatchInfo when Watch an Address is pressed', () => {

‎apps/mobile/src/modules/onboarding/screens/AddAccountScreen/__tests__/useAddAccountScreen.spec.ts‎

Lines changed: 26 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -156,6 +156,9 @@ describe('useAddAccountScreen', () => {
156156
'add_account_create_universal_wallet_button',
157157
)
158158
expect(result.current.mainOptions[1]?.testID).toBe(
159+
'add_account_create_joint_button',
160+
)
161+
expect(result.current.mainOptions[2]?.testID).toBe(
159162
'add_account_import_button',
160163
)
161164
})
@@ -247,64 +250,43 @@ describe('useAddAccountScreen', () => {
247250
expect(mockGoBack).toHaveBeenCalledTimes(1)
248251
})
249252

250-
it('handleImportAccount opens import options', () => {
253+
it('import account option navigates to ImportAccountOptions', () => {
251254
const { result } = renderHook(() => useAddAccountScreen())
252255

253-
expect(result.current.isImportOptionsVisible).toBe(false)
254-
255-
act(() => {
256-
result.current.handleImportAccount()
257-
})
258-
259-
expect(result.current.isImportOptionsVisible).toBe(true)
260-
})
261-
262-
it('handleCloseImportOptions closes import options', () => {
263-
const { result } = renderHook(() => useAddAccountScreen())
256+
const importOption = result.current.mainOptions.find(
257+
o => o.testID === 'add_account_import_button',
258+
)!
264259

265260
act(() => {
266-
result.current.handleImportAccount()
261+
importOption.onPress()
267262
})
268-
expect(result.current.isImportOptionsVisible).toBe(true)
269263

270-
act(() => {
271-
result.current.handleCloseImportOptions()
272-
})
273-
expect(result.current.isImportOptionsVisible).toBe(false)
264+
expect(mockPush).toHaveBeenCalledWith('ImportAccountOptions')
274265
})
275266

276-
it('handleHDWalletPress closes import options and navigates to ImportInfo with hdWallet', () => {
267+
it('mainOptions does not include pair ledger or scan qr options', () => {
277268
const { result } = renderHook(() => useAddAccountScreen())
278269

279-
act(() => {
280-
result.current.handleImportAccount()
281-
})
282-
283-
act(() => {
284-
result.current.handleHDWalletPress()
285-
})
286-
287-
expect(result.current.isImportOptionsVisible).toBe(false)
288-
expect(mockPush).toHaveBeenCalledWith('ImportInfo', {
289-
accountType: 'hdWallet',
290-
})
270+
expect(
271+
result.current.mainOptions.find(
272+
o => o.testID === 'add_account_pair_ledger_button',
273+
),
274+
).toBeUndefined()
275+
expect(
276+
result.current.mainOptions.find(
277+
o => o.testID === 'add_account_scan_qr_button',
278+
),
279+
).toBeUndefined()
291280
})
292281

293-
it('handleAlgo25Press closes import options and navigates to ImportInfo with algo25', () => {
282+
it('mainOptions includes joint account option', () => {
294283
const { result } = renderHook(() => useAddAccountScreen())
295284

296-
act(() => {
297-
result.current.handleImportAccount()
298-
})
299-
300-
act(() => {
301-
result.current.handleAlgo25Press()
302-
})
303-
304-
expect(result.current.isImportOptionsVisible).toBe(false)
305-
expect(mockPush).toHaveBeenCalledWith('ImportInfo', {
306-
accountType: 'algo25',
307-
})
285+
expect(
286+
result.current.mainOptions.find(
287+
o => o.testID === 'add_account_create_joint_button',
288+
),
289+
).toBeDefined()
308290
})
309291

310292
it('watch address option navigates to WatchInfo', () => {

0 commit comments

Comments
 (0)