diff --git a/src/__swaps__/screens/Swap/components/GasPanel.tsx b/src/__swaps__/screens/Swap/components/GasPanel.tsx index 2402552e183..17224d285c7 100644 --- a/src/__swaps__/screens/Swap/components/GasPanel.tsx +++ b/src/__swaps__/screens/Swap/components/GasPanel.tsx @@ -16,7 +16,7 @@ import { import { add, subtract } from '@/__swaps__/utils/numbers'; import { opacity } from '@/__swaps__/utils/swaps'; import { ButtonPressAnimation } from '@/components/animations'; -import { Box, Inline, Separator, Stack, Text, globalColors, useColorMode, useForegroundColor } from '@/design-system'; +import { Bleed, Box, Inline, Separator, Stack, Text, globalColors, useColorMode, useForegroundColor } from '@/design-system'; import { IS_ANDROID } from '@/env'; import { lessThan } from '@/helpers/utilities'; import { useNavigation } from '@/navigation'; @@ -24,11 +24,14 @@ import Routes from '@/navigation/routesNames'; import { createRainbowStore } from '@/state/internal/createRainbowStore'; import { useSwapsStore } from '@/state/swaps/swapsStore'; import { upperFirst } from 'lodash'; +import { gasUtils } from '@/utils'; import { formatNumber } from '../hooks/formatNumber'; import { GasSettings, getCustomGasSettings, setCustomGasSettings, useCustomGasStore } from '../hooks/useCustomGas'; import { setSelectedGasSpeed, useSelectedGasSpeed } from '../hooks/useSelectedGas'; import { EstimatedSwapGasFee } from './EstimatedSwapGasFee'; +const { GAS_TRENDS } = gasUtils; + const MINER_TIP_TYPE = 'minerTip'; const MAX_BASE_FEE_TYPE = 'maxBaseFee'; const HIGH_ALERT = 'HIGH_ALERT'; @@ -136,9 +139,12 @@ function CurrentBaseFee() { const { isDarkMode } = useColorMode(); const { navigate } = useNavigation(); + const label = useForegroundColor('label'); + const labelSecondary = useForegroundColor('labelSecondary'); + const chainId = useSwapsStore(s => s.inputAsset?.chainId || ChainId.mainnet); const { data: baseFee } = useBaseFee({ chainId, select: selectWeiToGwei }); - const { data: gasTrend } = useGasTrend({ chainId }); + const { data: gasTrend = 'notrend' } = useGasTrend({ chainId }); const trendType = 'currentBaseFee' + upperFirst(gasTrend); @@ -160,15 +166,30 @@ function CurrentBaseFee() { > {i18n.t(i18n.l.gas.current_base_fee)} - - {formatNumber(baseFee || '0')} - + + + + {GAS_TRENDS[gasTrend].label} + + + {formatNumber(baseFee || '0')} + + + ); } @@ -277,9 +298,6 @@ function MaxTransactionFee() { {i18n.t(i18n.l.gas.max_transaction_fee)} - - 􀅴 -