first steps to i18n

app/_locales/en/messages.json

@@ -6,5 +6,170 @@
   "appDescription": {
     "message": "Ethereum Identity Management",
     "description": "The description of the application"
-  }
+  },
+  "encryptNewDen": {
+    "message": "Encrypt your new DEN"
+  },
+  "denExplainer": {
+    "message": "Your DEN is your password-encrypted storage within MetaMask."
+  },
+  "importDen": {
+    "message": "Import Existing DEN"
+  },
+  "createDen": {
+    "message": "Create"
+  },
+  "newPassword": {
+    "message": "New Password (min 8 chars)"
+  },
+  "confirmPassword": {
+    "message": "Confirm Password"
+  },
+  "passwordMismatch": {
+    "message": "passwords don't match"
+  },
+  "passwordShort": {
+    "message": "password not long enough"
+  },
+  "myAccounts": {
+    "message": "My Accounts"
+  },
+  "logout": {
+    "message": "Log out"
+  },
+  "createAccount": {
+    "message": "Create Account"
+  },
+  "importAccount": {
+    "message": "Import Account"
+  },
+  "account": {
+    "message": "Account:"
+  },
+  "infoHelp": {
+    "message": "Info & Help"
+  },
+  "settings": {
+    "message": "Settings"
+  },
+  "importedCaps": {
+    "message": "IMPORTED"
+  },
+  "saveButton": {
+    "message": "SAVE"
+  },
+  "cancelButton": {
+    "message": "CANCEL"
+  },
+  "signButton": {
+    "message": "SIGN"
+  },
+  "revert": {
+    "message": "Revert"
+  },
+  "gasLimit": {
+    "message": "Gas Limit"
+  },
+  "gasLimitCalculation": {
+    "message": "We calculate the suggested gas limit based on network success rates."
+  },
+  "gasPrice": {
+    "message": "Gas Price (GWEI)"
+  },
+  "gasPriceCalculation": {
+    "message": "We calculate the suggested gas prices based on network success rates."
+  },
+  "customGas": {
+    "message": "Customize Gas"
+  },
+  "balanceIsInsufficientGas": {
+    "message": "Insufficient balance for current gas total"
+  },
+  "gasLimitTooLow": {
+    "message": "Gas limit must be at least 21000"
+  },
+  "editButton": {
+    "message": "Edit"
+  },
+  "looseCaps": {
+    "message": "LOOSE"
+  },
+  "addToken": "Add Token",
+  "exportPrivateKey": "Export Private Key",
+  "copyAddress": "Copy Address to clipboard",
+  "etherscanView": "View account on Etherscan",
+  "qrCode": "Show QR Code",
+  "accDetails": "Account Details",
+  "networks": "Networks",
+  "defaultNetwork": "The default network for Ether transactions is Main Net.",
+  "mainnet": "Main Ethereum Network",
+  "unknownNetwork": "Unknown Private Network",
+  "rinkeby": "Rinkeby Test Network",
+  "kovan": "Kovan Test Network",
+  "ropsten": "Ropsten Test Network",
+  "localhost": "Localhost 8545",
+  "customRPC": "Custom RPC",
+  "hideToken": "Hide Token",
+  "copiedClipboard": "Copied to Clipboard",
+  "detailsCaps": "DETAILS",
+  "sendButton": "SEND",
+  "depositButton": "DEPOSIT",
+  "notStarted": "Not Started",
+  "noTransactions": "No Transactions",
+  "contractPublished": "Contract Published",
+  "noTransactionHistory": "No transaction history.",
+  "warning": "Warning",
+  "failed": "Failed",
+  "rejected": "Rejected",
+  "sigRequested": "Signature Requested",
+  "yourSigRequested": "Your signature is being requested",
+  "balance": "Balance:",
+  "retryWithMoreGas": "Retry with a higher gas price here",
+  "takesTooLong": "Taking too long?",
+  "transactionNumber": "Transaction Number",
+  "loadingTokens": "Loading Tokens...",
+  "troubleTokenBalances": "We had trouble loading your token balances. You can view them ",
+  "here": "here",
+  "message": "Message",
+  "signNotice": "Signing this message can have \ndangerous side effects. Only sign messages from \nsites you fully trust with your entire account.\n This dangerous method will be removed in a future version. ",
+  "youSign": "You are signing:",
+  "conversionProgress": "Conversion in progress",
+  "noDeposits": "No deposits received",
+  "fromShapeShift": "From ShapeShift",
+  "invalidRequest": "Invalid Request",
+  "status": "Status",
+  "limit": "Limit",
+  "exchangeRate": "Exchange Rate",
+  "min": "Minimum",
+  "available": "Available",
+  "unavailable": "Unavailable",
+  "depositBTC": "Deposit your BTC to the address below:",
+  "deposit": "Deposit",
+  "receive": "Receive",
+  "refundAddress": "Your Refund Address",
+  "buyButton": "Buy",
+  "signMessage": "Sign Message",
+  "youSignCaps": "YOU ARE SIGNING",
+  "messageCaps": "MESSAGE",
+  "readMore": "Read more here.",
+  "cancel": "Cancel",
+  "sign": "Sign",
+  "accept": "Accept",
+  "attemptingConnect": "Attempting to connect to blockchain.",
+  "privateNetwork": "Private Network",
+  "invalidInput": "Invalid input.",
+  "noAddressForName": "No address has been set for this name.",
+  "clickCopy": "Click to Copy",
+  "copyButton": " Copy ",
+  "copiedButton": "Copied",
+  "copy": "Copy",
+  "copiedExclamation": "Copied!",
+  "continueToCoinbase": "Continue to Coinbase",
+  "depositEth": "Deposit Eth",
+  "selectService": "Select Service",
+  "unknownNetworkId": "Unknown network ID",
+  "borrowDharma": "Borrow With Dharma (Beta)",
+  "exportPrivateKeyWarning": "Export private keys at your own risk.",
+  "confirmPasswordSmall": "confirm password",
+  "submit": "Submit",
 }

