aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/pages/create-account/connect-hardware
diff options
context:
space:
mode:
authorWhymarrh Whitby <whymarrh.whitby@gmail.com>2019-08-01 04:17:11 +0800
committerFrankie <frankie.diamond@gmail.com>2019-08-01 04:17:11 +0800
commit4d88e1cf862c3ae174780cd888d7703685db23e7 (patch)
tree93f7cd0e7bbcb42c7be310f0e6b12230eace9492 /ui/app/pages/create-account/connect-hardware
parente9c7df28ed88f6dc3a5074cf873f3920429d1803 (diff)
downloadtangerine-wallet-browser-4d88e1cf862c3ae174780cd888d7703685db23e7.tar.gz
tangerine-wallet-browser-4d88e1cf862c3ae174780cd888d7703685db23e7.tar.zst
tangerine-wallet-browser-4d88e1cf862c3ae174780cd888d7703685db23e7.zip
Enable indent linting via ESLint (#6936)
* Enable indent linting via ESLint * yarn run lint:fix
Diffstat (limited to 'ui/app/pages/create-account/connect-hardware')
-rw-r--r--ui/app/pages/create-account/connect-hardware/account-list.js228
-rw-r--r--ui/app/pages/create-account/connect-hardware/connect-screen.js214
-rw-r--r--ui/app/pages/create-account/connect-hardware/index.js60
3 files changed, 251 insertions, 251 deletions
diff --git a/ui/app/pages/create-account/connect-hardware/account-list.js b/ui/app/pages/create-account/connect-hardware/account-list.js
index 247c27a5d..71684783f 100644
--- a/ui/app/pages/create-account/connect-hardware/account-list.js
+++ b/ui/app/pages/create-account/connect-hardware/account-list.js
@@ -6,18 +6,18 @@ const Select = require('react-select').default
import Button from '../../../components/ui/button'
class AccountList extends Component {
- getHdPaths () {
- return [
- {
- label: `Ledger Live`,
- value: `m/44'/60'/0'/0/0`,
- },
- {
- label: `Legacy (MEW / MyCrypto)`,
- value: `m/44'/60'/0'`,
- },
- ]
- }
+ getHdPaths () {
+ return [
+ {
+ label: `Ledger Live`,
+ value: `m/44'/60'/0'/0/0`,
+ },
+ {
+ label: `Legacy (MEW / MyCrypto)`,
+ value: `m/44'/60'/0'`,
+ },
+ ]
+ }
goToNextPage = () => {
// If we have < 5 accounts, it's restricted by BIP-44
@@ -74,128 +74,128 @@ class AccountList extends Component {
}
renderAccounts () {
- return h('div.hw-account-list', [
- this.props.accounts.map((a, i) => {
-
- return h('div.hw-account-list__item', { key: a.address }, [
- h('div.hw-account-list__item__radio', [
- h('input', {
- type: 'radio',
- name: 'selectedAccount',
- id: `address-${i}`,
- value: a.index,
- onChange: (e) => this.props.onAccountChange(e.target.value),
- checked: this.props.selectedAccount === a.index.toString(),
- }),
- h(
- 'label.hw-account-list__item__label',
- {
- htmlFor: `address-${i}`,
- },
- [
- h('span.hw-account-list__item__index', a.index + 1),
- `${a.address.slice(0, 4)}...${a.address.slice(-4)}`,
- h('span.hw-account-list__item__balance', `${a.balance}`),
- ]),
+ return h('div.hw-account-list', [
+ this.props.accounts.map((a, i) => {
+
+ return h('div.hw-account-list__item', { key: a.address }, [
+ h('div.hw-account-list__item__radio', [
+ h('input', {
+ type: 'radio',
+ name: 'selectedAccount',
+ id: `address-${i}`,
+ value: a.index,
+ onChange: (e) => this.props.onAccountChange(e.target.value),
+ checked: this.props.selectedAccount === a.index.toString(),
+ }),
+ h(
+ 'label.hw-account-list__item__label',
+ {
+ htmlFor: `address-${i}`,
+ },
+ [
+ h('span.hw-account-list__item__index', a.index + 1),
+ `${a.address.slice(0, 4)}...${a.address.slice(-4)}`,
+ h('span.hw-account-list__item__balance', `${a.balance}`),
]),
- h(
- 'a.hw-account-list__item__link',
- {
- href: genAccountLink(a.address, this.props.network),
- target: '_blank',
- title: this.context.t('etherscanView'),
- },
- h('img', { src: 'images/popout.svg' })
- ),
- ])
- }),
- ])
+ ]),
+ h(
+ 'a.hw-account-list__item__link',
+ {
+ href: genAccountLink(a.address, this.props.network),
+ target: '_blank',
+ title: this.context.t('etherscanView'),
+ },
+ h('img', { src: 'images/popout.svg' })
+ ),
+ ])
+ }),
+ ])
}
- renderPagination () {
- return h('div.hw-list-pagination', [
- h(
- 'button.hw-list-pagination__button',
- {
- onClick: this.goToPreviousPage,
- },
- `< ${this.context.t('prev')}`
- ),
-
- h(
- 'button.hw-list-pagination__button',
- {
- onClick: this.goToNextPage,
- },
- `${this.context.t('next')} >`
- ),
- ])
- }
-
- renderButtons () {
- const disabled = this.props.selectedAccount === null
- const buttonProps = {}
- if (disabled) {
- buttonProps.disabled = true
+ renderPagination () {
+ return h('div.hw-list-pagination', [
+ h(
+ 'button.hw-list-pagination__button',
+ {
+ onClick: this.goToPreviousPage,
+ },
+ `< ${this.context.t('prev')}`
+ ),
+
+ h(
+ 'button.hw-list-pagination__button',
+ {
+ onClick: this.goToNextPage,
+ },
+ `${this.context.t('next')} >`
+ ),
+ ])
}
- return h('div.new-account-connect-form__buttons', {}, [
- h(Button, {
- type: 'default',
- large: true,
- className: 'new-account-connect-form__button',
- onClick: this.props.onCancel.bind(this),
- }, [this.context.t('cancel')]),
-
- h(Button, {
- type: 'primary',
- large: true,
- className: 'new-account-connect-form__button unlock',
- disabled,
- onClick: this.props.onUnlockAccount.bind(this, this.props.device),
- }, [this.context.t('unlock')]),
- ])
- }
+ renderButtons () {
+ const disabled = this.props.selectedAccount === null
+ const buttonProps = {}
+ if (disabled) {
+ buttonProps.disabled = true
+ }
- renderForgetDevice () {
- return h('div.hw-forget-device-container', {}, [
- h('a', {
- onClick: this.props.onForgetDevice.bind(this, this.props.device),
- }, this.context.t('forgetDevice')),
- ])
- }
+ return h('div.new-account-connect-form__buttons', {}, [
+ h(Button, {
+ type: 'default',
+ large: true,
+ className: 'new-account-connect-form__button',
+ onClick: this.props.onCancel.bind(this),
+ }, [this.context.t('cancel')]),
+
+ h(Button, {
+ type: 'primary',
+ large: true,
+ className: 'new-account-connect-form__button unlock',
+ disabled,
+ onClick: this.props.onUnlockAccount.bind(this, this.props.device),
+ }, [this.context.t('unlock')]),
+ ])
+ }
- render () {
- return h('div.new-account-connect-form.account-list', {}, [
+ renderForgetDevice () {
+ return h('div.hw-forget-device-container', {}, [
+ h('a', {
+ onClick: this.props.onForgetDevice.bind(this, this.props.device),
+ }, this.context.t('forgetDevice')),
+ ])
+ }
+
+ render () {
+ return h('div.new-account-connect-form.account-list', {}, [
this.renderHeader(),
this.renderAccounts(),
this.renderPagination(),
this.renderButtons(),
this.renderForgetDevice(),
- ])
- }
+ ])
+ }
}
AccountList.propTypes = {
- onPathChange: PropTypes.func.isRequired,
- selectedPath: PropTypes.string.isRequired,
- device: PropTypes.string.isRequired,
- accounts: PropTypes.array.isRequired,
- onAccountChange: PropTypes.func.isRequired,
- onForgetDevice: PropTypes.func.isRequired,
- getPage: PropTypes.func.isRequired,
- network: PropTypes.string,
- selectedAccount: PropTypes.string,
- history: PropTypes.object,
- onUnlockAccount: PropTypes.func,
- onCancel: PropTypes.func,
- onAccountRestriction: PropTypes.func,
+ onPathChange: PropTypes.func.isRequired,
+ selectedPath: PropTypes.string.isRequired,
+ device: PropTypes.string.isRequired,
+ accounts: PropTypes.array.isRequired,
+ onAccountChange: PropTypes.func.isRequired,
+ onForgetDevice: PropTypes.func.isRequired,
+ getPage: PropTypes.func.isRequired,
+ network: PropTypes.string,
+ selectedAccount: PropTypes.string,
+ history: PropTypes.object,
+ onUnlockAccount: PropTypes.func,
+ onCancel: PropTypes.func,
+ onAccountRestriction: PropTypes.func,
}
AccountList.contextTypes = {
- t: PropTypes.func,
+ t: PropTypes.func,
}
module.exports = AccountList
diff --git a/ui/app/pages/create-account/connect-hardware/connect-screen.js b/ui/app/pages/create-account/connect-hardware/connect-screen.js
index a3b8ad246..fe7c1e027 100644
--- a/ui/app/pages/create-account/connect-hardware/connect-screen.js
+++ b/ui/app/pages/create-account/connect-hardware/connect-screen.js
@@ -4,12 +4,12 @@ const h = require('react-hyperscript')
import Button from '../../../components/ui/button'
class ConnectScreen extends Component {
- constructor (props) {
- super(props)
- this.state = {
- selectedDevice: null,
- }
+ constructor (props) {
+ super(props)
+ this.state = {
+ selectedDevice: null,
}
+ }
connect = () => {
if (this.state.selectedDevice) {
@@ -19,23 +19,23 @@ class ConnectScreen extends Component {
}
renderConnectToTrezorButton () {
- return h(
- `button.hw-connect__btn${this.state.selectedDevice === 'trezor' ? '.selected' : ''}`,
- { onClick: _ => this.setState({selectedDevice: 'trezor'}) },
- h('img.hw-connect__btn__img', {
- src: 'images/trezor-logo.svg',
- })
- )
+ return h(
+ `button.hw-connect__btn${this.state.selectedDevice === 'trezor' ? '.selected' : ''}`,
+ { onClick: _ => this.setState({selectedDevice: 'trezor'}) },
+ h('img.hw-connect__btn__img', {
+ src: 'images/trezor-logo.svg',
+ })
+ )
}
renderConnectToLedgerButton () {
- return h(
- `button.hw-connect__btn${this.state.selectedDevice === 'ledger' ? '.selected' : ''}`,
- { onClick: _ => this.setState({selectedDevice: 'ledger'}) },
- h('img.hw-connect__btn__img', {
- src: 'images/ledger-logo.svg',
- })
- )
+ return h(
+ `button.hw-connect__btn${this.state.selectedDevice === 'ledger' ? '.selected' : ''}`,
+ { onClick: _ => this.setState({selectedDevice: 'ledger'}) },
+ h('img.hw-connect__btn__img', {
+ src: 'images/ledger-logo.svg',
+ })
+ )
}
renderButtons () {
@@ -57,30 +57,30 @@ class ConnectScreen extends Component {
}
renderUnsupportedBrowser () {
- return (
- h('div.new-account-connect-form.unsupported-browser', {}, [
- h('div.hw-connect', [
- h('h3.hw-connect__title', {}, this.context.t('browserNotSupported')),
- h('p.hw-connect__msg', {}, this.context.t('chromeRequiredForHardwareWallets')),
- ]),
- h(Button, {
- type: 'primary',
- large: true,
- onClick: () => global.platform.openWindow({
- url: 'https://google.com/chrome',
- }),
- }, this.context.t('downloadGoogleChrome')),
- ])
- )
+ return (
+ h('div.new-account-connect-form.unsupported-browser', {}, [
+ h('div.hw-connect', [
+ h('h3.hw-connect__title', {}, this.context.t('browserNotSupported')),
+ h('p.hw-connect__msg', {}, this.context.t('chromeRequiredForHardwareWallets')),
+ ]),
+ h(Button, {
+ type: 'primary',
+ large: true,
+ onClick: () => global.platform.openWindow({
+ url: 'https://google.com/chrome',
+ }),
+ }, this.context.t('downloadGoogleChrome')),
+ ])
+ )
}
renderHeader () {
- return (
- h('div.hw-connect__header', {}, [
- h('h3.hw-connect__header__title', {}, this.context.t(`hardwareWallets`)),
- h('p.hw-connect__header__msg', {}, this.context.t(`hardwareWalletsMsg`)),
- ])
- )
+ return (
+ h('div.hw-connect__header', {}, [
+ h('h3.hw-connect__header__title', {}, this.context.t(`hardwareWallets`)),
+ h('p.hw-connect__header__msg', {}, this.context.t(`hardwareWalletsMsg`)),
+ ])
+ )
}
getAffiliateLinks () {
@@ -96,10 +96,10 @@ class ConnectScreen extends Component {
}
renderTrezorAffiliateLink () {
- return h('div.hw-connect__get-hw', {}, [
- h('p.hw-connect__get-hw__msg', {}, this.context.t(`dontHaveAHardwareWallet`)),
- this.getAffiliateLinks(),
- ])
+ return h('div.hw-connect__get-hw', {}, [
+ h('p.hw-connect__get-hw__msg', {}, this.context.t(`dontHaveAHardwareWallet`)),
+ this.getAffiliateLinks(),
+ ])
}
@@ -108,89 +108,89 @@ class ConnectScreen extends Component {
}
renderLearnMore () {
- return (
- h('p.hw-connect__learn-more', {
- onClick: this.scrollToTutorial,
- }, [
- this.context.t('learnMore'),
- h('img.hw-connect__learn-more__arrow', { src: 'images/caret-right.svg'}),
- ])
- )
+ return (
+ h('p.hw-connect__learn-more', {
+ onClick: this.scrollToTutorial,
+ }, [
+ this.context.t('learnMore'),
+ h('img.hw-connect__learn-more__arrow', { src: 'images/caret-right.svg'}),
+ ])
+ )
}
renderTutorialSteps () {
- const steps = [
- {
- asset: 'hardware-wallet-step-1',
- dimensions: {width: '225px', height: '75px'},
- },
- {
- asset: 'hardware-wallet-step-2',
- dimensions: {width: '300px', height: '100px'},
- },
- {
- asset: 'hardware-wallet-step-3',
- dimensions: {width: '120px', height: '90px'},
- },
- ]
-
- return h('.hw-tutorial', {
- ref: node => { this.referenceNode = node },
+ const steps = [
+ {
+ asset: 'hardware-wallet-step-1',
+ dimensions: {width: '225px', height: '75px'},
+ },
+ {
+ asset: 'hardware-wallet-step-2',
+ dimensions: {width: '300px', height: '100px'},
},
- steps.map((step, i) => (
- h('div.hw-connect', {}, [
- h('h3.hw-connect__title', {}, this.context.t(`step${i + 1}HardwareWallet`)),
- h('p.hw-connect__msg', {}, this.context.t(`step${i + 1}HardwareWalletMsg`)),
- h('img.hw-connect__step-asset', { src: `images/${step.asset}.svg`, ...step.dimensions }),
- ])
- ))
- )
+ {
+ asset: 'hardware-wallet-step-3',
+ dimensions: {width: '120px', height: '90px'},
+ },
+ ]
+
+ return h('.hw-tutorial', {
+ ref: node => { this.referenceNode = node },
+ },
+ steps.map((step, i) => (
+ h('div.hw-connect', {}, [
+ h('h3.hw-connect__title', {}, this.context.t(`step${i + 1}HardwareWallet`)),
+ h('p.hw-connect__msg', {}, this.context.t(`step${i + 1}HardwareWalletMsg`)),
+ h('img.hw-connect__step-asset', { src: `images/${step.asset}.svg`, ...step.dimensions }),
+ ])
+ ))
+ )
}
renderFooter () {
- return (
- h('div.hw-connect__footer', {}, [
- h('h3.hw-connect__footer__title', {}, this.context.t(`readyToConnect`)),
- this.renderButtons(),
- h('p.hw-connect__footer__msg', {}, [
- this.context.t(`havingTroubleConnecting`),
- h('a.hw-connect__footer__link', {
- href: 'https://support.metamask.io/',
- target: '_blank',
- }, this.context.t('getHelp')),
- ]),
- ])
- )
+ return (
+ h('div.hw-connect__footer', {}, [
+ h('h3.hw-connect__footer__title', {}, this.context.t(`readyToConnect`)),
+ this.renderButtons(),
+ h('p.hw-connect__footer__msg', {}, [
+ this.context.t(`havingTroubleConnecting`),
+ h('a.hw-connect__footer__link', {
+ href: 'https://support.metamask.io/',
+ target: '_blank',
+ }, this.context.t('getHelp')),
+ ]),
+ ])
+ )
}
renderConnectScreen () {
- return (
- h('div.new-account-connect-form', {}, [
- this.renderHeader(),
- this.renderButtons(),
- this.renderTrezorAffiliateLink(),
- this.renderLearnMore(),
- this.renderTutorialSteps(),
- this.renderFooter(),
- ])
- )
+ return (
+ h('div.new-account-connect-form', {}, [
+ this.renderHeader(),
+ this.renderButtons(),
+ this.renderTrezorAffiliateLink(),
+ this.renderLearnMore(),
+ this.renderTutorialSteps(),
+ this.renderFooter(),
+ ])
+ )
}
render () {
- if (this.props.browserSupported) {
- return this.renderConnectScreen()
- }
- return this.renderUnsupportedBrowser()
+ if (this.props.browserSupported) {
+ return this.renderConnectScreen()
+ }
+ return this.renderUnsupportedBrowser()
}
}
ConnectScreen.propTypes = {
- connectToHardwareWallet: PropTypes.func.isRequired,
- browserSupported: PropTypes.bool.isRequired,
+ connectToHardwareWallet: PropTypes.func.isRequired,
+ browserSupported: PropTypes.bool.isRequired,
}
ConnectScreen.contextTypes = {
- t: PropTypes.func,
+ t: PropTypes.func,
}
module.exports = ConnectScreen
diff --git a/ui/app/pages/create-account/connect-hardware/index.js b/ui/app/pages/create-account/connect-hardware/index.js
index 80a160205..66851c780 100644
--- a/ui/app/pages/create-account/connect-hardware/index.js
+++ b/ui/app/pages/create-account/connect-hardware/index.js
@@ -126,16 +126,16 @@ class ConnectHardwareForm extends Component {
onForgetDevice = (device) => {
this.props.forgetDevice(device)
- .then(_ => {
- this.setState({
- error: null,
- selectedAccount: null,
- accounts: [],
- unlocked: false,
+ .then(_ => {
+ this.setState({
+ error: null,
+ selectedAccount: null,
+ accounts: [],
+ unlocked: false,
+ })
+ }).catch(e => {
+ this.setState({ error: e.toString() })
})
- }).catch(e => {
- this.setState({ error: e.toString() })
- })
}
onUnlockAccount = (device) => {
@@ -145,28 +145,28 @@ class ConnectHardwareForm extends Component {
}
this.props.unlockHardwareWalletAccount(this.state.selectedAccount, device)
- .then(_ => {
- this.context.metricsEvent({
- eventOpts: {
- category: 'Accounts',
- action: 'Connected Hardware Wallet',
- name: 'Connected Account with: ' + device,
- },
- })
- this.props.history.push(DEFAULT_ROUTE)
- }).catch(e => {
- this.context.metricsEvent({
- eventOpts: {
- category: 'Accounts',
- action: 'Connected Hardware Wallet',
- name: 'Error connecting hardware wallet',
- },
- customVariables: {
- error: e.toString(),
- },
+ .then(_ => {
+ this.context.metricsEvent({
+ eventOpts: {
+ category: 'Accounts',
+ action: 'Connected Hardware Wallet',
+ name: 'Connected Account with: ' + device,
+ },
+ })
+ this.props.history.push(DEFAULT_ROUTE)
+ }).catch(e => {
+ this.context.metricsEvent({
+ eventOpts: {
+ category: 'Accounts',
+ action: 'Connected Hardware Wallet',
+ name: 'Error connecting hardware wallet',
+ },
+ customVariables: {
+ error: e.toString(),
+ },
+ })
+ this.setState({ error: e.toString() })
})
- this.setState({ error: e.toString() })
- })
}
onCancel = () => {