[RN] i18n more strings and fix fontFamily (#1818)

iketw · IDubuque · commit 3b254e7e9064 · 2023-10-31T16:06:44.000-07:00
diff --git a/packages/react-native/src/evm/components/ConnectWalletDetails/ConnectAppField.tsx b/packages/react-native/src/evm/components/ConnectWalletDetails/ConnectAppField.tsx
@@ -13,9 +13,11 @@ import { WalletIcon } from "../base/WalletIcon";
 import WalletConnectIcon from "../../assets/wallet-connect";
 import QrCodeIcon from "../../assets/qr-code";
 import { QRCodeScan } from "./QRCodeScan";
+import { useLocale } from "../../providers/ui-context-provider";
 
 const ConnectAppField = () => {
   const theme = useTheme();
+  const l = useLocale();
   const [showWCInput, setShowWCInput] = useState(false);
   const [wcUri, setWCUri] = useState<string | undefined>();
   const [appMeta, setAppMeta] = useState<{ name: string; iconUrl: string }>();
@@ -132,7 +134,7 @@ const ConnectAppField = () => {
               numberOfLines: 1,
               style: {
                 color: theme.colors.textPrimary,
-                fontFamily: theme.textVariants.defaults.fontFamily,
+                // fontFamily: theme.textVariants.defaults.fontFamily,
               },
             }}
             containerProps={{
@@ -181,7 +183,7 @@ const ConnectAppField = () => {
             )}
             <View style={styles.exportWalletInfo}>
               <Text variant="bodySmall" numberOfLines={1}>
-                {appMeta ? appMeta.name : "Connect app"}
+                {appMeta ? appMeta.name : l.common.connect_app}
               </Text>
             </View>
           </>
diff --git a/packages/react-native/src/evm/components/ConnectWalletFlow/ChooseWallet/ChooseWallet.tsx b/packages/react-native/src/evm/components/ConnectWalletFlow/ChooseWallet/ChooseWallet.tsx
@@ -188,7 +188,7 @@ export function ChooseWallet({
         >
           <Box height={1} flex={1} backgroundColor="border" />
           <Text variant="subHeader" textAlign="center" marginHorizontal="xxs">
-            OR
+            {l.common.or}
           </Text>
           <Box height={1} flex={1} backgroundColor="border" />
         </Box>
diff --git a/packages/react-native/src/evm/components/ConnectWalletFlow/LocalWalletImportModal.tsx b/packages/react-native/src/evm/components/ConnectWalletFlow/LocalWalletImportModal.tsx
@@ -211,7 +211,7 @@ export const LocalWalletImportModal = ({
               onChangeText: onPrivateKeyEntered,
               style: {
                 color: theme.colors.textPrimary,
-                fontFamily: theme.textVariants.defaults.fontFamily,
+                // fontFamily: theme.textVariants.defaults.fontFamily,
               },
             }}
             containerProps={{ pl: "xxs" }}
diff --git a/packages/react-native/src/evm/components/PasswordInput.tsx b/packages/react-native/src/evm/components/PasswordInput.tsx
@@ -31,7 +31,7 @@ export const PasswordInput = ({
         style={{
           ...styles.textInput,
           color: theme.colors.textPrimary,
-          fontFamily: theme.textVariants.defaults.fontFamily,
+          // fontFamily: theme.textVariants.defaults.fontFamily,
         }}
         secureTextEntry={!showPassword}
         textContentType="none"
diff --git a/packages/react-native/src/evm/components/SendFunds/SendButton.tsx b/packages/react-native/src/evm/components/SendFunds/SendButton.tsx
@@ -289,7 +289,7 @@ const SendFundsForm = ({
           onChangeText={setReceiverAddress}
           style={{
             color: theme.colors.textPrimary,
-            fontFamily: theme.textVariants.defaults.fontFamily,
+            // fontFamily: theme.textVariants.defaults.fontFamily,
             textAlign: "left",
             flex: 1,
             height: 40,
@@ -323,7 +323,7 @@ const SendFundsForm = ({
           clearTextOnFocus={false}
           style={{
             color: theme.colors.textPrimary,
-            fontFamily: theme.textVariants.defaults.fontFamily,
+            // fontFamily: theme.textVariants.defaults.fontFamily,
             textAlign: "left",
             flex: 1,
             height: 40,
diff --git a/packages/react-native/src/evm/components/SendFunds/TokenSelector.tsx b/packages/react-native/src/evm/components/SendFunds/TokenSelector.tsx
@@ -141,7 +141,7 @@ export function TokenSelector(props: {
             onChangeText={setInput}
             style={{
               color: theme.colors.textPrimary,
-              fontFamily: theme.textVariants.defaults.fontFamily,
+              // fontFamily: theme.textVariants.defaults.fontFamily,
               textAlign: "left",
               flex: 1,
               height: 40,
diff --git a/packages/react-native/src/evm/i18n/types.ts b/packages/react-native/src/evm/i18n/types.ts
@@ -77,12 +77,14 @@ export const _en = {
     request_new_code: "Request new code",
     sign_in: "Sign In",
     sign_in_google: "Sign in with Google",
+    enter_your_email: "Enter your email address",
   },
   wallet_connect: {
     no_results_found: "No results found",
     search_wallets: "Search Wallets",
   },
   common: {
+    connect_app: "Connect app",
     unknown_network: "Unknown Network",
     fetching: "Fetching...",
     password: "Password",
diff --git a/packages/react-native/src/evm/styles/textVariants.ts b/packages/react-native/src/evm/styles/textVariants.ts
@@ -1,13 +1,11 @@
-import { Platform } from "react-native";
-
 export const textVariants = {
-  defaults: {
-    fontFamily: Platform.OS === "ios" ? "san Francisco" : "Roboto",
-    fontSize: 24,
-    fontWeight: "700",
-    lineHeight: 32,
-    color: "textPrimary",
-  },
+  // defaults: {
+  //   fontFamily: "ShopifySans", //Platform.OS === "ios" ? "San Francisco" : "Roboto",
+  //   fontSize: 24,
+  //   fontWeight: "700",
+  //   lineHeight: 32,
+  //   color: "textPrimary",
+  // },
   header: {
     fontSize: 24,
     fontWeight: "600",
diff --git a/packages/react-native/src/evm/wallets/wallets/embedded/EmbeddedSelectionUI.tsx b/packages/react-native/src/evm/wallets/wallets/embedded/EmbeddedSelectionUI.tsx
@@ -120,7 +120,7 @@ export const EmailSelectionUI: React.FC<
                 textAlign="center"
                 marginHorizontal="xxs"
               >
-                OR
+                {l.common.or}
               </Text>
               <Box height={1} flex={1} backgroundColor="border" />
             </Box>
@@ -131,13 +131,13 @@ export const EmailSelectionUI: React.FC<
         <>
           <TextInput
             textInputProps={{
-              placeholder: "Enter your email address",
+              placeholder: l.embedded_wallet.enter_your_email,
               placeholderTextColor: theme.colors.textSecondary,
               onChangeText: setEmailInput,
               style: {
                 fontSize: 14,
                 color: theme.colors.textPrimary,
-                fontFamily: theme.textVariants.defaults.fontFamily,
+                // fontFamily: theme.textVariants.defaults.fontFamily,
                 lineHeight: 16,
                 padding: 0,
                 flex: 1,
diff --git a/packages/react-native/src/evm/wallets/wallets/magic-link.tsx b/packages/react-native/src/evm/wallets/wallets/magic-link.tsx
@@ -69,15 +69,15 @@ const MagicSelectionUI: React.FC<SelectUIProps<MagicLink>> = (props) => {
     <Box paddingHorizontal="xl" mt="lg">
       <TextInput
         textInputProps={{
-          placeholder: "Enter your email address",
+          placeholder: l.embedded_wallet.enter_your_email,
           placeholderTextColor: theme.colors.textSecondary,
           onChangeText: (text: string) => {
             setEmail(text);
           },
           style: {
             fontSize: 14,
             color: theme.colors.textPrimary,
-            fontFamily: theme.textVariants.defaults.fontFamily,
+            // fontFamily: theme.textVariants.defaults.fontFamily,
             lineHeight: 16,
             padding: 0,
           },
diff --git a/packages/react-native/src/evm/wallets/wallets/wallet-connect/WalletConnectUI.tsx b/packages/react-native/src/evm/wallets/wallets/wallet-connect/WalletConnectUI.tsx
@@ -198,7 +198,7 @@ export function WalletConnectUI({
                       style={{
                         ...styles.textInput,
                         color: theme.colors.textSecondary,
-                        fontFamily: theme.textVariants.defaults.fontFamily,
+                        // fontFamily: theme.textVariants.defaults.fontFamily,
                       }}
                     />
                   </Box>

Original file line number	Diff line number	Diff line change
`@@ -188,7 +188,7 @@ export function ChooseWallet({`
`188`	`188`	`>`
`189`	`189`	`<Box height={1} flex={1} backgroundColor="border" />`
`190`	`190`	`<Text variant="subHeader" textAlign="center" marginHorizontal="xxs">`
`191`		`- OR`
	`191`	`+ {l.common.or}`
`192`	`192`	`</Text>`
`193`	`193`	`<Box height={1} flex={1} backgroundColor="border" />`
`194`	`194`	`</Box>`