import { isConfirmedLiveState } from "../lifecycle";
import { finiteMetric, formatNumber, pipelineLatency } from "../presentation";
import type { XgridsK1Controller } from "../runtimeContext";
import { MetricCard } from "./MetricCard";

export function K1Metrics({ controller }: { controller: XgridsK1Controller }) {
  const { state } = controller;
  const streamActive = isConfirmedLiveState(state) || state?.source_mode === "replay";
  const metrics = streamActive ? state?.metrics : undefined;
  const latency = pipelineLatency(metrics);
  const frameRate = finiteMetric(metrics?.frame_rate ?? metrics?.frame_rate_hz);
  const points = finiteMetric(metrics?.point_count);
  const droppedFrames = finiteMetric(metrics?.dropped_preview_frames);

  return (
    <section className="metrics-grid" aria-label="Метрики потока в реальном времени">
      <MetricCard
        featured
        eyebrow="ДО ПУБЛИКАЦИИ"
        value={formatNumber(latency)}
        unit="мс"
        detail="MQTT callback → Rerun SDK; без экрана"
      />
      <MetricCard
        eyebrow="ЧАСТОТА КАДРОВ"
        value={formatNumber(frameRate)}
        unit="кадр/с"
        detail="Последнее измерение адаптера"
      />
      <MetricCard
        eyebrow="ТОЧЕК В КАДРЕ"
        value={points === null ? "—" : points.toLocaleString("ru-RU", { maximumFractionDigits: 0 })}
        detail="Реальное число декодированных точек"
      />
      <MetricCard
        eyebrow="ПРОПУЩЕНО ПРЕДПРОСМОТРОВ"
        value={droppedFrames === null ? "—" : droppedFrames.toLocaleString("ru-RU", { maximumFractionDigits: 0 })}
        detail="Исходные данные при этом сохраняются"
      />
    </section>
  );
}
