@bifold/core 2.4.5 → 2.5.0

package/src/screens/Settings.tsx

@@ -1,415 +0,0 @@
-import { StackScreenProps } from '@react-navigation/stack'
-import React from 'react'
-import { useTranslation } from 'react-i18next'
-import { LockoutReason, useAuth } from '../contexts/auth'
-import {
-  ScrollView,
-  SectionList,
-  StyleSheet,
-  TouchableOpacity,
-  TouchableWithoutFeedback,
-  useWindowDimensions,
-  Vibration,
-  View,
-} from 'react-native'
-import { getBuildNumber, getVersion } from 'react-native-device-info'
-import { SafeAreaView } from 'react-native-safe-area-context'
-import Icon from 'react-native-vector-icons/MaterialIcons'
-
-import IconButton, { ButtonLocation } from '../components/buttons/IconButton'
-import { ThemedText } from '../components/texts/ThemedText'
-import { TOKENS, useServices } from '../container-api'
-import { AutoLockTime } from '../contexts/activity'
-import { useStore } from '../contexts/store'
-import { useTheme } from '../contexts/theme'
-import { useDeveloperMode } from '../hooks/developer-mode'
-import { Locales } from '../localization'
-import { GenericFn } from '../types/fn'
-import { Screens, SettingStackParams, Stacks } from '../types/navigators'
-import { SettingIcon, SettingSection } from '../types/settings'
-import { testIdWithKey } from '../utils/testable'
-
-type SettingsProps = StackScreenProps<SettingStackParams>
-
-const Settings: React.FC<SettingsProps> = ({ navigation }) => {
-  const { t, i18n } = useTranslation()
-  const [store] = useStore()
-  const { lockOutUser } = useAuth()
-  const onDevModeTriggered = () => {
-    Vibration.vibrate()
-    navigation.navigate(Screens.Developer)
-  }
-  const { incrementDeveloperMenuCounter } = useDeveloperMode(onDevModeTriggered)
-  const { SettingsTheme, TextTheme, ColorPalette, Assets, maxFontSizeMultiplier } = useTheme()
-  const [{ settings, enableTours, enablePushNotifications, disableContactsInSettings }, historyEnabled] = useServices([
-    TOKENS.CONFIG,
-    TOKENS.HISTORY_ENABLED,
-  ])
-  const { fontScale } = useWindowDimensions()
-  const fontIsGreaterThanCap = fontScale >= maxFontSizeMultiplier
-  const defaultIconSize = 24
-  const styles = StyleSheet.create({
-    container: {
-      backgroundColor: ColorPalette.brand.primaryBackground,
-      width: '100%',
-    },
-    section: {
-      backgroundColor: SettingsTheme.groupBackground,
-      paddingVertical: 24,
-      flexGrow: 1,
-    },
-    sectionHeader: {
-      flexDirection: 'row',
-      alignItems: 'center',
-      paddingBottom: 0,
-      marginBottom: -11,
-      paddingHorizontal: 25,
-    },
-    sectionSeparator: {
-      marginBottom: 10,
-    },
-    sectionRow: {
-      flexDirection: fontIsGreaterThanCap ? 'column' : 'row',
-      alignItems: fontIsGreaterThanCap ? 'flex-start' : 'center',
-      justifyContent: 'space-between',
-      flexGrow: 1,
-      paddingHorizontal: 25,
-    },
-    itemSeparator: {
-      borderBottomWidth: 1,
-      borderBottomColor: ColorPalette.brand.primaryBackground,
-      marginHorizontal: 25,
-    },
-    footer: {
-      marginVertical: 25,
-      alignItems: 'center',
-    },
-  })
-
-  const currentLanguage = i18n.t('Language.code', { context: i18n.language as Locales })
-
-  const settingsSections: SettingSection[] = [
-    {
-      header: {
-        icon: { name: store.preferences.useConnectionInviterCapability ? 'person' : 'apartment', size: 30 },
-        title: store.preferences.useConnectionInviterCapability ? store.preferences.walletName : t('Screens.Contacts'),
-        iconRight: {
-          name: 'edit',
-          action: () => {
-            navigation.navigate(Screens.RenameWallet)
-          },
-          accessibilityLabel: t('NameWallet.EditWalletName'),
-          testID: testIdWithKey('EditWalletName'),
-          style: { color: ColorPalette.brand.primary },
-        },
-        titleTestID: store.preferences.useConnectionInviterCapability ? testIdWithKey('WalletName') : undefined,
-      },
-      data: [
-        {
-          title: t('Screens.Contacts'),
-          accessibilityLabel: t('Screens.Contacts'),
-          testID: testIdWithKey('Contacts'),
-          onPress: () => navigation.getParent()?.navigate(Stacks.ContactStack, { screen: Screens.Contacts }),
-        },
-        {
-          title: t('Settings.WhatAreContacts'),
-          accessibilityLabel: t('Settings.WhatAreContacts'),
-          testID: testIdWithKey('WhatAreContacts'),
-          onPress: () => navigation.getParent()?.navigate(Stacks.ContactStack, { screen: Screens.WhatAreContacts }),
-          value: undefined,
-        },
-      ],
-    },
-    {
-      header: {
-        icon: { name: 'settings' },
-        title: t('Settings.AppSettings'),
-      },
-      data: [
-        {
-          title: t('Global.Biometrics'),
-          value: store.preferences.useBiometry ? t('Global.On') : t('Global.Off'),
-          accessibilityLabel: t('Global.Biometrics'),
-          testID: testIdWithKey('Biometrics'),
-          onPress: () => navigation.navigate(Screens.ToggleBiometry),
-        },
-        {
-          title: t('Settings.ChangePin'),
-          value: undefined,
-          accessibilityLabel: t('Settings.ChangePin'),
-          testID: testIdWithKey('Change Pin'),
-          onPress: () => navigation.navigate(Screens.ChangePIN),
-        },
-        {
-          title: t('Settings.Language'),
-          value: currentLanguage,
-          accessibilityLabel: t('Settings.Language'),
-          testID: testIdWithKey('Language'),
-          onPress: () => navigation.navigate(Screens.Language),
-        },
-        {
-          title: t('Settings.AutoLockTime'),
-          value:
-            store.preferences.autoLockTime !== AutoLockTime.Never ? `${store.preferences.autoLockTime} min` : 'Never',
-          accessibilityLabel: t('Settings.AutoLockTime'),
-          testID: testIdWithKey('Lockout'),
-          onPress: () => navigation.navigate(Screens.AutoLock),
-        },
-      ],
-    },
-    ...(settings || []),
-  ]
-
-  // Remove the Contact section from Setting per TOKENS.CONFIG
-  if (disableContactsInSettings) {
-    settingsSections.shift()
-  }
-
-  // add optional push notifications menu to settings
-  if (enablePushNotifications) {
-    settingsSections
-      .find((item) => item.header.title === t('Settings.AppSettings'))
-      ?.data.push({
-        title: t('Settings.Notifications'),
-        value: undefined,
-        accessibilityLabel: t('Settings.Notifications'),
-        testID: testIdWithKey('Notifications'),
-        onPress: () => navigation.navigate(Screens.TogglePushNotifications),
-      })
-  }
-
-  // add optional history menu to settings
-  if (historyEnabled) {
-    settingsSections
-      .find((item) => item.header.title === t('Settings.AppSettings'))
-      ?.data.push({
-        title: t('Global.History'),
-        value: undefined,
-        accessibilityLabel: t('Global.History'),
-        testID: testIdWithKey('History'),
-        onPress: () => navigation.navigate(Screens.HistorySettings),
-      })
-  }
-
-  if (enableTours) {
-    const section = settingsSections.find((item) => item.header.title === t('Settings.AppSettings'))
-    if (section) {
-      section.data = [
-        ...section.data,
-        {
-          title: t('Settings.AppGuides'),
-          value: store.tours.enableTours ? t('Global.On') : t('Global.Off'),
-          accessibilityLabel: t('Settings.AppGuides'),
-          testID: testIdWithKey('AppGuides'),
-          onPress: () => navigation.navigate(Screens.Tours),
-        },
-      ]
-    }
-  }
-
-  if (store.preferences.developerModeEnabled) {
-    const section = settingsSections.find((item) => item.header.title === t('Settings.AppSettings'))
-    if (section) {
-      section.data = [
-        ...section.data,
-        {
-          title: t('Settings.Developer'),
-          accessibilityLabel: t('Settings.Developer'),
-          testID: testIdWithKey('DeveloperOptions'),
-          onPress: () => navigation.navigate(Screens.Developer),
-        },
-        {
-          title: t('Settings.ConfigureMediator'),
-          value: store.preferences.selectedMediator,
-          accessibilityLabel: t('Settings.ConfigureMediator'),
-          testID: testIdWithKey('ConfigureMediator'),
-          onPress: () => navigation.navigate(Screens.ConfigureMediator),
-        },
-        {
-          title: t('Settings.Logout'),
-          accessibilityLabel: t('Settings.Logout'),
-          testID: testIdWithKey('Logout'),
-          onPress: () => lockOutUser(LockoutReason.Logout),
-        },
-      ]
-    }
-  }
-
-  if (store.preferences.useVerifierCapability) {
-    settingsSections.splice(1, 0, {
-      header: {
-        icon: { name: 'send' },
-        title: t('Screens.ProofRequests'),
-      },
-      data: [
-        {
-          title: t('Screens.SendProofRequest'),
-          accessibilityLabel: t('Screens.ProofRequests'),
-          testID: testIdWithKey('ProofRequests'),
-          onPress: () =>
-            navigation.getParent()?.navigate(Stacks.ProofRequestsStack, {
-              screen: Screens.ProofRequests,
-            }),
-        },
-      ],
-    })
-    if (!store.preferences.disableDataRetentionOption) {
-      const section = settingsSections.find((item) => item.header.title === t('Settings.AppSettings'))
-      if (section) {
-        section.data.splice(3, 0, {
-          title: t('Settings.DataRetention'),
-          value: store.preferences.useDataRetention ? t('Global.On') : t('Global.Off'),
-          accessibilityLabel: t('Settings.DataRetention'),
-          testID: testIdWithKey('DataRetention'),
-          onPress: () => navigation.navigate(Screens.DataRetention),
-        })
-      }
-    }
-  }
-
-  if (store.preferences.useConnectionInviterCapability) {
-    const section = settingsSections.find((item) => item.header.title === store.preferences.walletName)
-    if (section) {
-      section.data.splice(1, 0, {
-        title: t('Settings.ScanMyQR'),
-        accessibilityLabel: t('Settings.ScanMyQR'),
-        testID: testIdWithKey('ScanMyQR'),
-        onPress: () =>
-          navigation.getParent()?.navigate(Stacks.ConnectStack, {
-            screen: Screens.Scan,
-            params: { defaultToConnect: true },
-          }),
-      })
-    }
-  }
-
-  const SectionHeader: React.FC<{
-    icon: SettingIcon
-    iconRight?: SettingIcon
-    title: string
-    titleTestID?: string
-  }> = ({ icon, iconRight, title, titleTestID }) =>
-    // gate keep behind developer mode
-    store.preferences.useConnectionInviterCapability ? (
-      <View style={[styles.section, styles.sectionHeader, { justifyContent: iconRight ? 'space-between' : undefined }]}>
-        <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
-          <Icon
-            importantForAccessibility={'no-hide-descendants'}
-            accessible={false}
-            name={icon.name}
-            size={icon.size ?? defaultIconSize}
-            style={[{ marginRight: 10, color: SettingsTheme.iconColor }, icon.style]}
-          />
-          <ThemedText
-            variant="headingThree"
-            testID={titleTestID}
-            numberOfLines={1}
-            accessibilityRole={'header'}
-            style={{ flexShrink: 1 }}
-          >
-            {title}
-          </ThemedText>
-        </View>
-        {iconRight && (
-          <IconButton
-            buttonLocation={ButtonLocation.Right}
-            accessibilityLabel={iconRight.accessibilityLabel!}
-            testID={iconRight.testID!}
-            onPress={iconRight.action!}
-            icon={'pencil'}
-            iconTintColor={TextTheme.headingThree.color}
-          />
-        )}
-      </View>
-    ) : (
-      <View style={[styles.section, styles.sectionHeader]}>
-        <Icon
-          importantForAccessibility={'no-hide-descendants'}
-          accessible={false}
-          name={icon.name}
-          size={24}
-          style={{ marginRight: 10, color: SettingsTheme.iconColor }}
-        />
-        <ThemedText
-          maxFontSizeMultiplier={1.8}
-          variant="headingThree"
-          accessibilityRole={'header'}
-          style={{ flexShrink: 1 }}
-        >
-          {title}
-        </ThemedText>
-      </View>
-    )
-
-  const SectionRow: React.FC<{
-    title: string
-    value?: string
-    accessibilityLabel?: string
-    testID?: string
-    onPress?: GenericFn
-  }> = ({ title, value, accessibilityLabel, testID, onPress }) => (
-    <ScrollView horizontal style={styles.section} contentContainerStyle={{ flexGrow: 1 }}>
-      <TouchableOpacity
-        accessible={true}
-        accessibilityLabel={accessibilityLabel}
-        accessibilityRole="button"
-        testID={testID}
-        style={styles.sectionRow}
-        onPress={onPress}
-      >
-        <ThemedText
-          style={[TextTheme.settingsText, { marginRight: 14, maxWidth: fontIsGreaterThanCap ? '95%' : '100%' }]}
-        >
-          {title}
-        </ThemedText>
-        <ThemedText style={[TextTheme.settingsText, { color: ColorPalette.brand.link }]}>{value}</ThemedText>
-      </TouchableOpacity>
-    </ScrollView>
-  )
-
-  return (
-    <SafeAreaView style={styles.container} edges={['bottom', 'left', 'right']}>
-      <SectionList
-        renderItem={({ item: { title, value, accessibilityLabel, testID, onPress } }) => (
-          <SectionRow
-            title={title}
-            accessibilityLabel={accessibilityLabel}
-            testID={testID ?? 'NoTestIdFound'}
-            value={value}
-            onPress={onPress}
-          />
-        )}
-        renderSectionHeader={({
-          section: {
-            header: { title, icon, iconRight, titleTestID },
-          },
-        }) => <SectionHeader icon={icon} iconRight={iconRight} title={title} titleTestID={titleTestID} />}
-        ItemSeparatorComponent={() => (
-          <View style={{ backgroundColor: SettingsTheme.groupBackground }}>
-            <View style={styles.itemSeparator}></View>
-          </View>
-        )}
-        SectionSeparatorComponent={() => <View style={styles.sectionSeparator}></View>}
-        ListFooterComponent={() => (
-          <View style={styles.footer}>
-            <TouchableWithoutFeedback
-              onPress={incrementDeveloperMenuCounter}
-              disabled={store.preferences.developerModeEnabled}
-            >
-              <View>
-                <ThemedText testID={testIdWithKey('Version')}>
-                  {`${t('Settings.Version')} ${getVersion()} ${t('Settings.Build')} (${getBuildNumber()})`}
-                </ThemedText>
-                <Assets.svg.logo style={{ alignSelf: 'center' }} width={150} height={75} />
-              </View>
-            </TouchableWithoutFeedback>
-          </View>
-        )}
-        sections={settingsSections}
-        stickySectionHeadersEnabled={false}
-      ></SectionList>
-    </SafeAreaView>
-  )
-}
-
-export default Settings

