[Feat] Add token swap interface to /token page

[realproject7]

Summary

The PLOT token page (/token) is missing the swap interface and a proper Token Information section. Dropcast's DR token page has both — implement the same patterns for PlotLink.

1. Token Information Section (match Dropcast screenshot)

Add a "Token Information" section matching Dropcast's layout:

Price + Market Cap row

• Price: Current PLOT price in USD (fetch from MCV2_Bond or CoinGecko). Show % change if available.
• Market Cap: Current supply × price

External links (with icons)

• View on Mint Club — icon: /public/mc-icon-light.svg — link: https://mint.club/token/base/PLOT (placeholder until real $PLOT)
• View on Hunt Town — icon: /public/hunt-token.svg — link: Hunt Town token page (placeholder until real $PLOT)

Contract Address

• Basescan — icon: /public/basescan-icon.svg — show truncated address with copy button + external link to Basescan
• PLOT token: 0xF8A2C39111FCEB9C950aAf28A9E34EBaD99b85C1

Network badge

• "Base Mainnet (ERC-20)" with Base chain icon

Layout

Match the Dropcast card-style layout from the screenshot:

• Price and Market Cap in a two-column row with background cards
• Each external link as a full-width row with icon left, label center, external link icon right
• Contract address row with copy + external link icons
• Network badge row

2. Swap Interface

Reference Implementation

Dropcast swap interface: ~/Projects/dropcast/components/token/SwapInterface.tsx

Platform detection (via usePlatformDetection hook):

1. Farcaster Mini App / Base App: Uses sdk.actions.swapToken() — opens the platform's native swap UI
2. Web browser: Shows a button linking to Uniswap: https://app.uniswap.org/swap?outputCurrency=${PLOT_TOKEN}&chain=base

No iframes, no embedded widgets.

Component structure

• Create src/components/token/SwapInterface.tsx
• Use existing platform detection from PlotLink's Farcaster setup
• Add <SwapInterface /> to /token page

UI

• "Buy PLOT on Uniswap" button (web → opens Uniswap in new tab)
• "Swap to PLOT" button (Farcaster → triggers native swap)

Icons available in /public/

• mc-icon-light.svg — Mint Club logo
• basescan-icon.svg — Basescan logo
• hunt-token.svg — Hunt Town logo

Reference files

• Dropcast SwapInterface: ~/Projects/dropcast/components/token/SwapInterface.tsx
• Dropcast Token Information: ~/Projects/dropcast/app/token/page.tsx (and related components)
• Dropcast platform detection: ~/Projects/dropcast/lib/hooks/usePlatformDetection.ts
• PlotLink token page: src/app/token/page.tsx
• PLOT token: 0xF8A2C39111FCEB9C950aAf28A9E34EBaD99b85C1
• MCV2_Bond: 0xc5a076cad94176c2996B32d8466Be1cE757FAa27

Note

When real $PLOT is issued (#31 Phase B), update:

• Token address in Token Information section
• Mint Club + Hunt Town links
• Uniswap swap link (P5-OP2f)

Acceptance Criteria

• Token Information section with Price, Market Cap, external links, contract address, network badge
• Icons used: mc-icon-light.svg, hunt-token.svg, basescan-icon.svg
• SwapInterface: web links to Uniswap, Farcaster uses native swap
• Layout matches Dropcast card-style design
• Mobile responsive
• Build passes

Branch

task/462-token-swap in plotlink repo