/**
 * InferencePanel 單元測試（塊 2）
 *
 * 驗證：
 *   - isRunning=false → 顯示等待提示（idle）
 *   - isRunning=true 但無結果 → 顯示 waitingResults
 *   - 有 classifications → 顯示 label + 信心度百分比
 *   - 有 detections → 顯示 label + 信心度
 *   - 低於 confidenceThreshold 的結果被過濾
 *   - 效能指標 fps / latency 呈現
 */
import { render, screen } from "@testing-library/react";
import { beforeEach, describe, expect, it } from "vitest";

import { LocaleProvider } from "@/lib/i18n/context";
import { useInferenceStore } from "@/stores/inference-store";

import { InferencePanel } from "./inference-panel";

function resetStore() {
  useInferenceStore.setState({
    result: null,
    results: [],
    fps: 0,
    avgLatency: 0,
    batchResults: {},
    confidenceThreshold: 0.5,
  });
}

function renderPanel(isRunning: boolean) {
  return render(
    <LocaleProvider>
      <InferencePanel isRunning={isRunning} />
    </LocaleProvider>,
  );
}

describe("<InferencePanel />", () => {
  beforeEach(resetStore);

  it("未推論時顯示 idle 等待提示", () => {
    renderPanel(false);
    expect(screen.getByTestId("inference-panel-idle")).toBeInTheDocument();
    expect(screen.queryByTestId("inference-panel")).not.toBeInTheDocument();
  });

  it("推論中但無結果 → 顯示 waitingResults", () => {
    renderPanel(true);
    expect(screen.getByTestId("inference-panel")).toBeInTheDocument();
    expect(screen.getByText("等待第一筆結果…")).toBeInTheDocument();
  });

  it("顯示 classification 結果的 label + 信心度", () => {
    useInferenceStore.setState({
      result: {
        taskType: "classification",
        timestamp: Date.now(),
        latencyMs: 15,
        classifications: [
          { label: "dog", confidence: 0.92 },
          { label: "cat", confidence: 0.61 },
        ],
      },
      fps: 12,
      avgLatency: 15,
    });
    renderPanel(true);
    expect(screen.getByText("dog")).toBeInTheDocument();
    expect(screen.getByText("92%")).toBeInTheDocument();
    expect(screen.getByText("cat")).toBeInTheDocument();
    expect(screen.getByText("61%")).toBeInTheDocument();
  });

  it("過濾低於 confidenceThreshold 的結果", () => {
    useInferenceStore.setState({
      confidenceThreshold: 0.7,
      result: {
        taskType: "classification",
        timestamp: Date.now(),
        latencyMs: 15,
        classifications: [
          { label: "high", confidence: 0.8 },
          { label: "low", confidence: 0.4 },
        ],
      },
    });
    renderPanel(true);
    expect(screen.getByText("high")).toBeInTheDocument();
    expect(screen.queryByText("low")).not.toBeInTheDocument();
  });

  it("顯示 detection 結果", () => {
    useInferenceStore.setState({
      result: {
        taskType: "detection",
        timestamp: Date.now(),
        latencyMs: 20,
        detections: [
          { label: "person", confidence: 0.88, bbox: { x: 0, y: 0, width: 0.3, height: 0.6 } },
        ],
      },
    });
    renderPanel(true);
    expect(screen.getByText("person")).toBeInTheDocument();
    expect(screen.getByText("88%")).toBeInTheDocument();
  });

  it("呈現 fps 與 latency 指標", () => {
    useInferenceStore.setState({ fps: 24, avgLatency: 33.7 });
    renderPanel(true);
    expect(screen.getByTestId("metric-fps")).toHaveTextContent("24");
    expect(screen.getByTestId("metric-latency")).toHaveTextContent("34 ms");
  });
});