// Token Swap — DEX-style swap dashboard for UBR / USDC / patent / DAO tokens. const SWAP_TOKENS = [ { sym: 'UBR', name: 'Unblock token', price: 1.84, cls: 'protocol', col: 'oklch(0.86 0.19 118)' }, { sym: 'USDC', name: 'USD Coin', price: 1.00, cls: 'stable', col: '#2775CA' }, { sym: 'ETH', name: 'Ether', price: 3210, cls: 'crypto', col: '#5B5A60' }, { sym: 'GAT3-LTP',name: 'Astrocytic GAT-3 mod', price: 1.84, cls: 'patent', col: 'oklch(0.66 0.13 240)' }, { sym: 'AGEX', name: 'AgeX Longevity DAO', price: 2.42, cls: 'dao', col: 'oklch(0.78 0.16 70)' }, { sym: 'GLIA', name: 'Glia Initiative DAO', price: 1.84, cls: 'dao', col: 'oklch(0.78 0.16 70)' }, { sym: 'OPENVAX', name: 'OpenVax Cooperative', price: 0.94, cls: 'dao', col: 'oklch(0.78 0.16 70)' }, { sym: 'AGE-04', name: 'Aging assay platform', price: 1.32, cls: 'patent', col: 'oklch(0.66 0.13 240)' }, ]; function SwapRail() { return ( <>
WALLET · LIQUID
$48,210
14 assets · 3 networks
); } function TokenPill({ t }) { return (
{t.sym.slice(0, 2)}
{t.sym} ▾
); } function SwapDapp() { const from = SWAP_TOKENS[1]; // USDC const to = SWAP_TOKENS[4]; // AGEX return ( }> Tokens · Swap} title="Swap" sub="Trade UBR, stables, and any patent or DAO token issued through UB-Chain. Routes auto-split across the protocol AMM and approved third-party pools." actions={<> Slippage · 0.5% History · 124 Provide liquidity } />
{/* Left — swap card + chart + route */}
{/* From */}
YOU PAY balance · 18,420.00 USDC
≈ $2,500.00
{['25%', '50%', 'MAX'].map(p => {p})}
{/* Flip */}
{/* To */}
YOU RECEIVE balance · 12,400.00 AGEX
1,033.057
≈ $2,490.00 · 1 AGEX = $2.42
Confirm swap · 2,500 USDC → 1,033 AGEX
Rate1 USDC = 0.413 AGEX
Slippage tolerance0.50%
Min received1,027.89 AGEX
Price impact0.18%
Network fee0.0014 UBR · $0.02
Protocol fee0.30% · $7.50
{[40, 80, 120].map(y => )} {(() => { const pts = []; for (let i = 0; i <= 30; i++) { pts.push(120 - i * 1.6 + Math.sin(i * 0.5) * 10); } let d = `M 0 ${pts[0]}`; pts.forEach((y, i) => { d += ` L ${(i / 30) * 600} ${y}`; }); return ; })()}
{/* From box */} 2,500 USDC {/* Three split paths */} {[{ y: 22, l: '60% · UBP-AMM v1 · USDC/AGEX', col: UB.accent }, { y: 60, l: '28% · USDC/UBR/AGEX', col: 'oklch(0.66 0.13 240)' }, { y: 98, l: '12% · USDC/ETH/AGEX', col: UB.ok }].map((r, i) => ( 60 ? 280 : 280} ${r.y} 380 ${r.y}`} stroke={r.col} strokeWidth="1.4" fill="none" /> {r.l} ))} {/* To box */} 1,033 AGEX
{/* Right — pairs / order book / recents */}
{[ ['UBR/USDC', '$1.84', '+2.1%', '$4.2M'], ['AGEX/USDC', '$2.42', '+5.1%', '$1.4M'], ['GLIA/UBR', '$1.84', '+2.4%', '$0.9M'], ['GAT3/USDC', '$1.84', '+0.4%', '$0.4M'], ['OPENVAX/UBR', '$0.94', '+1.4%', '$0.3M'], ['CRSPR/USDC', '$1.42', '+3.2%', '$0.2M'], ].map((r, i, arr) => (
{r[0]} {r[1]} {r[2]} {r[3]}
))}
{[[2.42, 1240], [2.41, 2100], [2.40, 540], [2.38, 4400]].map((r, i) => (
${r[0].toFixed(2)} {r[1]}
))}
{[[2.43, 800], [2.45, 1400], [2.48, 2200], [2.52, 1800]].map((r, i) => (
${r[0].toFixed(2)} {r[1]}
))}
{[ ['USDC → AGEX', '$2,500', '+1,033 AGEX', '14:08'], ['UBR → USDC', '8,000 UBR', '+$14,720', '11:42'], ['OPENVAX → UBR','2,000', '+1,020 UBR', '08:14'], ['USDC → GAT3', '$4,000', '+2,173 GAT3', 'yesterday'], ['UBR → AGEX', '1,200 UBR', '+912 AGEX', 'yesterday'], ['USDC → GLIA', '$1,800', '+978 GLIA', '2d'], ].map((r, i, arr) => (
{r[0]} {r[1]} {r[2]} {r[3]}
))}
); } window.SwapDapp = SwapDapp;