{title}
- {renderDescription(description)}
+ {description}
{date}
{title}
- {renderDescription(description)}
+ {description}
{date}
+
{
// If we have < 5 accounts, it's restricted by BIP-44
if (this.props.accounts.length === 5) {
@@ -25,13 +19,8 @@ class AccountList extends Component {
this.props.getPage(this.props.device, -1, this.props.selectedPath);
};
- setPath(pathValue) {
- this.setState({ pathValue });
- }
-
renderHdPathSelector() {
- const { selectedPath, hdPaths } = this.props;
- const { pathValue } = this.state;
+ const { onPathChange, selectedPath, hdPaths } = this.props;
return (
);
@@ -211,44 +193,7 @@ class AccountList extends Component {
);
}
- renderSelectPathPopover() {
- const { pathValue } = this.state;
- const { onPathChange } = this.props;
-
- const footer = (
-
- {this.renderHdPathSelector()}
-
- );
- }
-
render() {
- const { showPopover } = this.state;
return (
+
);
}
- renderContinueButton() {
- return (
-
- );
- }
-
renderUnsupportedBrowser() {
return (
@@ -43,9 +32,9 @@ class AccountList extends Component {
{
- this.setPath(value);
+ onPathChange(value);
}}
/>
@@ -58,25 +47,18 @@ class AccountList extends Component {
}
renderHeader() {
+ const { device } = this.props;
return (
- {this.context.t('selectAnAccount')} + {`${this.context.t('unlock')} ${this.capitalizeDevice(device)}`}
+ {device.toLowerCase() === 'ledger' ? this.renderHdPathSelector() : null}{this.context.t('selectAnAccount')}
{this.context.t('selectAnAccountHelp')} - {this.context.t('selectAnAccountHelpDirections', [ - , - ])}
-
-
-
- );
-
- return (
-
{this.renderHeader()}
@@ -256,7 +201,6 @@ class AccountList extends Component {
{this.renderPagination()}
{this.renderButtons()}
{this.renderForgetDevice()}
- {showPopover && this.renderSelectPathPopover()}
);
}
diff --git a/ui/app/pages/create-account/connect-hardware/index.js b/ui/app/pages/create-account/connect-hardware/index.js
index ef9cc3f80..67051c213 100644
--- a/ui/app/pages/create-account/connect-hardware/index.js
+++ b/ui/app/pages/create-account/connect-hardware/index.js
@@ -139,24 +139,11 @@ class ConnectHardwareForm extends Component {
this.setState({ browserSupported: false, error: null });
} else if (errorMessage.includes(U2F_ERROR)) {
this.setState({ error: U2F_ERROR });
- } else if (
- errorMessage === 'LEDGER_LOCKED' ||
- errorMessage === 'LEDGER_WRONG_APP'
- ) {
- this.setState({
- error: this.context.t('ledgerLocked'),
- });
- } else if (errorMessage.includes('timeout')) {
- this.setState({
- error: this.context.t('ledgerTimeout'),
- });
} else if (
errorMessage !== 'Window closed' &&
errorMessage !== 'Popup closed'
) {
- this.setState({
- error: errorMessage,
- });
+ this.setState({ error: errorMessage });
}
});
};
@@ -261,7 +248,6 @@ class ConnectHardwareForm extends Component {
@@ -123,109 +117,118 @@ export default class SelectHardware extends Component {
);
}
- renderTutorialsteps() {
- switch (this.state.selectedDevice) {
- case 'ledger':
- return this.renderLedgerTutorialSteps();
- case 'trezor':
- return this.renderTrezorTutorialSteps();
- default:
- return '';
- }
- }
+ getAffiliateLinks() {
+ const links = {
+ trezor: `Trezor`,
+ ledger: `Ledger`,
+ };
- renderLedgerTutorialSteps() {
- const steps = [];
- if (this.props.useLedgerLive) {
- steps.push({
- title: this.context.t('step1LedgerWallet'),
- message: this.context.t('step1LedgerWalletMsg', [
-
- {this.context.t('ledgerLiveApp')}
- ,
- ]),
- });
- }
-
- steps.push({
- asset: 'plug-in-wallet',
- dimensions: { width: '225px', height: '75px' },
- title: this.context.t('step2LedgerWallet'),
- message: this.context.t('step2LedgerWalletMsg', [
-
- {this.context.t('hardwareWalletSupportLinkConversion')}
- ,
- ]),
- });
+ const text = this.context.t('orderOneHere');
+ const response = text
+ .replace('Trezor', links.trezor)
+ .replace('Ledger', links.ledger);
return (
-
+
+ );
+ }
+
+ renderTrezorAffiliateLink() {
+ return (
+
+
+ );
+ }
+
+ scrollToTutorial = () => {
+ if (this.referenceNode) {
+ this.referenceNode.scrollIntoView({ behavior: 'smooth' });
+ }
+ };
+
+ renderLearnMore() {
+ return (
+ + {this.context.t('dontHaveAHardwareWallet')} +
+ {this.getAffiliateLinks()} +
+ {this.context.t('learnMore')}
+ 
+
{
+ this.referenceNode = node;
+ }}
+ >
{steps.map((step, index) => (
- )}
+
))}
);
}
- renderTrezorTutorialSteps() {
- const steps = [
- {
- asset: 'plug-in-wallet',
- dimensions: { width: '225px', height: '75px' },
- title: this.context.t('step1TrezorWallet'),
- message: this.context.t('step1TrezorWalletMsg', [
-
- {this.context.t('hardwareWalletSupportLinkConversion')}
- ,
- ]),
- },
- ];
-
+ renderFooter() {
return (
- {step.title}
{step.message}
- {step.asset && ( -
- )}
+
- {steps.map((step, index) => (
-
-
- )}
-
- ))}
+ {step.title}
-{step.message}
- {step.asset && ( -
- )}
-
+
);
}
@@ -235,8 +238,10 @@ export default class SelectHardware extends Component {
+ {this.context.t('readyToConnect')} +
+ {this.renderButtons()} ++ {this.context.t('havingTroubleConnecting')} + + {this.context.t('getHelp')} + +
{this.renderHeader()}
{this.renderButtons()}
- {this.state.selectedDevice && this.renderTutorialsteps()}
- {this.renderContinueButton()}
+ {this.renderTrezorAffiliateLink()}
+ {this.renderLearnMore()}
+ {this.renderTutorialSteps()}
+ {this.renderFooter()}
);
}
diff --git a/ui/app/pages/create-account/create-account.component.js b/ui/app/pages/create-account/create-account.component.js
index 4cba7b261..4eaefce52 100644
--- a/ui/app/pages/create-account/create-account.component.js
+++ b/ui/app/pages/create-account/create-account.component.js
@@ -1,6 +1,7 @@
import React, { Component } from 'react';
-import { Switch, Route } from 'react-router-dom';
-
+import { Switch, Route, matchPath } from 'react-router-dom';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
import {
NEW_ACCOUNT_ROUTE,
IMPORT_ACCOUNT_ROUTE,
@@ -11,9 +12,53 @@ import NewAccountImportForm from './import-account';
import ConnectHardwareForm from './connect-hardware';
export default class CreateAccountPage extends Component {
+ renderTabs() {
+ const {
+ history,
+ location: { pathname },
+ } = this.props;
+ const getClassNames = (path) =>
+ classnames('new-account__tabs__tab', {
+ 'new-account__tabs__selected': matchPath(pathname, {
+ path,
+ exact: true,
+ }),
+ });
+
+ return (
+
+
+ );
+ }
+
render() {
return (
history.push(NEW_ACCOUNT_ROUTE)}
+ >
+ {this.context.t('create')}
+
+ history.push(IMPORT_ACCOUNT_ROUTE)}
+ >
+ {this.context.t('import')}
+
+ history.push(CONNECT_HARDWARE_ROUTE)}
+ >
+ {this.context.t('hardware')}
+
+
+
{
+ let wrapper;
+
+ const props = {
+ history: {
+ push: sinon.spy(),
+ },
+ location: {
+ pathname: '/new-account',
+ },
+ };
+
+ beforeAll(() => {
+ wrapper = mountWithRouter(
);
}
diff --git a/ui/app/pages/settings/advanced-tab/advanced-tab.component.test.js b/ui/app/pages/settings/advanced-tab/advanced-tab.component.test.js
index b73b90212..fc133a5d1 100644
--- a/ui/app/pages/settings/advanced-tab/advanced-tab.component.test.js
+++ b/ui/app/pages/settings/advanced-tab/advanced-tab.component.test.js
@@ -23,7 +23,7 @@ describe('AdvancedTab Component', () => {
},
);
- expect(root.find('.settings-page__content-row')).toHaveLength(11);
+ expect(root.find('.settings-page__content-row')).toHaveLength(10);
});
it('should update autoLockTimeLimit', () => {
diff --git a/ui/app/pages/settings/advanced-tab/advanced-tab.container.js b/ui/app/pages/settings/advanced-tab/advanced-tab.container.js
index 2fe9eaf39..1bfa82f30 100644
--- a/ui/app/pages/settings/advanced-tab/advanced-tab.container.js
+++ b/ui/app/pages/settings/advanced-tab/advanced-tab.container.js
@@ -11,7 +11,6 @@ import {
turnThreeBoxSyncingOnAndInitialize,
setUseNonceField,
setIpfsGateway,
- setLedgerLivePreference,
} from '../../../store/actions';
import { getPreferences } from '../../../selectors';
import AdvancedTab from './advanced-tab.component';
@@ -27,7 +26,6 @@ export const mapStateToProps = (state) => {
threeBoxDisabled,
useNonceField,
ipfsGateway,
- useLedgerLive,
} = metamask;
const { showFiatInTestnets, autoLockTimeLimit } = getPreferences(state);
@@ -41,7 +39,6 @@ export const mapStateToProps = (state) => {
threeBoxDisabled,
useNonceField,
ipfsGateway,
- useLedgerLive,
};
};
@@ -71,8 +68,6 @@ export const mapDispatchToProps = (dispatch) => {
setIpfsGateway: (value) => {
return dispatch(setIpfsGateway(value));
},
- setLedgerLivePreference: (value) =>
- dispatch(setLedgerLivePreference(value)),
};
};
diff --git a/ui/app/store/actions.js b/ui/app/store/actions.js
index f3c2c03ea..cbd90fe84 100644
--- a/ui/app/store/actions.js
+++ b/ui/app/store/actions.js
@@ -2845,14 +2845,6 @@ export function getCurrentWindowTab() {
};
}
-export function setLedgerLivePreference(value) {
- return async (dispatch) => {
- dispatch(showLoadingIndication());
- await promisifiedBackground.setLedgerLivePreference(value);
- dispatch(hideLoadingIndication());
- };
-}
-
// MetaMetrics
/**
* @typedef {import('../../../shared/constants/metametrics').MetaMetricsEventPayload} MetaMetricsEventPayload
diff --git a/yarn.lock b/yarn.lock
index f72b8435e..c40f5432a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2704,14 +2704,14 @@
resolved "https://registry.yarnpkg.com/@metamask/eslint-config/-/eslint-config-6.0.0.tgz#ec53e8ab278073e882411ed89705bc7d06b78c81"
integrity sha512-LyakGYGwM8UQOGhwWa+5erAI1hXuiTgf/y7USzOomX6H9KiuY09IAUYnPh7ToPG2sedD2F48UF1bUm8yvCoZOw==
-"@metamask/eth-ledger-bridge-keyring@^0.4.0":
- version "0.4.0"
- resolved "https://registry.yarnpkg.com/@metamask/eth-ledger-bridge-keyring/-/eth-ledger-bridge-keyring-0.4.0.tgz#764834adf146fc86ab7688a6c8f1e08708ed0d71"
- integrity sha512-FkoAsP19YMKHNQzfPL5l9QJwp4YsEaN8d5pbJc+VcMzoC5rkt1iyDQdderERUV9DQlS3flBjxECCZ+QX54HD5w==
+"@metamask/eth-ledger-bridge-keyring@^0.3.0":
+ version "0.3.0"
+ resolved "https://registry.yarnpkg.com/@metamask/eth-ledger-bridge-keyring/-/eth-ledger-bridge-keyring-0.3.0.tgz#4fc2a6345199e18f94c098d8c632d3d55add5c36"
+ integrity sha512-Iv9fmxPClBohIK6ciy0ZVYNTUodlmrdQt19cZDAicSfFdR2Gcgbq2FDA75o63+fW8TwPEohhDRV/vWQ0MU5esw==
dependencies:
eth-sig-util "^1.4.2"
ethereumjs-tx "^1.3.4"
- ethereumjs-util "^7.0.9"
+ ethereumjs-util "^5.1.5"
events "^2.0.0"
hdkey "0.8.0"
+
+ {this.renderTabs()}
+
+
-
- );
- }
-
handleIpfsGatewayChange(url) {
const { t } = this.context;
@@ -510,7 +478,6 @@ export default class AdvancedTab extends PureComponent {
{this.renderAutoLockTimeLimit()}
{this.renderThreeBoxControl()}
{this.renderIpfsGatewayControl()}
- {this.renderLedgerLiveControl()}
- {t('ledgerLiveAdvancedSetting')}
-
-
- {t('ledgerLiveAdvancedSettingDescription')}
-
-
-
-
- setLedgerLivePreference(!value)}
- offLabel={t('off')}
- onLabel={t('on')}
- disabled={getPlatform() === PLATFORM_FIREFOX}
- />
-
-