Extract i18n strings in modals/* (#4706)

* DeployContract formatting

* PasswordManager i18n

* SaveContract i18n

* Transfer i18n

* Verification i18n

* Fix spacing on label

js/src/modals/Verification/Done/done.js

@@ -15,7 +15,9 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 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';
 
@@ -23,8 +25,13 @@ export default class Done extends Component {
   render () {
     return (
       <div className={ styles.container }>
-        <SuccessIcon />
-        <p className={ styles.message }>Congratulations, your account is verified!</p>
+        <DoneIcon />
+        <p className={ styles.message }>
+          <FormattedMessage
+            id='verification.done.message'
+            defaultMessage='Congratulations, your account is verified!'
+          />
+        </p>
       </div>
     );
   }

js/src/modals/Verification/GatherData/gatherData.js

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

js/src/modals/Verification/QueryCode/queryCode.js

@@ -42,7 +42,15 @@ export default class QueryCode extends Component {
 
     return (
       <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
           autoFocus
           label={

js/src/modals/Verification/SendConfirmation/sendConfirmation.js

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

js/src/modals/Verification/SendRequest/sendRequest.js

@@ -15,6 +15,7 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import React, { Component, PropTypes } from 'react';
+import { FormattedMessage } from 'react-intl';
 
 import { nullableProptype } from '~/util/proptypes';
 import TxHash from '~/ui/TxHash';
@@ -35,19 +36,39 @@ export default class SendRequest extends Component {
 
     switch (step) {
       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:
         return (
           <div className={ styles.centered }>
-            <TxHash hash={ tx } maxConfirmations={ 1 } />
-            <p>Please keep this window open.</p>
+            <TxHash
+              hash={ tx }
+              maxConfirmations={ 1 }
+            />
+            <p>
+              <FormattedMessage
+                id='verification.request.windowOpen'
+                defaultMessage='Please keep this window open.'
+              />
+            </p>
           </div>
         );
 
       case REQUESTING_CODE:
         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:

js/src/modals/Verification/verification.js

@@ -19,11 +19,10 @@ import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
 import { observer } from 'mobx-react';
 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 RadioButtons from '~/ui/Form/RadioButtons';
+import { CancelIcon, DoneIcon } from '~/ui/Icons';
 
 import SMSVerificationStore from './sms-store';
 import EmailVerificationStore from './email-store';