ui/app/components/account-dropdowns.js

@@ -79,7 +79,7 @@ class AccountDropdowns extends Component {
     try { // Sometimes keyrings aren't loaded yet:
       const type = keyring.type
       const isLoose = type !== 'HD Key Tree'
-      return isLoose ? h('.keyring-label', 'LOOSE') : null
+      return isLoose ? h('.keyring-label', t('looseCaps')) : null
     } catch (e) { return }
   }
 
@@ -129,7 +129,7 @@ class AccountDropdowns extends Component {
                 diameter: 32,
               },
             ),
-            h('span', { style: { marginLeft: '20px', fontSize: '24px' } }, 'Create Account'),
+            h('span', { style: { marginLeft: '20px', fontSize: '24px' } }, t('createAccount')),
           ],
         ),
         h(
@@ -192,7 +192,7 @@ class AccountDropdowns extends Component {
               global.platform.openWindow({ url })
             },
           },
-          'View account on Etherscan',
+          t('etherscanView'),
         ),
         h(
           DropdownMenuItem,
@@ -204,7 +204,7 @@ class AccountDropdowns extends Component {
               actions.showQrView(selected, identity ? identity.name : '')
             },
           },
-          'Show QR Code',
+          t('qrCode'),
         ),
         h(
           DropdownMenuItem,
@@ -216,7 +216,7 @@ class AccountDropdowns extends Component {
               copyToClipboard(checkSumAddress)
             },
           },
-          'Copy Address to clipboard',
+          t('copyAddress'),
         ),
         h(
           DropdownMenuItem,
@@ -226,7 +226,7 @@ class AccountDropdowns extends Component {
               actions.requestAccountExport()
             },
           },
-          'Export Private Key',
+          t('exportPrivateKey'),
         ),
       ]
     )

ui/app/components/account-export.js

@@ -35,7 +35,7 @@ ExportAccountView.prototype.render = function () {
   if (notExporting) return h('div')
 
   if (exportRequested) {
-    const warning = `Export private keys at your own risk.`
+    const warning = t('exportPrivateKeyWarning')
     return (
       h('div', {
         style: {
@@ -53,7 +53,7 @@ ExportAccountView.prototype.render = function () {
             h('p.error', warning),
             h('input#exportAccount.sizing-input', {
               type: 'password',
-              placeholder: 'confirm password',
+              placeholder: t('confirmPasswordSmall'),
               onKeyPress: this.onExportKeyPress.bind(this),
               style: {
                 position: 'relative',
@@ -74,10 +74,10 @@ ExportAccountView.prototype.render = function () {
                 style: {
                   marginRight: '10px',
                 },
-              }, 'Submit'),
+              }, t('submit')),
               h('button', {
                 onClick: () => this.props.dispatch(actions.backToAccountDetail(this.props.address)),
-              }, 'Cancel'),
+              }, t('cancel')),
             ]),
           (this.props.warning) && (
           h('span.error', {

ui/app/components/account-menu/index.js

@@ -70,10 +70,10 @@ AccountMenu.prototype.render = function () {
     h(Item, {
       className: 'account-menu__header',
     }, [
-      'My Accounts',
+      t('myAccounts'),
       h('button.account-menu__logout-button', {
         onClick: lockMetamask,
-      }, 'Log out'),
+      }, t('logout')),
     ]),
     h(Divider),
     h('div.account-menu__accounts', this.renderAccounts()),
@@ -81,23 +81,23 @@ AccountMenu.prototype.render = function () {
     h(Item, {
       onClick: () => showNewAccountPage('CREATE'),
       icon: h('img', { src: 'images/plus-btn-white.svg' }),
-      text: 'Create Account',
+      text: t('createAccount'),
     }),
     h(Item, {
       onClick: () => showNewAccountPage('IMPORT'),
       icon: h('img', { src: 'images/import-account.svg' }),
-      text: 'Import Account',
+      text: t('importAccount'),
     }),
     h(Divider),
     h(Item, {
       onClick: showInfoPage,
       icon: h('img', { src: 'images/mm-info-icon.svg' }),
-      text: 'Info & Help',
+      text: t('infoHelp'),
     }),
     h(Item, {
       onClick: showConfigPage,
       icon: h('img', { src: 'images/settings.svg' }),
-      text: 'Settings',
+      text: t('settings'),
     }),
   ])
 }
@@ -155,6 +155,6 @@ AccountMenu.prototype.indicateIfLoose = function (keyring) {
   try { // Sometimes keyrings aren't loaded yet:
     const type = keyring.type
     const isLoose = type !== 'HD Key Tree'
-    return isLoose ? h('.keyring-label', 'IMPORTED') : null
+    return isLoose ? h('.keyring-label', t('importedCaps')) : null
   } catch (e) { return }
 }

ui/app/components/buy-button-subview.js

@@ -76,7 +76,7 @@ BuyButtonSubview.prototype.headerSubview = function () {
             paddingTop: '4px',
             paddingBottom: '4px',
           },
-        }, 'Deposit Eth'),
+        }, t('depositEth')),
       ]),
 
       // loading indication
@@ -118,7 +118,7 @@ BuyButtonSubview.prototype.headerSubview = function () {
             paddingTop: '4px',
             paddingBottom: '4px',
           },
-        }, 'Select Service'),
+        }, t('selectService')),
       ]),
 
     ])
