import { DonutBreakdownCard } from '@/components/patterns/donut-breakdown-card'
import { SegmentedProgressCard } from '@/components/patterns/segmented-progress-card'
import { peerSessionBreakdown } from '@/lib/metrics'
import { aggregateNetworkMetrics } from '@/queries/overview'
import type { PeerRow, SpeakerRow } from '@/types/api'

export function NetworkOverviewAnalyticsCard({
  peers,
  speakers,
  loading,
}: {
  peers: PeerRow[]
  speakers: SpeakerRow[]
  loading?: boolean
}) {
  const net = aggregateNetworkMetrics(peers, speakers)
  const slices = peerSessionBreakdown(peers)
  const speakersPct =
    net.speakersTotal > 0 ? Math.round((net.speakersOnline / net.speakersTotal) * 100) : 0

  if (loading) {
    return (
      <DonutBreakdownCard
        title="Сводка BGP"
        description="Установленные сессии и спикеры"
        slices={[]}
        centerLabel="Пиры"
      />
    )
  }

  return (
    <div className="grid gap-4 lg:grid-cols-2">
      <DonutBreakdownCard
        title="Сводка BGP"
        description="Распределение состояний пиров"
        slices={slices}
        centerLabel="Пиры"
        badge={net.peersMismatch > 0 ? `${net.peersMismatch} расхождений` : 'в норме'}
      />
      <SegmentedProgressCard
        title="Спикеры"
        description="Доступность агентов"
        primary={{
          value: `${net.speakersOnline}/${net.speakersTotal}`,
          label: 'В сети',
          percent: speakersPct,
        }}
        secondary={{
          value: net.speakersTotal - net.speakersOnline,
          label: 'Не в сети',
          percent: 100 - speakersPct,
        }}
        footer={`Пиры установлены: ${net.peersEstablished}/${net.peersEnabled}`}
      />
    </div>
  )
}