go back link

ui/pages/Transaction.tsx

@@ -8,7 +8,7 @@ import type { RoutedTab } from 'ui/shared/RoutedTabs/types';
 
 import eastArrowIcon from 'icons/arrows/east.svg';
 import useFetch from 'lib/hooks/useFetch';
-import link from 'lib/link/link';
+import isBrowser from 'lib/isBrowser';
 import networkExplorers from 'lib/networks/networkExplorers';
 import ExternalLink from 'ui/shared/ExternalLink';
 import Page from 'ui/shared/Page/Page';
@@ -48,13 +48,16 @@ const TransactionPageContent = () => {
       return <ExternalLink key={ explorer.baseUrl } title={ `Open in ${ explorer.title }` } href={ url.toString() }/>;
     });
 
+  const hasGoBackLink = isBrowser() && window.document.referrer.includes('/txs');
+
   return (
     <Page>
-      { /* TODO should be shown only when navigating from txs list */ }
-      <Link mb={ 6 } display="inline-flex" href={ link('txs') }>
-        <Icon as={ eastArrowIcon } boxSize={ 6 } mr={ 2 } transform="rotate(180deg)"/>
-        Transactions
-      </Link>
+      { hasGoBackLink && (
+        <Link mb={ 6 } display="inline-flex" href={ window.document.referrer }>
+          <Icon as={ eastArrowIcon } boxSize={ 6 } mr={ 2 } transform="rotate(180deg)"/>
+            Transactions
+        </Link>
+      ) }
       <Flex alignItems="flex-start" flexDir={{ base: 'column', lg: 'row' }}>
         <PageTitle text="Transaction details"/>
         { data?.tx_tag && <Tag my={ 2 } ml={ 3 }>{ data.tx_tag }</Tag> }

ui/shared/address/AddressLink.tsx

 import { Link, chakra, shouldForwardProp, Tooltip, Box } from '@chakra-ui/react';
+import type { HTMLAttributeAnchorTarget } from 'react';
 import React from 'react';
 
 import link from 'lib/link/link';
@@ -13,9 +14,10 @@ interface Props {
   truncation?: 'constant' | 'dynamic'| 'none';
   fontWeight?: string;
   id?: string;
+  target?: HTMLAttributeAnchorTarget;
 }
 
-const AddressLink = ({ alias, type, className, truncation = 'dynamic', hash, id, fontWeight }: Props) => {
+const AddressLink = ({ alias, type, className, truncation = 'dynamic', hash, id, fontWeight, target }: Props) => {
   let url;
   if (type === 'transaction') {
     url = link('tx', { id: id || hash });
@@ -49,7 +51,7 @@ const AddressLink = ({ alias, type, className, truncation = 'dynamic', hash, id,
     <Link
       className={ className }
       href={ url }
-      target="_blank"
+      target={ target || '_blank' }
       overflow="hidden"
       whiteSpace="nowrap"
     >

ui/txs/TxsListItem.tsx

@@ -60,6 +60,7 @@ const TxsListItem = ({ tx }: {tx: Transaction}) => {
                 type="transaction"
                 fontWeight="700"
                 truncation="constant"
+                target="_self"
               />
             </Address>
           </Flex>

ui/txs/TxsTableItem.tsx

@@ -89,6 +89,7 @@ const TxsTableItem = ({ tx }: {tx: Transaction}) => {
               hash={ tx.hash }
               type="transaction"
               fontWeight="700"
+              target="_self"
             />
           </Address>
           <Text color="gray.500" fontWeight="400">{ dayjs(tx.timestamp).fromNow() }</Text>