// AnalysisTrail — reusable render of analysisSteps for a paperId.
//
// Extracted from the inline section that lived in Dossier.jsx (lines 279–381).
// Same render rules; same defensive defaults for evidenceClass on objections
// (cited only when declared "cited" AND ≥1 relatedSourceIds; anything else
// collapses to "editorial" so a false cited badge cannot appear).
//
// Renders nothing when the paper has no public/excerpt steps.
//
// Used by:
//   - components/Dossier.jsx              (public dossier page)
//   - components/AdminAnalysisEditor.jsx  (live preview while drafting — Step 2)
//
// Props:
//   paperId    — the dossier's paper id (string, required).
//   extraSteps — optional array of analysisStep objects to merge with the
//                data.js steps for this paperId. Used by AdminAnalysisEditor
//                for the live preview of an in-flight draft. Steps with the
//                same `id` as an existing one override; others are appended.

const AnalysisTrail = ({ paperId, extraSteps }) => {
  const stepLabel = (typeof window !== "undefined" && window.stepLabel) ? window.stepLabel : (t) => t;
  const visLabel = (typeof window !== "undefined" && window.visLabel) ? window.visLabel : (v) => v;
  const evidenceClassLabel = (typeof window !== "undefined" && window.evidenceClassLabel) ? window.evidenceClassLabel : (c) => c;

  const baseSteps = (AOP_DATA.analysisSteps || []).filter((s) => s.paperId === paperId);
  const extras = (extraSteps || []).filter((s) => s && s.paperId === paperId);
  const byId = new Map();
  for (const s of baseSteps) byId.set(s.id, s);
  for (const s of extras) byId.set(s.id, s);
  const analysisSteps = Array.from(byId.values())
    .filter((s) => s.visibility !== "private")
    .sort((a, b) => a.order - b.order);

  if (analysisSteps.length === 0) return null;

  const questions = AOP_DATA.questions.filter((q) => q.paperId === paperId);
  const sources = AOP_DATA.sources.filter((s) => s.paperId === paperId);

  return (
    <section style={{ marginTop: 40 }}>
      <SectionHead
        num="A"
        title="Analysis trail"
        desc="How the dossier's conclusions were reached. The trail is process; the verdict rests on the cited sources and the editorial review above."
      />

      <div className="callout" style={{ marginTop: 18, marginBottom: 24 }}>
        <h4>The LLM is an analytical aid, not evidence</h4>
        <p style={{ margin: 0, fontFamily: "var(--serif)", fontSize: 14.5, lineHeight: 1.55, color: "var(--ink-2)" }}>
          The LLM conversation is not evidence. It is an analytical aid used to generate questions, identify assumptions, and organize source-based review. The final verdict depends on cited sources and editorial review, not on the LLM's authority.
        </p>
        <p style={{ margin: "8px 0 0", fontFamily: "var(--serif)", fontSize: 14.5, lineHeight: 1.55, color: "var(--ink-2)" }}>
          Editorial challenges do not carry the same evidentiary weight as cited counter-evidence and should not be read as published refutations.
        </p>
      </div>

      {analysisSteps.map((step) => {
        const isObjection = step.stepType === "objection";
        const hasSources = !!(step.relatedSourceIds && step.relatedSourceIds.length);
        const ec = isObjection
          ? (step.evidenceClass === "cited" && hasSources ? "cited" : "editorial")
          : null;
        const citedObjection = isObjection && ec === "cited";
        const editorialObjection = isObjection && ec === "editorial";

        const loadBearing = step.stepType === "source_check" || step.stepType === "editorial_decision" || citedObjection;
        const processy = step.stepType === "prompt" || step.stepType === "llm_response" || editorialObjection;
        const isExcerpt = step.visibility === "excerpt_only";
        const body = isExcerpt
          ? (step.excerpt || ((step.content || "").slice(0, 220) + (step.content && step.content.length > 220 ? "…" : "")))
          : step.content;
        const wrapClass = loadBearing ? "callout" : "";
        const wrapStyle = loadBearing
          ? { marginTop: 18 }
          : editorialObjection
            ? { marginTop: 18, padding: "16px 18px", border: "1px dashed var(--rule)", borderLeft: "3px dashed var(--conf-low)", background: "var(--paper-2)" }
            : { padding: "22px 0", borderTop: "1px solid var(--rule)" };

        return (
          <div key={step.id} className={wrapClass} style={wrapStyle}>
            <div style={{ display: "flex", gap: 12, alignItems: "baseline", flexWrap: "wrap", marginBottom: 8 }}>
              <span className="meta" style={{ color: "var(--ink-3)" }}>№ {String(step.order).padStart(2, "0")}</span>
              <span className="label" style={{ color: "var(--ink-2)" }}>{stepLabel(step.stepType)}</span>
              <span className="meta" style={{ color: "var(--ink-3)" }}>· {visLabel(step.visibility)}</span>
              {citedObjection && (
                <span className="meta" style={{ color: "var(--accent)" }}>· {evidenceClassLabel("cited")}</span>
              )}
              {editorialObjection && (
                <span className="meta" style={{ color: "var(--conf-low)" }}>· {evidenceClassLabel("editorial")} — not citable</span>
              )}
            </div>
            <h3 style={{ fontFamily: "var(--serif)", fontSize: 19, fontWeight: 500, lineHeight: 1.32, margin: "0 0 10px", maxWidth: 720 }}>
              {step.title}
            </h3>
            {body && (
              <p style={{
                fontFamily: "var(--serif)",
                fontSize: 15.5,
                lineHeight: 1.65,
                color: loadBearing ? "var(--ink)" : "var(--ink-2)",
                margin: 0,
                maxWidth: 720,
                fontStyle: processy ? "italic" : "normal",
              }}>
                {body}
              </p>
            )}
            {isExcerpt && (
              <div className="meta" style={{ color: "var(--ink-3)", marginTop: 10, fontStyle: "italic" }}>
                [Full step withheld — visible to admin only.]
              </div>
            )}
            {((step.relatedQuestionIds && step.relatedQuestionIds.length) || (step.relatedSourceIds && step.relatedSourceIds.length)) ? (
              <div style={{ display: "flex", gap: 10, flexWrap: "wrap", marginTop: 14, alignItems: "center" }}>
                {step.relatedQuestionIds && step.relatedQuestionIds.map((qid) => {
                  const ref = questions.find((q) => q.id === qid);
                  if (!ref) return null;
                  return <span key={qid} className="tag">№ {ref.n} · {qid}</span>;
                })}
                {step.relatedSourceIds && step.relatedSourceIds.map((sid) => {
                  const ref = sources.find((s) => s.n === sid);
                  if (!ref) return null;
                  return (
                    <a
                      key={sid}
                      href={`#${sid}`}
                      className="meta"
                      title={`Jump to source ${sid}`}
                      style={{ color: "var(--accent)", textDecoration: "none", border: 0 }}
                    >[{sid}]</a>
                  );
                })}
              </div>
            ) : null}
          </div>
        );
      })}
    </section>
  );
};

window.AnalysisTrail = AnalysisTrail;
