"use client";

import type { QaReport } from "../lib/domain/types";

interface QaReportPanelProps {
  report: QaReport | null;
}

const statusLabels = {
  pass: "通过",
  warn: "警告",
  fail: "失败",
} as const;

const ruleLabels: Record<string, string> = {
  industry_alignment: "行业一致性",
  image_text_match: "图文匹配",
  voice_consistency: "表达视角一致性",
  platform_fit: "平台适配",
  company_name_integrity: "公司名称完整性",
  title_quality: "标题质量",
  body_quality: "正文质量",
  hallucination_risk: "事实幻觉风险",
  claim_consistency: "主张一致性",
  context_sensitive_terms: "语境敏感词",
};

const targetAgentLabels: Record<string, string> = {
  title: "标题改写",
  body: "正文改写",
};

export function QaReportPanel({ report }: QaReportPanelProps) {
  if (!report) {
    return (
      <section className="panel empty-panel">
        <div className="panel-heading">质量报告</div>
      </section>
    );
  }

  return (
    <section className="panel stack">
      <div className="panel-heading">
        <span>质量报告</span>
        <span className={`status-pill ${report.overall_status}`}>
          {statusLabels[report.overall_status]}
        </span>
      </div>
      <div className="qa-list">
        {report.checks.map((check) => (
          <div className="qa-item" key={check.rule_id}>
            <div className="qa-title-row">
              <strong>{ruleLabels[check.rule_id] ?? check.rule_id}</strong>
              <span className={`status-pill ${check.status}`}>
                {statusLabels[check.status]}
              </span>
            </div>
            <p>{check.reason}</p>
            <small>{check.evidence}</small>
            {check.suggested_fix && <em>{check.suggested_fix}</em>}
            {check.target_agent && (
              <code>
                {targetAgentLabels[check.target_agent] ?? check.target_agent}
              </code>
            )}
          </div>
        ))}
      </div>
    </section>
  );
}