package/src/screens/Splash.tsx

@@ -1,80 +0,0 @@
-import { RemoteOCABundleResolver } from '@bifold/oca/build/legacy'
-import React, { useEffect, useRef } from 'react'
-import { useTranslation } from 'react-i18next'
-import { DeviceEventEmitter, StyleSheet } from 'react-native'
-import { SafeAreaView } from 'react-native-safe-area-context'
-
-import { EventTypes } from '../constants'
-import { TOKENS, useServices } from '../container-api'
-import { useAnimatedComponents } from '../contexts/animated-components'
-import { useTheme } from '../contexts/theme'
-import { BifoldError } from '../types/error'
-import { WalletSecret } from '../types/security'
-import { useAuth } from '../contexts/auth'
-import { useStore } from '../contexts/store'
-
-export type SplashProps = {
-  initializeAgent: (walletSecret: WalletSecret) => Promise<void>
-}
-
-/**
- * This Splash screen is shown in two scenarios: initial load of the app,
- * and during agent initialization after login
- */
-const Splash: React.FC<SplashProps> = ({ initializeAgent }) => {
-  const { walletSecret } = useAuth()
-  const { t } = useTranslation()
-  const [store] = useStore()
-  const { ColorPalette } = useTheme()
-  const { LoadingIndicator } = useAnimatedComponents()
-  const initializing = useRef(false)
-  const [logger, ocaBundleResolver] = useServices([TOKENS.UTIL_LOGGER, TOKENS.UTIL_OCA_RESOLVER])
-
-  const styles = StyleSheet.create({
-    container: {
-      flex: 1,
-      justifyContent: 'center',
-      alignItems: 'center',
-      backgroundColor: ColorPalette.brand.primaryBackground,
-    },
-  })
-
-  useEffect(() => {
-    if (initializing.current || !store.authentication.didAuthenticate) {
-      return
-    }
-
-    if (!walletSecret) {
-      throw new Error('Wallet secret is missing')
-    }
-    initializing.current = true
-
-    const initAgentAsyncEffect = async (): Promise<void> => {
-      try {
-        await (ocaBundleResolver as RemoteOCABundleResolver).checkForUpdates?.()
-
-        await initializeAgent(walletSecret)
-      } catch (err: unknown) {
-        const error = new BifoldError(
-          t('Error.Title1045'),
-          t('Error.Message1045'),
-          (err as Error)?.message ?? err,
-          1045
-        )
-
-        DeviceEventEmitter.emit(EventTypes.ERROR_ADDED, error)
-        logger.error((err as Error)?.message ?? err)
-      }
-    }
-
-    initAgentAsyncEffect()
-  }, [initializeAgent, ocaBundleResolver, logger, walletSecret, t, store.authentication.didAuthenticate])
-
-  return (
-    <SafeAreaView style={styles.container}>
-      <LoadingIndicator />
-    </SafeAreaView>
-  )
-}
-
-export default Splash

