The ID of the reward for which user rewards should be fetched.
Optional
params: { Optional additional parameters that will be passed along to the useUserRewards
hook.
The returning object contains:
refresh
: FetchUserRewardsMethod - Function to refresh or re-fetch the user rewards data.userRewards
: The current list of user rewards.fetched
: Boolean indicating whether the user rewards data has been successfully fetched.rewardId
and optional additional params
to further
refine the data fetch.useUserRewards
, passing along
the rewardId
.useUserRewards
are inherited to optimize network
performance.import { useUserRewardsByReward } from 'react-playmakers';
const RewardUserRewards: React.FC = () => {
const { userRewards, fetched, refresh } = useUserRewardsByReward('rXXXXXXX');
useEffect(() => {
if (!fetched) {
console.log("Fetching rewards for the reward...");
}
}, [fetched]);
const handleRefresh = async () => {
await refresh();
console.log("User rewards refreshed.");
};
return (
<div>
{fetched ? (
<div>
<h2>Reward User Rewards</h2>
<ul>
{userRewards.map((reward, index) => (
<li key={index}>{reward.name}</li>
))}
</ul>
</div>
) : (
<p>Loading...</p>
)}
<button onClick={handleRefresh}>Refresh Rewards</button>
</div>
);
};
Generated using TypeDoc
Custom React hook to fetch user rewards specific to a given reward.
This hook is a wrapper around the useUserRewards hook, automatically passing the
rewardId
to filter user rewards for that specific reward. You can also pass additional parameters to further filter or modify the data fetching behavior.