@@ -164,14 +164,14 @@ BuyButtonSubview.prototype.primarySubview = function () {
               style: {
                 marginTop: '15px',
               },
-            }, 'Borrow With Dharma (Beta)')
+            }, t('borrowDharma'))
           ) : null,
       ])
     )
 
     default:
       return (
-        h('h2.error', 'Unknown network ID')
+        h('h2.error', t('unknownNetworkId'))
       )
 
   }

ui/app/components/coinbase-form.js

@@ -37,11 +37,11 @@ CoinbaseForm.prototype.render = function () {
     }, [
       h('button.btn-green', {
         onClick: this.toCoinbase.bind(this),
-      }, 'Continue to Coinbase'),
+      }, t('continueToCoinbase')),
 
       h('button.btn-red', {
         onClick: () => props.dispatch(actions.goHome()),
-      }, 'Cancel'),
+      }, t('cancel')),
     ]),
   ])
 }

ui/app/components/copyButton.js

@@ -22,7 +22,7 @@ CopyButton.prototype.render = function () {
   const value = props.value
   const copied = state.copied
 
-  const message = copied ? 'Copied' : props.title || ' Copy '
+  const message = copied ? t('copiedButton') : props.title || t('copyButton')
 
   return h('.copy-button', {
     style: {

ui/app/components/copyable.js

@@ -22,7 +22,7 @@ Copyable.prototype.render = function () {
   const { copied } = state
 
   return h(Tooltip, {
-    title: copied ? 'Copied!' : 'Copy',
+    title: copied ? t('copiedExclamation') : t('copy'),
     position: 'bottom',
   }, h('span', {
     style: {

ui/app/components/customize-gas-modal/index.js

@@ -146,7 +146,7 @@ CustomizeGasModal.prototype.validate = function ({ gasTotal, gasLimit }) {
   })
 
   if (!balanceIsSufficient) {
-    error = 'Insufficient balance for current gas total'
+    error = t('balanceIsInsufficientGas')
   }
 
   const gasLimitTooLow = gasLimit && conversionGreaterThan(
@@ -162,7 +162,7 @@ CustomizeGasModal.prototype.validate = function ({ gasTotal, gasLimit }) {
   )
 
   if (gasLimitTooLow) {
-    error = 'Gas limit must be at least 21000'
+    error = t('gasLimitTooLow')
   }
 
   this.setState({ error })
@@ -239,7 +239,7 @@ CustomizeGasModal.prototype.render = function () {
     }, [
       h('div.send-v2__customize-gas__header', {}, [
 
-        h('div.send-v2__customize-gas__title', 'Customize Gas'),
+        h('div.send-v2__customize-gas__title', t('customGas')),
 
         h('div.send-v2__customize-gas__close', {
           onClick: hideModal,
@@ -255,8 +255,8 @@ CustomizeGasModal.prototype.render = function () {
           // max: 1000,
           step: multiplyCurrencies(MIN_GAS_PRICE_GWEI, 10),
           onChange: value => this.convertAndSetGasPrice(value),
-          title: 'Gas Price (GWEI)',
-          copy: 'We calculate the suggested gas prices based on network success rates.',
+          title: t('gasPrice'),
+          copy: t('gasPriceCalculation'),
         }),
 
         h(GasModalCard, {
@@ -265,8 +265,8 @@ CustomizeGasModal.prototype.render = function () {
           // max: 100000,
           step: 1,
           onChange: value => this.convertAndSetGasLimit(value),
-          title: 'Gas Limit',
-          copy: 'We calculate the suggested gas limit based on network success rates.',
+          title: t('gasLimit'),
+          copy: t('gasLimitCalculation'),
         }),
 
       ]),
@@ -279,16 +279,16 @@ CustomizeGasModal.prototype.render = function () {
 
         h('div.send-v2__customize-gas__revert', {
           onClick: () => this.revert(),
-        }, ['Revert']),
+        }, [t('revert')]),
 
         h('div.send-v2__customize-gas__buttons', [
           h('div.send-v2__customize-gas__cancel', {
             onClick: this.props.hideModal,
-          }, ['CANCEL']),
+          }, [t('cancelButton')]),
 
           h(`div.send-v2__customize-gas__save${error ? '__error' : ''}`, {
             onClick: () => !error && this.save(gasPrice, gasLimit, gasTotal),
-          }, ['SAVE']),
+          }, [t('saveButton')]),
         ]),
 
       ]),

ui/app/components/dropdowns/components/account-dropdowns.js

@@ -129,7 +129,7 @@ class AccountDropdowns extends Component {
                   actions.showEditAccountModal(identity)
                 },
               }, [
-                'Edit',
+                t('editButton'),
               ]),
             ]),
 
@@ -159,7 +159,7 @@ class AccountDropdowns extends Component {
     try { // Sometimes keyrings aren't loaded yet:
       const type = keyring.type
       const isLoose = type !== 'HD Key Tree'
-      return isLoose ? h('.keyring-label', 'LOOSE') : null
+      return isLoose ? h('.keyring-label', t('looseCaps')) : null
     } catch (e) { return }
   }
 
@@ -217,7 +217,7 @@ class AccountDropdowns extends Component {
                 fontSize: '16px',
                 lineHeight: '23px',
               },
-            }, 'Create Account'),
+            }, t('createAccount')),
           ],
         ),
         h(
@@ -251,7 +251,7 @@ class AccountDropdowns extends Component {
                 fontSize: '16px',
                 lineHeight: '23px',
               },
-            }, 'Import Account'),
+            }, t('importAccount')),
           ]
         ),
       ]
@@ -302,7 +302,7 @@ class AccountDropdowns extends Component {
               menuItemStyles,
             ),
           },
-          'Account Details',
+          t('accDetails'),
         ),
         h(
           DropdownMenuItem,
@@ -318,7 +318,7 @@ class AccountDropdowns extends Component {
               menuItemStyles,
             ),
           },
