Add display of transaction status link and

explorer name in Success component

src/features/Web3/components/Success/Success.module.css

@@ -6,3 +6,18 @@
 .title {
   font-size: var(--font-size-h3);
 }
+
+.actions {
+  display: flex;
+  justify-content: center;
+}
+
+.actions button {
+  width: 115px;
+  height: 45px;
+  padding: 0;
+}
+
+.success code {
+  font-size: var(--font-size-small);
+}

src/features/Web3/components/Success/Success.tsx

@@ -1,27 +1,31 @@
 import { $txHash, $isInitSend } from '@features/Web3/stores'
 import { useStore } from '@nanostores/react'
 import styles from './Success.module.css'
+import { useNetwork } from 'wagmi'
 
 export function Success() {
+  const { chain } = useNetwork()
   const txHash = useStore($txHash)
+  console.log(chain)
+
+  const explorerName = chain?.blockExplorers?.default.name
+  const explorerLink = `${chain?.blockExplorers?.default.url}/tx/${txHash}`
 
   return (
     <div className={styles.success}>
-      <h5 className={styles.title}>You're amazing!</h5>
+      <h5 className={styles.title}>You're amazing, thanks!</h5>
 
       <p>
-        Your transaction has been sent. You can check the status on{' '}
-        <a
-          href={`https://etherscan.io/tx/${txHash}`}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Etherscan
+        Your transaction is on its way. You can check the status on{' '}
+        <a href={explorerLink} target="_blank" rel="noopener noreferrer">
+          {explorerName}
         </a>
         .
       </p>
       <p>
-        <code>0xxxx{txHash}</code>
+        <a href={explorerLink} target="_blank" rel="noopener noreferrer">
+          <code>{txHash}</code>
+        </a>
       </p>
 
       <footer className={styles.actions}>