1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00

Fix duplicate button issue on Ledger connectivity screen (#17130)

This commit is contained in:
ryanml 2023-01-11 11:34:05 -07:00 committed by GitHub
parent 64839b6bf7
commit 5061eac2e7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -181,6 +181,7 @@ export default class SelectHardware extends Component {
const steps = []; const steps = [];
if (this.props.ledgerTransportType === LEDGER_TRANSPORT_TYPES.LIVE) { if (this.props.ledgerTransportType === LEDGER_TRANSPORT_TYPES.LIVE) {
steps.push({ steps.push({
renderButtons: false,
title: this.context.t('step1LedgerWallet'), title: this.context.t('step1LedgerWallet'),
message: this.context.t('step1LedgerWalletMsg', [ message: this.context.t('step1LedgerWalletMsg', [
<a <a
@ -197,6 +198,7 @@ export default class SelectHardware extends Component {
} }
steps.push({ steps.push({
renderButtons: true,
asset: 'plug-in-wallet', asset: 'plug-in-wallet',
dimensions: { width: '225px', height: '75px' }, dimensions: { width: '225px', height: '75px' },
title: this.context.t('step2LedgerWallet'), title: this.context.t('step2LedgerWallet'),
@ -218,32 +220,36 @@ export default class SelectHardware extends Component {
{steps.map((step, index) => ( {steps.map((step, index) => (
<div className="hw-connect" key={index}> <div className="hw-connect" key={index}>
<h3 className="hw-connect__title">{step.title}</h3> <h3 className="hw-connect__title">{step.title}</h3>
<Button {step.renderButtons ? (
className="hw-connect__external-btn-first" <>
type="secondary" <Button
onClick={() => { className="hw-connect__external-btn-first"
this.context.trackEvent({ type="secondary"
category: EVENT.CATEGORIES.NAVIGATION, onClick={() => {
event: 'Clicked Ledger Buy Now', this.context.trackEvent({
}); category: EVENT.CATEGORIES.NAVIGATION,
window.open(AFFILIATE_LINKS.LEDGER, '_blank'); event: 'Clicked Ledger Buy Now',
}} });
> window.open(AFFILIATE_LINKS.LEDGER, '_blank');
{this.context.t('buyNow')} }}
</Button> >
<Button {this.context.t('buyNow')}
className="hw-connect__external-btn" </Button>
type="secondary" <Button
onClick={() => { className="hw-connect__external-btn"
this.context.trackEvent({ type="secondary"
category: EVENT.CATEGORIES.NAVIGATION, onClick={() => {
event: 'Clicked Ledger Tutorial', this.context.trackEvent({
}); category: EVENT.CATEGORIES.NAVIGATION,
window.open(AFFILIATE_TUTORIAL_LINKS.LEDGER, '_blank'); event: 'Clicked Ledger Tutorial',
}} });
> window.open(AFFILIATE_TUTORIAL_LINKS.LEDGER, '_blank');
{this.context.t('tutorial')} }}
</Button> >
{this.context.t('tutorial')}
</Button>
</>
) : null}
<p className="hw-connect__msg">{step.message}</p> <p className="hw-connect__msg">{step.message}</p>
{step.asset && ( {step.asset && (
<img <img
@ -549,7 +555,7 @@ export default class SelectHardware extends Component {
{steps.map((step, index) => ( {steps.map((step, index) => (
<div className="hw-connect" key={index}> <div className="hw-connect" key={index}>
{step.title && <h3 className="hw-connect__title">{step.title}</h3>} {step.title && <h3 className="hw-connect__title">{step.title}</h3>}
<p className="hw-connect__msg">{step.message}</p> <div className="hw-connect__msg">{step.message}</div>
{step.asset && ( {step.asset && (
<img <img
className="hw-connect__step-asset" className="hw-connect__step-asset"