m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 09:57:02 +01:00
Code

fix tx submit button when using Ledger

Browse Source
This commit is contained in:
Matthias Kretschmann 2023-06-29 16:31:20 +01:00
parent 4988e033ad
commit 350132ae03
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 6 additions and 127 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

127
ui/components/app/ledger-instruction-field/ledger-instruction-field.js
View File

@ -1,16 +1,11 @@
import React, { useEffect } from 'react'; import { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import PropTypes from 'prop-types';
import { import {
LedgerTransportTypes, LedgerTransportTypes,
WebHIDConnectedStatuses, WebHIDConnectedStatuses,
HardwareTransportStates, HardwareTransportStates,
LEDGER_USB_VENDOR_ID, LEDGER_USB_VENDOR_ID,
} from '../../../../shared/constants/hardware-wallets'; } from '../../../../shared/constants/hardware-wallets';
import {
PLATFORM_FIREFOX,
ENVIRONMENT_TYPE_FULLSCREEN,
} from '../../../../shared/constants/app';
import { import {
setLedgerWebHidConnectedStatus, setLedgerWebHidConnectedStatus,
@ -19,44 +14,15 @@ import {
getLedgerTransportStatus, getLedgerTransportStatus,
} from '../../../ducks/app/app'; } from '../../../ducks/app/app';
import { BannerAlert, ButtonLink, Text } from '../../component-library';
import { useI18nContext } from '../../../hooks/useI18nContext';
import {
SEVERITIES,
TextAlign,
TextColor,
} from '../../../helpers/constants/design-system';
import {
getPlatform,
getEnvironmentType,
} from '../../../../app/scripts/lib/util';
import { getLedgerTransportType } from '../../../ducks/metamask/metamask'; import { getLedgerTransportType } from '../../../ducks/metamask/metamask';
import { attemptLedgerTransportCreation } from '../../../store/actions'; import { attemptLedgerTransportCreation } from '../../../store/actions';
const renderInstructionStep = ( export default function LedgerInstructionField() {
text,
show = true,
color = TextColor.textDefault,
) => {
return (
show && (
<Text color={color} as="h6">
{text}
</Text>
)
);
};
export default function LedgerInstructionField({ showDataInstruction }) {
const t = useI18nContext();
const dispatch = useDispatch(); const dispatch = useDispatch();
const webHidConnectedStatus = useSelector(getLedgerWebHidConnectedStatus); const webHidConnectedStatus = useSelector(getLedgerWebHidConnectedStatus);
const ledgerTransportType = useSelector(getLedgerTransportType); const ledgerTransportType = useSelector(getLedgerTransportType);
const transportStatus = useSelector(getLedgerTransportStatus); const transportStatus = useSelector(getLedgerTransportStatus);
const environmentType = getEnvironmentType();
const environmentTypeIsFullScreen =
environmentType === ENVIRONMENT_TYPE_FULLSCREEN;
useEffect(() => { useEffect(() => {
const initialConnectedDeviceCheck = async () => { const initialConnectedDeviceCheck = async () => {
@ -121,92 +87,5 @@ export default function LedgerInstructionField({ showDataInstruction }) {
}; };
}, [dispatch]); }, [dispatch]);
const usingLedgerLive = ledgerTransportType === LedgerTransportTypes.live; return null;
const usingWebHID = ledgerTransportType === LedgerTransportTypes.webhid;
const isFirefox = getPlatform() === PLATFORM_FIREFOX;
return (
<div>
<div className="confirm-detail-row">
<BannerAlert severity={SEVERITIES.INFO}>
<div className="ledger-live-dialog">
{renderInstructionStep(t('ledgerConnectionInstructionHeader'))}
{renderInstructionStep(
`• ${t('ledgerConnectionInstructionStepOne')}`,
!isFirefox && usingLedgerLive,
)}
{renderInstructionStep(
`• ${t('ledgerConnectionInstructionStepTwo')}`,
!isFirefox && usingLedgerLive,
)}
{renderInstructionStep(
`• ${t('ledgerConnectionInstructionStepThree')}`,
)}
{renderInstructionStep(
`• ${t('ledgerConnectionInstructionStepFour')}`,
showDataInstruction,
)}
{renderInstructionStep(
<span>
<ButtonLink
textAlign={TextAlign.Left}
onClick={async () => {
if (environmentTypeIsFullScreen) {
window.location.reload();
} else {
global.platform.openExtensionInBrowser(null, null, true);
}
}}
>
{t('ledgerConnectionInstructionCloseOtherApps')}
</ButtonLink>
</span>,
transportStatus === HardwareTransportStates.deviceOpenFailure,
)}
{renderInstructionStep(
<span>
<ButtonLink
textAlign={TextAlign.Left}
onClick={async () => {
if (environmentTypeIsFullScreen) {
const connectedDevices =
await window.navigator.hid.requestDevice({
filters: [{ vendorId: LEDGER_USB_VENDOR_ID }],
});
const webHidIsConnected = connectedDevices.some(
(device) =>
device.vendorId === Number(LEDGER_USB_VENDOR_ID),
);
dispatch(
setLedgerWebHidConnectedStatus({
webHidConnectedStatus: webHidIsConnected
? WebHIDConnectedStatuses.connected
: WebHIDConnectedStatuses.notConnected,
}),
);
} else {
global.platform.openExtensionInBrowser(null, null, true);
}
}}
>
{environmentTypeIsFullScreen
? t('clickToConnectLedgerViaWebHID')
: t('openFullScreenForLedgerWebHid')}
</ButtonLink>
</span>,
usingWebHID &&
webHidConnectedStatus === WebHIDConnectedStatuses.notConnected,
TextColor.WARNING_DEFAULT,
)}
</div>
</BannerAlert>
</div>
</div>
);
} }
LedgerInstructionField.propTypes = {
// whether or not to show the data instruction
showDataInstruction: PropTypes.bool,
};

6
ui/pages/confirm-transaction-base/confirm-transaction-base.container.js
View File

@ -44,7 +44,7 @@ import {
} from '../../selectors'; } from '../../selectors';
import { getMostRecentOverviewPage } from '../../ducks/history/history'; import { getMostRecentOverviewPage } from '../../ducks/history/history';
import { import {
// isAddressLedger, isAddressLedger,
updateGasFees, updateGasFees,
getIsGasEstimatesLoading, getIsGasEstimatesLoading,
getNativeCurrency, getNativeCurrency,
@ -213,7 +213,7 @@ const mapStateToProps = (state, ownProps) => {
const gasFeeIsCustom = const gasFeeIsCustom =
fullTxData.userFeeLevel === CUSTOM_GAS_ESTIMATE || fullTxData.userFeeLevel === CUSTOM_GAS_ESTIMATE ||
txParamsAreDappSuggested(fullTxData); txParamsAreDappSuggested(fullTxData);
// const fromAddressIsLedger = isAddressLedger(state, fromAddress); const fromAddressIsLedger = isAddressLedger(state, fromAddress);
const nativeCurrency = getNativeCurrency(state); const nativeCurrency = getNativeCurrency(state);
///: BEGIN:ONLY_INCLUDE_IN(build-mmi) ///: BEGIN:ONLY_INCLUDE_IN(build-mmi)
const accountType = getAccountType(state, fromAddress); const accountType = getAccountType(state, fromAddress);
@ -272,7 +272,7 @@ const mapStateToProps = (state, ownProps) => {
maxPriorityFeePerGas: gasEstimationObject.maxPriorityFeePerGas, maxPriorityFeePerGas: gasEstimationObject.maxPriorityFeePerGas,
baseFeePerGas: gasEstimationObject.baseFeePerGas, baseFeePerGas: gasEstimationObject.baseFeePerGas,
gasFeeIsCustom, gasFeeIsCustom,
showLedgerSteps: false, showLedgerSteps: fromAddressIsLedger,
nativeCurrency, nativeCurrency,
hardwareWalletRequiresConnection, hardwareWalletRequiresConnection,
isMultiLayerFeeNetwork, isMultiLayerFeeNetwork,