fix show/hide

ui/txs/TxsTableItem.tsx

@@ -14,6 +14,7 @@ import {
   PopoverBody,
   useColorModeValue,
   Show,
+  Hide,
 } from '@chakra-ui/react';
 import React from 'react';
 
@@ -113,7 +114,7 @@ const TxsTableItem = ({ tx }: {tx: Transaction}) => {
           { addressTo }
         </Td>
       </Show>
-      <Show below="xl" ssr={ false }>
+      <Hide above="xl" ssr={ false }>
         <Td colSpan={ 3 }>
           <Box>
             { addressFrom }
@@ -128,7 +129,7 @@ const TxsTableItem = ({ tx }: {tx: Transaction}) => {
             { addressTo }
           </Box>
         </Td>
-      </Show>
+      </Hide>
       <Td isNumeric>
         <CurrencyValue value={ tx.value }/>
       </Td>

ui/txs/TxsWithSort.tsx

-import { Box, Show } from '@chakra-ui/react';
+import { Box, Show, Hide } from '@chakra-ui/react';
 import React, { useEffect, useState } from 'react';
 
 import type { TransactionsResponse } from 'types/api/transaction';
@@ -29,7 +29,7 @@ const TxsWithSort = ({
   return (
     <>
       <Show below="lg" ssr={ false }><Box>{ sortedTxs.map(tx => <TxsListItem tx={ tx } key={ tx.hash }/>) }</Box></Show>
-      <Show above="lg" ssr={ false }><TxsTable txs={ sortedTxs } sort={ sort } sorting={ sorting }/></Show>
+      <Hide below="lg" ssr={ false }><TxsTable txs={ sortedTxs } sort={ sort } sorting={ sorting }/></Hide>
     </>
   );