status-im
/
nimbus-gui
mirror of https://github.com/status-im/nimbus-gui.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: change recovery mechanism structure

This commit is contained in:
RadoslavDimchev 2023-10-31 10:03:53 +02:00
parent 09489520f3
commit e1dd7b9066
1 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/pages/ValidatorOnboarding/KeyGeneration/RecoveryMechanism/RecoveryMechanism.tsx
View File

@ -8,7 +8,11 @@ type RecoveryMechanismProps = {
recoveryMechanism: string
}
const cards = [RECOVERY_PHRASE, KEYSTORE_FILES, BOTH_KEY_AND_RECOVERY]
const cards = {
[RECOVERY_PHRASE]: 'recovery-phrase-icon.svg',
[KEYSTORE_FILES]: 'keystore-files-icon.svg',
[BOTH_KEY_AND_RECOVERY]: 'both-recovery-keystore-icon.svg',
}
const RecoveryMechanism = ({ recoveryMechanism }: RecoveryMechanismProps) => {
return (
@ -17,8 +21,13 @@ const RecoveryMechanism = ({ recoveryMechanism }: RecoveryMechanismProps) => {
Select Recovery Mechanism
</Text>
<XStack space={'$4'} style={{ justifyContent: 'space-between', marginTop: '40px' }}>
{cards.map(value => (
<RecoveryMechanismCard key={value} value={value} recoveryMechanism={recoveryMechanism} />
{Object.entries(cards).map(([value, icon]) => (
<RecoveryMechanismCard
key={value}
value={value}
recoveryMechanism={recoveryMechanism}
icon={icon}
/>
))}
</XStack>
</YStack>