Docs
Token Tx Sonner

Token Tx Sonner

The Token Transaction Sonner is a component that displays real-time transaction status updates for users, including pending transactions, successful verifications, or errors encountered during processing.

Installation

Run the following command:

npx @token-kit/cli@latest add token-tx-sonner

Add the Toaster Component

app/layout.tsx
import { Toaster } from "@/components/ui/sonner";
 
export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <head />
      <body>
        <main>{children}</main>
        <Toaster />
      </body>
    </html>
  );
}

Usage

import { showTxSonner } from "@/components/token-kit/token-tx-sonner";
showTxSonner(
  "0x6ab620baa39d4bf784a229c1aa4df0b25267863a4e623785d8937c48c6b4170d",
  "https://etherscan.io/tx/",
  5000,
);