@bifold/core 2.4.5 → 2.5.0

package/src/screens/PINVerify.tsx

@@ -1,195 +0,0 @@
-import React, { useCallback, useEffect, useState } from 'react'
-import { useTranslation } from 'react-i18next'
-import { Keyboard, StyleSheet, View } from 'react-native'
-import Button, { ButtonType } from '../components/buttons/Button'
-import { InlineMessageProps } from '../components/inputs/InlineErrorText'
-import PINInput from '../components/inputs/PINInput'
-import { InfoBoxType } from '../components/misc/InfoBox'
-import PopupModal from '../components/modals/PopupModal'
-import { ThemedText } from '../components/texts/ThemedText'
-import KeyboardView from '../components/views/KeyboardView'
-import { minPINLength } from '../constants'
-import { TOKENS, useServices } from '../container-api'
-import { useAnimatedComponents } from '../contexts/animated-components'
-import { useAuth } from '../contexts/auth'
-import { useTheme } from '../contexts/theme'
-import usePreventScreenCapture from '../hooks/screen-capture'
-import { testIdWithKey } from '../utils/testable'
-
-interface Props {
-  setAuthenticated: (status: boolean) => void
-  usage?: PINEntryUsage
-  onCancelAuth?: React.Dispatch<React.SetStateAction<boolean>>
-}
-
-export enum PINEntryUsage {
-  PINCheck,
-  ChangeBiometrics,
-}
-
-const PINVerify: React.FC<Props> = ({ setAuthenticated, usage = PINEntryUsage.PINCheck, onCancelAuth }) => {
-  const { t } = useTranslation()
-  const { verifyPIN } = useAuth()
-  const [PIN, setPIN] = useState<string>('')
-  const [continueDisabled, setContinueDisabled] = useState(false)
-  const [loading, setLoading] = useState(false)
-  const [alertModalVisible, setAlertModalVisible] = useState<boolean>(false)
-  const { ColorPalette } = useTheme()
-  const { ButtonLoading } = useAnimatedComponents()
-  const [inlineMessageField, setInlineMessageField] = useState<InlineMessageProps>()
-  const [{ preventScreenCapture }] = useServices([TOKENS.CONFIG])
-  usePreventScreenCapture(preventScreenCapture)
-
-  useEffect(() => {
-    setInlineMessageField(undefined)
-  }, [PIN])
-
-  const clearAlertModal = useCallback(() => {
-    setAlertModalVisible(false)
-    setAuthenticated(false)
-  }, [setAlertModalVisible, setAuthenticated])
-
-  const onPINInputCompleted = useCallback(async () => {
-    Keyboard.dismiss()
-    setLoading(true)
-    setContinueDisabled(true)
-    const isPINVerified = await verifyPIN(PIN)
-    if (isPINVerified) {
-      setAuthenticated(true)
-    } else {
-      setAlertModalVisible(true)
-    }
-    setLoading(false)
-    setContinueDisabled(false)
-  }, [verifyPIN, setLoading, setAuthenticated, setContinueDisabled, PIN])
-
-  const inputLabelText = {
-    [PINEntryUsage.ChangeBiometrics]: t('PINEnter.ChangeBiometricsInputLabel'),
-    [PINEntryUsage.PINCheck]: t('PINEnter.AppSettingChangedEnterPIN'),
-  }
-
-  const inputTestId = {
-    [PINEntryUsage.ChangeBiometrics]: 'BiometricChangedEnterPIN',
-    [PINEntryUsage.PINCheck]: 'AppSettingChangedEnterPIN',
-  }
-
-  const primaryButtonText = {
-    [PINEntryUsage.ChangeBiometrics]: t('Global.Continue'),
-    [PINEntryUsage.PINCheck]: t('PINEnter.AppSettingSave'),
-  }
-
-  const primaryButtonTestId = {
-    [PINEntryUsage.ChangeBiometrics]: 'Continue',
-    [PINEntryUsage.PINCheck]: 'AppSettingSave',
-  }
-
-  const helpText = {
-    [PINEntryUsage.ChangeBiometrics]: t('PINEnter.ChangeBiometricsSubtext'),
-    [PINEntryUsage.PINCheck]: t('PINEnter.AppSettingChanged'),
-  }
-
-  const isContinueDisabled = continueDisabled || PIN.length < minPINLength
-
-  const style = StyleSheet.create({
-    screenContainer: {
-      flex: 1,
-      padding: 20,
-      backgroundColor: ColorPalette.brand.primaryBackground,
-      justifyContent: 'space-between',
-    },
-    buttonContainer: {
-      width: '100%',
-    },
-    helpText: {
-      alignSelf: 'auto',
-      textAlign: 'left',
-      marginBottom: 40,
-    },
-    inputLabelText: {
-      alignSelf: 'auto',
-      textAlign: 'left',
-      marginBottom: 20,
-    },
-    modalText: {
-      marginVertical: 5,
-    },
-    changeBiometricsHeader: {
-      marginTop: 0,
-      marginBottom: 40,
-    },
-  })
-
-  return (
-    <KeyboardView keyboardAvoiding={false}>
-      <View style={style.screenContainer}>
-        <View>
-          {usage === PINEntryUsage.ChangeBiometrics && (
-            <ThemedText variant="headingTwo" style={style.changeBiometricsHeader}>
-              {t('PINEnter.ChangeBiometricsHeader')}
-            </ThemedText>
-          )}
-          <ThemedText style={style.helpText}>{helpText[usage]}</ThemedText>
-          <ThemedText variant="bold" style={style.inputLabelText}>
-            {inputLabelText[usage]}
-            {usage === PINEntryUsage.ChangeBiometrics && (
-              <ThemedText variant="caption">
-                {` `}
-                {t('PINEnter.ChangeBiometricsInputLabelParenthesis')}
-              </ThemedText>
-            )}
-          </ThemedText>
-          <PINInput
-            onPINChanged={(p: string) => {
-              setPIN(p)
-              if (p.length === minPINLength) {
-                Keyboard.dismiss()
-              }
-            }}
-            testID={testIdWithKey(inputTestId[usage])}
-            accessibilityLabel={inputLabelText[usage]}
-            autoFocus={true}
-            inlineMessage={inlineMessageField}
-            onSubmitEditing={async () => {
-              await onPINInputCompleted()
-            }}
-          />
-        </View>
-        <View style={style.buttonContainer}>
-          <Button
-            title={primaryButtonText[usage]}
-            buttonType={ButtonType.Primary}
-            testID={testIdWithKey(primaryButtonTestId[usage])}
-            disabled={isContinueDisabled}
-            accessibilityLabel={primaryButtonText[usage]}
-            onPress={async () => {
-              await onPINInputCompleted()
-            }}
-          >
-            {loading && <ButtonLoading />}
-          </Button>
-        </View>
-        {usage === PINEntryUsage.PINCheck && (
-          <View style={[style.buttonContainer, { marginTop: 10 }]}>
-            <Button
-              title={t('PINEnter.AppSettingCancel')}
-              buttonType={ButtonType.Secondary}
-              testID={testIdWithKey('AppSettingCancel')}
-              accessibilityLabel={t('PINEnter.AppSettingCancel')}
-              onPress={() => onCancelAuth?.(false)}
-            />
-          </View>
-        )}
-      </View>
-      {alertModalVisible && (
-        <PopupModal
-          notificationType={InfoBoxType.Info}
-          title={t('PINEnter.IncorrectPIN')}
-          onCallToActionLabel={t('Global.Okay')}
-          onCallToActionPressed={clearAlertModal}
-        />
-      )}
-    </KeyboardView>
-  )
-}
-
-export default PINVerify

