diff --git a/package-lock.json b/package-lock.json index 69b3cf2aa..318abc91b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21414,23 +21414,12 @@ "integrity": "sha512-1XgkCpwMnNQsuOIy938UCntz8Xzwt9ECwHaH3cCfIQK1SPpH+y7gCYtqEcb6Rm0hAUq7Lp9+Ljoti9zGMswYrQ==" }, "react-i18next": { - "version": "9.0.10", - "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-9.0.10.tgz", - "integrity": "sha512-xpeCWNut7ylQLs3Qqyo7dT13kgZbML1CdftbdnswLCv0RbRT16bRP16ma59iLe1KHIbn92VJo0Q8LSKYoXVNvg==", + "version": "10.11.4", + "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-10.11.4.tgz", + "integrity": "sha512-/CWXaf3a5BLNeVnBGxzWOIZLQgSNEc2LWHX4ZaJb7ww0xgY0S5K9HRAMzJIHeHGe7jfpSraprD66VDblWb4ZXA==", "requires": { "@babel/runtime": "^7.3.1", - "hoist-non-react-statics": "3.2.1", "html-parse-stringify2": "2.0.1" - }, - "dependencies": { - "hoist-non-react-statics": { - "version": "3.2.1", - "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.2.1.tgz", - "integrity": "sha512-TFsu3TV3YLY+zFTZDrN8L2DTFanObwmBLpWvJs1qfUuEQ5bTAdFcwfx2T/bsCXfM9QHSLvjfP+nihEl0yvozxw==", - "requires": { - "react-is": "^16.3.2" - } - } } }, "react-is": { diff --git a/package.json b/package.json index 71dd22c34..a26f3b6bb 100644 --- a/package.json +++ b/package.json @@ -28,7 +28,7 @@ "react-dom": "^16.6.0", "react-emoji-render": "^0.5.0", "react-file-reader-input": "^2.0.0", - "react-i18next": "^9.0.7", + "react-i18next": "^10.11.4", "react-linkify": "^0.2.2", "react-native-webview-messaging": "^1.2.3", "react-qr-reader": "^2.1.1", diff --git a/src/App.js b/src/App.js index 59acfa880..b15680919 100644 --- a/src/App.js +++ b/src/App.js @@ -3,7 +3,7 @@ import { Tx, Input, Output, Util } from 'leap-core'; import { Dapparatus, Transactions, Gas } from "dapparatus"; import { equal, bi } from 'jsbi-utils'; import Web3 from 'web3'; -import { I18nextProvider } from 'react-i18next'; +import { I18nextProvider, Translation } from 'react-i18next'; import i18n from './i18n'; import './App.scss'; import Header from './components/Header'; @@ -62,7 +62,7 @@ let mainStyle = { mainColor:"white", } -let title = i18n.t('app_name') +const title = i18n.t('app_name') let titleImage = ( ) @@ -101,8 +101,8 @@ const Warning = styled(Text).attrs(()=>({ export default class App extends Component { constructor(props) { + console.log('Props ', props) - console.log("[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[["+title+"]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]") let view = 'main' let cachedView = getStoredValue("view") let cachedViewSetAge = Date.now() - getStoredValue("viewSetTime") @@ -122,7 +122,7 @@ export default class App extends Component { sendKey: "", alert: null, loadingTitle:'loading...', - title: title, + title, extraHeadroom:0, balance: 0.00, vendors: {}, @@ -833,451 +833,347 @@ export default class App extends Component { return ( -
-
- {extraHead} - {networkOverlay} - {web3_setup} + + { + (t) => ( + // eslint-disable-next-line no-unused-expressions +
+
+ {extraHead} + {networkOverlay} + {web3_setup} -
- {header} +
+ {header} - {web3 /*&& this.checkNetwork()*/ && (() => { - //console.log("VIEW:",view) + {web3 /*&& this.checkNetwork()*/ && (() => { + //console.log("VIEW:",view) - let moreButtons = ( - - ) + let moreButtons = ( + + ) - let extraTokens = "" + let selected = "xDai" + let extraTokens = "" - let defaultBalanceDisplay = ( -
- -
- ) - - // NOTE: This view is to show specific historical transactions. - if(view.includes("account_")) { - const targetAddress = view.replace("account_","") - return ( -
- - - {defaultBalanceDisplay} - - - - { - this.changeView('main') - }} - /> -
- - ) - } - - // NOTE: This view shows specific historical transactions to - // bity.com - if (view.includes("bity_")) { - const orderId = view.replace("bity_","") - return ( -
- - - - - { - this.changeView('main') - }} - /> -
+ let defaultBalanceDisplay = ( +
+ +
+ ) - ) - } + // NOTE: This view is to show specific historical transactions. + if(view.includes("account_")) { + const targetAddress = view.replace("account_","") + return ( +
+ + + {defaultBalanceDisplay} + + - if (view.includes("loader_")) { - const network = view.replace("loader_"); - return ( -
-
+ { + this.changeView('main') + }} + /> +
- -
- -
- ); - } - - const sendByScan = ( - { - this.changeAlert("danger",error) - }} - /> - ) - - switch(view) { - case 'main': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - {extraTokens} - - {expertMode ? (<> - - - - - - ) : ( - - )} - - {/* eslint-disable-next-line jsx-a11y/accessible-emoji */} - 💀 This product is currently in early alpha. Use at your own risk! 💀 - - - - {moreButtons} - - - - - { - this.changeView('advanced') + ) + } + + // NOTE: This view shows specific historical transactions to + // bity.com + if (view.includes("bity_")) { + const orderId = view.replace("bity_","") + return ( +
+ + + + + { + this.changeView('main') + }} + /> +
+ + ) + } + + if (view.includes("loader_")) { + const network = view.replace("loader_"); + return ( +
+
+ + +
+ +
+ ); + } + + const sendByScan = ( + { + this.changeAlert("danger",error) }} /> -
- ); - case 'cashout': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - -
- + {this.state.scannerOpen ? sendByScan : null} + + {extraTokens} + + {expertMode ? (<> + + + + + + ) : ( + + )} + {/* eslint-disable-next-line jsx-a11y/accessible-emoji */} + 💀 This product is currently in early alpha. Use at your own risk! 💀 + + -
- + + {moreButtons} + + + + + { + this.changeView('advanced') + }} /> - - -
- ); - case 'advanced': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - - - - -
- ) - case 'withdraw_from_private': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - - {defaultBalanceDisplay} - + ); + case 'cashout': + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + +
+ +
+ + + +
+ ); + case 'advanced': + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + + + + - - { - this.changeView('main') - }} - /> -
- ); - case 'send_to_address': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - - {defaultBalanceDisplay} - - - -
- ); - case 'receipt': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - - - - -
- ); - case 'receive': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - - {defaultBalanceDisplay} - - - -
- ); - case 'request_funds': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - - {defaultBalanceDisplay} - + ) + case 'withdraw_from_private': + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + + {defaultBalanceDisplay} + + + { + this.changeView('main') + }} + /> +
+ ); + case 'send_to_address': + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + + {defaultBalanceDisplay} + + + - - { - this.changeView('main') - }} - /> -
- ); - case 'share': - - let url = window.location.protocol+"//"+window.location.hostname - if(window.location.port&&window.location.port!==80&&window.location.port!==443){ - url = url+":"+window.location.port - } - +
+ ); + case 'receipt': return (
{this.state.scannerOpen ? sendByScan : null} - - +
); - case 'share-link': + case 'receive': return (
{this.state.scannerOpen ? sendByScan : null} - - + {defaultBalanceDisplay} + + + +
+ ); + case 'request_funds': + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + + {defaultBalanceDisplay} + + + { + this.changeView('main') + }} + /> +
+ ); + case 'share': + + let url = window.location.protocol+"//"+window.location.hostname + if(window.location.port&&window.location.port!==80&&window.location.port!==443){ + url = url+":"+window.location.port + } + + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + + + + +
+ ); + case 'share-link': + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + + + + +
+ ); + case 'burn-wallet': + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + + {defaultBalanceDisplay} + { + burnMetaAccount() + if(RNMessageChannel){ + RNMessageChannel.send("burn") + } + if(localStorage&&typeof localStorage.setItem === "function"){ + localStorage.setItem(this.state.account+"loadedBlocksTop","") + localStorage.setItem(this.state.account+"metaPrivateKey","") + localStorage.setItem(this.state.account+"recentTxs","") + localStorage.setItem(this.state.account+"transactionsByAddress","") + this.setState({recentTxs:[],transactionsByAddress:{}}) + } + }} + /> + + +
+ ); + + case 'exchange': + return ( +
+ {this.state.scannerOpen ? sendByScan : null} + + + -
); - case 'burn-wallet': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - - {defaultBalanceDisplay} - { - burnMetaAccount() - if(RNMessageChannel){ - RNMessageChannel.send("burn") - } - storeValues({ - loadedBlocksTop: "", - metaPrivateKey: "", - recentTxs: "", - transactionsByAddress: "", - }, this.state.account); - this.setState({recentTxs:[],transactionsByAddress:{}}) - }} - /> - - -
- ); - - case 'exchange': - return ( -
- {this.state.scannerOpen ? sendByScan : null} - - - - -
- ); - case 'loader': - return ( -
-
- - -
- -
- ); - case 'reader': - return ( -
-
- -
- -
- ); - case 'claimer': - return ( -
-
- -
- -
- ); - default: - return ( -
unknown view
- ) - } - })()} - { ( false || !web3 /*|| !this.checkNetwork() */) && } - { alert &&
} -
- { - //console.log("DAPPARATUS UPDATE",state) - if (state.xdaiweb3) { - let xdaiContract; - try { - xdaiContract = new state.xdaiweb3.eth.Contract(require("./contracts/StableCoin.abi.js"), CONFIG.SIDECHAIN.DAI_ADDRESS) - } catch(err) { - console.log("Error loading PDAI contract"); - } - this.setState({xdaiContract}); - } - if (state.web3Provider) { - state.web3 = new Web3(state.web3Provider) - this.setState(state,()=>{ - //console.log("state set:",this.state) - if(this.state.possibleNewPrivateKey){ - this.dealWithPossibleNewPrivateKey() + case 'loader': + return ( +
+
+ + +
+ +
+ ); + case 'reader': + return ( +
+
+ +
+ +
+ ); + case 'claimer': + return ( +
+
+ +
+ +
+ ); + default: + return ( +
unknown view
+ ) + } + })()} + { ( false || !web3 /*|| !this.checkNetwork() */) && } + { alert &&
} +
+ { + //console.log("DAPPARATUS UPDATE",state) + if (state.xdaiweb3) { + let xdaiContract; + try { + xdaiContract = new state.xdaiweb3.eth.Contract(require("./contracts/StableCoin.abi.js"), CONFIG.SIDECHAIN.DAI_ADDRESS) + } catch(err) { + console.log("Error loading PDAI contract"); + } + this.setState({xdaiContract}); } - if(!this.state.parsingTheChain){ - this.setState({parsingTheChain:true},async ()=>{ - let upperBoundOfSearch = this.state.block - //parse through recent transactions and store in local storage - let initResult = this.initRecentTxs() - let recentTxs = initResult[0] - let transactionsByAddress = initResult[1] - let loadedBlocksTop = this.state.loadedBlocksTop - if (!loadedBlocksTop) { - loadedBlocksTop = getStoredValue("loadedBlocksTop", this.state.account) + if (state.web3Provider) { + state.web3 = new Web3(state.web3Provider) + this.setState(state,()=>{ + //console.log("state set:",this.state) + if(this.state.possibleNewPrivateKey){ + this.dealWithPossibleNewPrivateKey() } - // Look back through previous blocks since this account - // was last online... this could be bad. We might need a - // central server keeping track of all these and delivering - // a list of recent transactions - let updatedTxs = false - if (!loadedBlocksTop || loadedBlocksTop < this.state.block) { - if (!loadedBlocksTop) loadedBlocksTop = Math.max(2, this.state.block - 5) - if (this.state.block - loadedBlocksTop > MAX_BLOCK_TO_LOOK_BACK) { - loadedBlocksTop = this.state.block - MAX_BLOCK_TO_LOOK_BACK - } - let paddedLoadedBlocks = parseInt(loadedBlocksTop) + BLOCKS_TO_PARSE_PER_BLOCKTIME - //console.log("choosing the min of ",paddedLoadedBlocks,"and",this.state.block) - let parseBlock = Math.min(paddedLoadedBlocks, this.state.block) - //console.log("MIN:",parseBlock) - upperBoundOfSearch = parseBlock - console.log(" +++++++======== Parsing recent blocks ~" + this.state.block) - //first, if we are still back parsing, we need to look at *this* block too - if (upperBoundOfSearch < this.state.block) { - for (let b = this.state.block; b > this.state.block - 6; b--) { - //console.log(" ++ Parsing *CURRENT BLOCK* Block "+b+" for transactions...") - updatedTxs = (await this.parseBlocks(b, recentTxs, transactionsByAddress)) || updatedTxs + if(!this.state.parsingTheChain){ + this.setState({parsingTheChain:true},async ()=>{ + let upperBoundOfSearch = this.state.block + //parse through recent transactions and store in local storage + + if(localStorage&&typeof localStorage.setItem === "function"){ + + let initResult = this.initRecentTxs() + let recentTxs = initResult[0] + let transactionsByAddress = initResult[1] + + let loadedBlocksTop = this.state.loadedBlocksTop + if(!loadedBlocksTop){ + loadedBlocksTop = localStorage.getItem(this.state.account+"loadedBlocksTop") + } + // Look back through previous blocks since this account + // was last online... this could be bad. We might need a + // central server keeping track of all these and delivering + // a list of recent transactions + + let updatedTxs = false + if(!loadedBlocksTop || loadedBlocksTop MAX_BLOCK_TO_LOOK_BACK){ + loadedBlocksTop = this.state.block-MAX_BLOCK_TO_LOOK_BACK + } + + let paddedLoadedBlocks = parseInt(loadedBlocksTop)+BLOCKS_TO_PARSE_PER_BLOCKTIME + //console.log("choosing the min of ",paddedLoadedBlocks,"and",this.state.block) + let parseBlock=Math.min(paddedLoadedBlocks,this.state.block) + + //console.log("MIN:",parseBlock) + upperBoundOfSearch = parseBlock + console.log(" +++++++======== Parsing recent blocks ~"+this.state.block) + //first, if we are still back parsing, we need to look at *this* block too + if(upperBoundOfSearchthis.state.block-6;b--){ + //console.log(" ++ Parsing *CURRENT BLOCK* Block "+b+" for transactions...") + updatedTxs = (await this.parseBlocks(b,recentTxs,transactionsByAddress)) || updatedTxs + } + } + console.log(" +++++++======== Parsing from "+loadedBlocksTop+" to "+upperBoundOfSearch+"....") + while(loadedBlocksTop - { - console.log("Gas price update:",state) - const gwei = (state.gwei || this.state.gwei) + 0.1; - console.log("GWEI set:",gwei); - this.setState({ - ...state, - gwei - }) - }} - /> -
- {eventParser} -
-
+ }} + /> + { + console.log("Gas price update:",state) + const gwei = (state.gwei || this.state.gwei) + 0.1; + console.log("GWEI set:",gwei); + this.setState({ + ...state, + gwei + }) + }} + /> +
+ {eventParser} +
+
+ ) + } + ) diff --git a/src/components/Advanced.js b/src/components/Advanced.js index 8fcd01da6..762dc4c01 100644 --- a/src/components/Advanced.js +++ b/src/components/Advanced.js @@ -1,7 +1,7 @@ import React from 'react'; import { Scaler } from "dapparatus"; import { CopyToClipboard } from "react-copy-to-clipboard"; -import i18n from '../i18n'; +import { withTranslation } from 'react-i18next'; import { Input, QR as QRCode, @@ -16,7 +16,7 @@ import { getStoredValue, storeValues } from "../services/localStorage"; const { CURRENCY, LINKS } = getConfig() -export default class Advanced extends React.Component { +class Advanced extends React.Component { constructor(props) { super(props); this.state = { @@ -52,7 +52,7 @@ export default class Advanced extends React.Component { } render(){ - let {isVendor, balance, privateKey, changeAlert, changeView, setPossibleNewPrivateKey} = this.props + let {isVendor, balance, privateKey, changeAlert, changeView, setPossibleNewPrivateKey, t} = this.props let { currency, expertMode } = this.state let url = window.location.protocol+"//"+window.location.hostname @@ -112,7 +112,7 @@ export default class Advanced extends React.Component { changeAlert({type: 'warning', message: 'Invalid private key.'}) } }}> - {i18n.t('create')} + {t('create')}
) @@ -153,7 +153,7 @@ export default class Advanced extends React.Component { } }}> - {i18n.t('create')} + {t('create')} @@ -162,7 +162,7 @@ export default class Advanced extends React.Component { return (
- {i18n.t('currency.label')} + {t('currency.label')} {fields.IBAN.message} ) : null} - + - {i18n.t("offramp.form.submit")} + {t("offramp.form.submit")}
); } } -export default Bity; +export default withTranslation()(Bity); diff --git a/src/components/BityHistory.js b/src/components/BityHistory.js index f3397183f..624edac34 100644 --- a/src/components/BityHistory.js +++ b/src/components/BityHistory.js @@ -1,7 +1,7 @@ // @format import React, { Component } from "react"; -import i18n from "../i18n"; +import { withTranslation } from 'react-i18next'; import { Flex, Box, Image, Icon } from "rimble-ui"; import { getOrder } from "../services/bity"; import Blockies from "react-blockies"; @@ -10,7 +10,7 @@ import Ruler from "./Ruler"; import Loader from "./Loader"; import burnerlogo from "../assets/burnerwallet.png"; -export default class BityHistory extends Component { +class BityHistory extends Component { constructor(props) { super(props); this.state = {}; @@ -23,7 +23,7 @@ export default class BityHistory extends Component { } render() { - const { address, orderId } = this.props; + const { address, orderId, t } = this.props; const { order } = this.state; if (order) { @@ -54,27 +54,27 @@ export default class BityHistory extends Component { -
{i18n.t("offramp.history.status_title")}
+
{t("offramp.history.status_title")}
    {order.timestamp_created && ( -
  • ✓ {i18n.t("offramp.history.status.created")+orderId}
    • +
  • ✓ {t("offramp.history.status.created")+orderId}
    • )} {order.timestamp_payment_received && ( -
  • ✓ {i18n.t("offramp.history.status.received")}
    • +
  • ✓ {t("offramp.history.status.received")}
    • )} {order.timestamp_executed && ( -
  • ✓ {i18n.t("offramp.history.status.executed")}
    • +
  • ✓ {t("offramp.history.status.executed")}
    • )}

