import { PageContainer } from '../../components/shared/PageContainer';
import { StatusIndicator } from '../../components/shared/StatusIndicator';

export default function MarketReportingPage() {
  return (
    <PageContainer>
      <h1 className="text-2xl font-bold mb-6">Market Reporting</h1>
      <div className="bg-white rounded-lg shadow p-6">
        <h2 className="text-xl font-semibold mb-4">API Connection Status</h2>
        <div className="space-y-2">
          <div className="flex justify-between">
            <span>Binance</span>
            <StatusIndicator status="healthy" />
          </div>
          <div className="flex justify-between">
            <span>Coinbase</span>
            <StatusIndicator status="healthy" />
          </div>
          <div className="flex justify-between">
            <span>Kraken</span>
            <StatusIndicator status="healthy" />
          </div>
        </div>
      </div>
    </PageContainer>
  );
}

