diff --git a/packages/checkout/widgets-lib/src/components/EOAWarningDrawer/EOAWarningDrawer.tsx b/packages/checkout/widgets-lib/src/components/EOAWarningDrawer/EOAWarningDrawer.tsx index ac95a4fd8e..501691d96c 100644 --- a/packages/checkout/widgets-lib/src/components/EOAWarningDrawer/EOAWarningDrawer.tsx +++ b/packages/checkout/widgets-lib/src/components/EOAWarningDrawer/EOAWarningDrawer.tsx @@ -5,6 +5,7 @@ import { Drawer, Heading, } from '@biom3/react'; +import { useTranslation } from 'react-i18next'; import { WarningHero } from '../Hero/WarningHero'; export function EOAWarningDrawer({ @@ -16,6 +17,7 @@ export function EOAWarningDrawer({ onProceedClick: () => void; onCloseDrawer: () => void; }) { + const { t } = useTranslation(); return ( - WARNING + {t('drawers.eoaWarning.dividerText')} - You could lose sight of your assets if you don’t deliver them to Passport + {t('drawers.eoaWarning.heading')} - Deliver to Passport instead + {t('drawers.eoaWarning.passportButtonText')} diff --git a/packages/checkout/widgets-lib/src/components/WalletDrawer/DeliverToWalletDrawer.tsx b/packages/checkout/widgets-lib/src/components/WalletDrawer/DeliverToWalletDrawer.tsx index 686e7a65fd..ecaa4f9c62 100644 --- a/packages/checkout/widgets-lib/src/components/WalletDrawer/DeliverToWalletDrawer.tsx +++ b/packages/checkout/widgets-lib/src/components/WalletDrawer/DeliverToWalletDrawer.tsx @@ -4,6 +4,7 @@ import { } from '@imtbl/checkout-sdk'; import { Web3Provider } from '@ethersproject/providers'; import { useContext } from 'react'; +import { useTranslation } from 'react-i18next'; import { ConnectWalletDrawer } from './ConnectWalletDrawer'; import { ConnectEIP6963ProviderError } from '../../lib/connectEIP6963Provider'; import { @@ -64,10 +65,10 @@ export function DeliverToWalletDrawer({ const selectedSameFromWalletType = ( providerInfo: EIP6963ProviderInfo, ): boolean | undefined => (fromProviderInfo?.rdns !== providerInfo.rdns ? undefined : false); - + const { t } = useTranslation(); return ( { if (insufficientBalance && fromProviderInfo) { return [{ - label: 'insufficient funds', + label: t('drawers.wallet.insufficientFunds'), rdns: fromProviderInfo.rdns, }]; } return []; - }, [insufficientBalance, fromProviderInfo]); + }, [t, insufficientBalance, fromProviderInfo]); const handleOnConnect = (provider: Web3Provider, providerInfo: EIP6963ProviderInfo) => { onConnect('from', provider, providerInfo); @@ -59,34 +61,35 @@ export function PayWithWalletDrawer({ } }; - const payWithCardItem = useMemo( - () => { - if (!showOnRampOption) return null; + const payWithCardItem = useMemo(() => { + if (!showOnRampOption) return null; - return ( - { - onClose(); - onPayWithCard?.(); - }} - > - - Pay with Card - - ); - }, - [onClose, onPayWithCard], - ); + return ( + { + onClose(); + onPayWithCard?.(); + }} + > + + {t('drawers.wallet.payWithCard')} + + ); + }, [onClose, onPayWithCard]); return ( ) : undefined; diff --git a/packages/checkout/widgets-lib/src/locales/en.json b/packages/checkout/widgets-lib/src/locales/en.json index 397054221c..6c751ce2f0 100644 --- a/packages/checkout/widgets-lib/src/locales/en.json +++ b/packages/checkout/widgets-lib/src/locales/en.json @@ -65,7 +65,11 @@ }, "ERROR_VIEW": { "heading": "Something's gone wrong", - "body": ["You can try again or contact", "support", "for help."], + "body": [ + "You can try again or contact", + "support", + "for help." + ], "actionText": "Try again" }, "SERVICE_UNAVAILABLE_ERROR_VIEW": { @@ -647,8 +651,35 @@ } }, "ADD_TOKENS": { + "tokenSelection": { + "buttonText": "Add Token", + "tokenLabel": "Add", + "drawerHeading": "Add Token", + "searchPlaceholder": "Search tokens" + }, + "walletSelection": { + "fromText": "Send from", + "toText": "Deliver to" + }, + "routeSelection": { + "loadingText": "Finding the best payment route...", + "noRoute": "No routes found, choose a different wallet, token or amount.", + "payWithCard": "No routes found, pay with card available", + "fastestBadge": "Fastest", + "minutesText": "mins", + "minuteText": "min", + "secondsText": "s" + }, "drawer": { "options": { + "heading": "Pay from", + "moreOptionsDividerText": "More ways to Pay", + "loadingText1": "Finding the best value", + "loadingText2": "across all chains", + "noRoutes": { + "heading": "No routes found", + "caption": "Choose a different wallet, token or amount and try again." + }, "swap": { "heading": "Swap", "caption": "Swap tokens on this network.", @@ -666,6 +697,110 @@ } } }, + "error": { + "default": { + "heading": "Sorry, something went wrong. Please try again later.", + "secondaryButtonText": "Close" + }, + "invalidParameters": { + "heading": "Invalid parameters", + "subHeading": "The widget parameters provided are invalid. Please check again.", + "secondaryButtonText": "Close" + }, + "serviceBreakdown": { + "heading": "Our system is currently down", + "subHeading": "We are currently experiencing technical difficulties. Please try again later.", + "secondaryButtonText": "Close" + }, + "transactionFailed": { + "heading": "Transaction failed", + "subHeading": "The transaction failed. Please try again.", + "primaryButtonText": "Retry", + "secondaryButtonText": "Close" + }, + "unrecognisedChain": { + "heading": "Unrecognised chain", + "subHeading": "Please add the chain to your account and try again.", + "primaryButtonText": "Retry", + "secondaryButtonText": "Close" + }, + "providerError": { + "heading": "Wallet cannot be found", + "subHeading": "Please try to connect your wallet and try again.", + "primaryButtonText": "Retry", + "secondaryButtonText": "Close" + }, + "walletFailed": { + "heading": "Transaction failed", + "subHeading": "The transaction failed. Please try again.", + "primaryButtonText": "Retry", + "secondaryButtonText": "Close" + }, + "walletRejected": { + "heading": "Transaction rejected", + "subHeading": "You'll need to approve the transaction in your wallet to proceed.", + "primaryButtonText": "Retry", + "secondaryButtonText": "Close" + }, + "walletRejectedNoFunds": { + "heading": "Insufficient funds", + "subHeading": "You do not have enough funds to complete the transaction.", + "primaryButtonText": "Retry", + "secondaryButtonText": "Close" + }, + "walletPopupBlocked": { + "heading": "Browser's popup blocked", + "subHeading": "Please allow pop-ups in your browser to proceed.", + "primaryButtonText": "Retry", + "secondaryButtonText": "Close" + }, + "environmentError": { + "heading": "Unsupported environment", + "subHeading": "This is only supported in production environment.", + "secondaryButtonText": "Close" + }, + "addressMismatch": { + "heading": "Oops! It seems your payment wallet has changed", + "body": "You'll be ask to re-connect the same wallet you selected to pay with before proceeding", + "buttonText": "Re-select payment wallet" + } + }, + "review": { + "buttonText": "Review", + "heading": "Review", + "send": "Send", + "receive": "Receive", + "swap": "Swap", + "to": "to", + "loadingText": "Securing quote", + "processingButtonText": "Processing", + "proceedButtonText": "Proceed", + "poweredBySquid": "Powered by Squid" + }, + "handover": { + "preparing": { + "heading": "Preparing" + }, + "requestingApproval": { + "heading": "Waiting for access approval in your wallet", + "subHeading": "Approve the transaction request to complete this transaction" + }, + "approved": { + "heading": "Granted access to your tokens" + }, + "requestingExecution": { + "heading": "Waiting for transaction confirmation in your wallet", + "subHeading": "Confirm the transaction request to complete this transaction" + }, + "executing": { + "heading": "Processing" + }, + "executed": { + "heading": "Funds added successfully", + "subHeadingGoTo": "Go to", + "subHeadingTransactionDetails": "for transaction details" + } + }, "onboarding": { "screen1": { "title": "We've changed a few things\nto make it easier", @@ -684,14 +819,18 @@ } }, "footer": { - "body": "Swap functionality is powered by a third party, Squid. Immutable neither builds, owns, operates or deploys Squid." + "body": "Swap functionality is powered by a third party, Squid. Immutable neither builds, owns, operates or deploys Squid." }, "geoBlockError": { "buyTokenButton": "Buy tokens", "bridgeTokenButton": "Bridge tokens" }, "fees": { - "fiatPricePrefix": "≈ USD" + "fee": "Fee", + "balance": "Balance", + "fiatPricePrefix": "≈ USD", + "zeroFees": "Zero fees", + "includedFees": "Included fees" } } }, @@ -847,6 +986,20 @@ "proceed": "I understand" } } + }, + "wallet": { + "payWithHeading": "Send from", + "payWithHeadingInsufficientBalance": "Choose another option", + "deliverToHeading": "Deliver to", + "payWithCard": "Pay with Card", + "insufficientFunds": "insufficient funds", + "noFunds": "no funds" + }, + "eoaWarning": { + "dividerText": "WARNING", + "heading": "You could lose sight of your assets if you don’t deliver them to Passport", + "passportButtonText": "Deliver to Passport instead", + "proceedButtonText": "Proceed anyway" } } } diff --git a/packages/checkout/widgets-lib/src/locales/ja.json b/packages/checkout/widgets-lib/src/locales/ja.json index 2890c82e06..bf0f5a3971 100644 --- a/packages/checkout/widgets-lib/src/locales/ja.json +++ b/packages/checkout/widgets-lib/src/locales/ja.json @@ -634,48 +634,186 @@ } }, "ADD_TOKENS": { + "tokenSelection": { + "buttonText": "トークンを追加", + "tokenLabel": "追加", + "drawerHeading": "トークンを追加", + "searchPlaceholder": "トークンを検索" + }, + "walletSelection": { + "fromText": "送金元", + "toText": "送金先" + }, + "routeSelection": { + "loadingText": "最適な支払いルートを検索中...", + "noRoute": "ルートが見つかりません。他のウォレット、トークン、または金額を選択してください。", + "payWithCard": "ルートが見つかりません。カードでの支払いが利用可能です", + "fastestBadge": "最速", + "minutesText": "分", + "minuteText": "分", + "secondsText": "秒" + }, "drawer": { "options": { + "heading": "支払い元", + "moreOptionsDividerText": "支払い方法の追加", + "loadingText1": "最適な価値を検索中", + "loadingText2": "すべてのチェーンを横断", + "noRoutes": { + "heading": "ルートが見つかりません", + "caption": "他のウォレット、トークン、または金額を選択して再試行してください。" + }, "swap": { "heading": "スワップ", - "caption": "このネットワークでトークンをスワップします。", + "caption": "このネットワークでトークンを交換します。", "disabledCaption": "現在利用できません。" }, "debit": { "heading": "デビットカード", "caption": "", - "disabledCaption": "選択した内容には利用できません。トークンを追加することをお勧めします。" + "disabledCaption": "お客様の選択では利用できません。トークンの追加をお勧めします。" }, "credit": { "heading": "クレジットカード", - "caption": "失敗や追加手数料が発生する可能性があります。", - "disabledCaption": "選択した内容には利用できません。トークンを追加することをお勧めします。" + "caption": "失敗や追加料金が発生する可能性があります。", + "disabledCaption": "お客様の選択では利用できません。トークンの追加をお勧めします。" } } }, + "error": { + "default": { + "heading": "申し訳ありませんが、問題が発生しました。後でもう一度お試しください。", + "secondaryButtonText": "閉じる" + }, + "invalidParameters": { + "heading": "無効なパラメータ", + "subHeading": "提供されたウィジェットパラメータが無効です。再度確認してください。", + "secondaryButtonText": "閉じる" + }, + "serviceBreakdown": { + "heading": "現在システムがダウンしています", + "subHeading": "現在技術的な問題が発生しています。後でもう一度お試しください。", + "secondaryButtonText": "閉じる" + }, + "transactionFailed": { + "heading": "取引が失敗しました", + "subHeading": "取引に失敗しました。もう一度お試しください。", + "primaryButtonText": "再試行", + "secondaryButtonText": "閉じる" + }, + "unrecognisedChain": { + "heading": "認識できないチェーン", + "subHeading": "チェーンをアカウントに追加して再試行してください。", + "primaryButtonText": "再試行", + "secondaryButtonText": "閉じる" + }, + "providerError": { + "heading": "ウォレットが見つかりません", + "subHeading": "ウォレットを接続して再試行してください。", + "primaryButtonText": "再試行", + "secondaryButtonText": "閉じる" + }, + "walletFailed": { + "heading": "取引が失敗しました", + "subHeading": "取引に失敗しました。もう一度お試しください。", + "primaryButtonText": "再試行", + "secondaryButtonText": "閉じる" + }, + "walletRejected": { + "heading": "取引が拒否されました", + "subHeading": "続行するにはウォレットで取引を承認してください。", + "primaryButtonText": "再試行", + "secondaryButtonText": "閉じる" + }, + "walletRejectedNoFunds": { + "heading": "資金が不足しています", + "subHeading": "取引を完了するのに十分な資金がありません。", + "primaryButtonText": "再試行", + "secondaryButtonText": "閉じる" + }, + "walletPopupBlocked": { + "heading": "ブラウザのポップアップがブロックされました", + "subHeading": "続行するにはブラウザでポップアップを許可してください。", + "primaryButtonText": "再試行", + "secondaryButtonText": "閉じる" + }, + "environmentError": { + "heading": "サポートされていない環境", + "subHeading": "これは本番環境でのみサポートされています。", + "secondaryButtonText": "閉じる" + }, + "addressMismatch": { + "heading": "おっと!支払いウォレットが変更されました", + "body": "以前に選択したウォレットと再接続するように求められます", + "buttonText": "支払いウォレットを再選択" + } + }, + "review": { + "buttonText": "確認", + "heading": "確認", + "send": "送信", + "receive": "受信", + "swap": "交換", + "to": "に", + "loadingText": "見積もりを確保中", + "processingButtonText": "処理中", + "proceedButtonText": "進む", + "poweredBySquid": "Squidによる提供" + }, + "handover": { + "preparing": { + "heading": "準備中" + }, + "requestingApproval": { + "heading": "ウォレットでのアクセス承認待ち", + "subHeading": "取引リクエストを承認してこの取引を完了してください" + }, + "approved": { + "heading": "トークンへのアクセスが許可されました" + }, + "requestingExecution": { + "heading": "ウォレットでの取引確認待ち", + "subHeading": "取引リクエストを確認してこの取引を完了してください" + }, + "executing": { + "heading": "処理中" + }, + "executed": { + "heading": "資金が正常に追加されました", + "subHeadingGoTo": "移動", + "subHeadingTransactionDetails": "取引詳細はこちら" + } + }, "onboarding": { "screen1": { - "title": "いくつか変更しました\nより簡単にするために", + "title": "いくつか変更して\nより簡単になりました", "caption": "注目してください", "buttonText": "次へ" }, "screen2": { - "title": "トークンをパスポートに送って\nどのウォレットからでも支払い可能です", + "title": "トークンをPassportに送信して\nどのウォレットからでも支払えます", "caption": "進化した点", "buttonText": "次へ" }, "screen3": { - "title": "他のチェーンでトークンを使用し、\n最適なオプションを見つけます", + "title": "他のチェーンでトークンを使用できます。\n最適なオプションを見つけます", "caption": "進化", "buttonText": "トークンを追加しましょう" } }, "footer": { - "body": "スワップ機能はサードパーティであるSquidによって提供されています。ImmutableはSquidを構築、所有、運営、またはデプロイしていません。" + "body": "スワップ機能は第三者のSquidによって提供されています。ImmutableはSquidを構築、所有、運営、または配信していません。" }, "geoBlockError": { - "buyTokenButton": "トークンを購入する", - "bridgeTokenButton": "トークンをブリッジする" + "buyTokenButton": "トークンを購入", + "bridgeTokenButton": "トークンをブリッジ" + }, + "fees": { + "fee": "手数料", + "balance": "残高", + "fiatPricePrefix": "≈ USD", + "zeroFees": "手数料無料", + "includedFees": "手数料込み" } } }, @@ -831,6 +969,20 @@ "proceed": "わかりました" } } + }, + "wallet": { + "payWithHeading": "送信元", + "payWithHeadingInsufficientBalance": "別のオプションを選択してください", + "deliverToHeading": "配送先", + "payWithCard": "カードで支払う", + "insufficientFunds": "残高不足", + "noFunds": "資金がありません" + }, + "eoaWarning": { + "dividerText": "警告", + "heading": "資産をPassportに送らないと見失う可能性があります", + "passportButtonText": "代わりにPassportに送る", + "proceedButtonText": "それでも続行" } } } diff --git a/packages/checkout/widgets-lib/src/locales/ko.json b/packages/checkout/widgets-lib/src/locales/ko.json index fc71af00b9..eca668a4bd 100644 --- a/packages/checkout/widgets-lib/src/locales/ko.json +++ b/packages/checkout/widgets-lib/src/locales/ko.json @@ -65,7 +65,11 @@ }, "ERROR_VIEW": { "heading": "문제가 발생했습니다", - "body": ["다시 시도하거나", "지원팀에", "도움을 요청하세요."], + "body": [ + "다시 시도하거나", + "지원팀에", + "도움을 요청하세요." + ], "actionText": "다시 시도" }, "SERVICE_UNAVAILABLE_ERROR_VIEW": { @@ -627,48 +631,186 @@ } }, "ADD_TOKENS": { + "tokenSelection": { + "buttonText": "토큰 추가", + "tokenLabel": "추가", + "drawerHeading": "토큰 추가", + "searchPlaceholder": "토큰 검색" + }, + "walletSelection": { + "fromText": "보내는 곳", + "toText": "받는 곳" + }, + "routeSelection": { + "loadingText": "최적의 결제 경로를 찾는 중...", + "noRoute": "경로를 찾을 수 없습니다. 다른 지갑, 토큰 또는 금액을 선택하세요.", + "payWithCard": "경로를 찾을 수 없습니다. 카드 결제가 가능합니다", + "fastestBadge": "가장 빠름", + "minutesText": "분", + "minuteText": "분", + "secondsText": "초" + }, "drawer": { "options": { + "heading": "지불 방식", + "moreOptionsDividerText": "다른 결제 방법", + "loadingText1": "최적의 가치를 찾는 중", + "loadingText2": "모든 체인에서", + "noRoutes": { + "heading": "경로를 찾을 수 없음", + "caption": "다른 지갑, 토큰 또는 금액을 선택하고 다시 시도하세요." + }, "swap": { "heading": "스왑", - "caption": "이 네트워크에서 토큰을 스왑합니다.", + "caption": "이 네트워크에서 토큰을 교환합니다.", "disabledCaption": "현재 이용할 수 없습니다." }, "debit": { - "heading": "직불카드", + "heading": "직불 카드", "caption": "", - "disabledCaption": "선택한 항목에서 사용할 수 없습니다. 토큰 추가를 권장합니다." + "disabledCaption": "선택한 옵션으로 이용할 수 없습니다. 토큰 추가를 권장합니다." }, "credit": { - "heading": "신용카드", - "caption": "실패하거나 추가 수수료가 발생할 수 있습니다.", - "disabledCaption": "선택한 항목에서 사용할 수 없습니다. 토큰 추가를 권장합니다." + "heading": "신용 카드", + "caption": "실패 및 추가 수수료가 발생할 수 있습니다.", + "disabledCaption": "선택한 옵션으로 이용할 수 없습니다. 토큰 추가를 권장합니다." } } }, + "error": { + "default": { + "heading": "죄송합니다, 문제가 발생했습니다. 나중에 다시 시도해 주세요.", + "secondaryButtonText": "닫기" + }, + "invalidParameters": { + "heading": "잘못된 매개변수", + "subHeading": "제공된 위젯 매개변수가 잘못되었습니다. 다시 확인해 주세요.", + "secondaryButtonText": "닫기" + }, + "serviceBreakdown": { + "heading": "시스템이 현재 중단되었습니다", + "subHeading": "현재 기술적인 문제가 발생했습니다. 나중에 다시 시도해 주세요.", + "secondaryButtonText": "닫기" + }, + "transactionFailed": { + "heading": "거래 실패", + "subHeading": "거래가 실패했습니다. 다시 시도해 주세요.", + "primaryButtonText": "재시도", + "secondaryButtonText": "닫기" + }, + "unrecognisedChain": { + "heading": "인식할 수 없는 체인", + "subHeading": "계정에 체인을 추가하고 다시 시도해 주세요.", + "primaryButtonText": "재시도", + "secondaryButtonText": "닫기" + }, + "providerError": { + "heading": "지갑을 찾을 수 없습니다", + "subHeading": "지갑을 연결하고 다시 시도해 주세요.", + "primaryButtonText": "재시도", + "secondaryButtonText": "닫기" + }, + "walletFailed": { + "heading": "거래 실패", + "subHeading": "거래가 실패했습니다. 다시 시도해 주세요.", + "primaryButtonText": "재시도", + "secondaryButtonText": "닫기" + }, + "walletRejected": { + "heading": "거래 거부됨", + "subHeading": "진행하려면 지갑에서 거래를 승인해야 합니다.", + "primaryButtonText": "재시도", + "secondaryButtonText": "닫기" + }, + "walletRejectedNoFunds": { + "heading": "잔액 부족", + "subHeading": "거래를 완료할 수 있는 충분한 자금이 없습니다.", + "primaryButtonText": "재시도", + "secondaryButtonText": "닫기" + }, + "walletPopupBlocked": { + "heading": "브라우저의 팝업이 차단되었습니다", + "subHeading": "계속 진행하려면 브라우저에서 팝업을 허용해 주세요.", + "primaryButtonText": "재시도", + "secondaryButtonText": "닫기" + }, + "environmentError": { + "heading": "지원되지 않는 환경", + "subHeading": "이것은 프로덕션 환경에서만 지원됩니다.", + "secondaryButtonText": "닫기" + }, + "addressMismatch": { + "heading": "앗! 결제 지갑이 변경되었습니다", + "body": "이전에 선택한 지갑과 다시 연결하라는 메시지가 표시됩니다", + "buttonText": "결제 지갑 재선택" + } + }, + "review": { + "buttonText": "검토", + "heading": "검토", + "send": "보내기", + "receive": "받기", + "swap": "스왑", + "to": "대상", + "loadingText": "견적 확보 중", + "processingButtonText": "처리 중", + "proceedButtonText": "진행", + "poweredBySquid": "Squid 제공" + }, + "handover": { + "preparing": { + "heading": "준비 중" + }, + "requestingApproval": { + "heading": "지갑에서 액세스 승인 대기 중", + "subHeading": "거래 요청을 승인하여 이 거래를 완료하세요" + }, + "approved": { + "heading": "토큰에 대한 액세스가 승인되었습니다" + }, + "requestingExecution": { + "heading": "지갑에서 거래 확인 대기 중", + "subHeading": "거래 요청을 확인하여 이 거래를 완료하세요" + }, + "executing": { + "heading": "처리 중" + }, + "executed": { + "heading": "자금이 성공적으로 추가되었습니다", + "subHeadingGoTo": "이동", + "subHeadingTransactionDetails": "거래 세부 정보 보기" + } + }, "onboarding": { "screen1": { - "title": "더 쉽게 이용할 수 있도록\n몇 가지를 변경했습니다", - "caption": "주의하세요", + "title": "몇 가지를 변경하여\n더 쉽게 만들었습니다", + "caption": "잘 들어보세요", "buttonText": "다음" }, "screen2": { - "title": "패스포트로 토큰을 보내고\n어떤 지갑에서든 결제할 수 있습니다", - "caption": "변화된 점", + "title": "토큰을 Passport로 전송하고\n어느 지갑에서든 결제할 수 있습니다", + "caption": "무엇이 바뀌었나요", "buttonText": "다음" }, "screen3": { - "title": "다른 체인에서 토큰을 사용하고,\n최적의 옵션을 찾아드릴게요", + "title": "다른 체인에서 토큰을 사용하세요,\n최적의 옵션을 찾아드리겠습니다", "caption": "진화", "buttonText": "토큰 추가하기" } }, "footer": { - "body": "스왑 기능은 제3자인 Squid에 의해 제공됩니다. Immutable은 Squid를 구축, 소유, 운영 또는 배포하지 않습니다." + "body": "스왑 기능은 제3자 Squid에 의해 제공됩니다. Immutable은 Squid를 구축, 소유, 운영 또는 배포하지 않습니다." }, "geoBlockError": { "buyTokenButton": "토큰 구매", "bridgeTokenButton": "토큰 브릿지" + }, + "fees": { + "fee": "수수료", + "balance": "잔액", + "fiatPricePrefix": "≈ USD", + "zeroFees": "수수료 없음", + "includedFees": "수수료 포함" } } }, @@ -824,6 +966,20 @@ "proceed": "이해합니다" } } + }, + "wallet": { + "payWithHeading": "송신 계좌", + "payWithHeadingInsufficientBalance": "다른 옵션을 선택하세요", + "deliverToHeading": "배송지", + "payWithCard": "카드로 결제", + "insufficientFunds": "잔액 부족", + "noFunds": "잔액이 없습니다" + }, + "eoaWarning": { + "dividerText": "경고", + "heading": "자산을 Passport에 전달하지 않으면 잃어버릴 수 있습니다", + "passportButtonText": "Passport로 대신 전달", + "proceedButtonText": "계속 진행" } } } diff --git a/packages/checkout/widgets-lib/src/locales/zh.json b/packages/checkout/widgets-lib/src/locales/zh.json index a232b41f4b..d7c0cd1080 100644 --- a/packages/checkout/widgets-lib/src/locales/zh.json +++ b/packages/checkout/widgets-lib/src/locales/zh.json @@ -65,7 +65,11 @@ }, "ERROR_VIEW": { "heading": "出了些问题", - "body": ["您可以再试一次或联系", "支持", "寻求帮助。"], + "body": [ + "您可以再试一次或联系", + "支持", + "寻求帮助。" + ], "actionText": "再试一次" }, "SERVICE_UNAVAILABLE_ERROR_VIEW": { @@ -627,48 +631,186 @@ } }, "ADD_TOKENS": { + "tokenSelection": { + "buttonText": "添加代币", + "tokenLabel": "添加", + "drawerHeading": "添加代币", + "searchPlaceholder": "搜索代币" + }, + "walletSelection": { + "fromText": "从此发送", + "toText": "发送到" + }, + "routeSelection": { + "loadingText": "寻找最佳支付路线中...", + "noRoute": "未找到路线,请选择其他钱包、代币或金额。", + "payWithCard": "未找到路线,可选择用卡支付", + "fastestBadge": "最快", + "minutesText": "分钟", + "minuteText": "分钟", + "secondsText": "秒" + }, "drawer": { "options": { + "heading": "支付来源", + "moreOptionsDividerText": "更多支付方式", + "loadingText1": "寻找最佳价值", + "loadingText2": "跨所有链", + "noRoutes": { + "heading": "未找到路线", + "caption": "请选择其他钱包、代币或金额并重试。" + }, "swap": { - "heading": "兑换", - "caption": "在此网络上兑换代币。", + "heading": "交换", + "caption": "在此网络上交换代币。", "disabledCaption": "当前不可用。" }, "debit": { "heading": "借记卡", "caption": "", - "disabledCaption": "您的选择不可用。我们建议添加代币。" + "disabledCaption": "当前选择不可用,建议添加代币。" }, "credit": { "heading": "信用卡", - "caption": "可能会发生失败或额外费用。", - "disabledCaption": "您的选择不可用。我们建议添加代币。" + "caption": "可能会有失败或额外费用。", + "disabledCaption": "当前选择不可用,建议添加代币。" } } }, + "error": { + "default": { + "heading": "抱歉,出现了问题。请稍后再试。", + "secondaryButtonText": "关闭" + }, + "invalidParameters": { + "heading": "参数无效", + "subHeading": "提供的小部件参数无效,请重新检查。", + "secondaryButtonText": "关闭" + }, + "serviceBreakdown": { + "heading": "系统目前无法使用", + "subHeading": "我们正在经历技术问题,请稍后再试。", + "secondaryButtonText": "关闭" + }, + "transactionFailed": { + "heading": "交易失败", + "subHeading": "交易失败,请重试。", + "primaryButtonText": "重试", + "secondaryButtonText": "关闭" + }, + "unrecognisedChain": { + "heading": "未识别的链", + "subHeading": "请将该链添加到您的账户并重试。", + "primaryButtonText": "重试", + "secondaryButtonText": "关闭" + }, + "providerError": { + "heading": "无法找到钱包", + "subHeading": "请尝试连接您的钱包后重试。", + "primaryButtonText": "重试", + "secondaryButtonText": "关闭" + }, + "walletFailed": { + "heading": "交易失败", + "subHeading": "交易失败,请重试。", + "primaryButtonText": "重试", + "secondaryButtonText": "关闭" + }, + "walletRejected": { + "heading": "交易被拒绝", + "subHeading": "您需要在钱包中批准交易以继续。", + "primaryButtonText": "重试", + "secondaryButtonText": "关闭" + }, + "walletRejectedNoFunds": { + "heading": "资金不足", + "subHeading": "您的资金不足以完成交易。", + "primaryButtonText": "重试", + "secondaryButtonText": "关闭" + }, + "walletPopupBlocked": { + "heading": "浏览器弹窗被拦截", + "subHeading": "请允许浏览器弹窗以继续。", + "primaryButtonText": "重试", + "secondaryButtonText": "关闭" + }, + "environmentError": { + "heading": "不支持的环境", + "subHeading": "此功能仅在生产环境中支持。", + "secondaryButtonText": "关闭" + }, + "addressMismatch": { + "heading": "抱歉!您的支付钱包似乎已更改", + "body": "在继续之前,您需要重新连接之前选择的支付钱包。", + "buttonText": "重新选择支付钱包" + } + }, + "review": { + "buttonText": "审查", + "heading": "审查", + "send": "发送", + "receive": "接收", + "swap": "交换", + "to": "至", + "loadingText": "正在获取报价", + "processingButtonText": "处理中", + "proceedButtonText": "继续", + "poweredBySquid": "由Squid提供" + }, + "handover": { + "preparing": { + "heading": "准备中" + }, + "requestingApproval": { + "heading": "正在等待您的钱包授权访问", + "subHeading": "批准交易请求以完成此交易" + }, + "approved": { + "heading": "已授予访问您的代币的权限" + }, + "requestingExecution": { + "heading": "正在等待您的钱包确认交易", + "subHeading": "确认交易请求以完成此交易" + }, + "executing": { + "heading": "处理中" + }, + "executed": { + "heading": "资金添加成功", + "subHeadingGoTo": "前往", + "subHeadingTransactionDetails": "查看交易详情" + } + }, "onboarding": { "screen1": { - "title": "我们做了一些改变\n让操作更简便", + "title": "我们做了一些改动,\n让它变得更简单", "caption": "请注意", "buttonText": "下一步" }, "screen2": { - "title": "你可以将代币发送到护照\n并使用任何钱包支付", - "caption": "更新内容", + "title": "您可以将代币发送到Passport,\n并从任何钱包付款", + "caption": "有哪些改进", "buttonText": "下一步" }, "screen3": { - "title": "在其他链上使用代币,\n我们将为你找到最佳选项", - "caption": "演进", - "buttonText": "添加一些代币" + "title": "在其他链上使用代币,\n我们会为您找到最佳选项", + "caption": "进化", + "buttonText": "让我们添加一些代币" } }, "footer": { - "body": "交换功能由第三方 Squid 提供。Immutable 不构建、拥有、运营或部署 Squid。" + "body": "交换功能由第三方Squid提供支持。Immutable不构建、不拥有、不运营或不部署Squid。" }, "geoBlockError": { "buyTokenButton": "购买代币", "bridgeTokenButton": "桥接代币" + }, + "fees": { + "fee": "费用", + "balance": "余额", + "fiatPricePrefix": "≈ 美元", + "zeroFees": "零手续费", + "includedFees": "包含的手续费" } } }, @@ -824,6 +966,20 @@ "proceed": "我明白" } } + }, + "wallet": { + "payWithHeading": "付款方式", + "payWithHeadingInsufficientBalance": "请选择其他选项", + "deliverToHeading": "送货至", + "payWithCard": "用卡支付", + "insufficientFunds": "余额不足", + "noFunds": "没有资金" + }, + "eoaWarning": { + "dividerText": "警告", + "heading": "如果不将资产转移到Passport,您可能会丢失它们", + "passportButtonText": "转移到Passport", + "proceedButtonText": "仍要继续" } } } diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/AddressMissmatchDrawer.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/AddressMissmatchDrawer.tsx index bd2a6e0648..0beccc3ea9 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/AddressMissmatchDrawer.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/AddressMissmatchDrawer.tsx @@ -1,6 +1,7 @@ import { Body, Box, Button, Drawer, Heading, } from '@biom3/react'; +import { useTranslation } from 'react-i18next'; import { WalletWarningHero } from '../../../components/Hero/WalletWarningHero'; export interface AddressMissmatchDrawerProps { @@ -12,6 +13,7 @@ export function AddressMissmatchDrawer({ visible, onClick, }: AddressMissmatchDrawerProps) { + const { t } = useTranslation(); return ( @@ -24,7 +26,7 @@ export function AddressMissmatchDrawer({ textAlign: 'center', }} > - Oops! It seems your payment wallet has changed + {t('views.ADD_TOKENS.error.addressMismatch.heading')} - You'll be ask to re-connect the same wallet you selected to pay with before proceeding. + {t('views.ADD_TOKENS.error.addressMismatch.body')} - Re-select payment wallet + {t('views.ADD_TOKENS.error.addressMismatch.buttonText')} diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/Options.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/Options.tsx index 77b64d5069..9b8d09b860 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/Options.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/Options.tsx @@ -1,19 +1,10 @@ import { - Body, - FramedVideo, - MenuItem, - Stack, - MenuItemSize, - Divider, - Banner, + Banner, Body, Divider, FramedVideo, MenuItem, MenuItemSize, Stack, } from '@biom3/react'; import { motion } from 'framer-motion'; -import { useMemo } from 'react'; import { Checkout } from '@imtbl/checkout-sdk'; -import { - listItemVariants, - listVariants, -} from '../../../lib/animation/listAnimation'; +import { useTranslation } from 'react-i18next'; +import { listItemVariants, listVariants } from '../../../lib/animation/listAnimation'; import { FiatOption } from './FiatOption'; import { Chain, FiatOptionType, RouteData } from '../types'; import { RouteOption } from './RouteOption'; @@ -47,6 +38,8 @@ export function Options({ insufficientBalance, selectedIndex, }: OptionsProps) { + const { t } = useTranslation(); + // @NOTE: early exit with loading related UI, when the // routes are not yet available if (!routes?.length && !insufficientBalance) { @@ -60,9 +53,9 @@ export function Options({ - Finding the best value + {t('views.ADD_TOKENS.drawer.options.loadingText1')}
- across all chains + {t('views.ADD_TOKENS.drawer.options.loadingText2')} ); } + const noRoutes = !(!insufficientBalance || routes?.length); - const routeOptions = routes?.map((routeData: RouteData, index) => ( - onRouteClick(routeData, index)} - isFastest={index === 0} - selected={index === selectedIndex} - rc={} - /> - )); - - const fiatOptions = useMemo(() => { - if (!showOnrampOption) return null; - - return ( + return ( + + } + > + {routes?.map((routeData: RouteData, index) => ( + onRouteClick(routeData, index)} + isFastest={index === 0} + selected={index === selectedIndex} + rc={} + /> + ))} + {noRoutes && ( + + + {t('views.ADD_TOKENS.drawer.options.noRoutes.heading')} + + {t('views.ADD_TOKENS.drawer.options.noRoutes.caption')} + + + )} + {showOnrampOption && ( <> - More ways to Pay + {t('views.ADD_TOKENS.drawer.options.moreOptionsDividerText')} {defaultFiatOptions.map((type, idx) => ( ))} - ); - }, [showOnrampOption, size, onCardClick]); - - const noFundsBanner = useMemo(() => { - if (!insufficientBalance || routes?.length) return null; - - return ( - - - No routes found - - Choose a different wallet, token or amount and try again. - - - ); - }, [insufficientBalance, routes]); - - return ( - - } - > - {routeOptions} - {noFundsBanner} - {fiatOptions} + )} ); } diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/OptionsDrawer.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/OptionsDrawer.tsx index 682e7d3f2b..0a3f042feb 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/OptionsDrawer.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/OptionsDrawer.tsx @@ -3,6 +3,7 @@ import { motion } from 'framer-motion'; import { useContext, useRef } from 'react'; import { Checkout } from '@imtbl/checkout-sdk'; +import { useTranslation } from 'react-i18next'; import { listVariants } from '../../../lib/animation/listAnimation'; import { Options } from './Options'; import { FiatOptionType, RouteData } from '../types'; @@ -36,6 +37,7 @@ export function OptionsDrawer({ showBridgeOption, insufficientBalance, }: OptionsDrawerProps) { + const { t } = useTranslation(); const { addTokensState: { chains }, } = useContext(AddTokensContext); @@ -76,7 +78,7 @@ export function OptionsDrawer({ } sx={{ mx: 'base.spacing.x2' }} /> - Pay from + {t('views.ADD_TOKENS.drawer.options.heading')} {fromProviderInfo?.name} {' • '} diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/RouteOption.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/RouteOption.tsx index d350e76cc2..8fb834c658 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/RouteOption.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/RouteOption.tsx @@ -49,6 +49,9 @@ export function RouteOption({ const estimatedDurationFormatted = getDurationFormatted( estimate.estimatedRouteDuration, + t('views.ADD_TOKENS.routeSelection.minutesText'), + t('views.ADD_TOKENS.routeSelection.minuteText'), + t('views.ADD_TOKENS.routeSelection.secondsText'), ); const { totalFeesUsd } = useMemo( @@ -92,7 +95,9 @@ export function RouteOption({ )} - {`Balance ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} $${routeBalanceUsd}`} + + {`${t('views.ADD_TOKENS.fees.balance')} ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} $${routeBalanceUsd}`} + @@ -133,12 +138,15 @@ export function RouteOption({ {isFastest && ( )} - {`Fee ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} $${getFormattedAmounts(totalFeesUsd)}`} + { + `${t('views.ADD_TOKENS.fees.fee')} ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} + $${getFormattedAmounts(totalFeesUsd)}` + } diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/SelectedRouteOption.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/SelectedRouteOption.tsx index a98bc023bb..4aa47d2680 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/SelectedRouteOption.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/SelectedRouteOption.tsx @@ -104,7 +104,7 @@ export function SelectedRouteOption({ mimeType="video/mp4" circularFrame /> - Finding the best payment route... + {t('views.ADD_TOKENS.routeSelection.loadingText')} ); } @@ -115,12 +115,12 @@ export function SelectedRouteOption({ if (insufficientBalance) { icon = 'InformationCircle'; - copy = 'No routes found, choose a different wallet, token or amount.'; + copy = t('views.ADD_TOKENS.routeSelection.noRoute'); } if (insufficientBalancePayWithCard) { icon = 'BankCard'; - copy = 'No routes found, pay with card available'; + copy = t('views.ADD_TOKENS.routeSelection.payWithCard'); } return ( @@ -169,7 +169,7 @@ export function SelectedRouteOption({ {fromToken?.name} - {`Balance ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} $${routeBalanceUsd}`} + {`${t('views.ADD_TOKENS.fees.balance')} ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} $${routeBalanceUsd}`} diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/TokenDrawerMenu.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/TokenDrawerMenu.tsx index 3f0ba1f8d5..8761c5c514 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/components/TokenDrawerMenu.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/components/TokenDrawerMenu.tsx @@ -18,6 +18,7 @@ import { useState, } from 'react'; import { Environment } from '@imtbl/config'; +import { useTranslation } from 'react-i18next'; import type { StrongCheckoutWidgetsConfig } from '../../../lib/withDefaultWidgetConfig'; import { AddTokensActions, @@ -63,6 +64,7 @@ export function TokenDrawerMenu({ config.theme, ); const { track } = useAnalytics(); + const { t } = useTranslation(); const setSelectedToken = (token: TokenInfo | undefined) => { track({ @@ -184,7 +186,7 @@ export function TokenDrawerMenu({ visible={visible} onCloseDrawer={handleDrawerClose} size="full" - headerBarTitle="Add Tokens" + headerBarTitle={t('views.ADD_TOKENS.tokenSelection.drawerHeading')} drawerCloseIcon="ChevronExpand" showHeaderBar outsideClicksClose @@ -231,7 +233,7 @@ export function TokenDrawerMenu({ { setSearchValue(event.target.value); diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/functions/getDurationFormatted.ts b/packages/checkout/widgets-lib/src/widgets/add-tokens/functions/getDurationFormatted.ts index 7909c141d0..cb49563d3b 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/functions/getDurationFormatted.ts +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/functions/getDurationFormatted.ts @@ -1,8 +1,13 @@ -export function getDurationFormatted(estimatedRouteDuration: number) { +export function getDurationFormatted( + estimatedRouteDuration: number, + minutesText: string, + minuteText: string, + secondText: string, +) { const seconds = estimatedRouteDuration; if (seconds >= 60) { const minutes = Math.round(seconds / 60); - return minutes === 1 ? '1 min' : `${minutes} mins`; + return minutes === 1 ? `1 ${minuteText}` : `${minutes} ${minutesText}`; } - return `${seconds.toFixed(0)}s`; + return `${seconds.toFixed(0)}${secondText}`; } diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/hooks/useError.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/hooks/useError.tsx index 360d8844f6..db3926ee1c 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/hooks/useError.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/hooks/useError.tsx @@ -1,5 +1,6 @@ import { Environment } from '@imtbl/config'; import { useContext } from 'react'; +import { useTranslation } from 'react-i18next'; import { AddTokensErrorTypes, RiveStateMachineInput } from '../types'; import { useHandover } from '../../../lib/hooks/useHandover'; import { HandoverTarget } from '../../../context/handover-context/HandoverContext'; @@ -31,6 +32,7 @@ export const useError = (environment: Environment) => { const { viewDispatch } = useContext(ViewContext); const { page } = useAnalytics(); + const { t } = useTranslation(); const { addHandover, closeHandover } = useHandover({ id: HandoverTarget.GLOBAL, }); @@ -58,87 +60,82 @@ export const useError = (environment: Environment) => { const errorConfig: Record = { [AddTokensErrorTypes.DEFAULT]: { - headingText: 'Sorry, something went wrong. Please try again later.', - secondaryButtonText: 'Close', + headingText: t('views.ADD_TOKENS.error.default.heading'), + secondaryButtonText: t('views.ADD_TOKENS.error.default.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, [AddTokensErrorTypes.INVALID_PARAMETERS]: { - headingText: 'Invalid parameters', - subHeadingText: - 'The widget parameters provided are invalid. Please check again.', - secondaryButtonText: 'Close', + headingText: t('views.ADD_TOKENS.error.invalidParameters.heading'), + subHeadingText: t('views.ADD_TOKENS.error.invalidParameters.subHeading'), + secondaryButtonText: t('views.ADD_TOKENS.error.invalidParameters.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, [AddTokensErrorTypes.SERVICE_BREAKDOWN]: { - headingText: 'Our system is currently down', - subHeadingText: - 'We are currently experiencing technical difficulties. Please try again later.', - secondaryButtonText: 'Close', + headingText: t('views.ADD_TOKENS.error.serviceBreakdown.heading'), + subHeadingText: t('views.ADD_TOKENS.error.serviceBreakdown.subHeading'), + secondaryButtonText: t('views.ADD_TOKENS.error.serviceBreakdown.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, [AddTokensErrorTypes.TRANSACTION_FAILED]: { - headingText: 'Transaction failed', - subHeadingText: 'The transaction failed. Please try again.', - primaryButtonText: 'Retry', + headingText: t('views.ADD_TOKENS.error.transactionFailed.heading'), + subHeadingText: t('views.ADD_TOKENS.error.transactionFailed.subHeading'), + primaryButtonText: t('views.ADD_TOKENS.error.transactionFailed.primaryButtonText'), onPrimaryButtonClick: goBackToAddTokensView, - secondaryButtonText: 'Close', + secondaryButtonText: t('views.ADD_TOKENS.error.transactionFailed.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, [AddTokensErrorTypes.UNRECOGNISED_CHAIN]: { - headingText: 'Unrecognised chain', - subHeadingText: 'Please add the chain to your account and try again.', - primaryButtonText: 'Retry', + headingText: t('views.ADD_TOKENS.error.unrecognisedChain.heading'), + subHeadingText: t('views.ADD_TOKENS.error.unrecognisedChain.subHeading'), + primaryButtonText: t('views.ADD_TOKENS.error.unrecognisedChain.primaryButtonText'), onPrimaryButtonClick: goBackToAddTokensView, - secondaryButtonText: 'Close', + secondaryButtonText: t('views.ADD_TOKENS.error.unrecognisedChain.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, [AddTokensErrorTypes.PROVIDER_ERROR]: { - headingText: 'Wallet cannot be found', - subHeadingText: - 'Please try to connect your wallet and try again.', - primaryButtonText: 'Retry', + headingText: t('views.ADD_TOKENS.error.providerError.heading'), + subHeadingText: t('views.ADD_TOKENS.error.providerError.subHeading'), + primaryButtonText: t('views.ADD_TOKENS.error.providerError.primaryButtonText'), onPrimaryButtonClick: goBackToAddTokensView, - secondaryButtonText: 'Close', + secondaryButtonText: t('views.ADD_TOKENS.error.providerError.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, [AddTokensErrorTypes.WALLET_FAILED]: { - headingText: 'Transaction failed', - subHeadingText: 'The transaction failed. Please try again.', - primaryButtonText: 'Retry', + headingText: t('views.ADD_TOKENS.error.walletFailed.heading'), + subHeadingText: t('views.ADD_TOKENS.error.walletFailed.subHeading'), + primaryButtonText: t('views.ADD_TOKENS.error.walletFailed.primaryButtonText'), onPrimaryButtonClick: goBackToAddTokensView, - secondaryButtonText: 'Close', + secondaryButtonText: t('views.ADD_TOKENS.error.walletFailed.secondaryButtonText'), onSecondaryButtonClick: goBackToAddTokensView, }, [AddTokensErrorTypes.WALLET_REJECTED]: { - headingText: 'Transaction rejected', - subHeadingText: - "You'll need to approve the transaction in your wallet to proceed.", - primaryButtonText: 'Retry', + headingText: t('views.ADD_TOKENS.error.walletRejected.heading'), + subHeadingText: t('views.ADD_TOKENS.error.walletRejected.subHeading'), + primaryButtonText: t('views.ADD_TOKENS.error.walletRejected.primaryButtonText'), onPrimaryButtonClick: goBackToAddTokensView, - secondaryButtonText: 'Close', + secondaryButtonText: t('views.ADD_TOKENS.error.walletRejected.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, [AddTokensErrorTypes.WALLET_REJECTED_NO_FUNDS]: { - headingText: 'Insufficient funds', - subHeadingText: - 'You do not have enough funds to complete the transaction.', - primaryButtonText: 'Retry', + headingText: t('views.ADD_TOKENS.error.walletRejectedNoFunds.heading'), + subHeadingText: t('views.ADD_TOKENS.error.walletRejectedNoFunds.subHeading'), + primaryButtonText: t('views.ADD_TOKENS.error.walletRejectedNoFunds.primaryButtonText'), onPrimaryButtonClick: goBackToAddTokensView, - secondaryButtonText: 'Close', + secondaryButtonText: t('views.ADD_TOKENS.error.walletRejectedNoFunds.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, [AddTokensErrorTypes.WALLET_POPUP_BLOCKED]: { - headingText: "Browser's popup blocked", - subHeadingText: 'Please allow pop-ups in your browser to proceed.', - primaryButtonText: 'Retry', + headingText: t('views.ADD_TOKENS.error.walletPopupBlocked.heading'), + subHeadingText: t('views.ADD_TOKENS.error.walletPopupBlocked.subHeading'), + primaryButtonText: t('views.ADD_TOKENS.error.walletPopupBlocked.primaryButtonText'), onPrimaryButtonClick: goBackToAddTokensView, - secondaryButtonText: 'Close', + secondaryButtonText: t('views.ADD_TOKENS.error.walletPopupBlocked.secondaryButtonText'), onSecondaryButtonClick: goBackToAddTokensView, }, [AddTokensErrorTypes.ENVIRONMENT_ERROR]: { - headingText: 'Unsupported environment', - subHeadingText: 'This is only supported in production environment.', - secondaryButtonText: 'Close', + headingText: t('views.ADD_TOKENS.error.environmentError.heading'), + subHeadingText: t('views.ADD_TOKENS.error.environmentError.subHeading'), + secondaryButtonText: t('views.ADD_TOKENS.error.environmentError.secondaryButtonText'), onSecondaryButtonClick: closeWidget, }, }; diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/views/AddTokens.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/views/AddTokens.tsx index 02a1ace7fe..094d75f993 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/views/AddTokens.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/views/AddTokens.tsx @@ -542,13 +542,13 @@ export function AddTokens({ toTokenAddress={toTokenAddress} /> {showInitialEmptyState ? ( - Add Token + {t('views.ADD_TOKENS.tokenSelection.buttonText')} ) : ( - Add + {t('views.ADD_TOKENS.tokenSelection.tokenLabel')} {' '} {selectedToken.symbol} @@ -588,7 +588,7 @@ export function AddTokens({ && inputValue ? { animation: `${PULSE_SHADOW} 2s infinite ease-in-out` } : {}} - label="Send from" + label={t('views.ADD_TOKENS.walletSelection.fromText')} providerInfo={{ ...fromProviderInfo, address: fromAddress, @@ -638,7 +638,7 @@ export function AddTokens({ && inputValue ? { animation: `${PULSE_SHADOW} 2s infinite ease-in-out` } : {}} - label="Deliver to" + label={t('views.ADD_TOKENS.walletSelection.toText')} providerInfo={{ ...toProviderInfo, address: toAddress, @@ -656,7 +656,7 @@ export function AddTokens({ onClick={handleReviewClick} sx={{ opacity: readyToReview ? 1 : 0.5 }} > - Review + {t('views.ADD_TOKENS.review.buttonText')} diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx index 0b7f58f22f..c1aa425c80 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx @@ -196,7 +196,7 @@ export function Review({ cursor: 'pointer', }} > - Included fees + {t('views.ADD_TOKENS.fees.includedFees')} {` ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} $${getFormattedAmounts(totalFeesUsd)}`} - {t('Zero fees')} + {t('views.ADD_TOKENS.fees.zeroFees')} ); }, [totalFeesUsd]); @@ -271,7 +271,7 @@ export function Review({ showHandover( APPROVE_TXN_ANIMATION, RiveStateMachineInput.START, - 'Preparing', + t('views.ADD_TOKENS.handover.preparing.heading'), ); const changeableProvider = await convertToNetworkChangeableProvider( @@ -294,8 +294,8 @@ export function Review({ showHandover( APPROVE_TXN_ANIMATION, RiveStateMachineInput.WAITING, - 'Waiting for access approval in your wallet', - 'Approve the transaction request to complete this transaction', + t('views.ADD_TOKENS.handover.requestingApproval.heading'), + t('views.ADD_TOKENS.handover.requestingApproval.subHeading'), ); const approveTxnReceipt = await approve(changeableProvider, route); @@ -307,7 +307,7 @@ export function Review({ showHandover( APPROVE_TXN_ANIMATION, RiveStateMachineInput.COMPLETED, - 'Granted access to your tokens', + t('views.ADD_TOKENS.handover.approved.heading'), '', FIXED_HANDOVER_DURATION, ); @@ -316,8 +316,8 @@ export function Review({ showHandover( EXECUTE_TXN_ANIMATION, RiveStateMachineInput.WAITING, - 'Waiting for transaction confirmation in your wallet', - 'Confirm the transaction request to complete this transaction', + t('views.ADD_TOKENS.handover.requestingExecution.heading'), + t('views.ADD_TOKENS.handover.requestingExecution.subHeading'), ); const executeTxnReceipt = await execute(squid, changeableProvider, route); @@ -337,7 +337,7 @@ export function Review({ showHandover( EXECUTE_TXN_ANIMATION, RiveStateMachineInput.PROCESSING, - 'Processing', + t('views.ADD_TOKENS.handover.executing.heading'), '', FIXED_HANDOVER_DURATION, ); @@ -345,9 +345,9 @@ export function Review({ showHandover( EXECUTE_TXN_ANIMATION, RiveStateMachineInput.COMPLETED, - 'Funds added successfully', + t('views.ADD_TOKENS.handover.executed.heading'), <> - Go to + {t('views.ADD_TOKENS.handover.executed.subHeadingGoTo')} {' '} {' '} - for transaction details + {t('views.ADD_TOKENS.handover.executed.subHeadingTransactionDetails')} , ); } @@ -381,7 +381,12 @@ export function Review({ ]); const formattedDuration = route - ? getDurationFormatted(route.route.estimate.estimatedRouteDuration) + ? getDurationFormatted( + route.route.estimate.estimatedRouteDuration, + t('views.ADD_TOKENS.routeSelection.minutesText'), + t('views.ADD_TOKENS.routeSelection.minuteText'), + t('views.ADD_TOKENS.routeSelection.secondsText'), + ) : ''; return ( @@ -431,7 +436,7 @@ export function Review({ {!!route && ( <> - Review + {t('views.ADD_TOKENS.review.heading')} @@ -459,7 +464,7 @@ export function Review({ - Send + {t('views.ADD_TOKENS.review.send')} {' '} {route.route.estimate.fromToken.name} @@ -526,11 +531,11 @@ export function Review({ - Swap + {t('views.ADD_TOKENS.review.swap')} {' '} {route.route.estimate.fromToken.name} {' '} - to + {t('views.ADD_TOKENS.review.to')} {' '} {route.route.estimate.toToken.name} @@ -538,7 +543,7 @@ export function Review({ size="small" sx={{ c: 'base.color.text.body.secondary' }} > - Powered by Squid + {t('views.ADD_TOKENS.review.poweredBySquid')}
1 {' '} @@ -596,7 +601,7 @@ export function Review({ - Receive + {t('views.ADD_TOKENS.review.receive')} {' '} {route?.route.estimate.toToken.name} @@ -682,7 +687,8 @@ export function Review({ disabled={proceedDisabled} sx={{ mx: 'base.spacing.x3' }} > - {proceedDisabled ? 'Processing' : 'Proceed'} + {proceedDisabled ? t('views.ADD_TOKENS.review.processingButtonText') + : t('views.ADD_TOKENS.review.proceedButtonText')} @@ -691,7 +697,7 @@ export function Review({ {!route && !showAddressMissmatchDrawer && ( )}