-          'View account on Etherscan',
+          t('etherscanView'),
         ),
         h(
           DropdownMenuItem,
@@ -334,7 +334,7 @@ class AccountDropdowns extends Component {
               menuItemStyles,
             ),
           },
-          'Copy Address to clipboard',
+          t('copyAddress'),
         ),
         h(
           DropdownMenuItem,
@@ -346,7 +346,7 @@ class AccountDropdowns extends Component {
               menuItemStyles,
             ),
           },
-          'Export Private Key',
+          t('exportPrivateKey'),
         ),
         h(
           DropdownMenuItem,
@@ -361,7 +361,7 @@ class AccountDropdowns extends Component {
               menuItemStyles,
             ),
           },
-          'Add Token',
+          t('addToken'),
         ),
 
       ]
@@ -479,4 +479,3 @@ function mapStateToProps (state) {
 }
 
 module.exports = connect(mapStateToProps, mapDispatchToProps)(AccountDropdowns)
-

ui/app/components/dropdowns/network-dropdown.js

@@ -93,13 +93,13 @@ NetworkDropdown.prototype.render = function () {
   }, [
 
     h('div.network-dropdown-header', {}, [
-      h('div.network-dropdown-title', {}, 'Networks'),
+      h('div.network-dropdown-title', {}, t('networks')),
 
       h('div.network-dropdown-divider'),
 
       h('div.network-dropdown-content',
         {},
-        'The default network for Ether transactions is Main Net.'
+        t('defaultNetwork')
       ),
     ]),
 
@@ -121,7 +121,7 @@ NetworkDropdown.prototype.render = function () {
           style: {
             color: providerType === 'mainnet' ? '#ffffff' : '#9b9b9b',
           },
-        }, 'Main Ethereum Network'),
+        }, t('mainnet')),
       ]
     ),
 
@@ -143,7 +143,7 @@ NetworkDropdown.prototype.render = function () {
           style: {
             color: providerType === 'ropsten' ? '#ffffff' : '#9b9b9b',
           },
-        }, 'Ropsten Test Network'),
+        }, t('ropsten')),
       ]
     ),
 
@@ -165,7 +165,7 @@ NetworkDropdown.prototype.render = function () {
           style: {
             color: providerType === 'kovan' ? '#ffffff' : '#9b9b9b',
           },
-        }, 'Kovan Test Network'),
+        }, t('kovan')),
       ]
     ),
 
@@ -187,7 +187,7 @@ NetworkDropdown.prototype.render = function () {
           style: {
             color: providerType === 'rinkeby' ? '#ffffff' : '#9b9b9b',
           },
-        }, 'Rinkeby Test Network'),
+        }, t('rinkeby')),
       ]
     ),
 
@@ -209,7 +209,7 @@ NetworkDropdown.prototype.render = function () {
           style: {
             color: activeNetwork === 'http://localhost:8545' ? '#ffffff' : '#9b9b9b',
           },
-        }, 'Localhost 8545'),
+        }, t('localhost')),
       ]
     ),
 
@@ -233,7 +233,7 @@ NetworkDropdown.prototype.render = function () {
           style: {
             color: activeNetwork === 'custom' ? '#ffffff' : '#9b9b9b',
           },
-        }, 'Custom RPC'),
+        }, t('customRPC')),
       ]
     ),
 
@@ -248,15 +248,15 @@ NetworkDropdown.prototype.getNetworkName = function () {
   let name
 
   if (providerName === 'mainnet') {
-    name = 'Main Ethereum Network'
+    name = t('mainnet')
   } else if (providerName === 'ropsten') {
-    name = 'Ropsten Test Network'
+    name = t('ropsten')
   } else if (providerName === 'kovan') {
-    name = 'Kovan Test Network'
+    name = t('kovan')
   } else if (providerName === 'rinkeby') {
-    name = 'Rinkeby Test Network'
+    name = t('rinkeby')
   } else {
-    name = 'Unknown Private Network'
+    name = t('unknownNetwork')
   }
 
   return name

ui/app/components/dropdowns/token-menu-dropdown.js

@@ -43,7 +43,7 @@ TokenMenuDropdown.prototype.render = function () {
             showHideTokenConfirmationModal(this.props.token)
             this.props.onClose()
           },
-        }, 'Hide Token'),
+        }, t('hideToken')),
 
       ]),
     ]),

ui/app/components/ens-input.js

