Remove Text as any occurrences (MetaMask#5430)

app/components/Base/Alert.tsx

@@ -10,10 +10,8 @@ import {
   TextStyle,
 } from 'react-native';
 import IonicIcon from 'react-native-vector-icons/Ionicons';
-import CustomText from './Text';
+import Text from './Text';
 import { useTheme } from '../../util/theme';
-// TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
 
 export enum AlertType {
   Info = 'Info',

app/components/Base/Title/Title.tsx

@@ -4,8 +4,8 @@ import { useTheme } from '../../../util/theme';
 import styles from './Title.styles';
 
 interface TitleProps extends React.ComponentPropsWithoutRef<typeof Text> {
-  centered: boolean;
-  hero: boolean;
+  centered?: boolean;
+  hero?: boolean;
 }
 
 const Title: React.FC<TitleProps> = ({

app/components/UI/FiatOnRampAggregator/Views/AmountToBuy.tsx

@@ -20,7 +20,7 @@ import useRegions from '../hooks/useRegions';
 import useAnalytics from '../hooks/useAnalytics';
 
 import useModalHandler from '../../../Base/hooks/useModalHandler';
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import BaseListItem from '../../../Base/ListItem';
 import BaseSelectorButton from '../../../Base/SelectorButton';
 import StyledButton from '../../StyledButton';
@@ -58,7 +58,6 @@ import { formatAmount } from '../utils';
 import { createGetQuotesNavDetails } from './GetQuotes';
 
 // TODO: Convert into typescript and correctly type
-const Text = BaseText as any;
 const ListItem = BaseListItem as any;
 const SelectorButton = BaseSelectorButton as any;
 

app/components/UI/FiatOnRampAggregator/Views/GetQuotes.tsx

@@ -30,7 +30,7 @@ import ErrorViewWithReporting from '../components/ErrorViewWithReporting';
 import InfoAlert from '../components/InfoAlert';
 import SkeletonText from '../components/SkeletonText';
 import Box from '../components/Box';
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import StyledButton from '../../StyledButton';
 import BaseListItem from '../../../Base/ListItem';
 import { getFiatOnRampAggNavbar } from '../../Navbar';
@@ -52,7 +52,6 @@ import Routes from '../../../../constants/navigation/Routes';
 import { createCheckoutNavDetails } from './Checkout';
 
 // TODO: Convert into typescript and correctly type
-const Text = BaseText as any;
 const ListItem = BaseListItem as any;
 
 interface GetQuotesParams {

app/components/UI/FiatOnRampAggregator/Views/GetStarted/GetStarted.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect } from 'react';
 import { Image, View, ScrollView } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
-import TextJS from '../../../../Base/Text';
+import Text from '../../../../Base/Text';
 import StyledButton from '../../../StyledButton';
 import ScreenLayout from '../../components/ScreenLayout';
 import { getFiatOnRampAggNavbar } from '../../../Navbar';
@@ -18,9 +18,6 @@ import { createRegionNavDetails } from '../Region';
 /* eslint-disable import/no-commonjs, @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports */
 const getStartedIcon = require('../../components/images/WalletInfo.png');
 
-// TODO: Convert into typescript and correctly type optionals
-const Text = TextJS as any;
-
 const GetStarted: React.FC = () => {
   const navigation = useNavigation();
   const {

app/components/UI/FiatOnRampAggregator/Views/PaymentMethods.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect } from 'react';
 import { View, StyleSheet, ScrollView } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import ScreenLayout from '../components/ScreenLayout';
 import PaymentMethod from '../components/PaymentMethod';
 import { useFiatOnRampSDK } from '../sdk';
@@ -25,7 +25,6 @@ import {
 } from '../../../../util/navigation/navUtils';
 import { createAmountToBuyNavDetails } from './AmountToBuy';
 // TODO: Convert into typescript and correctly type
-const Text = BaseText as any;
 const ListItem = BaseListItem as any;
 
 interface PaymenthMehodsParams {

app/components/UI/FiatOnRampAggregator/Views/Region.tsx

@@ -2,7 +2,7 @@ import React, { useCallback, useEffect } from 'react';
 import { View, TouchableOpacity, StyleSheet } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import FontAwesome from 'react-native-vector-icons/FontAwesome';
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import BaseListItem from '../../../Base/ListItem';
 import useModalHandler from '../../../Base/hooks/useModalHandler';
 import ScreenLayout from '../components/ScreenLayout';
@@ -24,7 +24,6 @@ import { createNavigationDetails } from '../../../../util/navigation/navUtils';
 import { createPaymentMethodsNavDetails } from './PaymentMethods';
 
 // TODO: Convert into typescript and correctly type
-const Text = BaseText as any;
 const ListItem = BaseListItem as any;
 
 const styles = StyleSheet.create({

app/components/UI/FiatOnRampAggregator/components/Account.tsx

@@ -2,13 +2,12 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import EthereumAddress from '../../EthereumAddress';
 import JSIdenticon from '../../Identicon';
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import { View, StyleSheet } from 'react-native';
 import { useTheme } from '../../../../util/theme';
 import { Colors } from '../../../../util/theme/models';
 import { colors as importedColors } from '../../../../styles/common';
 // TODO: Convert into typescript and correctly type
-const Text = BaseText as any;
 const Identicon = JSIdenticon as any;
 
 const createStyles = (colors: Colors) =>

app/components/UI/FiatOnRampAggregator/components/AccountSelector.tsx

@@ -6,12 +6,11 @@ import { useDispatch, useSelector } from 'react-redux';
 import { toggleAccountsModal } from '../../../../actions/modals';
 import EthereumAddress from '../../EthereumAddress';
 import JSIdenticon from '../../Identicon';
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import JSSelectorButton from '../../../Base/SelectorButton';
 
 // TODO: Convert into typescript and correctly type
 const SelectorButton = JSSelectorButton as any;
-const Text = BaseText as any;
 const Identicon = JSIdenticon as any;
 
 const styles = StyleSheet.create({

app/components/UI/FiatOnRampAggregator/components/AmountInput.tsx

@@ -2,11 +2,10 @@ import React from 'react';
 import { StyleSheet, TouchableOpacity } from 'react-native';
 import Box from './Box';
 import BaseListItem from '../../../Base/ListItem';
-import CustomText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import CurrencyChevron from './CurrencyChevron';
 
 // TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
 const ListItem = BaseListItem as any;
 
 const styles = StyleSheet.create({

app/components/UI/FiatOnRampAggregator/components/ApplePayButton.tsx

@@ -2,17 +2,14 @@ import React from 'react';
 import { Image, StyleSheet } from 'react-native';
 import { colors as importedColors } from '../../../../styles/common';
 import { useAssetFromTheme } from '../../../../util/theme';
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import StyledButton from '../../StyledButton';
 
 /* eslint-disable import/no-commonjs, @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports */
 const ApplePayLogoLight = require('../../../../images/ApplePayLogo-light.png');
 const ApplePayLogoDark = require('../../../../images/ApplePayLogo-dark.png');
 /* eslint-enable import/no-commonjs, @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports */
 
-// TODO: Convert into typescript and correctly type
-const Text = BaseText as any;
-
 const styles = StyleSheet.create({
   applePayButton: {
     padding: 12,

app/components/UI/FiatOnRampAggregator/components/AssetSelectorButton.tsx

@@ -3,12 +3,11 @@ import { StyleSheet, View } from 'react-native';
 import Box from './Box';
 
 import BaseListItem from '../../../Base/ListItem';
-import CustomText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 
 import CurrencyChevron from './CurrencyChevron';
 
 // TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
 const ListItem = BaseListItem as any;
 
 const styles = StyleSheet.create({

app/components/UI/FiatOnRampAggregator/components/Box.tsx

@@ -8,9 +8,7 @@ import {
 } from 'react-native';
 import { useTheme } from '../../../../util/theme';
 import { Colors } from '../../../../util/theme/models';
-import CustomText from '../../../Base/Text';
-// TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
+import Text from '../../../Base/Text';
 
 const createStyles = (colors: Colors) =>
   StyleSheet.create({

app/components/UI/FiatOnRampAggregator/components/CurrencyChevron.tsx

@@ -1,13 +1,10 @@
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
 import Entypo from 'react-native-vector-icons/Entypo';
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import { useTheme } from '../../../../util/theme';
 import { Colors } from '../../../../util/theme/models';
 
-// TODO: Convert into typescript and correctly type optionals
-const Text = BaseText as any;
-
 const createStyles = (colors: Colors) =>
   StyleSheet.create({
     chevron: {

app/components/UI/FiatOnRampAggregator/components/CustomActionButton.tsx

@@ -7,9 +7,7 @@ import {
 import { useAssetFromTheme } from '../../../../util/theme';
 import StyledButton from '../../StyledButton';
 import RemoteImage from '../../../Base/RemoteImage';
-import CustomText from '../../../Base/Text';
-// TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
+import Text from '../../../Base/Text';
 
 interface Props {
   customActionButton: PaymentCustomActionButton;

app/components/UI/FiatOnRampAggregator/components/ErrorView.tsx

@@ -1,20 +1,16 @@
 import React, { useCallback, useEffect } from 'react';
 import { View, StyleSheet } from 'react-native';
 import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
-import BaseTitle from '../../../Base/Title';
 import { useTheme } from '../../../../util/theme';
-import BaseText from '../../../Base/Text';
+import Title from '../../../Base/Title';
+import Text from '../../../Base/Text';
 import StyledButton from '../../StyledButton';
 import { strings } from '../../../../../locales/i18n';
 import { Colors } from '../../../../util/theme/models';
 import { ScreenLocation } from '../types';
 import useAnalytics from '../hooks/useAnalytics';
 import { useFiatOnRampSDK } from '../sdk';
 
-// TODO: Convert into typescript and correctly type
-const Text = BaseText as any;
-const Title = BaseTitle as any;
-
 type IconType = 'error' | 'info';
 
 const createStyles = (colors: Colors) =>

app/components/UI/FiatOnRampAggregator/components/InfoAlert.tsx

@@ -5,8 +5,8 @@ import { QuoteResponse } from '@consensys/on-ramp-sdk';
 import IonicIcon from 'react-native-vector-icons/Ionicons';
 
 import Box from '../components/Box';
-import CustomText from '../../../Base/Text';
-import CustomTitle from '../../../Base/Title';
+import Text from '../../../Base/Text';
+import Title from '../../../Base/Title';
 import RemoteImage from '../../../Base/RemoteImage';
 import { useAssetFromTheme, useTheme } from '../../../../util/theme';
 import { strings } from '../../../../../locales/i18n';
@@ -15,9 +15,6 @@ import useAnalytics from '../hooks/useAnalytics';
 
 type Logos = QuoteResponse['provider']['logos'];
 
-const Text = CustomText as any;
-const Title = CustomTitle as any;
-
 const LOGO_SIZE = 1;
 
 const createStyles = (colors: Colors) =>

app/components/UI/FiatOnRampAggregator/components/OrderDetails.tsx

@@ -9,7 +9,7 @@ import {
 import Feather from 'react-native-vector-icons/Feather';
 import { Order, OrderStatusEnum } from '@consensys/on-ramp-sdk';
 import Box from './Box';
-import CustomText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import BaseListItem from '../../../Base/ListItem';
 import { toDateFormat } from '../../../../util/date';
 import { useTheme } from '../../../../util/theme';
@@ -31,7 +31,6 @@ import { FIAT_ORDER_STATES } from '../../../../constants/on-ramp';
 const failedIcon = require('./images/TransactionIcon_Failed.png');
 
 // TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
 const ListItem = BaseListItem as any;
 
 const createStyles = (colors: any) =>

app/components/UI/FiatOnRampAggregator/components/PaymentMethod.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { StyleSheet, View } from 'react-native';
 import Box from './Box';
 import Feather from 'react-native-vector-icons/Feather';
-import CustomText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import BaseListItem from '../../../Base/ListItem';
 import { strings } from '../../../../../locales/i18n';
 import { TimeDescriptions, timeToDescription } from '../utils';
@@ -12,7 +12,6 @@ import PaymentMethodBadges from './PaymentMethodBadges';
 import { Payment } from '@consensys/on-ramp-sdk';
 import PaymentMethodIcon from './PaymentMethodIcon';
 // TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
 const ListItem = BaseListItem as any;
 
 interface Props {

app/components/UI/FiatOnRampAggregator/components/PaymentMethodModal.tsx

@@ -3,7 +3,7 @@ import { StyleSheet, SafeAreaView, View, ScrollView } from 'react-native';
 import Modal from 'react-native-modal';
 import { Payment, PaymentType } from '@consensys/on-ramp-sdk';
 
-import BaseText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import ScreenLayout from './ScreenLayout';
 import ModalDragger from '../../../Base/ModalDragger';
 import PaymentMethod from './PaymentMethod';
@@ -13,9 +13,6 @@ import { useTheme } from '../../../../util/theme';
 import { Colors } from '../../../../util/theme/models';
 import { ScreenLocation } from '../types';
 
-// TODO: Convert into typescript and correctly type
-const Text = BaseText as any;
-
 const createStyles = (colors: Colors) =>
   StyleSheet.create({
     modal: {

app/components/UI/FiatOnRampAggregator/components/PaymentMethodSelector.tsx

@@ -5,11 +5,11 @@ import Entypo from 'react-native-vector-icons/Entypo';
 import { useTheme } from '../../../../util/theme';
 
 import ListItemBase from '../../../Base/ListItem';
-import TextBase from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import { Colors } from '../../../../util/theme/models';
 
+// TODO: Convert into typescript and correctly type
 const ListItem = ListItemBase as any;
-const Text = TextBase as any;
 
 const createStyles = (colors: Colors) =>
   StyleSheet.create({

app/components/UI/FiatOnRampAggregator/components/QuickAmounts.tsx

@@ -2,10 +2,7 @@ import React, { useCallback } from 'react';
 import { ScrollView, StyleSheet, TouchableOpacity, View } from 'react-native';
 import { useTheme } from '../../../../util/theme';
 import { Colors } from '../../../../util/theme/models';
-import CustomText from '../../../Base/Text';
-
-// TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
+import Text from '../../../Base/Text';
 
 const INSET = 25;
 const createStyles = (colors: Colors) =>

app/components/UI/FiatOnRampAggregator/components/Quote.tsx

@@ -17,8 +17,8 @@ import Animated, {
 } from 'react-native-reanimated';
 import { QuoteResponse } from '@consensys/on-ramp-sdk';
 import Box from './Box';
-import CustomText from '../../../Base/Text';
-import CustomTitle from '../../../Base/Title';
+import Text from '../../../Base/Text';
+import Title from '../../../Base/Title';
 import BaseListItem from '../../../Base/ListItem';
 import StyledButton from '../../StyledButton';
 import {
@@ -34,8 +34,6 @@ import RemoteImage from '../../../Base/RemoteImage';
 import { Colors } from '../../../../util/theme/models';
 
 // TODO: Convert into typescript and correctly type optionals
-const Text = CustomText as any;
-const Title = CustomTitle as any;
 const ListItem = BaseListItem as any;
 
 const createStyles = (colors: Colors) =>

app/components/UI/FiatOnRampAggregator/components/RegionAlert.tsx

@@ -1,15 +1,12 @@
 import React, { useCallback } from 'react';
 import { Linking, StyleSheet, TouchableOpacity, View } from 'react-native';
 import Modal from 'react-native-modal';
-import CustomText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import EvilIcons from 'react-native-vector-icons/EvilIcons';
 import Box from '../components/Box';
 import { useTheme } from '../../../../util/theme';
 import { Colors } from '../../../../util/theme/models';
 
-// TODO: Convert into typescript and correctly type
-const Text = CustomText as any;
-
 const createStyles = (colors: Colors) =>
   StyleSheet.create({
     box: {

app/components/UI/FiatOnRampAggregator/components/RegionModal.tsx

@@ -16,7 +16,7 @@ import { strings } from '../../../../../locales/i18n';
 import { fontStyles } from '../../../../styles/common';
 import ScreenLayout from './ScreenLayout';
 import Feather from 'react-native-vector-icons/Feather';
-import CustomText from '../../../Base/Text';
+import Text from '../../../Base/Text';
 import BaseListItem from '../../../Base/ListItem';
 import ModalDragger from '../../../Base/ModalDragger';
 import { useTheme } from '../../../../util/theme';
@@ -25,7 +25,7 @@ import { Colors } from '../../../../util/theme/models';
 import { Region, ScreenLocation } from '../types';
 import useAnalytics from '../hooks/useAnalytics';
 
-const Text = CustomText as any;
+// TODO: Convert into typescript and correctly type
 const ListItem = BaseListItem as any;
 
 const MAX_REGION_RESULTS = 20;