package/src/screens/PasteUrl.tsx

@@ -1,140 +0,0 @@
-import { useAgent } from '@credo-ts/react-hooks'
-import { StackScreenProps } from '@react-navigation/stack'
-import React, { useState } from 'react'
-import { useTranslation } from 'react-i18next'
-import { StyleSheet, View, TextInput, ScrollView, TouchableOpacity } from 'react-native'
-import { SafeAreaView } from 'react-native-safe-area-context'
-
-import Button, { ButtonType } from '../components/buttons/Button'
-import InfoBox, { InfoBoxType } from '../components/misc/InfoBox'
-import SafeAreaModal from '../components/modals/SafeAreaModal'
-import { TOKENS, useServices } from '../container-api'
-import { useTheme } from '../contexts/theme'
-import { ConnectStackParams } from '../types/navigators'
-import { connectFromScanOrDeepLink } from '../utils/helpers'
-import { testIdWithKey } from '../utils/testable'
-import { ThemedText } from '../components/texts/ThemedText'
-
-export type PasteProps = StackScreenProps<ConnectStackParams>
-
-const PasteUrl: React.FC<PasteProps> = ({ navigation }) => {
-  const { ColorPalette, TextTheme } = useTheme()
-  const [pastedContent, setPastedContent] = useState<string>('')
-  const [errorMessage, setErrorMessage] = useState<{ title: string; message: string } | undefined>()
-  const { t } = useTranslation()
-  const { agent } = useAgent()
-  const [logger, { enableImplicitInvitations, enableReuseConnections }] = useServices([
-    TOKENS.UTIL_LOGGER,
-    TOKENS.CONFIG,
-  ])
-  const styles = StyleSheet.create({
-    container: {
-      flex: 1,
-      backgroundColor: ColorPalette.brand.primaryBackground,
-    },
-    content: {
-      margin: 20,
-    },
-    description: {
-      marginBottom: 20,
-    },
-    textBox: {
-      ...TextTheme.normal,
-      textAlignVertical: 'top',
-      borderColor: ColorPalette.grayscale.darkGrey,
-      borderWidth: 1,
-      borderRadius: 5,
-      backgroundColor: ColorPalette.grayscale.lightGrey,
-    },
-    buttonContainer: {
-      margin: 20,
-    },
-  })
-
-  const processPastedContent = async () => {
-    try {
-      await connectFromScanOrDeepLink(
-        pastedContent,
-        agent,
-        logger,
-        navigation?.getParent(),
-        false, // isDeepLink
-        enableImplicitInvitations,
-        enableReuseConnections
-      )
-    } catch (err: unknown) {
-      setErrorMessage({ title: t('PasteUrl.ErrorInvalidUrl'), message: t('PasteUrl.ErrorInvalidUrlDescription') })
-    }
-  }
-
-  return (
-    <SafeAreaView style={styles.container}>
-      <ScrollView>
-        <SafeAreaModal visible={!!errorMessage} testID={testIdWithKey('ErrorModal')} animationType="fade" transparent>
-          <View
-            style={{
-              flex: 1,
-              paddingHorizontal: 10,
-              justifyContent: 'center',
-              alignItems: 'center',
-              backgroundColor: 'rgba(0,0,0,0.6)',
-            }}
-          >
-            <InfoBox
-              notificationType={InfoBoxType.Error}
-              title={errorMessage?.title ?? ''}
-              description={errorMessage?.message ?? ''}
-              onCallToActionPressed={() => setErrorMessage(undefined)}
-              onCallToActionLabel={t('Global.TryAgain')}
-            />
-          </View>
-        </SafeAreaModal>
-        <View style={styles.content}>
-          <ThemedText style={styles.description}>{t('PasteUrl.PasteUrlDescription')}</ThemedText>
-          <TextInput
-            testID={testIdWithKey('PastedUrl')}
-            style={styles.textBox}
-            numberOfLines={15}
-            multiline
-            value={pastedContent}
-            onChangeText={(text) => setPastedContent(text)}
-          />
-        </View>
-        <View style={styles.buttonContainer}>
-          <TouchableOpacity
-            testID={testIdWithKey('ScanPastedUrlDisabled')}
-            disabled={pastedContent.length > 0}
-            onPress={() => {
-              setErrorMessage({
-                title: t('PasteUrl.ErrorTextboxEmpty'),
-                message: t('PasteUrl.ErrorTextboxEmptyDescription'),
-              })
-            }}
-          >
-            <Button
-              title={t('Global.Continue')}
-              accessibilityLabel={t('Global.Continue')}
-              testID={testIdWithKey('ScanPastedUrl')}
-              buttonType={ButtonType.Primary}
-              onPress={processPastedContent}
-              disabled={pastedContent.length === 0}
-            />
-          </TouchableOpacity>
-          <View style={{ marginTop: 15 }}>
-            <Button
-              title={t('PasteUrl.Clear')}
-              accessibilityLabel={t('PasteUrl.Clear')}
-              testID={testIdWithKey('ClearPastedUrl')}
-              buttonType={ButtonType.Secondary}
-              onPress={() => {
-                setPastedContent('')
-              }}
-            />
-          </View>
-        </View>
-      </ScrollView>
-    </SafeAreaView>
-  )
-}
-
-export default PasteUrl

