'use client'; import React from 'react'; import { useWebSocket } from '@/hooks/useWebSocket'; export const LiveMetrics: React.FC<{ streamId: string }> = ({ streamId }) => { const { liveViewers, livePurchases } = useWebSocket(streamId); return ( <div style={{ display: 'flex', gap: 16, padding: '8px 12px', background: 'rgba(0,0,0,0.6)', borderRadius: 8, color: '#fff', fontSize: 13, fontWeight: 600 }}> <span>👁 {liveViewers.toLocaleString()}</span> <span style={{ color: '#FFD700' }}>🛒 {livePurchases}</span> </div> ); };