diff options
author | brunobar79 <brunobar79@gmail.com> | 2018-07-06 05:45:28 +0800 |
---|---|---|
committer | brunobar79 <brunobar79@gmail.com> | 2018-07-06 05:45:28 +0800 |
commit | 6c2730f24300449010bd3552d4d746bcb5dd176a (patch) | |
tree | 674ad6bdf972a613207cdcfbe0b871224a4db7ef /ui/app/components/pages/create-account/connect-hardware/connect-screen.js | |
parent | ba5cde0995f956fb22825d604fe7d664677abaaa (diff) | |
download | tangerine-wallet-browser-6c2730f24300449010bd3552d4d746bcb5dd176a.tar.gz tangerine-wallet-browser-6c2730f24300449010bd3552d4d746bcb5dd176a.tar.zst tangerine-wallet-browser-6c2730f24300449010bd3552d4d746bcb5dd176a.zip |
Refactor UI
Diffstat (limited to 'ui/app/components/pages/create-account/connect-hardware/connect-screen.js')
-rw-r--r-- | ui/app/components/pages/create-account/connect-hardware/connect-screen.js | 60 |
1 files changed, 60 insertions, 0 deletions
diff --git a/ui/app/components/pages/create-account/connect-hardware/connect-screen.js b/ui/app/components/pages/create-account/connect-hardware/connect-screen.js new file mode 100644 index 000000000..1b064a15c --- /dev/null +++ b/ui/app/components/pages/create-account/connect-hardware/connect-screen.js @@ -0,0 +1,60 @@ +const { Component } = require('react') +const PropTypes = require('prop-types') +const h = require('react-hyperscript') + +export default class ConnectScreen extends Component { + constructor (props, context) { + super(props) + } + + connectToTrezor = () => { + if (this.props.connectToTrezor) { + this.props.connectToTrezor() + } + } + + renderUnsupportedBrowser () { + return ( + [ + h('div.hw-unsupported-browser', [ + h('h3.hw-unsupported-browser__title', {}, this.context.t('browserNotSupported')), + h('p.hw-unsupported-browser__msg', {}, this.context.t('chromeRequiredForTrezor')), + ]), + h( + 'button.btn-primary.btn--large', + { onClick: () => global.platform.openWindow({ + url: 'https://google.com/chrome', + }), style: { margin: 12 } }, + this.context.t('downloadGoogleChrome') + )] + ) + } + + renderConnectButton () { + return !this.state.accounts.length + ? h( + 'button.btn-primary.btn--large', + { onClick: this.connectToTrezor, style: { margin: 12 } }, + this.props.btnText + ) + : null + } + + render () { + const isChrome = window.navigator.userAgent.search('Chrome') !== -1 + if (isChrome) { + return this.renderConnectButton() + } else { + return this.renderUnsupportedBrowser() + } + } +} + +ConnectScreen.propTypes = { + connectToTrezor: PropTypes.func.isRequired, + btnText: PropTypes.string, +} + +ConnectScreen.contextTypes = { + t: PropTypes.func, +} |