import React, { useState, useEffect } from 'react';
import { useEthers } from '@usedapp/core';
import { ethers } from 'ethers';
import contractABI from './contractABI.json';
const contractAddress = '0xYourContractAddress';
const ReferralDashboard = () => {
const { account, library } = useEthers();
const [referrerAddress, setReferrerAddress] = useState('');
const [totalRewards, setTotalRewards] = useState(0);
const [levelRewards, setLevelRewards] = useState(Array(7).fill(0));
useEffect(() => {
async function loadUserDashboard() {
if (account && library) {
const referralContract = new ethers.Contract(contractAddress, contractABI, library);
const connectedContract = referralContract.connect(account);
const currentReferrerAddress = await connectedContract.referrers(account);
setReferrerAddress(currentReferrerAddress);
const currentTotalRewards = await connectedContract.totalRewards(account);
setTotalRewards(ethers.utils.formatEther(currentTotalRewards));
const currentLevelRewards = [];
for (let i = 1; i <= 7; i++) {
const levelReward = await connectedContract.rewards(account, i);
currentLevelRewards.push(ethers.utils.formatEther(levelReward));
}
setLevelRewards(currentLevelRewards);
}
}
loadUserDashboard();
}, [account, library]);
return (
<div>
<h1>User Dashboard</h1>
<p>User Address: {account || 'Not connected'}</p>
<p>Referrer Address: {referrerAddress}</p>
<p>Total Referral Rewards: {totalRewards} SMU</p>
<p>Level-wise Referral Rewards:</p>
<ul>
{levelRewards.map((reward, index) => (
<li key={index}>Level {index + 1}: {reward} SMU</li>
))}
</ul>
</div>
);
};
export default ReferralDashboard;