✨ Add Share Market and Social Features

[Mosas2000]

Description

Add social features to increase platform engagement and market visibility.

Proposed Features

1. Share Market

• Copy market link button
• Share to Twitter/X with pre-filled text
• Share to Discord/Telegram
• Embed widget code for external sites

2. Share Modal

┌─ Share Market ───────────────────────────┐
│                                          │
│ 🔗 https://0xcast.vercel.app/trade/5    │
│                                    [Copy]│
│                                          │
│ Share on:                                │
│ [Twitter] [Discord] [Telegram] [Reddit]  │
│                                          │
│ Embed Code:                              │
│ <iframe src="..."></iframe>      [Copy] │
└──────────────────────────────────────────┘

3. Market Comments

• Simple comment thread per market
• Requires wallet connection
• On-chain or off-chain storage (TBD)

4. Leaderboard

• Top predictors by win rate
• Top by volume
• Weekly/monthly rankings

5. Referral System

• Generate referral links
• Track referral rewards
• Display referral stats

Implementation Notes

Share URLs

const shareUrl = `${window.location.origin}/trade/${marketId}`;
const twitterUrl = `https://twitter.com/intent/tweet?text=${encodeURIComponent(text)}&url=${shareUrl}`;

OG Meta Tags for Link Previews

<meta property="og:title" content="Will BTC reach $100k?">
<meta property="og:description" content="Yes: 65% | No: 35% - Pool: 245 STX">
<meta property="og:image" content="/api/og/market/5">

Files to Create

• frontend/src/components/ShareModal.tsx
• frontend/src/components/SocialButtons.tsx
• frontend/src/pages/LeaderboardPage.tsx
• frontend/src/hooks/useLeaderboard.ts
• Consider: pages/api/og/[marketId].tsx for dynamic OG images

Priority

🟢 Low - Growth feature