> ## Documentation Index
> Fetch the complete documentation index at: https://docs.getpara.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Watch Contract Events
> Listen to smart contract events and parse event logs in real-time
export const Link = ({href, label, newTab = false}) => {
const [isHovered, setIsHovered] = useState(false);
return setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}>
{label}
;
};
export const Card = ({imgUrl, title, description, href, horizontal = false, newTab = false}) => {
const [isHovered, setIsHovered] = useState(false);
const handleClick = e => {
e.preventDefault();
if (newTab) {
window.open(href, '_blank', 'noopener,noreferrer');
} else {
window.location.href = href;
}
};
return ;
};
Subscribe to and filter smart contract events to react to on-chain activity in real-time.
## Prerequisites
You need Web3 libraries configured with Para authentication.
## Watch Contract Events
```typescript theme={null}
import { ethers } from "ethers";
const ERC20_ABI = [
"event Transfer(address indexed from, address indexed to, uint256 value)"
];
async function watchTransferEvents(
provider: ethers.Provider,
tokenAddress: string
) {
const contract = new ethers.Contract(
tokenAddress,
ERC20_ABI,
provider
);
contract.on("Transfer", (from, to, value, event) => {
console.log(`Transfer Event: ${from} -> ${to}, Value: ${ethers.formatUnits(value, 18)}`);
console.log("Event details:", event);
});
console.log(`Listening for Transfer events on ${tokenAddress}...`);
}
async function stopWatchingTransferEvents(
provider: ethers.Provider,
tokenAddress: string
) {
const contract = new ethers.Contract(
tokenAddress,
ERC20_ABI,
provider
);
contract.off("Transfer");
console.log(`Stopped listening for Transfer events on ${tokenAddress}.`);
}
```
```typescript theme={null}
import { createPublicClient, http } from "viem";
import { mainnet } from "viem/chains";
const ERC20_ABI = [
{
anonymous: false,
inputs: [
{ indexed: true, name: "from", type: "address" },
{ indexed: true, name: "to", type: "address" },
{ indexed: false, name: "value", type: "uint256" },
],
name: "Transfer",
type: "event",
},
] as const;
async function watchTransferEvents(
publicClient: any,
tokenAddress: `0x${string}`
) {
const unwatch = publicClient.watchContractEvent({
address: tokenAddress,
abi: ERC20_ABI,
eventName: "Transfer",
onLogs: (logs) => {
for (const log of logs) {
console.log(`Transfer Event: ${log.args.from} -> ${log.args.to}, Value: ${log.args.value}`);
console.log("Log details:", log);
}
},
});
console.log(`Listening for Transfer events on ${tokenAddress}...`);
return unwatch; // Return the unwatch function to stop listening later
}
```
```typescript theme={null}
import { useWatchContractEvent } from "@getpara/react-sdk/wagmi";
const ERC20_ABI = [
{
anonymous: false,
inputs: [
{ indexed: true, name: "from", type: "address" },
{ indexed: true, name: "to", type: "address" },
{ indexed: false, name: "value", type: "uint256" },
],
name: "Transfer",
type: "event",
},
] as const;
function WatchTransferEvents({ tokenAddress }: { tokenAddress: `0x${string}` }) {
useWatchContractEvent({
address: tokenAddress,
abi: ERC20_ABI,
eventName: "Transfer",
onLogs: (logs) => {
for (const log of logs) {
console.log(`Transfer Event: ${log.args.from} -> ${log.args.to}, Value: ${log.args.value}`);
console.log("Log details:", log);
}
},
});
return Listening for Transfer events on {tokenAddress}...
;
}
```
## Next Steps
