Integrate User Profile with Contracts

[Mrwicks00]

Description

Display user-specific data on the profile page, including submitted memes, votes cast, staked amounts, and won NFTs.

Tasks

• Create a custom hook useUserMemes(userAddress) to fetch all memes submitted by user
• Create a custom hook useUserVotes(userAddress) to fetch all votes cast by user across all battles
• Create a custom hook useUserNFTs(userAddress) to fetch winning NFTs from WinningMemeNFT
• Display user's submitted memes with battle themes
• Display user's votes with staked amounts and selected memes
• Display user's winning NFTs with battle info
• Show total USDC staked across all battles
• Show total USDC won from battles
• Display withdrawable amounts for finalized battles
• Handle loading and error states

Contract Functions Used

• MemeRegistry.memes(uint256) - Get meme details (iterate through all memes to find user's)
• VotingEngine.votes(uint256, address) - Get user's vote for each battle
• WinningMemeNFT.balanceOf(address) - Get user's NFT count
• WinningMemeNFT.tokenOfOwnerByIndex(address, uint256) - Get NFT token IDs (if implemented)
• WinningMemeNFT.tokenOfMeme(uint256) - Get NFT token ID for meme

Files to Modify

• frontend/app/profile/page.tsx
• frontend/hooks/useUserMemes.ts (new file)
• frontend/hooks/useUserVotes.ts (new file)
• frontend/hooks/useUserNFTs.ts (new file)