Extract i18n strings in modals/* (#4706)

* DeployContract formatting

* PasswordManager i18n

* SaveContract i18n

* Transfer i18n

* Verification i18n

* Fix spacing on label
This commit is contained in:
Jaco Greeff 2017-03-02 13:29:32 +01:00 committed by Gav Wood
parent 31302e057f
commit 5f51fa23ea
12 changed files with 230 additions and 58 deletions

View File

@ -150,15 +150,20 @@ class DeployContract extends Component {
const title = realSteps const title = realSteps
? null ? null
: (deployError : (
? <FormattedMessage deployError
? (
<FormattedMessage
id='deployContract.title.failed' id='deployContract.title.failed'
defaultMessage='deployment failed' defaultMessage='deployment failed'
/> />
: <FormattedMessage )
: (
<FormattedMessage
id='deployContract.title.rejected' id='deployContract.title.rejected'
defaultMessage='rejected' defaultMessage='rejected'
/> />
)
); );
const waiting = realSteps const waiting = realSteps
@ -195,9 +200,7 @@ class DeployContract extends Component {
} }
return ( return (
<Warning <Warning warning={ errorEstimated } />
warning={ errorEstimated }
/>
); );
} }

View File

@ -117,8 +117,15 @@ class PasswordManager extends Component {
{ address } { address }
</span> </span>
<span className={ styles.passwordHint }> <span className={ styles.passwordHint }>
<span className={ styles.hintLabel }>Hint </span> <span className={ styles.hintLabel }>
{ passwordHint || '-' } <FormattedMessage
id='passwordChange.passwordHint'
defaultMessage='Hint {hint}'
values={ {
hint: passwordHint || '-'
} }
/>
</span>
</span> </span>
</div> </div>
</div> </div>

View File

@ -15,12 +15,11 @@
// along with Parity. If not, see <http://www.gnu.org/licenses/>. // along with Parity. If not, see <http://www.gnu.org/licenses/>.
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import SaveIcon from 'material-ui/svg-icons/content/save';
import ContentClear from 'material-ui/svg-icons/content/clear';
import { Button, Form, Input, Portal } from '~/ui'; import { Button, Form, Input, Portal } from '~/ui';
import Editor from '~/ui/Editor'; import Editor from '~/ui/Editor';
import { CancelIcon, SaveIcon } from '~/ui/Icons';
import { ERRORS, validateName } from '~/util/validation'; import { ERRORS, validateName } from '~/util/validation';
import styles from './saveContract.css'; import styles from './saveContract.css';
@ -46,13 +45,28 @@ export default class SaveContract extends Component {
buttons={ this.renderDialogActions() } buttons={ this.renderDialogActions() }
onClose={ this.onClose } onClose={ this.onClose }
open open
title='save contract' title={
<FormattedMessage
id='saveContract.title'
defaultMessage='save contract'
/>
}
> >
<div> <div>
<Form> <Form>
<Input <Input
label='contract name' label={
hint='choose a name for this contract' <FormattedMessage
id='saveContract.name.label'
defaultMessage='contract name'
/>
}
hint={
<FormattedMessage
id='saveContract.name.hint'
defaultMessage='choose a name for this contract'
/>
}
value={ name } value={ name }
error={ nameError } error={ nameError }
onChange={ this.onChangeName } onChange={ this.onChangeName }
@ -72,9 +86,14 @@ export default class SaveContract extends Component {
renderDialogActions () { renderDialogActions () {
const cancelBtn = ( const cancelBtn = (
<Button <Button
icon={ <ContentClear /> } icon={ <CancelIcon /> }
key='cancel' key='cancel'
label='Cancel' label={
<FormattedMessage
id='saveContract.buttons.cancel'
defaultMessage='Cancel'
/>
}
onClick={ this.onClose } onClick={ this.onClose }
/> />
); );
@ -83,7 +102,12 @@ export default class SaveContract extends Component {
<Button <Button
icon={ <SaveIcon /> } icon={ <SaveIcon /> }
key='save' key='save'
label='Save' label={
<FormattedMessage
id='saveContract.buttons.save'
defaultMessage='Save'
/>
}
disabled={ !!this.state.nameError } disabled={ !!this.state.nameError }
onClick={ this.onSave } onClick={ this.onSave }
/> />

View File

@ -14,8 +14,9 @@
// You should have received a copy of the GNU General Public License // You should have received a copy of the GNU General Public License
// along with Parity. If not, see <http://www.gnu.org/licenses/>. // along with Parity. If not, see <http://www.gnu.org/licenses/>.
import React, { Component, PropTypes } from 'react';
import { Checkbox } from 'material-ui'; import { Checkbox } from 'material-ui';
import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import Form, { Input, InputAddressSelect, AddressSelect } from '~/ui/Form'; import Form, { Input, InputAddressSelect, AddressSelect } from '~/ui/Form';
import { nullableProptype } from '~/util/proptypes'; import { nullableProptype } from '~/util/proptypes';
@ -57,7 +58,15 @@ export default class Details extends Component {
render () { render () {
const { all, extras, tag, total, totalError, value, valueError } = this.props; const { all, extras, tag, total, totalError, value, valueError } = this.props;
const label = `amount to transfer (in ${tag})`; const label = (
<FormattedMessage
id='transfer.details.amount.label'
defaultMessage='amount to transfer (in {tag})'
values={ {
tag
} }
/>
);
return ( return (
<Form> <Form>
@ -69,7 +78,12 @@ export default class Details extends Component {
<Input <Input
disabled={ all } disabled={ all }
label={ label } label={ label }
hint='the amount to transfer to the recipient' hint={
<FormattedMessage
id='transfer.details.amount.hint'
defaultMessage='the amount to transfer to the recipient'
/>
}
value={ value } value={ value }
error={ valueError } error={ valueError }
onChange={ this.onEditValue } onChange={ this.onEditValue }
@ -78,7 +92,12 @@ export default class Details extends Component {
<div> <div>
<Checkbox <Checkbox
checked={ all } checked={ all }
label='full account balance' label={
<FormattedMessage
id='transfer.details.fullBalance.label'
defaultMessage='full account balance'
/>
}
onCheck={ this.onCheckAll } onCheck={ this.onCheckAll }
style={ CHECK_STYLE } style={ CHECK_STYLE }
/> />
@ -88,7 +107,12 @@ export default class Details extends Component {
<div> <div>
<Input <Input
disabled disabled
label='total transaction amount' label={
<FormattedMessage
id='transfer.details.total.label'
defaultMessage='total transaction amount'
/>
}
error={ totalError } error={ totalError }
> >
<div className={ styles.inputoverride }> <div className={ styles.inputoverride }>
@ -100,7 +124,12 @@ export default class Details extends Component {
<div> <div>
<Checkbox <Checkbox
checked={ extras } checked={ extras }
label='advanced sending options' label={
<FormattedMessage
id='transfer.details.advanced.label'
defaultMessage='advanced sending options'
/>
}
onCheck={ this.onCheckExtras } onCheck={ this.onCheckExtras }
style={ CHECK_STYLE } style={ CHECK_STYLE }
/> />
@ -122,8 +151,18 @@ export default class Details extends Component {
<AddressSelect <AddressSelect
accounts={ senders } accounts={ senders }
error={ senderError } error={ senderError }
label='sender address' label={
hint='the sender address' <FormattedMessage
id='transfer.details.sender.label'
defaultMessage='sender address'
/>
}
hint={
<FormattedMessage
id='transfer.details.sender.hint'
defaultMessage='the sender address'
/>
}
value={ sender } value={ sender }
onChange={ this.onEditSender } onChange={ this.onEditSender }
balances={ sendersBalances } balances={ sendersBalances }
@ -138,8 +177,18 @@ export default class Details extends Component {
return ( return (
<div className={ styles.address }> <div className={ styles.address }>
<InputAddressSelect <InputAddressSelect
label='recipient address' label={
hint='the recipient address' <FormattedMessage
id='transfer.details.recipient.label'
defaultMessage='recipient address'
/>
}
hint={
<FormattedMessage
id='transfer.details.recipient.hint'
defaultMessage='the recipient address'
/>
}
error={ recipientError } error={ recipientError }
value={ recipient } value={ recipient }
onChange={ this.onEditRecipient } onChange={ this.onEditRecipient }

View File

@ -181,11 +181,21 @@ class Transfer extends Component {
<div> <div>
<br /> <br />
<div> <div>
<p>This transaction needs confirmation from other owners.</p> <p>
<FormattedMessage
id='transfer.wallet.confirmation'
defaultMessage='This transaction needs confirmation from other owners.'
/>
</p>
<Input <Input
style={ { width: '50%', margin: '0 auto' } } style={ { width: '50%', margin: '0 auto' } }
value={ this.store.operation } value={ this.store.operation }
label='operation hash' label={
<FormattedMessage
id='transfer.wallet.operationHash'
defaultMessage='operation hash'
/>
}
readOnly readOnly
allowCopy allowCopy
/> />
@ -254,7 +264,12 @@ class Transfer extends Component {
<Button <Button
icon={ <CancelIcon /> } icon={ <CancelIcon /> }
key='cancel' key='cancel'
label='Cancel' label={
<FormattedMessage
id='transfer.buttons.cancel'
defaultMessage='Cancel'
/>
}
onClick={ this.handleClose } onClick={ this.handleClose }
/> />
); );
@ -263,7 +278,12 @@ class Transfer extends Component {
disabled={ !this.store.isValid } disabled={ !this.store.isValid }
icon={ <NextIcon /> } icon={ <NextIcon /> }
key='next' key='next'
label='Next' label={
<FormattedMessage
id='transfer.buttons.next'
defaultMessage='Next'
/>
}
onClick={ this.store.onNext } onClick={ this.store.onNext }
/> />
); );
@ -271,16 +291,31 @@ class Transfer extends Component {
<Button <Button
icon={ <PrevIcon /> } icon={ <PrevIcon /> }
key='back' key='back'
label='Back' label={
<FormattedMessage
id='transfer.buttons.back'
defaultMessage='Back'
/>
}
onClick={ this.store.onPrev } onClick={ this.store.onPrev }
/> />
); );
const sendBtn = ( const sendBtn = (
<Button <Button
disabled={ !this.store.isValid || sending } disabled={ !this.store.isValid || sending }
icon={ <IdentityIcon address={ account.address } button /> } icon={
<IdentityIcon
address={ account.address }
button
/>
}
key='send' key='send'
label='Send' label={
<FormattedMessage
id='transfer.buttons.send'
defaultMessage='Send'
/>
}
onClick={ this.store.onSend } onClick={ this.store.onSend }
/> />
); );
@ -288,7 +323,12 @@ class Transfer extends Component {
<Button <Button
icon={ <DoneIcon /> } icon={ <DoneIcon /> }
key='close' key='close'
label='Close' label={
<FormattedMessage
id='transfer.buttons.close'
defaultMessage='Close'
/>
}
onClick={ this.handleClose } onClick={ this.handleClose }
/> />
); );

View File

@ -15,7 +15,9 @@
// along with Parity. If not, see <http://www.gnu.org/licenses/>. // along with Parity. If not, see <http://www.gnu.org/licenses/>.
import React, { Component } from 'react'; import React, { Component } from 'react';
import SuccessIcon from 'material-ui/svg-icons/navigation/check'; import { FormattedMessage } from 'react-intl';
import { DoneIcon } from '~/ui/Icons';
import styles from './done.css'; import styles from './done.css';
@ -23,8 +25,13 @@ export default class Done extends Component {
render () { render () {
return ( return (
<div className={ styles.container }> <div className={ styles.container }>
<SuccessIcon /> <DoneIcon />
<p className={ styles.message }>Congratulations, your account is verified!</p> <p className={ styles.message }>
<FormattedMessage
id='verification.done.message'
defaultMessage='Congratulations, your account is verified!'
/>
</p>
</div> </div>
); );
} }

View File

@ -18,12 +18,10 @@ import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import BigNumber from 'bignumber.js'; import BigNumber from 'bignumber.js';
import { Checkbox } from 'material-ui'; import { Checkbox } from 'material-ui';
import InfoIcon from 'material-ui/svg-icons/action/info-outline';
import SuccessIcon from 'material-ui/svg-icons/navigation/check';
import ErrorIcon from 'material-ui/svg-icons/navigation/close';
import { fromWei } from '~/api/util/wei'; import { fromWei } from '~/api/util/wei';
import { Form, Input } from '~/ui'; import { Form, Input } from '~/ui';
import { DoneIcon, ErrorIcon, InfoIcon } from '~/ui/Icons';
import { nullableProptype } from '~/util/proptypes'; import { nullableProptype } from '~/util/proptypes';
import smsTermsOfService from '~/3rdparty/sms-verification/terms-of-service'; import smsTermsOfService from '~/3rdparty/sms-verification/terms-of-service';
@ -81,7 +79,7 @@ export default class GatherData extends Component {
if (isServerRunning) { if (isServerRunning) {
return ( return (
<div className={ styles.container }> <div className={ styles.container }>
<SuccessIcon /> <DoneIcon />
<p className={ styles.message }> <p className={ styles.message }>
<FormattedMessage <FormattedMessage
id='ui.verification.gatherData.isServerRunning.true' id='ui.verification.gatherData.isServerRunning.true'
@ -166,7 +164,7 @@ export default class GatherData extends Component {
} else if (accountIsVerified === false) { } else if (accountIsVerified === false) {
return ( return (
<div className={ styles.container }> <div className={ styles.container }>
<SuccessIcon /> <DoneIcon />
<p className={ styles.message }> <p className={ styles.message }>
<FormattedMessage <FormattedMessage
id='ui.verification.gatherData.accountIsVerified.false' id='ui.verification.gatherData.accountIsVerified.false'
@ -209,7 +207,7 @@ export default class GatherData extends Component {
} else if (accountHasRequested === false) { } else if (accountHasRequested === false) {
return ( return (
<div className={ styles.container }> <div className={ styles.container }>
<SuccessIcon /> <DoneIcon />
<p className={ styles.message }> <p className={ styles.message }>
<FormattedMessage <FormattedMessage
id='ui.verification.gatherData.accountHasRequested.false' id='ui.verification.gatherData.accountHasRequested.false'

View File

@ -42,7 +42,15 @@ export default class QueryCode extends Component {
return ( return (
<Form> <Form>
<p>The verification code has been sent to { receiver }.</p> <p>
<FormattedMessage
id='verification.code.sent'
defaultMessage='The verification code has been sent to {receiver}.'
values={ {
receiver
} }
/>
</p>
<Input <Input
autoFocus autoFocus
label={ label={

View File

@ -15,6 +15,7 @@
// along with Parity. If not, see <http://www.gnu.org/licenses/>. // along with Parity. If not, see <http://www.gnu.org/licenses/>.
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import { nullableProptype } from '~/util/proptypes'; import { nullableProptype } from '~/util/proptypes';
import TxHash from '~/ui/TxHash'; import TxHash from '~/ui/TxHash';
@ -34,14 +35,28 @@ export default class SendConfirmation extends Component {
const { step, tx } = this.props; const { step, tx } = this.props;
if (step === POSTING_CONFIRMATION) { if (step === POSTING_CONFIRMATION) {
return (<p>The verification code will be sent to the contract. Please authorize this using the Parity Signer.</p>); return (
<p>
<FormattedMessage
id='verification.confirmation.authorise'
defaultMessage='The verification code will be sent to the contract. Please authorize this using the Parity Signer.'
/>
</p>);
} }
if (step === POSTED_CONFIRMATION) { if (step === POSTED_CONFIRMATION) {
return ( return (
<div className={ styles.centered }> <div className={ styles.centered }>
<TxHash hash={ tx } maxConfirmations={ 2 } /> <TxHash
<p>Please keep this window open.</p> hash={ tx }
maxConfirmations={ 2 }
/>
<p>
<FormattedMessage
id='verification.confirmation.windowOpen'
defaultMessage='Please keep this window open.'
/>
</p>
</div> </div>
); );
} }

View File

@ -15,6 +15,7 @@
// along with Parity. If not, see <http://www.gnu.org/licenses/>. // along with Parity. If not, see <http://www.gnu.org/licenses/>.
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import { nullableProptype } from '~/util/proptypes'; import { nullableProptype } from '~/util/proptypes';
import TxHash from '~/ui/TxHash'; import TxHash from '~/ui/TxHash';
@ -35,19 +36,39 @@ export default class SendRequest extends Component {
switch (step) { switch (step) {
case POSTING_REQUEST: case POSTING_REQUEST:
return (<p>A verification request will be sent to the contract. Please authorize this using the Parity Signer.</p>); return (
<p>
<FormattedMessage
id='verification.request.authorise'
defaultMessage='A verification request will be sent to the contract. Please authorize this using the Parity Signer.'
/>
</p>
);
case POSTED_REQUEST: case POSTED_REQUEST:
return ( return (
<div className={ styles.centered }> <div className={ styles.centered }>
<TxHash hash={ tx } maxConfirmations={ 1 } /> <TxHash
<p>Please keep this window open.</p> hash={ tx }
maxConfirmations={ 1 }
/>
<p>
<FormattedMessage
id='verification.request.windowOpen'
defaultMessage='Please keep this window open.'
/>
</p>
</div> </div>
); );
case REQUESTING_CODE: case REQUESTING_CODE:
return ( return (
<p>Requesting a code from the Parity server and waiting for the puzzle to be put into the contract.</p> <p>
<FormattedMessage
id='verification.request.requesting'
defaultMessage='Requesting a code from the Parity server and waiting for the puzzle to be put into the contract.'
/>
</p>
); );
default: default:

View File

@ -19,11 +19,10 @@ import { FormattedMessage } from 'react-intl';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { observer } from 'mobx-react'; import { observer } from 'mobx-react';
import { observable } from 'mobx'; import { observable } from 'mobx';
import DoneIcon from 'material-ui/svg-icons/action/done-all';
import CancelIcon from 'material-ui/svg-icons/content/clear';
import { Button, IdentityIcon, Portal } from '~/ui'; import { Button, IdentityIcon, Portal } from '~/ui';
import RadioButtons from '~/ui/Form/RadioButtons'; import RadioButtons from '~/ui/Form/RadioButtons';
import { CancelIcon, DoneIcon } from '~/ui/Icons';
import SMSVerificationStore from './sms-store'; import SMSVerificationStore from './sms-store';
import EmailVerificationStore from './email-store'; import EmailVerificationStore from './email-store';

View File

@ -37,6 +37,7 @@ export FileUploadIcon from 'material-ui/svg-icons/file/file-upload';
export FileIcon from 'material-ui/svg-icons/editor/insert-drive-file'; export FileIcon from 'material-ui/svg-icons/editor/insert-drive-file';
export FingerprintIcon from 'material-ui/svg-icons/action/fingerprint'; export FingerprintIcon from 'material-ui/svg-icons/action/fingerprint';
export GasIcon from 'material-ui/svg-icons/maps/local-gas-station'; export GasIcon from 'material-ui/svg-icons/maps/local-gas-station';
export InfoIcon from 'material-ui/svg-icons/action/info-outline';
export KeyIcon from 'material-ui/svg-icons/communication/vpn-key'; export KeyIcon from 'material-ui/svg-icons/communication/vpn-key';
export KeyboardIcon from 'material-ui/svg-icons/hardware/keyboard'; export KeyboardIcon from 'material-ui/svg-icons/hardware/keyboard';
export LinkIcon from 'material-ui/svg-icons/content/link'; export LinkIcon from 'material-ui/svg-icons/content/link';