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

Part of #17670: Replace Typography with Text component in smart-transaction-status.js (#18743)

Browse Source 
* Update smart-transaction-status.js

* Update smart-transaction-status.js

* Update smart-transaction-status.js again.

* Update smart-transaction-status.js

* Update smart-transaction-status.js

* Update ui/pages/swaps/smart-transaction-status/smart-transaction-status.js

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>

* Update smart-transaction-status.js

---------

Co-authored-by: Brad Decker <bhdecker84@gmail.com>
Co-authored-by: George Marshall <georgewrmarshall@gmail.com>
This commit is contained in:
Harsh Shukla 2023-05-05 16:45:39 +05:30 committed by GitHub
parent 9fae71505c
commit 944d39ed3a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 23 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
ui/pages/swaps/smart-transaction-status/smart-transaction-status.js
View File

@ -3,7 +3,6 @@ import { useDispatch, useSelector, shallowEqual } from 'react-redux';
import { useHistory } from 'react-router-dom'; import { useHistory } from 'react-router-dom';
import { getBlockExplorerLink } from '@metamask/etherscan-link'; import { getBlockExplorerLink } from '@metamask/etherscan-link';
import { isEqual } from 'lodash'; import { isEqual } from 'lodash';
import { I18nContext } from '../../../contexts/i18n'; import { I18nContext } from '../../../contexts/i18n';
import { import {
getFetchParams, getFetchParams,
@ -40,7 +39,7 @@ import {
TextVariant, TextVariant,
JustifyContent, JustifyContent,
DISPLAY, DISPLAY,
FONT_WEIGHT, FontWeight,
AlignItems, AlignItems,
TextColor, TextColor,
} from '../../../helpers/constants/design-system'; } from '../../../helpers/constants/design-system';
@ -330,13 +329,19 @@ export default function SmartTransactionStatusPage() {
justifyContent={JustifyContent.center} justifyContent={JustifyContent.center}
alignItems={AlignItems.center} alignItems={AlignItems.center}
> >
<Text color={TextColor.textAlternative} variant={TextVariant.bodySm}> <Text
color={TextColor.textAlternative}
variant={TextVariant.bodySm}
as="h6"
>
{`${fetchParams?.value && Number(fetchParams.value).toFixed(5)} `} {`${fetchParams?.value && Number(fetchParams.value).toFixed(5)} `}
</Text> </Text>
<Text <Text
color={TextColor.textAlternative} color={TextColor.textAlternative}
variant={TextVariant.bodySmBold} variant={TextVariant.bodySmBold}
boxProps={{ marginLeft: 1, marginRight: 2 }} as="h6"
marginLeft={1}
marginRight={2}
> >
{fetchParamsSourceTokenInfo.symbol ?? {fetchParamsSourceTokenInfo.symbol ??
latestSmartTransaction?.sourceTokenSymbol} latestSmartTransaction?.sourceTokenSymbol}
@ -369,14 +374,16 @@ export default function SmartTransactionStatusPage() {
<Text <Text
color={TextColor.textAlternative} color={TextColor.textAlternative}
variant={TextVariant.bodySm} variant={TextVariant.bodySm}
boxProps={{ marginLeft: 2 }} as="h6"
marginLeft={2}
> >
{`~${destinationValue && Number(destinationValue).toFixed(5)} `} {`~${destinationValue && Number(destinationValue).toFixed(5)} `}
</Text> </Text>
<Text <Text
color={TextColor.textAlternative} color={TextColor.textAlternative}
variant={TextVariant.bodySmBold} variant={TextVariant.bodySmBold}
boxProps={{ marginLeft: 1 }} as="h6"
marginLeft={1}
> >
{fetchParamsDestinationTokenInfo.symbol ?? {fetchParamsDestinationTokenInfo.symbol ??
latestSmartTransaction?.destinationTokenSymbol} latestSmartTransaction?.destinationTokenSymbol}
@ -403,14 +410,16 @@ export default function SmartTransactionStatusPage() {
<Text <Text
color={TextColor.textAlternative} color={TextColor.textAlternative}
variant={TextVariant.bodySm} variant={TextVariant.bodySm}
boxProps={{ marginLeft: 1 }} as="h6"
marginLeft={1}
> >
{`${t('stxSwapCompleteIn')} `} {`${t('stxSwapCompleteIn')} `}
</Text> </Text>
<Text <Text
color={TextColor.textAlternative} color={TextColor.textAlternative}
variant={TextVariant.bodySmBold} variant={TextVariant.bodySmBold}
boxProps={{ marginLeft: 1 }} as="h6"
marginLeft={1}
className="smart-transaction-status__remaining-time" className="smart-transaction-status__remaining-time"
> >
{showRemainingTimeInMinAndSec(timeLeftForPendingStxInSec)} {showRemainingTimeInMinAndSec(timeLeftForPendingStxInSec)}
@ -420,7 +429,8 @@ export default function SmartTransactionStatusPage() {
<Text <Text
color={TextColor.textDefault} color={TextColor.textDefault}
variant={TextVariant.headingSm} variant={TextVariant.headingSm}
fontWeight={FONT_WEIGHT.BOLD} as="h4"
fontWeight={FontWeight.Bold}
> >
{headerText} {headerText}
</Text> </Text>
@ -441,7 +451,8 @@ export default function SmartTransactionStatusPage() {
{description && ( {description && (
<Text <Text
variant={TextVariant.bodySm} variant={TextVariant.bodySm}
boxProps={{ ...(blockExplorerUrl && { margin: [1, 0, 0] }) }} as="h6"
marginTop={blockExplorerUrl && 1}
color={TextColor.textAlternative} color={TextColor.textAlternative}
> >
{description} {description}
@ -460,7 +471,8 @@ export default function SmartTransactionStatusPage() {
{subDescription && ( {subDescription && (
<Text <Text
variant={TextVariant.bodySm} variant={TextVariant.bodySm}
boxProps={{ marginTop: 8 }} as="h6"
marginTop={8}
color={TextColor.textAlternative} color={TextColor.textAlternative}
> >
{subDescription} {subDescription}