feat: add different states for recovery mechanisms

src/pages/ValidatorOnboarding/KeyGeneration/KeyGeneration.tsx

@@ -23,18 +23,26 @@ const KeyGeneration = () => {
       <Text size={27} weight={'semibold'}>
         4 Validators
       </Text>
+      {selectedRecoveryMechanism === 'Key Files' && (
+        <>
           <PasswordFields />
           <InformationBox
             message="You should see that you have one keystore per validator. This keystore contains your signing key, encrypted with your password. Warning: Do not store keys on multiple (backup) validator clients at once"
             variant="error"
             icon={<CloseCircleIcon size={20} />}
           />
+        </>
+      )}
+      {selectedRecoveryMechanism === 'Recovery Phrase' && (
+        <>
           <Button>Reveal Recovery Phrase</Button>
           <InformationBox
             message="Write down and keep your Secret Recovery Phrase in a secure place. Make sure no one is looking at your screen."
             variant="error"
             icon={<CloseCircleIcon size={20} />}
           />
+        </>
+      )}
     </YStack>
   )
 }