@@ -89,13 +89,13 @@ EnsInput.prototype.lookupEnsName = function () {
   log.info(`ENS attempting to resolve name: ${recipient}`)
   this.ens.lookup(recipient.trim())
   .then((address) => {
-    if (address === ZERO_ADDRESS) throw new Error('No address has been set for this name.')
+    if (address === ZERO_ADDRESS) throw new Error(t('noAddressForName'))
     if (address !== ensResolution) {
       this.setState({
         loadingEns: false,
         ensResolution: address,
         nickname: recipient.trim(),
-        hoverText: address + '\nClick to Copy',
+        hoverText: address + '\n' + t('clickCopy'),
         ensFailure: false,
       })
     }

ui/app/components/hex-as-decimal-input.js

@@ -132,7 +132,7 @@ HexAsDecimalInput.prototype.constructWarning = function () {
   } else if (max) {
     message += `must be less than or equal to ${max}.`
   } else {
-    message += 'Invalid input.'
+    message += t('invalidInput')
   }
 
   return message

ui/app/components/network.js

@@ -33,7 +33,7 @@ Network.prototype.render = function () {
       onClick: (event) => this.props.onClick(event),
     }, [
       h('img', {
-        title: 'Attempting to connect to blockchain.',
+        title: t('attemptingConnect'),
         style: {
           width: '27px',
         },
@@ -41,22 +41,22 @@ Network.prototype.render = function () {
       }),
     ])
   } else if (providerName === 'mainnet') {
-    hoverText = 'Main Ethereum Network'
+    hoverText = t('mainnet')
     iconName = 'ethereum-network'
   } else if (providerName === 'ropsten') {
-    hoverText = 'Ropsten Test Network'
+    hoverText = t('ropsten')
     iconName = 'ropsten-test-network'
   } else if (parseInt(networkNumber) === 3) {
-    hoverText = 'Ropsten Test Network'
+    hoverText = t('ropsten')
     iconName = 'ropsten-test-network'
   } else if (providerName === 'kovan') {
-    hoverText = 'Kovan Test Network'
+    hoverText = t('kovan')
     iconName = 'kovan-test-network'
   } else if (providerName === 'rinkeby') {
-    hoverText = 'Rinkeby Test Network'
+    hoverText = t('rinkeby')
     iconName = 'rinkeby-test-network'
   } else {
-    hoverText = 'Unknown Private Network'
+    hoverText = t('unknownNetwork')
     iconName = 'unknown-private-network'
   }
 
@@ -84,7 +84,7 @@ Network.prototype.render = function () {
                 backgroundColor: '#038789', // $blue-lagoon
                 nonSelectBackgroundColor: '#15afb2',
               }),
-              h('.network-name', 'Main Network'),
+              h('.network-name', t('mainnet')),
               h('i.fa.fa-chevron-down.fa-lg.network-caret'),
             ])
           case 'ropsten-test-network':
@@ -93,7 +93,7 @@ Network.prototype.render = function () {
                 backgroundColor: '#e91550', // $crimson
                 nonSelectBackgroundColor: '#ec2c50',
               }),
-              h('.network-name', 'Ropsten Test Net'),
+              h('.network-name', t('ropsten')),
               h('i.fa.fa-chevron-down.fa-lg.network-caret'),
             ])
           case 'kovan-test-network':
@@ -102,7 +102,7 @@ Network.prototype.render = function () {
                 backgroundColor: '#690496', // $purple
                 nonSelectBackgroundColor: '#b039f3',
               }),
-              h('.network-name', 'Kovan Test Net'),
+              h('.network-name', t('kovan')),
               h('i.fa.fa-chevron-down.fa-lg.network-caret'),
             ])
           case 'rinkeby-test-network':
@@ -111,7 +111,7 @@ Network.prototype.render = function () {
                 backgroundColor: '#ebb33f', // $tulip-tree
                 nonSelectBackgroundColor: '#ecb23e',
               }),
-              h('.network-name', 'Rinkeby Test Net'),
+              h('.network-name', t('rinkeby')),
               h('i.fa.fa-chevron-down.fa-lg.network-caret'),
             ])
           default:
@@ -123,7 +123,7 @@ Network.prototype.render = function () {
                 },
               }),
 
-              h('.network-name', 'Private Network'),
+              h('.network-name', t('privateNetwork')),
               h('i.fa.fa-chevron-down.fa-lg.network-caret'),
             ])
         }

ui/app/components/notice.js

@@ -111,7 +111,7 @@ Notice.prototype.render = function () {
         style: {
           marginTop: '18px',
         },
-      }, 'Accept'),
+      }, t('accept')),
     ])
   )
 }

ui/app/components/pending-msg-details.js

@@ -39,7 +39,7 @@ PendingMsgDetails.prototype.render = function () {
       // message data
       h('.tx-data.flex-column.flex-justify-center.flex-grow.select-none', [
         h('.flex-column.flex-space-between', [
-          h('label.font-small', 'MESSAGE'),
+          h('label.font-small', t('messageCaps')),
           h('span.font-small', msgParams.data),
         ]),
       ]),
@@ -47,4 +47,3 @@ PendingMsgDetails.prototype.render = function () {
     ])
   )
 }
-

ui/app/components/pending-msg.js

@@ -29,17 +29,14 @@ PendingMsg.prototype.render = function () {
           fontWeight: 'bold',
           textAlign: 'center',
         },
-      }, 'Sign Message'),
+      }, t('signMessage')),
 
       h('.error', {
         style: {
           margin: '10px',
         },
       }, [
-        `Signing this message can have
-        dangerous side effects. Only sign messages from
-        sites you fully trust with your entire account.
-        This dangerous method will be removed in a future version. `,
+        t('signNotice'),
         h('a', {
           href: 'https://medium.com/metamask/the-new-secure-way-to-sign-data-in-your-browser-6af9dd2a1527',
           style: { color: 'rgb(247, 134, 28)' },
@@ -48,7 +45,7 @@ PendingMsg.prototype.render = function () {
             const url = 'https://medium.com/metamask/the-new-secure-way-to-sign-data-in-your-browser-6af9dd2a1527'
             global.platform.openWindow({ url })
           },
-        }, 'Read more here.'),
+        }, t('readMore')),
       ]),
 
       // message details
@@ -58,13 +55,12 @@ PendingMsg.prototype.render = function () {
       h('.flex-row.flex-space-around', [
         h('button', {
           onClick: state.cancelMessage,
-        }, 'Cancel'),
+        }, t('cancel')),
         h('button', {
           onClick: state.signMessage,
-        }, 'Sign'),
+        }, t('sign')),
       ]),
     ])
 
   )
 }
-

ui/app/components/pending-personal-msg-details.js

