translations

packages/react-native/src/evm/components/ConnectWallet.tsx

@@ -14,7 +14,7 @@ import { ConnectWalletButton } from "./ConnectWalletFlow/ConnectWalletButton";
 import { ConnectWalletButtonProps } from "./ConnectWalletFlow/ConnectWalletButton";
 import BaseButton from "./base/BaseButton";
 import Text from "./base/Text";
-import { useUIContext } from "../providers/ui-context-provider";
+import { useLocale, useUIContext } from "../providers/ui-context-provider";
 import { ThemeProvider } from "../styles/ThemeProvider";
 import { SupportedTokens, defaultTokens } from "./SendFunds/defaultTokens";
 
@@ -81,6 +81,7 @@ export const ConnectWallet = ({
   privacyPolicyUrl,
   supportedTokens,
 }: ConnectWalletProps) => {
+  const l = useLocale();
   const fadeAnim = useRef(new Animated.Value(0)).current;
   const address = useAddress();
   const isNetworkMismatch = useNetworkMismatch();
@@ -142,7 +143,7 @@ export const ConnectWallet = ({
                 <ActivityIndicator size="small" color="buttonTextColor" />
               ) : (
                 <Text variant="bodyLarge" color="buttonTextColor">
-                  Switch Network
+                  {l.common.switch_network}
                 </Text>
               )}
             </BaseButton>

packages/react-native/src/evm/components/ConnectWalletDetails/ConnectWalletDetailsModal.tsx

@@ -29,6 +29,7 @@ import { SendButton } from "../SendFunds/SendButton";
 import { SupportedTokens } from "../SendFunds/defaultTokens";
 import { ActiveDot } from "../base";
 import { EmbeddedWallet } from "../../wallets/wallets/embedded/EmbeddedWallet";
+import { useLocale } from "../../providers/ui-context-provider";
 
 const MODAL_HEIGHT = Dimensions.get("window").height * 0.7;
 const DEVICE_WIDTH = Dimensions.get("window").width;
@@ -50,6 +51,7 @@ export const ConnectWalletDetailsModal = ({
   supportedTokens: SupportedTokens;
   displayBalanceToken?: Record<number, string>;
 }) => {
+  const l = useLocale();
   const [isExportModalVisible, setIsExportModalVisible] = useState(false);
   const activeWallet = useWallet();
   const chain = useChain();
@@ -137,7 +139,9 @@ export const ConnectWalletDetailsModal = ({
       return (
         <>
           <View style={styles.currentNetwork}>
-            <Text variant="bodySmallSecondary">Additional Actions</Text>
+            <Text variant="bodySmallSecondary">
+              {l.connect_wallet_details.additional_actions}
+            </Text>
           </View>
           <BaseButton
             backgroundColor="background"
@@ -152,7 +156,9 @@ export const ConnectWalletDetailsModal = ({
             <>
               <PocketWalletIcon width={16} height={16} />
               <View style={styles.exportWalletInfo}>
-                <Text variant="bodySmall">Backup wallet</Text>
+                <Text variant="bodySmall">
+                  {l.connect_wallet_details.backup_wallet}
+                </Text>
               </View>
             </>
             <RightArrowIcon height={10} width={10} />
@@ -171,7 +177,9 @@ export const ConnectWalletDetailsModal = ({
             <>
               <PocketWalletIcon width={16} height={16} />
               <View style={styles.exportWalletInfo}>
-                <Text variant="bodySmall">Import wallet</Text>
+                <Text variant="bodySmall">
+                  {l.connect_wallet_details.import_wallet}
+                </Text>
               </View>
             </>
             <RightArrowIcon height={10} width={10} />
@@ -201,6 +209,7 @@ export const ConnectWalletDetailsModal = ({
     onExportLocalWalletPress,
     onWalletImported,
     smartWallet,
+    l,
   ]);
 
   return (
@@ -234,7 +243,7 @@ export const ConnectWalletDetailsModal = ({
                 <Box flexDirection="row" alignItems="center">
                   <ActiveDot width={10} height={10} />
                   <Text variant="bodySmallSecondary" ml="xxs">
-                    Connected to a Smart Wallet
+                    {l.connect_wallet_details.connected_to_smart_wallet}
                   </Text>
                 </Box>
                 {isSmartWalletDeployed ? (
@@ -260,13 +269,15 @@ export const ConnectWalletDetailsModal = ({
               <ReceiveButton />
             </Box>
             <View style={styles.currentNetwork}>
-              <Text variant="bodySmallSecondary">Current Network</Text>
+              <Text variant="bodySmallSecondary">
+                {l.connect_wallet_details.current_network}
+              </Text>
             </View>
             <NetworkButton chain={chain} enableSwitchModal={true} />
             {!hideTestnetFaucet && chain?.testnet && chain?.faucets?.length ? (
               <IconTextButton
                 mt="xs"
-                text="Request Testnet Funds"
+                text={l.connect_wallet_details.request_testnet_funds}
                 icon={<MoneyIcon height={16} width={16} />}
                 onPress={() => {
                   if (chain?.faucets?.[0]) {
@@ -278,7 +289,7 @@ export const ConnectWalletDetailsModal = ({
             {chain?.explorers && chain?.explorers?.[0] && (
               <IconTextButton
                 mt="xs"
-                text="View Transaction History"
+                text={l.connect_wallet_details.view_transaction_history}
                 icon={<TransactionIcon height={16} width={16} />}
                 onPress={() => {
                   Linking.openURL(

packages/react-native/src/evm/components/ConnectWalletDetails/ExportLocalWalletModal.tsx

@@ -18,6 +18,7 @@ import { usePersonalWalletAddress } from "../../wallets/hooks/usePersonalWalletA
 import { shortenWalletAddress } from "../../utils/addresses";
 import { LocalWallet } from "../../wallets/wallets/LocalWallet";
 import { TWModal } from "../base/modal/TWModal";
+import { useLocale } from "../../providers/ui-context-provider";
 
 export type ExportLocalWalletModalProps = {
   isVisible: boolean;
@@ -28,6 +29,7 @@ export const ExportLocalWalletModal = ({
   isVisible,
   onClose,
 }: ExportLocalWalletModalProps) => {
+  const l = useLocale();
   const [password, setPassword] = useState<string | undefined>();
   const [error, setError] = useState<string | undefined>();
   const [isExporting, setIsExporting] = useState<boolean>(false);
@@ -154,20 +156,18 @@ export const ExportLocalWalletModal = ({
             headerText="Backup your Wallet"
           />
           <Text variant="subHeader" mt="md" textAlign="left">
-            {
-              "This will download a JSON file containing your wallet information onto your device encrypted with the password."
-            }
+            {l.local_wallet.this_will_download_json}
           </Text>
           <Text variant="bodySmall" textAlign="left" mt="lg" mb="xxs">
-            Wallet Address
+            {l.local_wallet.wallet_address}
           </Text>
           <Text variant="bodySmallSecondary">
             {shortenWalletAddress(
               personalWalletAddress ? personalWalletAddress : address,
             )}
           </Text>
           <Text variant="bodySmall" textAlign="left" mt="lg" mb="xxs">
-            Password
+            {l.common.password}
           </Text>
           <PasswordInput onChangeText={onChangeText} />
           <Text variant="bodySmall" color="red" mt="xs" textAlign="left">
@@ -183,7 +183,7 @@ export const ExportLocalWalletModal = ({
                 <ActivityIndicator size="small" color="buttonTextColor" />
               ) : (
                 <Text variant="bodySmall" color="black">
-                  Backup
+                  {l.connect_wallet_details.backup}
                 </Text>
               )}
             </BaseButton>

packages/react-native/src/evm/components/ConnectWalletDetails/SessionProposalModal.tsx

@@ -7,9 +7,10 @@ import {
   CLOSE_MODAL_STATE,
   WalletConnectSessionProposalModal,
 } from "../../utils/modalTypes";
-import { useModalState } from "../../providers/ui-context-provider";
+import { useLocale, useModalState } from "../../providers/ui-context-provider";
 
 export const SessionProposalModal = () => {
+  const l = useLocale();
   const { modalState, setModalState } = useModalState();
   const { data: proposalData } =
     modalState as WalletConnectSessionProposalModal;
@@ -27,7 +28,7 @@ export const SessionProposalModal = () => {
       borderRadius="md"
       p="lg"
     >
-      <Text variant="bodyLarge">Connect to App</Text>
+      <Text variant="bodyLarge">{l.connect_wallet_details.connect_to_app}</Text>
       <Text variant="bodyLarge">{proposalData.proposer.metadata.name}</Text>
       <Box flexDirection="row" justifyContent="space-evenly" mt="lg">
         <BaseButton
@@ -44,7 +45,7 @@ export const SessionProposalModal = () => {
             onClose();
           }}
         >
-          <Text variant="bodySmall">Reject</Text>
+          <Text variant="bodySmall">{l.common.reject}</Text>
         </BaseButton>
         <BaseButton
           alignContent="center"
@@ -67,7 +68,7 @@ export const SessionProposalModal = () => {
           }}
         >
           <Text variant="bodySmall" color="black">
-            Approve
+            {l.common.approve}
           </Text>
         </BaseButton>
       </Box>

packages/react-native/src/evm/components/ConnectWalletDetails/SessionRequestModal.tsx

@@ -6,7 +6,7 @@ import {
   EIP155_SIGNING_METHODS,
   IWalletConnectReceiver,
 } from "@thirdweb-dev/wallets";
-import { useModalState } from "../../providers/ui-context-provider";
+import { useLocale, useModalState } from "../../providers/ui-context-provider";
 import {
   CLOSE_MODAL_STATE,
   WalletConnectSessionRequestModal,
@@ -30,6 +30,7 @@ const getTitle = (method: string) => {
 const MODAL_HEIGHT = Dimensions.get("window").height * 0.7;
 
 export const SessionRequestModal = () => {
+  const l = useLocale();
   const { modalState, setModalState } = useModalState();
   const { data: requestData } = modalState as WalletConnectSessionRequestModal;
   const [approvingRequest, setApprovingRequest] = useState(false);
@@ -60,7 +61,7 @@ export const SessionRequestModal = () => {
       case EIP155_SIGNING_METHODS.SWITCH_CHAIN:
         return (
           <Text variant="bodySmall" textAlign="left">
-            {`Switch to ${
+            {`${l.connect_wallet_details.switch_to} ${
               requestData.params[0].chainId === chain?.chainId
                 ? chain?.slug
                 : requestData.params[0].chainId
@@ -85,17 +86,17 @@ export const SessionRequestModal = () => {
         return (
           <Box>
             <Text variant="bodySmall" textAlign="left">
-              {`from: ${shortenWalletAddress(from)}`}
+              {`${l.common.from}: ${shortenWalletAddress(from)}`}
             </Text>
             <Text variant="bodySmall" textAlign="left" mt="sm">
-              {`to: ${shortenWalletAddress(to)}`}
+              {`${l.common.to}: ${shortenWalletAddress(to)}`}
             </Text>
           </Box>
         );
       default:
         throw new Error(`Method not implemented: ${requestData.method}`);
     }
-  }, [chain?.chainId, chain?.slug, requestData]);
+  }, [chain?.chainId, chain?.slug, requestData, l]);
 
   return (
     <Box
@@ -129,7 +130,7 @@ export const SessionRequestModal = () => {
             onClose();
           }}
         >
-          <Text variant="bodySmall">Reject</Text>
+          <Text variant="bodySmall">{l.common.reject}</Text>
         </BaseButton>
         <BaseButton
           alignContent="center"
@@ -148,7 +149,7 @@ export const SessionRequestModal = () => {
             <ActivityIndicator size="small" />
           ) : (
             <Text variant="bodySmall" color="black">
-              Approve
+              {l.common.approve}
             </Text>
           )}
         </BaseButton>

packages/react-native/src/evm/components/ConnectWalletDetails/SmartWalletAdditionalActions.tsx

@@ -14,13 +14,14 @@ import RightArrowIcon from "../../assets/right-arrow";
 import ConnectAppField from "./ConnectAppField";
 import DisconnectIcon from "../../assets/disconnect";
 import { IconTextButton } from "../base/IconTextButton";
-import { useGlobalTheme } from "../../providers/ui-context-provider";
+import { useGlobalTheme, useLocale } from "../../providers/ui-context-provider";
 
 export const SmartWalletAdditionalActions = ({
   onExportPress,
 }: {
   onExportPress: () => void;
 }) => {
+  const l = useLocale();
   const { setConnectedWallet } = useWalletContext();
   const [smartWallet, setSmartWallet] = useSmartWallet();
   const [smartWalletAddress, setSmartWalletAddress] = useState<string>("");
@@ -64,8 +65,8 @@ export const SmartWalletAdditionalActions = ({
         mt="xs"
         text={
           showSmartWallet
-            ? "Switch to Smart Wallet"
-            : "Switch to Personal Wallet"
+            ? l.smart_wallet.switch_to_smart
+            : l.smart_wallet.switch_to_personal
         }
         icon={
           <DisconnectIcon
@@ -98,8 +99,8 @@ export const SmartWalletAdditionalActions = ({
               <View style={styles.exportWalletInfo}>
                 <Text variant="bodySmall">
                   {wallet?.walletId === walletIds.localWallet
-                    ? "Backup personal wallet"
-                    : "Backup wallet"}
+                    ? l.connect_wallet_details.backup_personal_wallet
+                    : l.connect_wallet_details.backup_wallet}
                 </Text>
               </View>
             </>
@@ -110,9 +111,7 @@ export const SmartWalletAdditionalActions = ({
             />
           </BaseButton>
           <Text variant="error" textAlign="left" mb="sm">
-            {
-              "This is a temporary guest wallet. Download a backup if you don't want to loose access to it."
-            }
+            {l.local_wallet.this_is_a_temporary_wallet}
           </Text>
         </>
       ) : null}

packages/react-native/src/evm/components/ConnectWalletDetails/WalletDetailsButton.tsx

@@ -11,6 +11,7 @@ import { TextBalance } from "../base/TextBalance";
 import { SupportedTokens } from "../SendFunds/defaultTokens";
 import { SMART_WALLET_ICON } from "../../assets/svgs";
 import { ImageSvgUri } from "../base";
+import { useLocale } from "../../providers/ui-context-provider";
 
 export type ConnectWalletDetailsProps = {
   address?: string;
@@ -45,6 +46,7 @@ export const WalletDetailsButton = ({
   supportedTokens,
   displayBalanceToken,
 }: ConnectWalletDetailsProps) => {
+  const l = useLocale();
   const activeWallet = useWallet();
   const [isModalVisible, setIsModalVisible] = useState(false);
   const ensQuery = useENS();
@@ -100,7 +102,7 @@ export const WalletDetailsButton = ({
             <Box ml="md" justifyContent="center" alignItems="flex-start">
               {activeWallet?.walletId === LocalWallet.id ? (
                 <Text variant="bodySmall" color="red">
-                  Guest
+                  {l.connect_wallet_details.guest}
                 </Text>
               ) : ens ? (
                 <Text variant="bodySmall">{ens}</Text>