Was this helpful?
Distribute rewards to token holders using TIP-20's built-in reward distribution mechanism. Rewards allow parties to incentivize holders of a token by distributing tokens proportionally based on their balance.
Rewards can be distributed by anyone on any TIP-20 token, and claimed by any holder who has opted in. This guide covers both the reward distributor and token holder use cases. While the demo below uses a token you create, the same principles apply to any token.
Try out the complete rewards flow: create a token, opt in to receive rewards on it, create a reward for yourself, and claim it.
Use useWatchRewardDistributed to listen for new reward distributions on a token. This is useful for updating your UI when a reward is distributed.
import { } from 'wagmi/tempo'
function () {
const = '0x...' // Your token address
..
Use useWatchRewardRecipientSet to listen for when users opt in to rewards by setting their recipient address. This is useful for tracking opt-in activity.
import { } from 'wagmi/tempo'
function () {
const = '0x...' // Your token address
..
If you would like to distribute rewards on a token you have created, follow the Create a Stablecoin guide to deploy your token.
Token holders must opt in to receive rewards by setting their reward recipient address. This is typically set to their own address.
import React from 'react'
import { } from 'wagmi/tempo'
import { } from 'wagmi'
export function () {
const { } = ()
const = '0x...' // Your token address
const = ..()
const = () => {
if (!) return
.({
: ,
: ,
})
}
return (
<
={.}
={}
="button"
>
{. ? 'Opting in...' : 'Opt In to Rewards'}
</>
)
}import { , } from 'wagmi'
import { }
import React from 'react'
import { } from 'wagmi/tempo'
import { } from 'viem'
export function () {
const = '0x...' // Your token address
const { : } = ..
: ,
})
const = ..useStartSync()
const = () => {
if (!) return
.mutate({
: ('50', .),
: ,
})
}
return (
<
={.isPending || !}
={}
="button"
>
{.isPending ? 'Starting...' : 'Start Reward'}
</>
)
}import { , } from 'wagmi'
import { }
import React from 'react'
import { } from 'wagmi/tempo'
export function () {
const = '0x...' // Your token address
const = ..()
const = () => {
.({
: ,
})
}
return (
<
={.}
={}
="button"
>
{. ? 'Claiming...' : 'Claim Rewards'}
</>
)
}import { , } from 'wagmi'
import { }