Create new tx link component

src/custom/components/EnhancedTransactionLink/index.tsx

@@ -0,0 +1,32 @@
+import { ExplorerDataType } from 'utils/getExplorerLink'
+
+import { ExplorerLink } from 'components/ExplorerLink'
+import { GnosisSafeLink } from 'components/AccountDetails/Transaction/StatusDetails'
+
+import { EnhancedTransactionDetails, HashType } from 'state/enhancedTransactions/reducer'
+import { useWalletInfo } from 'hooks/useWalletInfo'
+
+interface Props {
+  tx: EnhancedTransactionDetails
+}
+
+/**
+ * Creates a link to the relevant explorer: Etherscan, GP Explorer or Blockscout, or Gnosis Safe web if its a Gnosis Safe Transaction
+ * @param props
+ */
+export function EnhancedTransactionLink(props: Props) {
+  const { tx } = props
+  const { chainId, gnosisSafeInfo } = useWalletInfo()
+
+  if (tx.hashType === HashType.GNOSIS_SAFE_TX) {
+    const safeTx = tx.safeTransaction
+
+    if (!chainId || !safeTx || !gnosisSafeInfo) {
+      return null
+    }
+
+    return <GnosisSafeLink chainId={chainId} safeTransaction={safeTx} gnosisSafeThreshold={gnosisSafeInfo.threshold} />
+  } else {
+    return <ExplorerLink id={tx.hash} type={ExplorerDataType.TRANSACTION} />
+  }
+}

src/custom/pages/Claim/ClaimingStatus.tsx

@@ -6,8 +6,7 @@ import { useActiveWeb3React } from 'hooks/web3'
 import CowProtocolLogo from 'components/CowProtocolLogo'
 import { useAllClaimingTransactions } from 'state/enhancedTransactions/hooks'
 import { useMemo } from 'react'
-import { ExplorerLink } from 'components/ExplorerLink'
-import { ExplorerDataType } from 'utils/getExplorerLink'
+import { EnhancedTransactionLink } from 'components/EnhancedTransactionLink'
 // import { formatSmartLocationAware } from 'utils/format'
 
 export default function ClaimingStatus() {
@@ -69,9 +68,7 @@ export default function ClaimingStatus() {
           </p>
         </AttemptFooter>
       )}
-      {isSubmitted && chainId && lastClaimTx?.hash && (
-        <ExplorerLink id={lastClaimTx.hash} type={ExplorerDataType.TRANSACTION} />
-      )}
+      {isSubmitted && chainId && lastClaimTx?.hash && <EnhancedTransactionLink tx={lastClaimTx} />}
     </ConfirmOrLoadingWrapper>
   )
 }