From 43048940f4039aadf06540e41f3c111050227288 Mon Sep 17 00:00:00 2001
From: Joel <itsjoelpm@gmail.com>
Date: Fri, 25 Oct 2024 00:57:13 +0300
Subject: [PATCH] chore: fix flames icon

---
 ui/blocks/BlocksTableItem.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/ui/blocks/BlocksTableItem.tsx b/ui/blocks/BlocksTableItem.tsx
index 1560bfa1f3..4037fdf19b 100644
--- a/ui/blocks/BlocksTableItem.tsx
+++ b/ui/blocks/BlocksTableItem.tsx
@@ -2,6 +2,7 @@ import { Tr, Td, Flex, Box, Tooltip, Skeleton, useColorModeValue } from '@chakra
 import BigNumber from 'bignumber.js';
 import { motion } from 'framer-motion';
 import React from 'react';
+import { TbCoins } from 'react-icons/tb';
 
 import type { Block } from 'types/api/block';
 
@@ -14,7 +15,6 @@ import BlockTimestamp from 'ui/blocks/BlockTimestamp';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import GasUsedToTargetRatio from 'ui/shared/GasUsedToTargetRatio';
-import IconSvg from 'ui/shared/IconSvg';
 import LinkInternal from 'ui/shared/links/LinkInternal';
 import TextSeparator from 'ui/shared/TextSeparator';
 import Utilization from 'ui/shared/Utilization/Utilization';
@@ -116,7 +116,9 @@ const BlocksTableItem = ({ data, isLoading, enableTimeIncrement }: Props) => {
       { !isRollup && !config.UI.views.block.hiddenFields?.burnt_fees && (
         <Td fontSize="sm">
           <Flex alignItems="center" columnGap={ 2 }>
-            <IconSvg name="flame" boxSize={ 5 } color={ burntFeesIconColor } isLoading={ isLoading }/>
+            <Skeleton isLoaded={ !isLoading } display="inline-block">
+              <TbCoins size={ 20 } color={ burntFeesIconColor }/>
+            </Skeleton>
             <Skeleton isLoaded={ !isLoading } display="inline-block">
               { burntFees.dividedBy(WEI).toFixed(8) }
             </Skeleton>