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

Replaced ActionableMessage Instances in edit-gas (#20196)

Browse Source 
* Replaced ActionableMessage Instances in edit-gas

* Updated BannerAlert className

* Changed errorKey to errorMessage

* Removing CSS and restoring local key

---------

Co-authored-by: georgewrmarshall <george.marshall@consensys.net>
This commit is contained in:
Pritam Dhara 2023-08-02 02:51:42 +05:30 committed by GitHub
parent 9b55791af7
commit 067d385012
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
ui/components/app/edit-gas-display/edit-gas-display.component.js
View File

@ -11,14 +11,13 @@ import {
FontWeight,
TextColor,
TextVariant,
Severity,
} from '../../../helpers/constants/design-system';
import { Text } from '../../component-library';
import { BannerAlert, Text } from '../../component-library';
import { areDappSuggestedAndTxParamGasFeesTheSame } from '../../../helpers/utils/confirm-tx.util';
import InfoTooltip from '../../ui/info-tooltip';
import ErrorMessage from '../../ui/error-message';
import AdvancedGasControls from '../advanced-gas-controls/advanced-gas-controls.component';
import ActionableMessage from '../../ui/actionable-message/actionable-message';
import { I18nContext } from '../../../contexts/i18n';
@ -62,38 +61,30 @@ export default function EditGasDisplay({
const showTopError = balanceError && txParamsHaveBeenCustomized;
let errorKey;
if (balanceError) {
errorKey = 'insufficientFunds';
}
return (
<div className="edit-gas-display">
<div className="edit-gas-display__content">
{showTopError && (
<div className="edit-gas-display__warning">
<ErrorMessage errorKey={errorKey} />
</div>
<BannerAlert
severity={Severity.Danger}
description={t('insufficientFunds')}
marginBottom={6}
/>
)}
{warningMessage && (
<div className="edit-gas-display__warning">
<ActionableMessage
className="actionable-message--warning"
message={warningMessage}
iconFillColor="var(--color-warning-default)"
useIcon
/>
</div>
<BannerAlert
severity={Severity.Warning}
description={warningMessage}
marginBottom={6}
/>
)}
{requireDappAcknowledgement && (
<div className="edit-gas-display__dapp-acknowledgement-warning">
<ActionableMessage
className="actionable-message--warning"
message={t('gasDisplayDappWarning', [transaction.origin])}
iconFillColor="var(--color-warning-default)"
useIcon
/>
</div>
<BannerAlert
severity={Severity.Warning}
className="banner-alert--warning"
description={t('gasDisplayDappWarning', [transaction.origin])}
marginBottom={6}
/>
)}
{mode === EditGasModes.speedUp && (
<div className="edit-gas-display__top-tooltip">
@ -113,7 +104,7 @@ export default function EditGasDisplay({
)}
<Text
color={TextColor.textDefault}
variant={TextVariant.displayMd}
variant={TextVariant.headingLg}
as="h1"
textAlign={TextAlign.Center}
>

38
ui/components/app/edit-gas-display/index.scss
View File

@ -1,13 +1,4 @@
.edit-gas-display {
& .actionable-message--warning,
& .actionable-message--error {
margin-top: 0;
& .actionable-message__message {
text-align: start;
}
}
&__top-tooltip {
text-align: center;
@ -21,10 +12,6 @@
}
}
&__dapp-acknowledgement-warning {
margin-bottom: 20px;
}
button.edit-gas-display__dapp-acknowledgement-button {
margin: 40px auto 0 auto;
display: block;
@ -39,35 +26,10 @@
margin: 20px auto;
}
&__advanced-button {
display: block;
margin: 0 auto;
background: transparent;
color: var(--color-primary-default);
font-weight: bold;
}
.advanced-gas-controls {
margin-top: 20px;
}
&__education {
margin-top: 20px;
button {
display: block;
margin: 0 auto;
background: transparent;
color: var(--color-primary-default);
}
}
&__warning {
margin-bottom: 24px;
position: relative;
margin-top: 4px;
}
&__scroll-bottom {
margin-bottom: -20px;
margin-top: 20px;