refactor: address pr comments

Signed-off-by: Bryce McMath <[email protected]>

app/container-imp.ts

@@ -213,6 +213,7 @@ export class AppContainer implements Container {
         },
       ],
       enableTours: true,
+      enableChat: true,
       supportedLanguages: ['en'],
       showPreface: true,
       disableOnboardingSkip: true,

app/src/localization/en/index.ts

@@ -66,20 +66,20 @@ const translation = {
     "Settings": "Menu",
     "Preface": "BC Wallet",
     "VerificationSteps": "Setup steps",
-    "VerificationStep1": {
+    "EvidenceCollectionStep": {
       "Stage1": "Choose your identification",
       "Stage2": "Instructions",
       "Stage3": "Scan your identification",
       "Stage4": "Enter serial number",
       "Stage5": "Enter birthdate",
     },
-    "VerificationStep2": {
+    "ResidentialAddressStep": {
       "Stage1": "TODO",
     },
-    "VerificationStep3": {
+    "EmailStep": {
       "Stage1": "TODO",
     },
-    "VerificationStep4": {
+    "VerifyIdentityStep": {
       "Stage1": "TODO",
     },
   },

app/src/localization/fr/index.ts

@@ -66,20 +66,20 @@ const translation = {
     "Settings": "Menu",
     "Preface": "BC Wallet",
     "VerificationSteps": "Setup steps (FR)",
-    "VerificationStep1": {
+    "EvidenceCollectionStep": {
       "Stage1": "Choose your identification (FR)",
       "Stage2": "Instructions (FR)",
       "Stage3": "Scan your identification (FR)",
       "Stage4": "Enter serial number (FR)",
       "Stage5": "Enter birthdate (FR)",
     },
-    "VerificationStep2": {
+    "ResidentialAddressStep": {
       "Stage1": "TODO",
     },
-    "VerificationStep3": {
+    "EmailStep": {
       "Stage1": "TODO",
     },
-    "VerificationStep4": {
+    "VerifyIdentityStep": {
       "Stage1": "TODO",
     },
   },

app/src/localization/pt-br/index.ts

@@ -66,20 +66,20 @@ const translation = {
     "Settings": "Menu (PT-BR)",
     "Preface": "BC Wallet",
     "VerificationSteps": "Setup steps (PT-BR)",
-    "VerificationStep1": {
+    "EvidenceCollectionStep": {
       "Stage1": "Choose your identification (PT-BR)",
       "Stage2": "Instructions (PT-BR)",
       "Stage3": "Scan your identification (PT-BR)",
       "Stage4": "Enter serial number (PT-BR)",
       "Stage5": "Enter birthdate (PT-BR)",
     },
-    "VerificationStep2": {
+    "ResidentialAddressStep": {
       "Stage1": "TODO",
     },
-    "VerificationStep3": {
+    "EmailStep": {
       "Stage1": "TODO",
     },
-    "VerificationStep4": {
+    "VerifyIdentityStep": {
       "Stage1": "TODO",
     },
   },

app/src/modules/unified/__tests__/components/CardButton.test.tsx → app/src/modules/unified/__tests__/components/TileButton.test.tsx

@@ -1,15 +1,15 @@
+import { testIdWithKey } from '@hyperledger/aries-bifold-core'
 import { fireEvent, render } from '@testing-library/react-native'
 import React from 'react'
 
-import CardButton from '../../components/CardButton'
-import { testIdWithKey } from '@hyperledger/aries-bifold-core'
+import TileButton from '../../components/TileButton'
 
-describe('CardButton Component', () => {
+describe('TileButton Component', () => {
   const onPress = jest.fn()
   const actionText = 'Action text'
   const description =
     'Lorem ipsum dolor sit amet consectetur adipisicing elit. Quasi et consectetur iusto error aliquam'
-  const testIDKey = 'CardButton'
+  const testIDKey = 'TileButton'
   const accessibilityLabel = 'Card'
 
   beforeEach(() => {
@@ -18,7 +18,7 @@ describe('CardButton Component', () => {
 
   test('renders correctly', () => {
     const tree = render(
-      <CardButton
+      <TileButton
         onPress={onPress}
         actionText={actionText}
         description={description}
@@ -31,7 +31,7 @@ describe('CardButton Component', () => {
 
   test('test ID is present and press handler works', () => {
     const { getByTestId } = render(
-      <CardButton
+      <TileButton
         onPress={onPress}
         actionText={actionText}
         description={description}
@@ -40,9 +40,9 @@ describe('CardButton Component', () => {
       />
     )
 
-    const cardButton = getByTestId(testIdWithKey(testIDKey))
-    expect(cardButton).toBeDefined()
-    fireEvent(cardButton, 'press')
+    const tileButton = getByTestId(testIdWithKey(testIDKey))
+    expect(tileButton).toBeDefined()
+    fireEvent(tileButton, 'press')
     expect(onPress).toHaveBeenCalledTimes(1)
   })
 })

app/src/modules/unified/__tests__/components/__snapshots__/CardButton.test.tsx.snap → app/src/modules/unified/__tests__/components/__snapshots__/TileButton.test.tsx.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`CardButton Component renders correctly 1`] = `
+exports[`TileButton Component renders correctly 1`] = `
 <View
   accessibilityLabel="Card"
   accessibilityState={
@@ -32,7 +32,7 @@ exports[`CardButton Component renders correctly 1`] = `
   onResponderTerminate={[Function]}
   onResponderTerminationRequest={[Function]}
   onStartShouldSetResponder={[Function]}
-  testID="com.ariesbifold:id/CardButton"
+  testID="com.ariesbifold:id/TileButton"
 >
   <View
     style={

app/src/modules/unified/__tests__/contents/VerificationStep1/Birthdate.test.tsx → app/src/modules/unified/__tests__/contents/EvidenceCollectionStep/Birthdate.test.tsx

@@ -3,7 +3,7 @@ import { fireEvent, render } from '@testing-library/react-native'
 import React from 'react'
 
 import { initialState, reducer } from '../../../../../store'
-import BirthdateContent from '../../../contents/VerificationStep1/Birthdate'
+import BirthdateContent from '../../../contents/EvidenceCollectionStep/Birthdate'
 
 describe('BirthdateContent Component', () => {
   const onComplete = jest.fn()

app/src/modules/unified/__tests__/contents/VerificationStep1/Choose.test.tsx → app/src/modules/unified/__tests__/contents/EvidenceCollectionStep/Choose.test.tsx

@@ -3,7 +3,7 @@ import { fireEvent, render } from '@testing-library/react-native'
 import React from 'react'
 
 import { initialState, reducer } from '../../../../../store'
-import ChooseContent from '../../../contents/VerificationStep1/Choose'
+import ChooseContent from '../../../contents/EvidenceCollectionStep/Choose'
 
 describe('ChooseContent Component', () => {
   const goToInstructions = jest.fn()
@@ -28,9 +28,9 @@ describe('ChooseContent Component', () => {
       </StoreProvider>
     )
 
-    const continueButton = getByTestId(testIdWithKey('CombinedCard'))
-    expect(continueButton).toBeDefined()
-    fireEvent(continueButton, 'press')
+    const combinedCardTileButton = getByTestId(testIdWithKey('CombinedCard'))
+    expect(combinedCardTileButton).toBeDefined()
+    fireEvent(combinedCardTileButton, 'press')
     expect(goToInstructions).toHaveBeenCalledTimes(1)
   })
 })

app/src/modules/unified/__tests__/contents/VerificationStep1/Instructions.test.tsx → app/src/modules/unified/__tests__/contents/EvidenceCollectionStep/Instructions.test.tsx

@@ -1,7 +1,7 @@
 import { fireEvent, render } from '@testing-library/react-native'
 import React from 'react'
 
-import InstructionsContent from '../../../contents/VerificationStep1/Instructions'
+import InstructionsContent from '../../../contents/EvidenceCollectionStep/Instructions'
 import { testIdWithKey } from '@hyperledger/aries-bifold-core'
 
 describe('InstructionsContent Component', () => {

app/src/modules/unified/__tests__/contents/VerificationStep1/ManualSerial.test.tsx → app/src/modules/unified/__tests__/contents/EvidenceCollectionStep/ManualSerial.test.tsx

@@ -3,7 +3,7 @@ import { fireEvent, render } from '@testing-library/react-native'
 import React from 'react'
 
 import { initialState, reducer } from '../../../../../store'
-import ManualSerialContent from '../../../contents/VerificationStep1/ManualSerial'
+import ManualSerialContent from '../../../contents/EvidenceCollectionStep/ManualSerial'
 
 describe('ManualSerialContent Component', () => {
   const goToBirthdate = jest.fn()

app/src/modules/unified/__tests__/contents/VerificationStep1/Scan.test.tsx → app/src/modules/unified/__tests__/contents/EvidenceCollectionStep/Scan.test.tsx

@@ -1,7 +1,7 @@
 import { render } from '@testing-library/react-native'
 import React from 'react'
 
-import ScanContent from '../../../contents/VerificationStep1/Scan'
+import ScanContent from '../../../contents/EvidenceCollectionStep/Scan'
 
 describe('ScanContent Component', () => {
   const goToBirthdate = jest.fn()

app/src/modules/unified/__tests__/contents/VerificationSteps/Steps.test.tsx

@@ -5,10 +5,10 @@ import VerificationStepsContent from '../../../contents/VerificationSteps/Steps'
 import { testIdWithKey } from '@hyperledger/aries-bifold-core'
 
 describe('VerificationStepsContent Component', () => {
-  const goToStep1 = jest.fn()
-  const goToStep2 = jest.fn()
-  const goToStep3 = jest.fn()
-  const goToStep4 = jest.fn()
+  const goToEvidenceCollectionStep = jest.fn()
+  const goToResidentialAddressStep = jest.fn()
+  const goToEmailStep = jest.fn()
+  const goToVerifyIdentityStep = jest.fn()
 
   beforeEach(() => {
     jest.resetAllMocks()
@@ -17,10 +17,10 @@ describe('VerificationStepsContent Component', () => {
   test('renders correctly', () => {
     const tree = render(
       <VerificationStepsContent
-        goToStep1={goToStep1}
-        goToStep2={goToStep2}
-        goToStep3={goToStep3}
-        goToStep4={goToStep4}
+        goToEvidenceCollectionStep={goToEvidenceCollectionStep}
+        goToResidentialAddressStep={goToResidentialAddressStep}
+        goToEmailStep={goToEmailStep}
+        goToVerifyIdentityStep={goToVerifyIdentityStep}
       />
     )
     expect(tree).toMatchSnapshot()
@@ -29,16 +29,16 @@ describe('VerificationStepsContent Component', () => {
   test('Step1 test ID is present and press handler works', () => {
     const { getByTestId } = render(
       <VerificationStepsContent
-        goToStep1={goToStep1}
-        goToStep2={goToStep2}
-        goToStep3={goToStep3}
-        goToStep4={goToStep4}
+        goToEvidenceCollectionStep={goToEvidenceCollectionStep}
+        goToResidentialAddressStep={goToResidentialAddressStep}
+        goToEmailStep={goToEmailStep}
+        goToVerifyIdentityStep={goToVerifyIdentityStep}
       />
     )
 
     const step1Button = getByTestId(testIdWithKey('Step1'))
     expect(step1Button).toBeDefined()
     fireEvent(step1Button, 'press')
-    expect(goToStep1).toHaveBeenCalledTimes(1)
+    expect(goToEvidenceCollectionStep).toHaveBeenCalledTimes(1)
   })
 })

app/src/modules/unified/components/CardButton.tsx → app/src/modules/unified/components/TileButton.tsx

@@ -2,7 +2,7 @@ import { testIdWithKey, useTheme } from '@hyperledger/aries-bifold-core'
 import { Text, View, Image, StyleSheet, Pressable, ImageSourcePropType, ViewStyle } from 'react-native'
 import Icon from 'react-native-vector-icons/MaterialCommunityIcons'
 
-export type CardButtonProps = {
+export type TileButtonProps = {
   onPress: () => void
   testIDKey: string
   accessibilityLabel: string
@@ -12,18 +12,18 @@ export type CardButtonProps = {
   style?: ViewStyle
 }
 
-const CardButton: React.FC<CardButtonProps> = ({
+const TileButton: React.FC<TileButtonProps> = ({
   onPress,
   testIDKey,
   accessibilityLabel,
   actionText,
   description,
   imgSrc,
   style,
-}: CardButtonProps) => {
+}: TileButtonProps) => {
   const { ColorPallet, TextTheme } = useTheme()
   const styles = StyleSheet.create({
-    card: {
+    tile: {
       borderRadius: 4,
       backgroundColor: ColorPallet.notification.info,
       padding: 24,
@@ -50,7 +50,7 @@ const CardButton: React.FC<CardButtonProps> = ({
       testID={testIdWithKey(testIDKey)}
       accessibilityLabel={accessibilityLabel}
     >
-      <View style={styles.card}>
+      <View style={styles.tile}>
         <Text style={styles.actionText}>
           {actionText}
           <Icon size={20} color={ColorPallet.brand.primary} name={'arrow-right-thin'} />
@@ -64,4 +64,4 @@ const CardButton: React.FC<CardButtonProps> = ({
   )
 }
 
-export default CardButton
+export default TileButton

app/src/modules/unified/contents/VerificationStep1/Birthdate.tsx → app/src/modules/unified/contents/EvidenceCollectionStep/Birthdate.tsx

@@ -7,11 +7,11 @@ import { SafeAreaView } from 'react-native-safe-area-context'
 
 import { BCDispatchAction, BCState } from '../../../../store'
 
-type ContentProps = {
+type BirthdateContentProps = {
   onComplete: () => void
 }
 
-const BirthdateContent: React.FC<ContentProps> = ({ onComplete }: ContentProps) => {
+const BirthdateContent: React.FC<BirthdateContentProps> = ({ onComplete }: BirthdateContentProps) => {
   const today = new Date()
   const { t } = useTranslation()
   const { ColorPallet, TextTheme } = useTheme()

app/src/modules/unified/contents/VerificationStep1/Choose.tsx → app/src/modules/unified/contents/EvidenceCollectionStep/Choose.tsx

@@ -5,17 +5,17 @@ import { Text, StyleSheet, ScrollView, Pressable, View, useWindowDimensions } fr
 import { SafeAreaView } from 'react-native-safe-area-context'
 import Icon from 'react-native-vector-icons/MaterialCommunityIcons'
 
-import CardButton, { CardButtonProps } from '../../components/CardButton'
+import TileButton, { TileButtonProps } from '../../components/TileButton'
 import { BCDispatchAction, BCState } from '../../../../store'
 import { UnifiedCardType } from '../../types'
 
 const pagePadding = 24
 
-type ContentProps = {
+type ChooseContentProps = {
   goToInstructions: () => void
 }
 
-const ChooseContent: React.FC<ContentProps> = ({ goToInstructions }: ContentProps) => {
+const ChooseContent: React.FC<ChooseContentProps> = ({ goToInstructions }: ChooseContentProps) => {
   const { t } = useTranslation()
   const { ColorPallet, TextTheme } = useTheme()
   const [, dispatch] = useStore<BCState>()
@@ -111,8 +111,8 @@ const ChooseContent: React.FC<ContentProps> = ({ goToInstructions }: ContentProp
           imgSrc: require('../../assets/img/no_photo_card.png'),
           style: { marginBottom: 16 },
         },
-      ] as CardButtonProps[]
-    ).map((props, i) => <CardButton {...props} key={i + 1} />)
+      ] as TileButtonProps[]
+    ).map((props, i) => <TileButton {...props} key={i + 1} />)
   }, [onPressCombinedCard, onPressPhotoCard, onPressNoPhotoCard, t])
 
   return (
@@ -137,7 +137,7 @@ const ChooseContent: React.FC<ContentProps> = ({ goToInstructions }: ContentProp
             <Icon size={20} color={ColorPallet.brand.primary} name={'help-circle-outline'} />
           </Text>
         </Pressable>
-        <CardButton
+        <TileButton
           onPress={onPressOtherID}
           testIDKey={'OtherID'}
           accessibilityLabel={t('Unified.ChooseYourID.OtherID')}

app/src/modules/unified/contents/VerificationStep1/Instructions.tsx → app/src/modules/unified/contents/EvidenceCollectionStep/Instructions.tsx

@@ -4,13 +4,17 @@ import { Text, StyleSheet, ScrollView, Image, View, useWindowDimensions } from '
 import { SafeAreaView } from 'react-native-safe-area-context'
 
 const pagePadding = 24
+const twoThirds = 0.67
 
-type ContentProps = {
+type InstructionsContentProps = {
   goToScan: () => void
   goToManualSerial: () => void
 }
 
-const InstructionsContent: React.FC<ContentProps> = ({ goToScan, goToManualSerial }: ContentProps) => {
+const InstructionsContent: React.FC<InstructionsContentProps> = ({
+  goToScan,
+  goToManualSerial,
+}: InstructionsContentProps) => {
   const { t } = useTranslation()
   const { ColorPallet, TextTheme } = useTheme()
   const { width } = useWindowDimensions()
@@ -33,7 +37,7 @@ const InstructionsContent: React.FC<ContentProps> = ({ goToScan, goToManualSeria
     },
     image: {
       width: width - pagePadding * 2,
-      height: (width - pagePadding * 2) * 0.67,
+      height: (width - pagePadding * 2) * twoThirds,
       marginBottom: 24,
     },
     heading: {