import "./review-badge.css";

// 火山人像合规审核盾(全站统一):全绿=已过审 / 全红=未过审 / 橙光扫=审核中 / 全灰=待审核。
// 灰盾(未送审)可点 → 提交审核(兜底,火山很快)。只在送审类(角色/三视图/分镜)上用。
export type ReviewStatus = "active" | "failed" | "processing" | "" | undefined;

const META: Record<string, { label: string; cls: string }> = {
  active: { label: "已过审", cls: "rv-pass" },
  failed: { label: "未过审", cls: "rv-fail" },
  processing: { label: "审核中", cls: "rv-proc" },
  "": { label: "待审核", cls: "rv-idle" }
};

export function ReviewBadge({ status, onSubmit, error, busy, compact }: {
  status: ReviewStatus;
  onSubmit?: () => void; // 灰盾(待审核)/红盾(未过审)时点击触发(重新)送审
  error?: string; // 未过审原因(气泡里显)
  busy?: boolean; // 提交中
  compact?: boolean; // 用在 overflow:hidden 容器里(如故事板分镜图):改用原生 title 提示,避免 CSS 气泡被裁掉看不见
}) {
  const key = status || "";
  const meta = META[key] || META[""];
  // 灰盾(待审核)和红盾(未过审/常见是审核超时)都可点重新送审 —— 超时是误判,重提即可再审一遍
  const clickable = (key === "" || key === "failed") && !!onSubmit && !busy;
  const hint =
    key === "active" ? "火山人像合规审核 · 已通过,可安全用于视频生成"
    : key === "failed" ? `火山人像合规审核 · 未通过${error ? " · " + error : ""}${clickable ? " · 点击重新送审" : ",建议改提示词重新生成"}`
    : key === "processing" ? "火山人像合规审核 · 审核中,通常很快"
    : clickable ? "尚未送审 · 点击立即提交火山人像审核"
    : "尚未送审 · 含人脸的视频素材需过火山人像审核";
  return (
    <span
      className={`review-badge ${meta.cls}${clickable ? " clickable" : ""}`}
      role={clickable ? "button" : undefined}
      tabIndex={clickable ? 0 : undefined}
      title={compact ? hint : undefined}
      onClick={clickable ? (e) => { e.stopPropagation(); onSubmit!(); } : undefined}
      onKeyDown={clickable ? (e) => { if (e.key === "Enter" || e.key === " ") { e.preventDefault(); e.stopPropagation(); onSubmit!(); } } : undefined}
    >
      <span className="rv-shield" aria-hidden="true" />
      <span className="rv-label">{busy ? "提交中…" : meta.label}</span>
      {!compact && <span className="review-pop" role="tooltip">{hint}</span>}
    </span>
  );
}