package/src/screens/Preface.tsx

@@ -1,78 +0,0 @@
-import { useNavigation } from '@react-navigation/native'
-import { StackNavigationProp } from '@react-navigation/stack'
-import React, { useState } from 'react'
-import { useTranslation } from 'react-i18next'
-import { ScrollView, StyleSheet, View } from 'react-native'
-import { SafeAreaView } from 'react-native-safe-area-context'
-
-import Button, { ButtonType } from '../components/buttons/Button'
-import CheckBoxRow from '../components/inputs/CheckBoxRow'
-import { DispatchAction } from '../contexts/reducers/store'
-import { useStore } from '../contexts/store'
-import { useTheme } from '../contexts/theme'
-import { OnboardingStackParams, Screens } from '../types/navigators'
-import { testIdWithKey } from '../utils/testable'
-import { ThemedText } from '../components/texts/ThemedText'
-
-const Preface: React.FC = () => {
-  const [, dispatch] = useStore()
-  const [checked, setChecked] = useState(false)
-  const { t } = useTranslation()
-  const navigation = useNavigation<StackNavigationProp<OnboardingStackParams>>()
-  const { Assets, OnboardingTheme, TextTheme } = useTheme()
-  const onSubmitPressed = () => {
-    dispatch({
-      type: DispatchAction.DID_SEE_PREFACE,
-    })
-    navigation.navigate(Screens.Onboarding)
-  }
-  const style = StyleSheet.create({
-    screenContainer: {
-      ...OnboardingTheme.container,
-      height: '100%',
-      padding: 20,
-      justifyContent: 'space-between',
-    },
-
-    // No properties needed, just helpful labels
-    contentContainer: {},
-    controlsContainer: {},
-  })
-
-  return (
-    <SafeAreaView style={{ flex: 1 }} edges={['left', 'right', 'bottom']}>
-      <ScrollView contentContainerStyle={{ flexGrow: 1 }}>
-        <View style={style.screenContainer}>
-          <View style={style.contentContainer}>
-            <Assets.svg.preface style={{ alignSelf: 'center', marginBottom: 20 }} height={200} />
-            <ThemedText variant="headingTwo">{t('Preface.PrimaryHeading')}</ThemedText>
-            <ThemedText style={{ marginTop: 20, marginBottom: 20 }}>{t('Preface.Paragraph1')}</ThemedText>
-          </View>
-          <View style={style.controlsContainer}>
-            <CheckBoxRow
-              title={t('Preface.Confirmed')}
-              accessibilityLabel={t('Terms.IAgree')}
-              testID={testIdWithKey('IAgree')}
-              checked={checked}
-              onPress={() => setChecked(!checked)}
-              reverse
-              titleStyle={{ fontWeight: TextTheme.bold.fontWeight }}
-            />
-            <View style={{ paddingTop: 10 }}>
-              <Button
-                title={t('Global.Continue')}
-                accessibilityLabel={t('Global.Continue')}
-                testID={testIdWithKey('Continue')}
-                disabled={!checked}
-                onPress={onSubmitPressed}
-                buttonType={ButtonType.Primary}
-              />
-            </View>
-          </View>
-        </View>
-      </ScrollView>
-    </SafeAreaView>
-  )
-}
-
-export default Preface

