diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 8e528f42e..542fa012d 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -1179,6 +1179,18 @@ "ledgerLiveApp": { "message": "Ledger Live App" }, + "ledgerLiveDialogHeader": { + "message": "Prior to clicking confirm:" + }, + "ledgerLiveDialogStepOne": { + "message": "Enable Use Ledger Live under Settings > Advanced" + }, + "ledgerLiveDialogStepThree": { + "message": "Plug in your Ledger device and select the Ethereum app" + }, + "ledgerLiveDialogStepTwo": { + "message": "Open and unlock Ledger Live App" + }, "ledgerLocked": { "message": "Cannot connect to Ledger device. Please make sure your device is unlocked and Ethereum app is opened." }, diff --git a/ui/pages/confirm-transaction-base/confirm-transaction-base.component.js b/ui/pages/confirm-transaction-base/confirm-transaction-base.component.js index 8f6751c4a..126c86d5d 100644 --- a/ui/pages/confirm-transaction-base/confirm-transaction-base.component.js +++ b/ui/pages/confirm-transaction-base/confirm-transaction-base.component.js @@ -35,10 +35,12 @@ import TransactionDetailItem from '../../components/app/transaction-detail-item/ import InfoTooltip from '../../components/ui/info-tooltip/info-tooltip'; import LoadingHeartBeat from '../../components/ui/loading-heartbeat'; import GasTiming from '../../components/app/gas-timing/gas-timing.component'; +import Dialog from '../../components/ui/dialog'; import { COLORS, FONT_STYLE, + FONT_WEIGHT, TYPOGRAPHY, } from '../../helpers/constants/design-system'; import { @@ -124,6 +126,8 @@ export default class ConfirmTransactionBase extends Component { baseFeePerGas: PropTypes.string, isMainnet: PropTypes.bool, gasFeeIsCustom: PropTypes.bool, + isLedgerAccount: PropTypes.bool.isRequired, + isFirefox: PropTypes.bool.isRequired, }; state = { @@ -303,6 +307,8 @@ export default class ConfirmTransactionBase extends Component { maxFeePerGas, maxPriorityFeePerGas, isMainnet, + isLedgerAccount, + isFirefox, } = this.props; const { t } = this.context; @@ -396,6 +402,51 @@ export default class ConfirmTransactionBase extends Component { ) : null; + const ledgerInstructionField = isLedgerAccount ? ( +