package/src/screens/Terms.tsx

@@ -1,127 +0,0 @@
-import { useNavigation } from '@react-navigation/native'
-import { StackNavigationProp } from '@react-navigation/stack'
-import React, { useCallback, useState } from 'react'
-import { useTranslation } from 'react-i18next'
-import { ScrollView, StyleSheet, View } from 'react-native'
-
-import { ButtonType } from '../components/buttons/Button-api'
-import CheckBoxRow from '../components/inputs/CheckBoxRow'
-import HighlightTextBox from '../components/texts/HighlightTextBox'
-import InfoTextBox from '../components/texts/InfoTextBox'
-import { TOKENS, useServices } from '../container-api'
-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 ScreenLayout from '../layout/ScreenLayout'
-import { ThemedText } from '../components/texts/ThemedText'
-
-export const TermsVersion = '1'
-
-const Terms: React.FC = () => {
-  const [store, dispatch] = useStore()
-  const agreedToPreviousTerms = store.onboarding.didAgreeToTerms
-  const [checked, setChecked] = useState(agreedToPreviousTerms)
-  const { t } = useTranslation()
-  const navigation = useNavigation<StackNavigationProp<OnboardingStackParams>>()
-  const { OnboardingTheme, TextTheme } = useTheme()
-  const [Button] = useServices([TOKENS.COMP_BUTTON])
-
-  const onSubmitPressed = useCallback(() => {
-    dispatch({
-      type: DispatchAction.DID_AGREE_TO_TERMS,
-      payload: [{ DidAgreeToTerms: TermsVersion }],
-    })
-  }, [dispatch])
-
-  const style = StyleSheet.create({
-    container: {
-      ...OnboardingTheme.container,
-      padding: 20,
-    },
-    bodyText: {
-      ...OnboardingTheme.bodyText,
-      flexShrink: 1,
-    },
-    controlsContainer: {
-      marginTop: 'auto',
-      marginBottom: 20,
-    },
-  })
-
-  const onBackPressed = () => {
-    //TODO:(jl) goBack() does not unwind the navigation stack but rather goes
-    //back to the splash screen. Needs fixing before the following code will
-    //work as expected.
-
-    // if (nav.canGoBack()) {
-    //   nav.goBack()
-    // }
-
-    navigation.navigate(Screens.Onboarding)
-  }
-
-  return (
-    <ScreenLayout screen={Screens.Terms}>
-      <ScrollView style={style.container}>
-        <InfoTextBox>Please agree to the terms and conditions below before using this application.</InfoTextBox>
-        <ThemedText style={[style.bodyText, { marginTop: 20, marginBottom: 20 }]}>
-          <ThemedText style={[style.bodyText, { fontWeight: TextTheme.bold.fontWeight }]}>
-            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-          </ThemedText>{' '}
-          Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
-          exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
-          in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
-          proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-        </ThemedText>
-        <HighlightTextBox>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui</HighlightTextBox>
-        <ThemedText style={[style.bodyText, { marginTop: 20 }]}>
-          Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
-          exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
-          in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Tempor incididunt ut labore et dolore magna
-          aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
-          consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
-          pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
-          est laborum.
-        </ThemedText>
-        <View style={style.controlsContainer}>
-          {!(agreedToPreviousTerms && store.authentication.didAuthenticate) && (
-            <View style={{ marginBottom: agreedToPreviousTerms ? 20 : 0 }}>
-              <CheckBoxRow
-                title={t('Terms.Attestation')}
-                accessibilityLabel={t('Terms.IAgree')}
-                testID={testIdWithKey('IAgree')}
-                checked={!!checked}
-                onPress={() => setChecked(!checked)}
-              />
-              <View style={{ paddingTop: 10 }}>
-                <Button
-                  title={agreedToPreviousTerms ? t('Global.Accept') : t('Global.Continue')}
-                  accessibilityLabel={agreedToPreviousTerms ? t('Global.Accept') : t('Global.Continue')}
-                  testID={agreedToPreviousTerms ? testIdWithKey('Accept') : testIdWithKey('Continue')}
-                  disabled={!checked}
-                  onPress={onSubmitPressed}
-                  buttonType={ButtonType.Primary}
-                />
-              </View>
-            </View>
-          )}
-          {!agreedToPreviousTerms && (
-            <View style={{ paddingTop: 10, marginBottom: 20 }}>
-              <Button
-                title={t('Global.Back')}
-                accessibilityLabel={t('Global.Back')}
-                testID={testIdWithKey('Back')}
-                onPress={onBackPressed}
-                buttonType={ButtonType.Secondary}
-              />
-            </View>
-          )}
-        </View>
-      </ScrollView>
-    </ScreenLayout>
-  )
-}
-
-export default Terms