- *{i18n.t("offramp.history.disclaimer")} + *{t("offramp.history.disclaimer")} - {i18n.t("offramp.history.click")} + {t("offramp.history.click")} .

@@ -85,3 +85,4 @@ export default class BityHistory extends Component { } } } +export default withTranslation()(BityHistory) \ No newline at end of file diff --git a/src/components/Bottom.js b/src/components/Bottom.js index 7aaa95f5e..60ffb3c1c 100644 --- a/src/components/Bottom.js +++ b/src/components/Bottom.js @@ -1,14 +1,14 @@ import React from 'react'; -import i18n from '../i18n'; +import { withTranslation } from 'react-i18next' import { Icon } from 'rimble-ui' import { ActionButton } from '../components/Buttons' -export default class Receive extends React.Component { +class Receive extends React.Component { render() { - let {icon,text,action} = this.props + let {icon,text,action, t} = this.props if(!icon) icon = "times" - if(!text) text = i18n.t('done') + if(!text) text = t('done') //icon = "fas fa-"+icon @@ -22,3 +22,4 @@ export default class Receive extends React.Component { ) } } +export default withTranslation()(Receive) \ No newline at end of file diff --git a/src/components/BurnWallet.js b/src/components/BurnWallet.js index b7e699e80..cfe951a6f 100644 --- a/src/components/BurnWallet.js +++ b/src/components/BurnWallet.js @@ -1,35 +1,61 @@ -import React from 'react'; +import React from "react"; import Ruler from "./Ruler"; -import i18n from '../i18n'; - +import { Translation } from "react-i18next"; export default ({ mainStyle, burnWallet, goBack }) => { return ( -
-
- {i18n.t('burn_wallet.burn_private_key_question')} -
-
- {i18n.t('burn_wallet.disclaimer')} -
-
- -
+ + {(t) => ( + // eslint-disable-next-line no-unused-expressions + <> +
+ {t("burn_wallet.burn_private_key_question")} +
+
+ {t("burn_wallet.disclaimer")} +
+
+ +
+
+ +
-
- +
+ +
- -
-
-
-
- -
- ) -} + + )} + + ); +}; diff --git a/src/components/Exchange.js b/src/components/Exchange.js index 7298eb58d..c70c2107a 100644 --- a/src/components/Exchange.js +++ b/src/components/Exchange.js @@ -4,7 +4,7 @@ import Ruler from "./Ruler"; import Blockies from 'react-blockies'; import { Scaler } from "dapparatus"; import Web3 from 'web3'; -import i18n from '../i18n'; +import { withTranslation } from 'react-i18next'; import { Flex, Box, @@ -39,7 +39,7 @@ const uniswapContractObject = { let metaReceiptTracker = {} -export default class Exchange extends React.Component { +class Exchange extends React.Component { constructor(props) { super(props); @@ -74,13 +74,13 @@ export default class Exchange extends React.Component { xdaiMetaAccount: xdaiMetaAccount, daiToXdaiMode: false, ethToDaiMode: false, - loaderBarStatusText: i18n.t('loading'), + loaderBarStatusText: props.t('loading'), loaderBarStartTime:Date.now(), loaderBarPercent: 2, loaderBarColor: "#aaaaaa", gwei: 5, maxWithdrawlAmount: 0.00, - withdrawalExplanation: i18n.t('exchange.withdrawal_explanation'), + withdrawalExplanation: props.t('exchange.withdrawal_explanation'), gettingGas:false, } @@ -159,11 +159,11 @@ export default class Exchange extends React.Component { console.log("watching for ",this.props.daiBalance,"to be ",this.state.daiBalanceShouldBe-0.0005) if(this.props.daiBalance>=(this.state.daiBalanceShouldBe-0.0005)){ - this.setState({loaderBarPercent:100,loaderBarStatusText: i18n.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) + this.setState({loaderBarPercent:100,loaderBarStatusText: this.props.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) setTimeout(()=>{ this.setState({ daiToXdaiMode: false, - loaderBarStatusText: i18n.t('loading'), + loaderBarStatusText: this.props.t('loading'), loaderBarStartTime:0, loaderBarPercent: 1, loaderBarColor: "#FFFFFF" @@ -179,11 +179,11 @@ export default class Exchange extends React.Component { //console.log("watching for ",this.state.xdaiBalance,"to be ",this.state.xdaiBalanceShouldBe-0.0005) if(this.props.xdaiBalance>=(this.state.xdaiBalanceShouldBe-0.0005)){ - this.setState({loaderBarPercent:100,loaderBarStatusText: i18n.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) + this.setState({loaderBarPercent:100,loaderBarStatusText: this.props.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) setTimeout(()=>{ this.setState({ daiToXdaiMode: false, - loaderBarStatusText: i18n.t('loading'), + loaderBarStatusText: this.props.t('loading'), loaderBarStartTime:0, loaderBarPercent: 1, loaderBarColor: "#FFFFFF" @@ -198,11 +198,11 @@ export default class Exchange extends React.Component { console.log("watching for ",this.props.daiBalance,"to be ",this.state.daiBalanceShouldBe-0.0005) if(this.props.daiBalance<=(this.state.daiBalanceShouldBe-0.0005)){ - this.setState({loaderBarPercent:100,loaderBarStatusText: i18n.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) + this.setState({loaderBarPercent:100,loaderBarStatusText: this.props.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) setTimeout(()=>{ this.setState({ daiToXdaiMode: false, - loaderBarStatusText: i18n.t('loading'), + loaderBarStatusText: this.props.t('loading'), loaderBarStartTime:0, loaderBarPercent: 1, loaderBarColor: "#FFFFFF" @@ -221,11 +221,11 @@ export default class Exchange extends React.Component { //ethBalanceShouldBe:this.state.ethBalance+amountOfChange, console.log("watching for ",this.props.ethBalance,"to be ",this.state.ethBalanceShouldBe-0.001) if(parseFloat(this.props.ethBalance)>=(this.state.ethBalanceShouldBe-0.001)){ - this.setState({loaderBarPercent:100,loaderBarStatusText: i18n.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) + this.setState({loaderBarPercent:100,loaderBarStatusText: this.props.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) setTimeout(()=>{ this.setState({ ethToDaiMode: false, - loaderBarStatusText: i18n.t('loading'), + loaderBarStatusText: this.props.t('loading'), loaderBarStartTime:0, loaderBarPercent: 1, loaderBarColor: "#FFFFFF" @@ -241,11 +241,11 @@ export default class Exchange extends React.Component { //console.log("watching for ",this.state.xdaiBalance,"to be ",this.state.xdaiBalanceShouldBe-0.0005) if(this.props.daiBalance>=(this.state.daiBalanceShouldBe-0.0005)){ - this.setState({loaderBarPercent:100,loaderBarStatusText: i18n.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) + this.setState({loaderBarPercent:100,loaderBarStatusText: this.props.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) setTimeout(()=>{ this.setState({ ethToDaiMode: false, - loaderBarStatusText: i18n.t('loading'), + loaderBarStatusText: this.props.t('loading'), loaderBarStartTime:0, loaderBarPercent: 1, loaderBarColor: "#FFFFFF" @@ -261,11 +261,11 @@ export default class Exchange extends React.Component { //ethBalanceShouldBe:this.state.ethBalance+amountOfChange, console.log("watching for ",this.props.ethBalance,"to be ",this.state.ethBalanceShouldBe-0.001) if(parseFloat(this.props.ethBalance)<=(this.state.ethBalanceShouldBe-0.001)){ - this.setState({loaderBarPercent:100,loaderBarStatusText: i18n.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) + this.setState({loaderBarPercent:100,loaderBarStatusText: this.props.t('exchange.funds_bridged'),loaderBarColor:"#62f54a"}) setTimeout(()=>{ this.setState({ ethToDaiMode: false, - loaderBarStatusText: i18n.t('loading'), + loaderBarStatusText: this.props.t('loading'), loaderBarStartTime:0, loaderBarPercent: 1, loaderBarColor: "#FFFFFF" @@ -294,22 +294,22 @@ export default class Exchange extends React.Component { daiSendAmount = `${convertCurrency(daiSendAmount, `USD/${displayCurrency}`)}`; if(parseFloat(daiBalance) 0)){ - changeAlert({type: 'warning',message: i18n.t('exchange.invalid_to_amount')}); + changeAlert({type: 'warning',message: this.props.t('exchange.invalid_to_amount')}); }else{ this.setState({ daiToXdaiMode:"sending", daiBalanceAtStart:daiBalance, daiBalanceShouldBe:parseFloat(daiBalance) - parseFloat(daiSendAmount), loaderBarColor:"#f5eb4a", - loaderBarStatusText: i18n.t('exchange.calculate_gas_price'), + loaderBarStatusText: this.props.t('exchange.calculate_gas_price'), loaderBarPercent:0, loaderBarStartTime: Date.now(), loaderBarClick:()=>{ - alert(i18n.t('exchange.go_to_etherscan')) + alert(this.props.t('exchange.go_to_etherscan')) } }) this.setState({sendDai:false}) @@ -555,22 +555,22 @@ export default class Exchange extends React.Component { let actualEthSendAmount = parseFloat(ethSendAmount)/parseFloat(ethprice) if(parseFloat(ethBalance)0)){ - changeAlert({type: 'warning',message: i18n.t('exchange.invalid_to_amount')}); + changeAlert({type: 'warning',message: this.props.t('exchange.invalid_to_amount')}); }else{ this.setState({ ethToDaiMode:"sending", ethBalanceAtStart:ethBalance, ethBalanceShouldBe:parseFloat(ethBalance)-actualEthSendAmount, loaderBarColor:"#f5eb4a", - loaderBarStatusText: i18n.t('exchange.calculate_gas_price'), + loaderBarStatusText: this.props.t('exchange.calculate_gas_price'), loaderBarPercent:0, loaderBarStartTime: Date.now(), loaderBarClick:()=>{ - alert(i18n.t('exchange.go_to_etherscan')) + alert(this.props.t('exchange.go_to_etherscan')) }, sendEth: false }) @@ -695,7 +695,7 @@ export default class Exchange extends React.Component { loaderBarColor:"#4ab3f5", loaderBarStatusText:message, loaderBarClick:()=>{ - alert(i18n.t('exchange.idk')); + alert(this.props.t('exchange.idk')); } }) if(call){ @@ -723,20 +723,20 @@ export default class Exchange extends React.Component { } } render() { - const { address } = this.props; + const { address, t } = this.props; let {daiToXdaiMode,ethToDaiMode } = this.state let ethCancelButton = { this.setState({ethToDaiAmount:"",ethToDaiMode:false}) }}> - {i18n.t('cancel')} + {t('cancel')} let daiCancelButton = { this.setState({daiToXdaiAmount:"",daiToXdaiMode:false}) }}> - {i18n.t('cancel')} + {t('cancel')} let buttonsDisabled = ( @@ -747,7 +747,7 @@ export default class Exchange extends React.Component { let adjustedFontSize = Math.round((Math.min(document.documentElement.clientWidth,600)/600)*24) let adjustedTop = Math.round((Math.min(document.documentElement.clientWidth,600)/600)*-20)+9 - let daiToXdaiDisplay = i18n.t('loading') + let daiToXdaiDisplay = t('loading') //console.log("daiToXdaiMode",daiToXdaiMode) if(daiToXdaiMode==="sending" || daiToXdaiMode==="withdrawing" || daiToXdaiMode==="depositing"){ @@ -816,11 +816,11 @@ export default class Exchange extends React.Component { xdaiBalanceAtStart:this.props.xdaiBalance, xdaiBalanceShouldBe:parseFloat(this.props.xdaiBalance)+parseFloat(this.state.daiToXdaiAmount), loaderBarColor:"#3efff8", - loaderBarStatusText: i18n.t('exchange.calculate_gas_price'), + loaderBarStatusText: this.props.t('exchange.calculate_gas_price'), loaderBarPercent:0, loaderBarStartTime: Date.now(), loaderBarClick:()=>{ - alert(i18n.t('exchange.go_to_etherscan')) + alert(t('exchange.go_to_etherscan')) } }) @@ -834,7 +834,7 @@ export default class Exchange extends React.Component { loaderBarColor:"#4ab3f5", loaderBarStatusText:"Waiting for bridge...", loaderBarClick:()=>{ - alert(i18n.t('exchange.idk')) + alert(t('exchange.idk')) } }) }) @@ -889,7 +889,7 @@ export default class Exchange extends React.Component { // NOTE: Technically we're not "depositing" but that was the // only way I was able to make the loading bar show up... daiToXdaiMode:"depositing", - loaderBarStatusText: i18n.t('exchange.fast_exit_swap'), + loaderBarStatusText: t('exchange.fast_exit_swap'), loaderBarColor:"#3efff8", loaderBarPercent:30, loaderBarStartTime: Date.now(), @@ -928,7 +928,7 @@ export default class Exchange extends React.Component { console.log(rsp); this.updatePendingExits(this.state.daiAddress, this.state.xdaiweb3); this.setState({ - loaderBarStatusText: i18n.t('exchange.fast_exit_patience'), + loaderBarStatusText: t('exchange.fast_exit_patience'), loaderBarPercent:75, loaderBarStartTime: Date.now(), loaderBarClick:()=>{ @@ -938,7 +938,7 @@ export default class Exchange extends React.Component { this.setState({ daiToXdaiAmount: "", daiToXdaiMode: false }); this.props.changeAlert({ type: "success", - message: i18n.t("exchange.fast_exit_patience") + message: t("exchange.fast_exit_patience") }); }).catch(err => { console.log(err); @@ -965,7 +965,7 @@ export default class Exchange extends React.Component { this.updatePendingExits(this.state.daiAddress, this.state.xdaiweb3); this.props.changeAlert({ type: "success", - message: i18n.t("exchange.fast_exit_patience") + message: t("exchange.fast_exit_patience") }); this.setState({ daiToXdaiAmount: "", @@ -1010,7 +1010,7 @@ export default class Exchange extends React.Component { ) } - let ethToDaiDisplay = i18n.t('loading') + let ethToDaiDisplay = t('loading') if(ethToDaiMode==="sending" || ethToDaiMode==="depositing" || ethToDaiMode==="withdrawing"){ ethToDaiDisplay = ( @@ -1096,11 +1096,11 @@ export default class Exchange extends React.Component { this.setState({ ethToDaiMode:"depositing", loaderBarColor:"#3efff8", - loaderBarStatusText: i18n.t('exchange.calculate_gas_price'), + loaderBarStatusText: t('exchange.calculate_gas_price'), loaderBarPercent:0, loaderBarStartTime: Date.now(), loaderBarClick:()=>{ - alert(i18n.t('exchange.go_to_etherscan')) + alert(t('exchange.go_to_etherscan')) } }) @@ -1122,7 +1122,7 @@ export default class Exchange extends React.Component { loaderBarColor:"#4ab3f5", loaderBarStatusText:"Waiting for 🦄 exchange...", loaderBarClick:()=>{ - alert(i18n.t('exchange.idk')) + alert(t('exchange.idk')) } }) } @@ -1206,11 +1206,11 @@ export default class Exchange extends React.Component { this.setState({ ethToDaiMode:"withdrawing", loaderBarColor:"#3efff8", - loaderBarStatusText: i18n.t('exchange.calculate_gas_price'), + loaderBarStatusText: t('exchange.calculate_gas_price'), loaderBarPercent:0, loaderBarStartTime: Date.now(), loaderBarClick:()=>{ - alert(i18n.t('exchange.go_to_etherscan')) + alert(t('exchange.go_to_etherscan')) } }) @@ -1349,7 +1349,7 @@ export default class Exchange extends React.Component { loaderBarColor:"#42ceb2", loaderBarStatusText:"Approving 🦄 exchange...", loaderBarClick:()=>{ - alert(i18n.t('exchange.idk')) + alert(t('exchange.idk')) } }) @@ -1367,7 +1367,7 @@ export default class Exchange extends React.Component { loaderBarColor:"#4ab3f5", loaderBarStatusText:"Sending funds to 🦄 Exchange...", loaderBarClick:()=>{ - alert(i18n.t('exchange.idk')) + alert(t('exchange.idk')) } }) @@ -1390,7 +1390,7 @@ export default class Exchange extends React.Component { loaderBarColor:"#4ab3f5", loaderBarStatusText:"Sending funds to 🦄 Exchange...", loaderBarClick:()=>{ - alert(i18n.t('exchange.idk')) + alert(t('exchange.idk')) } }) @@ -1782,7 +1782,7 @@ export default class Exchange extends React.Component { this.props.changeView("cashout"); }}> - {i18n.t("offramp.account")} + {t("offramp.account")}
@@ -1791,3 +1791,5 @@ export default class Exchange extends React.Component { ) } } + +export default withTranslation()(Exchange); \ No newline at end of file diff --git a/src/components/MainCard.js b/src/components/MainCard.js index 5afb96c05..4dd67399a 100644 --- a/src/components/MainCard.js +++ b/src/components/MainCard.js @@ -1,34 +1,29 @@ import React from "react"; import { Flex, Icon, Box } from "rimble-ui"; -import i18next from "i18next"; +import { withTranslation } from "react-i18next"; import { PrimaryButton } from "./Buttons"; -export default ({ - changeView, -}) => { - let sendButtons = ( - - - - changeView("receive")}> - - - {i18next.t("main_card.receive")} - - - - - changeView("send_to_address")}> - - - {i18next.t("main_card.send")} - - - - - - ); +const MainCard = ({ changeView, t }) => ( + + + + changeView("receive")}> + + + {t("main_card.receive")} + + + + + changeView("send_to_address")}> + + + {t("main_card.send")} + + + + + +); - - return sendButtons -}; +export default withTranslation()(MainCard); diff --git a/src/components/MoreButtons.js b/src/components/MoreButtons.js index 03fb7af9d..11f0a28bf 100644 --- a/src/components/MoreButtons.js +++ b/src/components/MoreButtons.js @@ -1,12 +1,13 @@ import React from "react"; -import i18n from "../i18n"; import { Flex, Icon, Box } from "rimble-ui"; import { BorderButton } from "./Buttons"; +import { withTranslation } from "react-i18next"; -export default ({ +const MoreButtons = ({ isVendor, changeView, - expertMode + expertMode, + t }) => { let exchangeButton; @@ -20,7 +21,7 @@ export default ({ > - {i18n.t("more_buttons.exchange")} + {t("more_buttons.exchange")} ); @@ -51,7 +52,7 @@ export default ({ > - {i18n.t("more_buttons.request")} + {t("more_buttons.request")} @@ -59,3 +60,5 @@ export default ({ ); }; + +export default withTranslation()(MoreButtons) \ No newline at end of file diff --git a/src/components/Receipt.js b/src/components/Receipt.js index 3905ebce2..f86f9ca30 100644 --- a/src/components/Receipt.js +++ b/src/components/Receipt.js @@ -2,13 +2,13 @@ import React from 'react'; import { Blockie } from "dapparatus"; -import i18n from '../i18n'; +import { withTranslation } from 'react-i18next'; import bityLogo from '../assets/bity.png'; import { Image } from "rimble-ui"; const BockieSize = 12 -export default class Receive extends React.Component { +class Receive extends React.Component { componentDidMount(){ console.log("RECEIPT LOADED",this.props) @@ -39,7 +39,7 @@ export default class Receive extends React.Component { } } render() { - let {receipt, currencyDisplay} = this.props + let {receipt, currencyDisplay, t} = this.props let message = "" @@ -99,7 +99,7 @@ export default class Receive extends React.Component { @@ -107,3 +107,4 @@ export default class Receive extends React.Component { ) } } +export default withTranslation()(Receive) \ No newline at end of file diff --git a/src/components/Receive.js b/src/components/Receive.js index eaadffc52..fc5316dad 100644 --- a/src/components/Receive.js +++ b/src/components/Receive.js @@ -2,8 +2,8 @@ import React from 'react'; import {CopyToClipboard} from "react-copy-to-clipboard"; +import { Trans, withTranslation } from 'react-i18next'; import RecentTransactions from './RecentTransactions'; -import i18n from '../i18n'; import getConfig from "../config"; import { Flex, @@ -14,7 +14,7 @@ import { const CONFIG = getConfig(); -export default class Receive extends React.Component { +class Receive extends React.Component { render() { let { @@ -24,13 +24,14 @@ export default class Receive extends React.Component { changeAlert, changeView, currencyDisplay, + t } = this.props return (
{ - changeAlert({type: 'success', message: i18n.t('receive.address_copied')}) + changeAlert({type: 'success', message: t('receive.address_copied')}) }}> @@ -42,9 +43,11 @@ export default class Receive extends React.Component { {this.props.goBack()}}> - {i18n.t('cancel')} + {t('cancel')}
@@ -70,3 +73,5 @@ export default class Receive extends React.Component { ) } } + +export default withTranslation()(Receive); \ No newline at end of file diff --git a/src/components/RequestFunds.js b/src/components/RequestFunds.js index 157fd7d03..7bf7581f4 100644 --- a/src/components/RequestFunds.js +++ b/src/components/RequestFunds.js @@ -1,6 +1,6 @@ import React from 'react'; import {CopyToClipboard} from "react-copy-to-clipboard"; -import i18n from '../i18n'; +import { withTranslation } from 'react-i18next'; import RecentTransactions from './RecentTransactions'; import { Flex, @@ -12,7 +12,7 @@ import { import { PrimaryButton } from "./Buttons"; import { getStoredValue } from "../services/localStorage"; -export default class RequestFunds extends React.Component { +class RequestFunds extends React.Component { constructor(props) { super(props); @@ -46,13 +46,7 @@ export default class RequestFunds extends React.Component { render() { let { canRequest, message, amount, requested } = this.state; - let { - currencyDisplay, - view, - buttonStyle, - address, - changeView, - } = this.props + let {currencyDisplay, view, buttonStyle, ERC20TOKEN, address, changeView, t} = this.props if(requested){ let url = window.location.protocol+"//"+window.location.hostname @@ -109,7 +103,7 @@ export default class RequestFunds extends React.Component { }else{ return (
- + - + - {i18n.t('request_funds.button')} + {t('request_funds.button')}
) @@ -143,3 +137,5 @@ export default class RequestFunds extends React.Component { } } + +export default withTranslation()(RequestFunds) \ No newline at end of file diff --git a/src/components/SendByScan.js b/src/components/SendByScan.js index c77519d5e..996103efc 100644 --- a/src/components/SendByScan.js +++ b/src/components/SendByScan.js @@ -3,7 +3,7 @@ import QrReader from "react-qr-reader"; import FileReaderInput from 'react-file-reader-input'; import qrimage from '../assets/qrcode.png'; import RNMessageChannel from 'react-native-webview-messaging'; -import i18n from "../i18n"; +import { withTranslation } from 'react-i18next'; import Web3 from 'web3'; function base64ToBitmap(base64) { @@ -197,7 +197,7 @@ class SendByScan extends Component { }) } render() { - + let { t } = this.props let displayedImage = "" if(this.state.imageData){ displayedImage = ( @@ -230,7 +230,7 @@ class SendByScan extends Component {
-
{i18n.t('send_by_scan.try_again')}
+
{t('send_by_scan.try_again')}
@@ -264,11 +264,11 @@ class SendByScan extends Component {
-
{i18n.t('send_by_scan.capture')}
+
{t('send_by_scan.capture')}
@@ -300,4 +300,4 @@ class SendByScan extends Component { } } -export default SendByScan; +export default withTranslation()(SendByScan); diff --git a/src/components/SendToAddress.js b/src/components/SendToAddress.js index f242ce5eb..9e348cddb 100644 --- a/src/components/SendToAddress.js +++ b/src/components/SendToAddress.js @@ -2,8 +2,8 @@ import React from 'react'; import cookie from 'react-cookies' import {CopyToClipboard} from "react-copy-to-clipboard"; import Blockies from 'react-blockies'; -import { scroller } from 'react-scroll' -import i18n from '../i18n'; +import { scroller } from 'react-scroll'; +import { withTranslation } from 'react-i18next'; import queryString from 'query-string'; import { Box, @@ -14,7 +14,7 @@ import { PrimaryButton, BorderButton } from "./Buttons"; import InputInfo from "./InputInfo"; import { getStoredValue } from "../services/localStorage"; -export default class SendToAddress extends React.Component { +class SendToAddress extends React.Component { constructor(props) { super(props); @@ -32,6 +32,7 @@ export default class SendToAddress extends React.Component { convertCurrency, changeAlert, address, + t } = props; @@ -54,7 +55,7 @@ export default class SendToAddress extends React.Component { // NOTE: In this case, we scan the RequestFunds QR code and if "currency" // is missing, we display a warning. } else if (((toAddress && amount) || message) && !currency) { - changeAlert({type: "warning", message: i18n.t("send_to_address.currency_error")}); + changeAlert({type: "warning", message: t("send_to_address.currency_error")}); // NOTE: We're setting currency equal to displayCurrency here to not // trigger the next condition, as that would set currencyWarning to // true again. @@ -160,7 +161,7 @@ export default class SendToAddress extends React.Component { send = async () => { let { toAddress, amount } = this.state; - let { address, convertCurrency, currencyDisplay } = this.props + let { address, convertCurrency, currencyDisplay, t } = this.props const displayCurrency = getStoredValue("currency", address); amount = convertCurrency(amount, `USD/${displayCurrency}`); @@ -237,7 +238,7 @@ export default class SendToAddress extends React.Component { }) } }else{ - this.props.changeAlert({type: 'warning', message: i18n.t('send_to_address.error')}) + this.props.changeAlert({type: 'warning', message: t('send_to_address.error')}) } }; @@ -247,6 +248,8 @@ export default class SendToAddress extends React.Component { toAddress } = this.state; + let { t } = this.props; + /*let sendMessage = "" if(this.state.message){ sendMessage = ( @@ -292,7 +295,7 @@ export default class SendToAddress extends React.Component { return (
- + }
- + {amountInputDisplay} {/* TODO: i18n this with merging PR #195 */ this.state.currencyWarning ? ( @@ -355,3 +358,4 @@ export default class SendToAddress extends React.Component { ) } } +export default withTranslation()(SendToAddress); \ No newline at end of file diff --git a/src/components/Share.js b/src/components/Share.js index c3bea204c..04488c60d 100644 --- a/src/components/Share.js +++ b/src/components/Share.js @@ -1,6 +1,6 @@ import React from 'react'; import { CopyToClipboard } from "react-copy-to-clipboard"; -import i18n from '../i18n'; +import { withTranslation } from 'react-i18next'; import { Flex, Box, @@ -8,18 +8,19 @@ import { QR as QRCode } from 'rimble-ui' -export default class Receive extends React.Component { +class Receive extends React.Component { render() { let { changeAlert, - url + url, + t } = this.props return (
{ - changeAlert({type: 'success', message: i18n.t('share.copied')}) + changeAlert({type: 'success', message: t('share.copied')}) }}> @@ -34,3 +35,5 @@ export default class Receive extends React.Component { ) } } + +export default withTranslation()(Receive) diff --git a/src/components/WithdrawFromPrivate.js b/src/components/WithdrawFromPrivate.js index 2d3442cee..2fc59aac8 100644 --- a/src/components/WithdrawFromPrivate.js +++ b/src/components/WithdrawFromPrivate.js @@ -2,7 +2,7 @@ import React from 'react'; import Web3 from 'web3'; import { Scaler } from "dapparatus"; import Blockies from 'react-blockies'; -import i18n from '../i18n'; +import { withTranslation } from 'react-i18next'; import { Box, Field, @@ -16,7 +16,7 @@ import { PrimaryButton } from "./Buttons"; // TODO: Can this be state of SendToAddress? let pollInterval -export default class SendToAddress extends React.Component { +class SendToAddress extends React.Component { constructor(props) { super(props); @@ -110,13 +110,13 @@ export default class SendToAddress extends React.Component { message: 'Withdrawn!' }); }else{ - this.props.changeAlert({type: 'warning', message: i18n.t('withdraw_from_private.error')}) + this.props.changeAlert({type: 'warning', message: this.props.t('withdraw_from_private.error')}) } }; render() { let { canWithdraw, fromAddress } = this.state; - let { currencyDisplay } = this.props; + let { currencyDisplay, t } = this.props; let products = [] for(let p in this.props.products){ @@ -176,7 +176,7 @@ export default class SendToAddress extends React.Component { {currencyDisplay(this.state.fromBalance)} - + - + - {i18n.t('withdraw_from_private.withdraw')} + {t('withdraw_from_private.withdraw')}
) } } +export default withTranslation()(SendToAddress) \ No newline at end of file diff --git a/src/i18n/index.js b/src/i18n/index.js index 49af2ce9d..28148f1c3 100644 --- a/src/i18n/index.js +++ b/src/i18n/index.js @@ -1,15 +1,14 @@ -import i18next from "i18next"; +import i18n from "i18next"; import LanguageDetector from "i18next-browser-languagedetector"; import { fr, en, es, ca, de, ro, he, ru, pt, ja } from "./locales"; +import { initReactI18next } from 'react-i18next'; -const i18n = i18next; const options = { interpolation: { escapeValue: false // not needed for react!! }, debug: true, - resources: { fr: { common: fr.fr @@ -53,12 +52,13 @@ const options = { wait: false, bindI18n: "languageChanged loaded", bindStore: "added removed", - nsMode: "default" + nsMode: "default", + transSupportBasicHtmlNodes: true, } }; -i18next.use(LanguageDetector).init(options); -i18next.changeLanguage(navigator.language, (err, t) => { +i18n.use(LanguageDetector).use(initReactI18next).init(options); +i18n.changeLanguage(navigator.language, (err, t) => { if (err) return console.log("Something went wrong during loading"); }); diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index d49bbf4d6..11ad2ed90 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -67,7 +67,8 @@ "exchange": "Exchange" }, "receive": { - "address_copied": "Address copied to clipboard" + "address_copied": "Address copied to clipboard", + "view_link": "<0>View on LeapDAO Testnet Explorer" }, "history": { "metamask_error": "Encrypted messaging not available with MetaMask", @@ -152,7 +153,8 @@ "errors": { "bity_connection": "There was a problem connecting to our exchange provider bity.com. Please try again later.", "ethgasstation_connection": "There was a problem getting the latest gas prices. Please try sending your transaction later." - } + }, + "heading": "Transfer your ether directly to your bank account with just one click using <1>bity.com, the secure swiss crypto gateway. No KYC is required within bity.com's 5000 CHF (~4500 EUR) annual limit." } } }