@@ -45,7 +45,7 @@ PendingMsgDetails.prototype.render = function () {
           height: '260px',
         },
       }, [
-        h('label.font-small', { style: { display: 'block' } }, 'MESSAGE'),
+        h('label.font-small', { style: { display: 'block' } }, t('messageCaps')),
         h(BinaryRenderer, {
           value: data,
           style: {
@@ -57,4 +57,3 @@ PendingMsgDetails.prototype.render = function () {
     ])
   )
 }
-

ui/app/components/pending-typed-msg-details.js

@@ -45,7 +45,7 @@ PendingMsgDetails.prototype.render = function () {
           height: '260px',
         },
       }, [
-        h('label.font-small', { style: { display: 'block' } }, 'YOU ARE SIGNING'),
+        h('label.font-small', { style: { display: 'block' } }, t('youSignCaps')),
         h(TypedMessageRenderer, {
           value: data,
           style: {

ui/app/components/pending-typed-msg.js

@@ -26,7 +26,7 @@ PendingMsg.prototype.render = function () {
           fontWeight: 'bold',
           textAlign: 'center',
         },
-      }, 'Sign Message'),
+      }, t('signMessage')),
 
       // message details
       h(PendingTxDetails, state),
@@ -35,10 +35,10 @@ PendingMsg.prototype.render = function () {
       h('.flex-row.flex-space-around', [
         h('button', {
           onClick: state.cancelTypedMessage,
-        }, 'Cancel'),
+        }, t('cancelButton')),
         h('button', {
           onClick: state.signTypedMessage,
-        }, 'Sign'),
+        }, t('signButton')),
       ]),
     ])
 

ui/app/components/shapeshift-form.js

@@ -92,7 +92,7 @@ ShapeshiftForm.prototype.onBuyWithShapeShift = function () {
       }))
       .catch(() => this.setState({
         showQrCode: false,
-        errorMessage: 'Invalid Request',
+        errorMessage: t('invalidRequest'),
         isLoading: false,
       }))
   }
@@ -124,10 +124,10 @@ ShapeshiftForm.prototype.renderMarketInfo = function () {
 
   return h('div.shapeshift-form__metadata', {}, [
 
-    this.renderMetadata('Status', limit ? 'Available' : 'Unavailable'),
-    this.renderMetadata('Limit', limit),
-    this.renderMetadata('Exchange Rate', rate),
-    this.renderMetadata('Minimum', minimum),
+    this.renderMetadata(t('status'), limit ? t('available') : t('unavailable')),
+    this.renderMetadata(t('limit'), limit),
+    this.renderMetadata(t('exchangeRate'), rate),
+    this.renderMetadata(t('min'), minimum),
 
   ])
 }
