FRONTEND: User Dashboard with Portfolio Analytics

[PoulavBhowmick03]

Description
Personalized dashboard showing contest history and performance stats.

Acceptance Criteria:

1. SSG page with client-side hydration
2. Interactive charts:
   • ROI over time (Line chart)
   • Sport distribution (Pie chart)
   • Win/loss ratio (Donut chart)
3. Paginated transaction history table
4. Downloadable tax report (PDF)

Technical Details:

// pages/dashboard/[wallet].tsx
export const getStaticPaths: GetStaticPaths = async () => {
  return { paths: [], fallback: 'blocking' };
};

export const getStaticProps: GetStaticProps = async ({ params }) => {
  const res = await fetchUserData(params.wallet as string);
  return { props: { userData: await res.json() } };
};

export default function Dashboard({ userData }: { userData: User }) {
  const { data } = useSWR(`/api/users/${userData.wallet}`, {
    fallbackData: userData
  });
  
  return (
    <div>
      <PortfolioChart data={data.performance} />
      <TransactionHistory transactions={data.txns} />
    </div>
  );
}

Notes:

• Use recharts for visualizations
• Implement SSG with fallback
• Add CSV/PDF export functionality

---