package/src/screens/ProofChangeCredential.tsx

@@ -1,179 +0,0 @@
-import {
-  AnonCredsCredentialsForProofRequest,
-  AnonCredsRequestedAttributeMatch,
-  AnonCredsRequestedPredicateMatch,
-} from '@credo-ts/anoncreds'
-import { StackScreenProps } from '@react-navigation/stack'
-import React, { useCallback, useEffect, useState } from 'react'
-import { useTranslation } from 'react-i18next'
-import { DeviceEventEmitter, FlatList, StyleSheet, TouchableOpacity, View } from 'react-native'
-import { SafeAreaView } from 'react-native-safe-area-context'
-
-import RecordLoading from '../components/animated/RecordLoading'
-import { CredentialCard } from '../components/misc'
-import { EventTypes } from '../constants'
-import { useTheme } from '../contexts/theme'
-import { useAllCredentialsForProof } from '../hooks/proofs'
-import { BifoldError } from '../types/error'
-import { ProofRequestsStackParams, Screens } from '../types/navigators'
-import { ProofCredentialItems } from '../types/proof-items'
-import { Fields, evaluatePredicates } from '../utils/helpers'
-import { testIdWithKey } from '../utils/testable'
-import { CredentialErrors } from '../components/misc/CredentialCard11'
-import { ThemedText } from '../components/texts/ThemedText'
-
-type ProofChangeProps = StackScreenProps<ProofRequestsStackParams, Screens.ProofChangeCredential>
-
-const ProofChangeCredential: React.FC<ProofChangeProps> = ({ route, navigation }) => {
-  if (!route?.params) {
-    throw new Error('Change credential route params were not set properly')
-  }
-  const proofId = route.params.proofId
-  const selectedCred = route.params.selectedCred
-  const altCredentials = route.params.altCredentials
-  const onCredChange = route.params.onCredChange
-  const { ColorPalette, SelectedCredTheme } = useTheme()
-  const { t } = useTranslation()
-  const [loading, setLoading] = useState(false)
-  const [proofItems, setProofItems] = useState<ProofCredentialItems[]>([])
-  const [retrievedCredentials, setRetrievedCredentials] = useState<AnonCredsCredentialsForProofRequest>()
-  const credProofPromise = useAllCredentialsForProof(proofId)
-  const styles = StyleSheet.create({
-    pageContainer: {
-      flex: 1,
-    },
-    pageMargin: {
-      marginHorizontal: 20,
-    },
-    cardLoading: {
-      backgroundColor: ColorPalette.brand.secondaryBackground,
-      flex: 1,
-      flexGrow: 1,
-      marginVertical: 35,
-      borderRadius: 15,
-      paddingHorizontal: 10,
-    },
-  })
-
-  const getCredentialsFields = useCallback(
-    (): Fields => ({
-      ...retrievedCredentials?.attributes,
-      ...retrievedCredentials?.predicates,
-    }),
-    [retrievedCredentials]
-  )
-
-  useEffect(() => {
-    setLoading(true)
-
-    credProofPromise
-      ?.then((value) => {
-        if (value) {
-          const { groupedProof, retrievedCredentials } = value
-          setLoading(false)
-          const activeCreds = groupedProof.filter((proof) => altCredentials.includes(proof.credId))
-          const credList = activeCreds.map((cred) => cred.credId)
-          const formatCredentials = (
-            retrievedItems: Record<string, (AnonCredsRequestedAttributeMatch | AnonCredsRequestedPredicateMatch)[]>
-          ) => {
-            return Object.keys(retrievedItems)
-              .map((key) => {
-                return {
-                  [key]: retrievedItems[key].filter((attr) => credList.includes(attr.credentialId)),
-                }
-              })
-              .reduce((prev, curr) => {
-                return {
-                  ...prev,
-                  ...curr,
-                }
-              }, {})
-          }
-          const selectRetrievedCredentials: AnonCredsCredentialsForProofRequest | undefined = retrievedCredentials
-            ? {
-                ...retrievedCredentials,
-                attributes: formatCredentials(retrievedCredentials.attributes) as Record<
-                  string,
-                  AnonCredsRequestedAttributeMatch[]
-                >,
-                predicates: formatCredentials(retrievedCredentials.predicates) as Record<
-                  string,
-                  AnonCredsRequestedPredicateMatch[]
-                >,
-              }
-            : undefined
-          setRetrievedCredentials(selectRetrievedCredentials)
-          setProofItems(activeCreds)
-        }
-      })
-      .catch((err: unknown) => {
-        const error = new BifoldError(
-          t('Error.Title1026'),
-          t('Error.Message1026'),
-          (err as Error)?.message ?? err,
-          1026
-        )
-        DeviceEventEmitter.emit(EventTypes.ERROR_ADDED, error)
-      })
-  }, [credProofPromise, altCredentials, t])
-
-  const listHeader = () => {
-    return (
-      <View style={{ ...styles.pageMargin, marginVertical: 20 }}>
-        {loading ? (
-          <View style={styles.cardLoading}>
-            <RecordLoading />
-          </View>
-        ) : (
-          <ThemedText>{t('ProofRequest.MultipleCredentials')}</ThemedText>
-        )}
-      </View>
-    )
-  }
-
-  const changeCred = (credId: string) => {
-    onCredChange(credId)
-    navigation.goBack()
-  }
-  const hasSatisfiedPredicates = (fields: Fields, credId?: string) =>
-    proofItems.flatMap((item) => evaluatePredicates(fields, credId)(item)).every((p) => p.satisfied)
-
-  return (
-    <SafeAreaView style={styles.pageContainer} edges={['bottom', 'left', 'right']}>
-      <FlatList
-        data={proofItems}
-        ListHeaderComponent={listHeader}
-        renderItem={({ item }) => {
-          const errors: CredentialErrors[] = []
-          item.credExchangeRecord?.revocationNotification?.revocationDate && errors.push(CredentialErrors.Revoked)
-          !hasSatisfiedPredicates(getCredentialsFields(), item.credId) && errors.push(CredentialErrors.PredicateError)
-          return (
-            <View style={styles.pageMargin}>
-              <TouchableOpacity
-                accessibilityRole="button"
-                testID={testIdWithKey(`select:${item.credId}`)}
-                onPress={() => changeCred(item.credId ?? '')}
-                style={[item.credId === selectedCred ? SelectedCredTheme : undefined, { marginBottom: 10 }]}
-              >
-                <CredentialCard
-                  credential={item.credExchangeRecord}
-                  credDefId={item.credDefId}
-                  schemaId={item.schemaId}
-                  displayItems={[
-                    ...(item.attributes ?? []),
-                    ...evaluatePredicates(getCredentialsFields(), item.credId)(item),
-                  ]}
-                  credName={item.credName}
-                  proof
-                  credentialErrors={errors}
-                ></CredentialCard>
-              </TouchableOpacity>
-            </View>
-          )
-        }}
-      ></FlatList>
-    </SafeAreaView>
-  )
-}
-
-export default ProofChangeCredential