@@ -141,7 +141,7 @@ ShapeshiftForm.prototype.renderQrCode = function () {
   return h('div.shapeshift-form', {}, [
 
     h('div.shapeshift-form__deposit-instruction', [
-      'Deposit your BTC to the address below:',
+      t('depositBTC'),
     ]),
 
     h('div', depositAddress),
@@ -178,7 +178,7 @@ ShapeshiftForm.prototype.render = function () {
 
             h('div.shapeshift-form__selector', [
 
-              h('div.shapeshift-form__selector-label', 'Deposit'),
+              h('div.shapeshift-form__selector-label', t('deposit')),
 
               h(SimpleDropdown, {
                 selectedOption: this.state.depositCoin,
@@ -198,7 +198,7 @@ ShapeshiftForm.prototype.render = function () {
             h('div.shapeshift-form__selector', [
 
               h('div.shapeshift-form__selector-label', [
-                'Receive',
+                t('receive'),
               ]),
 
               h('div.shapeshift-form__selector-input', ['ETH']),
@@ -214,7 +214,7 @@ ShapeshiftForm.prototype.render = function () {
           }, [
 
             h('div.shapeshift-form__address-input-label', [
-              'Your Refund Address',
+              t('refundAddress'),
             ]),
 
             h('input.shapeshift-form__address-input', {
@@ -236,7 +236,7 @@ ShapeshiftForm.prototype.render = function () {
         className: btnClass,
         disabled: !token,
         onClick: () => this.onBuyWithShapeShift(),
-      }, ['Buy']),
+      }, [t('buyButton')]),
 
     ])
 }

ui/app/components/shift-list-item.js

@@ -141,7 +141,7 @@ ShiftListItem.prototype.renderInfo = function () {
             width: '100%',
           },
         }, `${props.depositType} to ETH via ShapeShift`),
-        h('div', 'No deposits received'),
+        h('div', t('noDeposits')),
         h('div', {
           style: {
             fontSize: 'x-small',
@@ -164,7 +164,7 @@ ShiftListItem.prototype.renderInfo = function () {
             width: '100%',
           },
         }, `${props.depositType} to ETH via ShapeShift`),
-        h('div', 'Conversion in progress'),
+        h('div', t('conversionProgress')),
         h('div', {
           style: {
             fontSize: 'x-small',
@@ -189,7 +189,7 @@ ShiftListItem.prototype.renderInfo = function () {
             color: '#ABA9AA',
             width: '100%',
           },
-        }, 'From ShapeShift'),
+        }, t('fromShapeShift')),
         h('div', formatDate(props.time)),
         h('div', {
           style: {
@@ -201,7 +201,7 @@ ShiftListItem.prototype.renderInfo = function () {
       ])
 
     case 'failed':
-      return h('span.error', '(Failed)')
+      return h('span.error', '(' + t('failed') + ')')
     default:
       return ''
   }

ui/app/components/signature-request.js

@@ -54,7 +54,7 @@ SignatureRequest.prototype.renderHeader = function () {
 
     h('div.request-signature__header-background'),
 
-    h('div.request-signature__header__text', 'Signature Request'),
+    h('div.request-signature__header__text', t('sigRequest')),
 
     h('div.request-signature__header__tip-container', [
       h('div.request-signature__header__tip'),
@@ -75,7 +75,7 @@ SignatureRequest.prototype.renderAccountDropdown = function () {
 
   return h('div.request-signature__account', [
 
-    h('div.request-signature__account-text', ['Account:']),
+    h('div.request-signature__account-text', [t('account')]),
 
     h(AccountDropdownMini, {
       selectedAccount,
@@ -102,7 +102,7 @@ SignatureRequest.prototype.renderBalance = function () {
 
   return h('div.request-signature__balance', [
 
-    h('div.request-signature__balance-text', ['Balance:']),
+    h('div.request-signature__balance-text', [t('balance')]),
 
     h('div.request-signature__balance-value', `${balanceInEther} ETH`),
 
@@ -136,7 +136,7 @@ SignatureRequest.prototype.renderRequestInfo = function () {
   return h('div.request-signature__request-info', [
 
     h('div.request-signature__headline', [
-      `Your signature is being requested`,
+      t('yourSigRequested'),
     ]),
 
   ])
@@ -154,21 +154,18 @@ SignatureRequest.prototype.msgHexToText = function (hex) {
 
 SignatureRequest.prototype.renderBody = function () {
   let rows
-  let notice = 'You are signing:'
+  let notice = t('youSign')
 
   const { txData } = this.props
   const { type, msgParams: { data } } = txData
 
   if (type === 'personal_sign') {
-    rows = [{ name: 'Message', value: this.msgHexToText(data) }]
+    rows = [{ name: t('message'), value: this.msgHexToText(data) }]
   } else if (type === 'eth_signTypedData') {
     rows = data
   } else if (type === 'eth_sign') {
-    rows = [{ name: 'Message', value: data }]
-    notice = `Signing this message can have
-    dangerous side effects. Only sign messages from
-    sites you fully trust with your entire account.
-    This dangerous method will be removed in a future version. `
+    rows = [{ name: t('message'), value: data }]
+    notice = t('signNotice')
   }
 
   return h('div.request-signature__body', {}, [
@@ -227,10 +224,10 @@ SignatureRequest.prototype.renderFooter = function () {
   return h('div.request-signature__footer', [
     h('button.request-signature__footer__cancel-button', {
       onClick: cancel,
-    }, 'CANCEL'),
+    }, t('cancelButton')),
     h('button.request-signature__footer__sign-button', {
       onClick: sign,
-    }, 'SIGN'),
+    }, t('signButton')),
   ])
 }
 
@@ -250,4 +247,3 @@ SignatureRequest.prototype.render = function () {
   )
 
 }
-

ui/app/components/token-list.js

@@ -42,7 +42,7 @@ TokenList.prototype.render = function () {
   const { tokens, isLoading, error } = state
 
   if (isLoading) {
-    return this.message('Loading Tokens...')
+    return this.message(t('loadingTokens'))
   }
 
   if (error) {
@@ -52,7 +52,7 @@ TokenList.prototype.render = function () {
         padding: '80px',
       },
     }, [
-      'We had trouble loading your token balances. You can view them ',
+      t('troubleTokenBalances'),
       h('span.hotFix', {
         style: {
           color: 'rgba(247, 134, 28, 1)',
@@ -63,7 +63,7 @@ TokenList.prototype.render = function () {
           url: `https://ethplorer.io/address/${userAddress}`,
         })
         },
-      }, 'here'),
+      }, t('here')),
     ])
   }
 

ui/app/components/transaction-list-item.js

@@ -85,7 +85,7 @@ TransactionListItem.prototype.render = function () {
         ]),
 
         h(Tooltip, {
-          title: 'Transaction Number',
+          title: t('transactionNumber'),
           position: 'right',
         }, [
           h('span', {
@@ -142,12 +142,12 @@ TransactionListItem.prototype.render = function () {
           style: {
             paddingRight: '2px',
           },
-        }, 'Taking too long?'),
+        }, t('takesTooLong')),
         h('div', {
           style: {
             textDecoration: 'underline',
           },
-        }, 'Retry with a higher gas price here'),
+        }, t('retryWithMoreGas')),
       ]),
     ])
   )
@@ -176,11 +176,11 @@ function recipientField (txParams, transaction, isTx, isMsg) {
   let message
 
   if (isMsg) {
-    message = 'Signature Requested'
+    message = t('sigRequested')
   } else if (txParams.to) {
     message = addressSummary(txParams.to)
   } else {
-    message = 'Contract Published'
+    message = t('contractPublished')
   }
 
   return h('div', {
@@ -203,7 +203,7 @@ function renderErrorOrWarning (transaction) {
 
   // show rejected
   if (status === 'rejected') {
-    return h('span.error', ' (Rejected)')
+    return h('span.error', ' (' + t('rejected') + ')')
   }
   if (transaction.err || transaction.warning) {
     const { err, warning = {} } = transaction
@@ -219,7 +219,7 @@ function renderErrorOrWarning (transaction) {
             title: message,
             position: 'bottom',
           }, [
-            h(`span.error`, ` (Failed)`),
+            h(`span.error`, ` (` + t('failed') + `)`),
           ])
       )
     }
@@ -231,7 +231,7 @@ function renderErrorOrWarning (transaction) {
         title: message,
         position: 'bottom',
       }, [
-        h(`span.warning`, ` (Warning)`),
+        h(`span.warning`, ` (` + t('warning') + `)`),
       ])
     }
   }

ui/app/components/transaction-list.js

@@ -78,10 +78,9 @@ TransactionList.prototype.render = function () {
             style: {
               marginTop: '50px',
             },
-          }, 'No transaction history.'),
+          }, t('noTransactionHistory')),
         ]),
       ]),
     ])
   )
 }
-

ui/app/components/tx-list-item.js

@@ -63,7 +63,7 @@ TxListItem.prototype.getAddressText = function () {
     default:
       return address
         ? `${address.slice(0, 10)}...${address.slice(-4)}`
-        : 'Contract Published'
+        : t('contractPublished')
   }
 }
 

