diff --git a/__tests__/components/Claim.test.js b/__tests__/components/Claim.test.js index eea4255f2..13e78c571 100644 --- a/__tests__/components/Claim.test.js +++ b/__tests__/components/Claim.test.js @@ -1,6 +1,7 @@ import React from 'react' import { shallow, mount } from 'enzyme' import { progressValues } from 'spunky' +import { injectIntl } from 'react-intl' import { createStore, provideStore } from '../testHelpers' import Claim from '../../app/containers/Claim/Claim' @@ -9,6 +10,8 @@ import { DEFAULT_LANGUAGE } from '../../app/core/constants' const { LOADED } = progressValues +const ClaimWithIntl = injectIntl(Claim) + const initialState = { spunky: { settings: { @@ -22,6 +25,12 @@ const initialState = { }, } +const INTL_STUB = { + noClaimableGas: 'Address has no claimable GAS', + claimTimeDisclaimer: 'You can claim GAS once every 5 minutes', + claimUnavailableInWatch: 'GAS claims are unavailable in Watch mode', +} + describe('Claim', () => { const props = { doGasClaim: () => {}, @@ -30,12 +39,20 @@ describe('Claim', () => { } test('should render claim GAS button as enabled', () => { - const wrapper = shallow() + const wrapper = shallow( + INTL_STUB[id] }} {...props} />, + ) expect(wrapper).toMatchSnapshot() }) test('should render claim GAS button as disabled', () => { - const wrapper = shallow() + const wrapper = shallow( + INTL_STUB[id] }} + {...props} + disableClaimButton + />, + ) expect(wrapper).toMatchSnapshot() }) @@ -46,7 +63,7 @@ describe('Claim', () => { const wrapper = mount( provideStore( - + , store, ), @@ -66,7 +83,7 @@ describe('Claim', () => { const wrapper = mount( provideStore( - + , store, ), diff --git a/__tests__/components/Send.test.js b/__tests__/components/Send.test.js index eac0eb749..d84f2efae 100644 --- a/__tests__/components/Send.test.js +++ b/__tests__/components/Send.test.js @@ -4,6 +4,7 @@ import { uniqueId } from 'lodash-es' import configureStore from 'redux-mock-store' import { Provider } from 'react-redux' import { progressValues } from 'spunky' +import { injectIntl } from 'react-intl' import Send from '../../app/containers/Send/Send' import ZeroAssets from '../../app/components/ZeroAssets/ZeroAssets' @@ -28,12 +29,14 @@ const initialState = { }, } +const SendWithIntl = injectIntl(Send) + const setup = props => { const store = configureStore()(initialState) const wrapper = mount( - - -
- -
- - - +
+ +
+ + + + - - ) + ) + } handleSort = (option: SelectOption) => { this.setState({ sorting: option }) diff --git a/app/components/CreateImportSplitWalletForm/CreateImportSplitWalletForm.jsx b/app/components/CreateImportSplitWalletForm/CreateImportSplitWalletForm.jsx index d3d2f0967..004e425c4 100644 --- a/app/components/CreateImportSplitWalletForm/CreateImportSplitWalletForm.jsx +++ b/app/components/CreateImportSplitWalletForm/CreateImportSplitWalletForm.jsx @@ -3,6 +3,8 @@ import React, { Fragment } from 'react' import { wallet } from '@cityofzion/neon-js' import { withRouter } from 'react-router-dom' import { cloneDeep } from 'lodash-es' +import { IntlShape, injectIntl, FormattedMessage } from 'react-intl' + import PasswordInput from '../Inputs/PasswordInput' import StyledReactSelect from '../Inputs/StyledReactSelect/StyledReactSelect' import TextInput from '../Inputs/TextInput' @@ -18,6 +20,7 @@ type Props = { authenticated: boolean, accounts: Object, showErrorNotification: Object => any, + intl: IntlShape, } type State = { @@ -150,8 +153,11 @@ class CreateImportSplitWalletForm extends React.Component { submitButtonDisabled, } = this.state - const instructions = - 'The Split Key import option allows users to create a new NEO account by combining the private key of an existing account with a separate private key.' + const { intl } = this.props + + const instructions = intl.formatMessage({ + id: 'splitKeyWalletInstructions', + }) if (this.state.step === 2) { return ( @@ -165,21 +171,33 @@ class CreateImportSplitWalletForm extends React.Component { this.setState({ walletName: e.target.value })} - label="Wallet Name" - placeholder="Enter your new split key wallet name..." + label={intl.formatMessage({ + id: 'walletCreationWalletNamePlaceholder', + })} + placeholder={intl.formatMessage({ + id: 'splitKeyWalletNamePlaceholder', + })} />
@@ -199,7 +217,7 @@ class CreateImportSplitWalletForm extends React.Component { primary disabled={this.isStep2Disabled()} > - Import Wallet +
@@ -213,12 +231,14 @@ class CreateImportSplitWalletForm extends React.Component {
@@ -226,8 +246,12 @@ class CreateImportSplitWalletForm extends React.Component { this.setState({ existingPassphrase: e.target.value }) } @@ -235,9 +259,13 @@ class CreateImportSplitWalletForm extends React.Component { this.setState({ keypart2: e.target.value })} - placeholder="Enter private key" + placeholder={intl.formatMessage({ + id: 'privateKey', + })} />
@@ -267,10 +295,16 @@ class CreateImportSplitWalletForm extends React.Component { validatePassphrase = () => { const { passphrase: p } = this.state + const { intl } = this.props // validate min char count const errorMessage = p && p.length < PASS_MIN_LENGTH - ? `Passphrase must contain at least ${PASS_MIN_LENGTH} characters` + ? intl.formatMessage( + { + id: 'errors.password.length', + }, + { PASS_MIN_LENGTH }, + ) : '' this.setState( { @@ -283,9 +317,12 @@ class CreateImportSplitWalletForm extends React.Component { validatePassphrase2 = () => { const { passphrase: p1, passphrase2: p2, passphraseValid } = this.state + const { intl } = this.props // validate phrases match const errorMessage = - p1 && p2 && p1 !== p2 && passphraseValid ? 'Passphrases must match' : '' + p1 && p2 && p1 !== p2 && passphraseValid + ? intl.formatMessage({ id: 'errors.password.match' }) + : '' this.setState({ passphrase2Error: errorMessage, passphrase2Valid: !!(p2 && !errorMessage), @@ -316,4 +353,4 @@ class CreateImportSplitWalletForm extends React.Component { } } -export default withRouter(CreateImportSplitWalletForm) +export default withRouter(injectIntl(CreateImportSplitWalletForm)) diff --git a/app/components/CreateImportWalletForm/CreateImportWalletForm.jsx b/app/components/CreateImportWalletForm/CreateImportWalletForm.jsx index 107e36c49..2978b0a84 100644 --- a/app/components/CreateImportWalletForm/CreateImportWalletForm.jsx +++ b/app/components/CreateImportWalletForm/CreateImportWalletForm.jsx @@ -202,10 +202,16 @@ class CreateImportWalletForm extends React.Component { validatePassphrase = () => { const { passphrase: p } = this.state + const { intl } = this.props // validate min char count const errorMessage = p && p.length < PASS_MIN_LENGTH - ? `Passphrase must contain at least ${PASS_MIN_LENGTH} characters` + ? intl.formatMessage( + { + id: 'errors.password.length', + }, + { PASS_MIN_LENGTH }, + ) : '' this.setState( { @@ -218,9 +224,12 @@ class CreateImportWalletForm extends React.Component { validatePassphrase2 = () => { const { passphrase: p1, passphrase2: p2, passphraseValid } = this.state + const { intl } = this.props // validate phrases match const errorMessage = - p1 && p2 && p1 !== p2 && passphraseValid ? 'Passphrases must match' : '' + p1 && p2 && p1 !== p2 && passphraseValid + ? intl.formatMessage({ id: 'errors.password.match' }) + : '' this.setState({ passphrase2Error: errorMessage, passphrase2Valid: !!(p2 && !errorMessage), diff --git a/app/components/Dashboard/AssetBalancesPanel/index.js b/app/components/Dashboard/AssetBalancesPanel/index.js index 6f45c5e79..d5edb81aa 100644 --- a/app/components/Dashboard/AssetBalancesPanel/index.js +++ b/app/components/Dashboard/AssetBalancesPanel/index.js @@ -78,10 +78,14 @@ export default compose( withLoadingProp(balancesActions), withSuccessNotification( balancesActions, - 'Received latest blockchain information.', + 'notifications.success.receivedBlockchainInfo', + {}, + true, ), withFailureNotification( balancesActions, - 'Failed to retrieve blockchain information.', + 'notifications.failure.blockchainInfoFailure', + {}, + true, ), )(AssetBalancesPanel) diff --git a/app/components/Dashboard/TokenBalancesPanel/TokenBalancesPanel.jsx b/app/components/Dashboard/TokenBalancesPanel/TokenBalancesPanel.jsx index 588929e76..bac4021c7 100644 --- a/app/components/Dashboard/TokenBalancesPanel/TokenBalancesPanel.jsx +++ b/app/components/Dashboard/TokenBalancesPanel/TokenBalancesPanel.jsx @@ -1,8 +1,7 @@ // @flow import React from 'react' import classNames from 'classnames' -import { NavLink } from 'react-router-dom' -import { FormattedMessage } from 'react-intl' +import { FormattedMessage, FormattedHTMLMessage, IntlShape } from 'react-intl' import TextInput from '../../Inputs/TextInput' import CopyToClipboard from '../../CopyToClipboard' @@ -11,7 +10,7 @@ import styles from './TokenBalancesPanel.scss' import { toFixedDecimals } from '../../../core/formatters' import { toBigNumber } from '../../../core/math' import Nothing from '../../../assets/icons/nothing.svg' -import { CURRENCIES, ROUTES, PRICE_UNAVAILABLE } from '../../../core/constants' +import { CURRENCIES, PRICE_UNAVAILABLE } from '../../../core/constants' type Props = { className: ?string, @@ -19,6 +18,7 @@ type Props = { prices: Object, currencyCode: string, address: string, + intl: IntlShape, } export default class TokenBalancesPanel extends React.Component { @@ -45,26 +45,24 @@ export default class TokenBalancesPanel extends React.Component { } renderEmptyBalanceInfo = () => { - const { address } = this.props + const { address, intl } = this.props return (
-

Nothing to see here!

+ +

+ +

- You’ll need to transfer compatible NEP-5 assets to this wallet - using{' '} - - receive - {' '} - or your public address: +

diff --git a/app/components/Dashboard/TokenBalancesPanel/index.js b/app/components/Dashboard/TokenBalancesPanel/index.js index 743fbe0ab..526f026a2 100644 --- a/app/components/Dashboard/TokenBalancesPanel/index.js +++ b/app/components/Dashboard/TokenBalancesPanel/index.js @@ -1,7 +1,7 @@ // @flow import React from 'react' import { compose } from 'recompose' -import { FormattedMessage } from 'react-intl' +import { FormattedMessage, injectIntl } from 'react-intl' // $FlowFixMe import { filter, cloneDeep } from 'lodash-es' @@ -78,4 +78,5 @@ export default compose( // expose data & functionality needed for `refresh` action withActions(balancesActions, mapBalancesActionsToProps), withLoadingProp(balancesActions), + injectIntl, )(TokenBalancesPanel) diff --git a/app/components/ErrorBoundaries/Main/Main.jsx b/app/components/ErrorBoundaries/Main/Main.jsx index cea884b8f..704e8d676 100644 --- a/app/components/ErrorBoundaries/Main/Main.jsx +++ b/app/components/ErrorBoundaries/Main/Main.jsx @@ -1,6 +1,7 @@ // @flow import React, { Component } from 'react' import { Link } from 'react-router-dom' +import { FormattedMessage } from 'react-intl' import styles from './Main.scss' import Button from '../../Button' @@ -39,7 +40,9 @@ export default class ErrorBoundary extends Component { return (
-

Oops something went wrong...

+

+ +