Merge branch 'dev' into stage

src/components/modular/AnimatedTabs/index.tsx

@@ -1,11 +1,5 @@
 import React, { useEffect, useRef, useState } from 'react';
-import {
- View,
- ScrollView,
- Dimensions,
- ViewStyle,
- RefreshControl
-} from 'react-native';
+import { View, ScrollView, Dimensions, ViewStyle } from 'react-native';
 import Animated, {
  useAnimatedStyle,
  useSharedValue,
@@ -24,12 +18,10 @@ type AnimatedTab = {
 interface AnimatedTabsProps {
  tabs: AnimatedTab[];
  containerStyle?: ViewStyle;
- onRefresh?: () => unknown;
- isRefreshing?: boolean;
 }
 
 export const AnimatedTabs = (props: AnimatedTabsProps) => {
- const { tabs, containerStyle, onRefresh, isRefreshing } = props;
+ const { tabs, containerStyle } = props;
  const tabCount = tabs.length;
  const scrollView = useRef<ScrollView>(null);
  const [currentIndex, setCurrentIndex] = useState(0);
@@ -118,12 +110,6 @@ export const AnimatedTabs = (props: AnimatedTabsProps) => {
  setCurrentIndex(scrollOffsetX > 0 ? 1 : 0);
  }}
  contentContainerStyle={{ flexGrow: 1 }}
- refreshControl={
- <RefreshControl
- onRefresh={onRefresh}
- refreshing={Boolean(isRefreshing)}
- />
- }
  >
  {tabs.map(renderTabView)}
  </ScrollView>

src/components/modular/WalletCard/index.tsx

@@ -86,7 +86,10 @@ export const WalletCard = (props: WalletCardProps) => {
  fontFamily="Inter_500Medium"
  >
  $
- {NumberUtils.formatNumber(usdBalance, usdBalance > 0 ? 2 : 0)}
+ {NumberUtils.limitDecimalCount(
+ usdBalance,
+ usdBalance > 0 ? 2 : 0
+ )}
  </Text>
  </View>
  </Row>

src/components/templates/ExplorerAccount/ExplorerAccount.Transactions.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import {
  ListRenderItemInfo,
+ RefreshControl,
  SectionList,
  SectionListData,
  StyleSheet
@@ -19,7 +20,9 @@ interface ExplorerAccountViewTransactionsProps {
  transactions: Transaction[];
  loading?: boolean;
  showTransactionDetailsOnPress?: boolean;
+ isRefreshing?: boolean;
  onEndReached?: () => unknown;
+ onRefresh?: () => unknown;
 }
 
 interface TransactionSection {
@@ -32,8 +35,14 @@ const DAY_FORMAT = 'MMM DD YYYY';
 export const AccountTransactions = (
  props: ExplorerAccountViewTransactionsProps
 ): JSX.Element => {
- const { transactions, loading, showTransactionDetailsOnPress, onEndReached } =
- props;
+ const {
+ transactions,
+ loading,
+ showTransactionDetailsOnPress,
+ isRefreshing,
+ onRefresh,
+ onEndReached
+ } = props;
  const { t } = useTranslation();
 
  const sectionizedTransactions: TransactionSection[] = React.useMemo(() => {
@@ -113,6 +122,12 @@ export const AccountTransactions = (
  showsVerticalScrollIndicator={false}
  testID="Transactions_List"
  ListFooterComponent={() => (loading ? <CenteredSpinner /> : <></>)}
+ refreshControl={
+ <RefreshControl
+ onRefresh={onRefresh}
+ refreshing={Boolean(isRefreshing)}
+ />
+ }
  />
  </>
  );

src/components/templates/WalletTransactionsAndAssets/WalletAssets/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FlatList, View } from 'react-native';
+import { FlatList, View, RefreshControl } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import { useTranslation } from 'react-i18next';
 import { LocalizedRenderEmpty } from '@components/templates/LocalizedRenderEmpty';
@@ -14,10 +14,12 @@ interface WalletAssetsProps {
  loading: boolean;
  error: boolean;
  account: ExplorerAccount;
+ isRefreshing?: boolean;
+ onRefresh?: () => unknown;
 }
 
 export const WalletAssets = (props: WalletAssetsProps): JSX.Element => {
- const { tokens, loading, account, error } = props;
+ const { tokens, loading, account, error, isRefreshing, onRefresh } = props;
  const navigation = useNavigation<HomeNavigationProp>();
 
  const { t } = useTranslation();
@@ -64,6 +66,12 @@ export const WalletAssets = (props: WalletAssetsProps): JSX.Element => {
  }
  contentContainerStyle={{ paddingBottom: '20%' }}
  showsVerticalScrollIndicator={false}
+ refreshControl={
+ <RefreshControl
+ onRefresh={onRefresh}
+ refreshing={Boolean(isRefreshing)}
+ />
+ }
  />
  )}
  </View>

src/components/templates/WalletTransactionsAndAssets/index.tsx

@@ -37,8 +37,6 @@ export const WalletTransactionsAndAssets = (
  return (
  <View style={{ flex: 1 }}>
  <AnimatedTabs
- onRefresh={refetchAssets}
- isRefreshing={refetching}
  tabs={[
  {
  title: t('wallet.my.assets'),
@@ -48,6 +46,8 @@ export const WalletTransactionsAndAssets = (
  loading={loading}
  account={account}
  error={error}
+ onRefresh={refetchAssets}
+ isRefreshing={refetching}
  />
  )
  },
@@ -57,7 +57,9 @@ export const WalletTransactionsAndAssets = (
  <AccountTransactions
  transactions={transactions}
  loading={loading}
+ isRefreshing={refetching}
  onEndReached={loadMoreTransactions}
+ onRefresh={refetchAssets}
  />
  )
  }

src/contexts/Passcode/index.tsx

@@ -6,7 +6,7 @@ import React, {
  useEffect,
  useState
 } from 'react';
-import { View } from 'react-native';
+import { Alert, View } from 'react-native';
 import * as LocalAuthentication from 'expo-local-authentication';
 import { useTranslation } from 'react-i18next';
 import { Toast, ToastPosition, ToastType } from '@components/modular/Toast';
@@ -89,6 +89,8 @@ export const PasscodeProvider: FC<{ children: React.ReactNode }> = ({
  if (result.success) {
  await PasscodeUtils.setFaceIDStatusInDB(true);
  setIsFaceIDEnabled(true);
+ } else {
+ Alert.alert(result.error, result.success || '');
  }
  } else {
  // show error otherwise

src/screens/SendFunds/screens/SendFundsStatus/index.tsx

@@ -59,7 +59,7 @@ export const SendFundsStatus = () => {
  };
 
  const navigateToHome = () => {
- navigation.replace('HomeScreen');
+ navigation.popToTop();
  reducer({ type: 'RESET_DATA' });
  };
  return (

src/screens/Settings/Settings.tsx

@@ -78,7 +78,7 @@ export const SettingsScreen = () => {
  <View style={styles.innerContainer}>
  {SETTINGS_MENU_ITEMS.map(renderMenu)}
  </View>
- {isStage && <Text style={{ margin: 20 }}>Build: 1.1.0.3</Text>}
+ {isStage && <Text style={{ margin: 20 }}>Build: 1.1.0.4</Text>}
  </View>
  );
 };

src/screens/Settings/screens/SecuritySettings/index.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { StyleSheet, View } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import * as LocalAuthentication from 'expo-local-authentication';
@@ -12,12 +12,49 @@ import { COLORS } from '@constants/colors';
 import { SettingsTabNavigationProp } from '@appTypes';
 import { useSupportedBiometrics } from '@hooks';
 import usePasscode from '@contexts/Passcode';
+import { Cache, CacheKey } from '@lib/cache';
 
 export const SecuritySettingsScreen = () => {
  const { t } = useTranslation();
  const supportedBiometrics = useSupportedBiometrics();
- const { toggleBiometricAuthentication, isFaceIDEnabled } = usePasscode();
+ const {
+ toggleBiometricAuthentication,
+ isFaceIDEnabled,
+ isPasscodeEnabled,
+ savedPasscode
+ } = usePasscode();
  const navigation = useNavigation<SettingsTabNavigationProp>();
+ const [hasHardware, setHasHardware] = useState(false);
+ const [isEnrolled, setIsEnrolled] = useState(false);
+ const [isSetupSecurityInProgress, setIsSetupSecurityInProgress] =
+ useState(false);
+ const [
+ isBiometricAuthenticationInProgress,
+ setIsBiometricAuthenticationInProgress
+ ] = useState(false);
+
+ const checkHardware = async () => {
+ // check if device has biometric hardware
+ const hasHardware = await LocalAuthentication.hasHardwareAsync();
+ // device has registered biometrics data, either fingerprint or face id
+ const isEnrolled = await LocalAuthentication.isEnrolledAsync();
+ const isSetupSecurityInProgress = await Cache.getItem(
+ CacheKey.isSetupSecurityInProgress
+ );
+ const isBiometricAuthenticationInProgress = await Cache.getItem(
+ CacheKey.isBiometricAuthenticationInProgress
+ );
+ setHasHardware(hasHardware);
+ setIsEnrolled(isEnrolled);
+ setIsSetupSecurityInProgress(Boolean(isSetupSecurityInProgress));
+ setIsBiometricAuthenticationInProgress(
+ Boolean(isBiometricAuthenticationInProgress)
+ );
+ };
+
+ useEffect(() => {
+ checkHardware();
+ }, []);
 
  const navigateToChangePasscode = useCallback(() => {
  navigation.navigate('ChangePasscode');
@@ -76,6 +113,40 @@ export const SecuritySettingsScreen = () => {
  </Row>
  </View>
  )}
+ <View style={{ paddingHorizontal: 24 }}>
+ <Row alignItems="center" justifyContent="space-between">
+ <Text>Face id enabled</Text>
+ <Text>{String(isFaceIDEnabled)}</Text>
+ </Row>
+ <Row alignItems="center" justifyContent="space-between">
+ <Text>Passcode enabled</Text>
+ <Text>{String(isPasscodeEnabled)}</Text>
+ </Row>
+ <Row alignItems="center" justifyContent="space-between">
+ <Text>Saved passcode</Text>
+ <Text>{savedPasscode?.length}</Text>
+ </Row>
+ <Row alignItems="center" justifyContent="space-between">
+ <Text>Biometrics</Text>
+ <Text>{supportedBiometrics.join(',')}</Text>
+ </Row>
+ <Row alignItems="center" justifyContent="space-between">
+ <Text>Has hardware</Text>
+ <Text>{String(hasHardware)}</Text>
+ </Row>
+ <Row alignItems="center" justifyContent="space-between">
+ <Text>Is enrolled</Text>
+ <Text>{String(isEnrolled)}</Text>
+ </Row>
+ <Row alignItems="center" justifyContent="space-between">
+ <Text>Biometric auth in progress</Text>
+ <Text>{String(isBiometricAuthenticationInProgress)}</Text>
+ </Row>
+ <Row alignItems="center" justifyContent="space-between">
+ <Text>Setup security progress</Text>
+ <Text>{String(isSetupSecurityInProgress)}</Text>
+ </Row>
+ </View>
  </SafeAreaView>
  );
 };