Update history empty state

Author: neikop

…wap-interface/src/assets/svg/no-data.svg …wap-interface/src/assets/svg/no_data.svgapps/kyberswap-interface/src/assets/svg/no-data.svg renamed to apps/kyberswap-interface/src/assets/svg/no_data.svg apps/kyberswap-interface/src/assets/svg/no-data.svg renamed to apps/kyberswap-interface/src/assets/svg/no_data.svg

@@ -9,7 +9,7 @@ import { Text } from 'rebass'
 import { useGetListOrdersQuery } from 'services/limitOrder'
 import styled from 'styled-components'
 
-import { ReactComponent as NoDataIcon } from 'assets/svg/no-data.svg'
+import { ReactComponent as NoDataIcon } from 'assets/svg/no_data.svg'
 import { ButtonLight } from 'components/Button'
 import Column from 'components/Column'
 import LocalLoader from 'components/LocalLoader'

apps/kyberswap-interface/src/assets/svg/no_transaction.svg

@@ -8,7 +8,7 @@ import { Text } from 'rebass'
 import { useGetOrdersByTokenPairQuery } from 'services/limitOrder'
 import styled, { CSSProperties } from 'styled-components'
 
-import { ReactComponent as NoDataIcon } from 'assets/svg/no-data.svg'
+import { ReactComponent as NoDataIcon } from 'assets/svg/no_data.svg'
 import LocalLoader from 'components/LocalLoader'
 import RefreshLoading from 'components/RefreshLoading'
 import { useActiveWeb3React } from 'hooks'

apps/kyberswap-interface/src/components/swapv2/LimitOrder/ListOrder/index.tsx

@@ -9,6 +9,7 @@ import { Flex, Text } from 'rebass'
 import styled from 'styled-components'
 import { formatUnits } from 'viem'
 
+import { ReactComponent as NoTransactionIcon } from 'assets/svg/no_transaction.svg'
 import CopyHelper from 'components/Copy'
 import Divider from 'components/Divider'
 import Pagination from 'components/Pagination'
@@ -258,9 +259,12 @@ export const TransactionHistory = () => {
         </TableHeader>
       )}
       {transactions.length === 0 && (
-        <Text color={theme.subText} padding="36px" textAlign="center">
-          {t`No transaction found`}
-        </Text>
+        <Flex flexDirection="column" alignItems="center">
+          <NoTransactionIcon width="120px" />
+          <Text color={theme.subText} padding="36px" textAlign="center" fontStyle="italic">
+            {t`No historical data available.`}
+          </Text>
+        </Flex>
       )}
       {transactions.slice((currentPage - 1) * PAGE_SIZE, currentPage * PAGE_SIZE).map(tx => {
         const sourceChainLogo = [NonEvmChain.Near, NonEvmChain.Bitcoin, NonEvmChain.Solana].includes(tx.sourceChain)