ui/app/components/tx-list.js

@@ -55,7 +55,7 @@ TxList.prototype.renderTransaction = function () {
     : [h(
         'div.tx-list-item.tx-list-item--empty',
         { key: 'tx-list-none' },
-        [ 'No Transactions' ],
+        [ t('noTransactions') ],
       )]
 }
 
@@ -110,7 +110,7 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa
 
   if (isUnapproved) {
     opts.onClick = () => showConfTxPage({id: transActionId})
-    opts.transactionStatus = 'Not Started'
+    opts.transactionStatus = t('Not Started')
   } else if (transactionHash) {
     opts.onClick = () => this.view(transactionHash, transactionNetworkId)
   }

ui/app/components/tx-view.js

@@ -72,21 +72,21 @@ TxView.prototype.renderButtons = function () {
           onClick: () => showModal({
             name: 'DEPOSIT_ETHER',
           }),
-        }, 'DEPOSIT'),
+        }, t('depositButton')),
 
         h('button.btn-clear.hero-balance-button', {
           style: {
             marginLeft: '0.8em',
           },
           onClick: showSendPage,
-        }, 'SEND'),
+        }, t('sendButton')),
       ])
     )
     : (
       h('div.flex-row.flex-center.hero-balance-buttons', [
         h('button.btn-clear.hero-balance-button', {
           onClick: showSendTokenPage,
-        }, 'SEND'),
+        }, t('sendButton')),
       ])
     )
 }

ui/app/components/wallet-view.js

@@ -113,7 +113,7 @@ WalletView.prototype.render = function () {
         onClick: hideSidebar,
       }),
 
-      h('div.wallet-view__keyring-label', isLoose ? 'IMPORTED' : ''),
+      h('div.wallet-view__keyring-label', isLoose ? t('importedCaps') : ''),
 
       h('div.flex-column.flex-center.wallet-view__name-container', {
         style: { margin: '0 auto' },
@@ -130,7 +130,7 @@ WalletView.prototype.render = function () {
           selectedIdentity.name,
         ]),
 
-        h('button.btn-clear.wallet-view__details-button', 'DETAILS'),
+        h('button.btn-clear.wallet-view__details-button', t('detailsCaps')),
       ]),
     ]),
 
@@ -142,7 +142,7 @@ WalletView.prototype.render = function () {
         setTimeout(() => this.setState({ hasCopied: false }), 3000)
       },
     }, [
-      this.state.hasCopied && 'Copied to Clipboard',
+      this.state.hasCopied && t('copiedClipboard'),
       !this.state.hasCopied && `${selectedAddress.slice(0, 4)}...${selectedAddress.slice(-4)}`,
       h('i.fa.fa-clipboard', { style: { marginLeft: '8px' } }),
     ]),
@@ -156,7 +156,7 @@ WalletView.prototype.render = function () {
         showAddTokenPage()
         hideSidebar()
       },
-    }, 'Add Token'),
+    }, t('addToken')),
   ])
 }
 

ui/app/first-time/init-menu.js

@@ -10,6 +10,13 @@ const getCaretCoordinates = require('textarea-caret')
 
 let isSubmitting = false
 
+let t = chrome.i18n.getMessage || (function() {
+  let msg = require('../../../app/_locales/en/messages.json');
+  return (function(key) {
+    return msg[key].message;
+  });
+})();
+
 module.exports = connect(mapStateToProps)(InitializeMenuScreen)
 
 inherits(InitializeMenuScreen, Component)
@@ -57,7 +64,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
           color: '#7F8082',
           marginBottom: 10,
         },
-      }, 'MetaMask'),
+      }, t('appName')),
 
 
       h('div', [
@@ -67,10 +74,10 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
             color: '#7F8082',
             display: 'inline',
           },
-        }, 'Encrypt your new DEN'),
+        }, t('encryptNewDen')),
 
         h(Tooltip, {
-          title: 'Your DEN is your password-encrypted storage within MetaMask.',
+          title: t('denExplainer'),
         }, [
           h('i.fa.fa-question-circle.pointer', {
             style: {
@@ -90,7 +97,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
       h('input.large-input.letter-spacey', {
         type: 'password',
         id: 'password-box',
-        placeholder: 'New Password (min 8 chars)',
+        placeholder: t('newPassword'),
         onInput: this.inputChanged.bind(this),
         style: {
           width: 260,
@@ -102,7 +109,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
       h('input.large-input.letter-spacey', {
         type: 'password',
         id: 'password-box-confirm',
-        placeholder: 'Confirm Password',
+        placeholder: t('confirmPassword'),
         onKeyPress: this.createVaultOnEnter.bind(this),
         onInput: this.inputChanged.bind(this),
         style: {
@@ -117,7 +124,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
         style: {
           margin: 12,
         },
-      }, 'Create'),
+      }, t('createDen')),
 
       h('.flex-row.flex-center.flex-grow', [
         h('p.pointer', {
@@ -127,7 +134,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
             color: 'rgb(247, 134, 28)',
             textDecoration: 'underline',
           },
-        }, 'Import Existing DEN'),
+        }, t('importDen')),
       ]),
 
     ])
@@ -156,12 +163,12 @@ InitializeMenuScreen.prototype.createNewVaultAndKeychain = function () {
   var passwordConfirm = passwordConfirmBox.value
 
   if (password.length < 8) {
-    this.warning = 'password not long enough'
+    this.warning = t('passwordShort')
     this.props.dispatch(actions.displayWarning(this.warning))
     return
   }
   if (password !== passwordConfirm) {
-    this.warning = 'passwords don\'t match'
+    this.warning = t('passwordMismatch')
     this.props.dispatch(actions.displayWarning(this.warning))
     return
   }