/* eslint-disable */
// #decisions, the register. Every open call in one place, with links to where it bites.

const SUPERSEDED = [
  { route: "home-v1", name: "Home (previous)", note: "Three pillars, accelerator strip, sticker-board hero. Replaced by the two-door router.", dec: "D17" },
  { route: "services", name: "Services overview", note: "The two doors are the router now.", dec: "D01" },
  { route: "blueprint", name: "AI Blueprint", note: "Becomes the Value pillar, an FAQ answer and the first white paper.", dec: "D04" },
  { route: "ai-setup", name: "AI Setup", note: "Absorbed into Value as the tool decision.", dec: "D03" },
  { route: "foundations", name: "Foundations (pillar overview)", note: "Replaced by AI Foundations.", dec: "D03" },
  { route: "literacy", name: "AI Literacy", note: "Proposed to survive as a depth page behind the Literacy pillar.", dec: "D02" },
  { route: "governance", name: "AI Governance", note: "Proposed to survive as a depth page behind the Controls pillar.", dec: "D02" },
  { route: "build", name: "Build", note: "Collapsed into AI Accelerators.", dec: "D05" },
  { route: "quick-wins", name: "Fixed-Scope Builds", note: "Collapsed into AI Accelerators.", dec: "D05" },
  { route: "custom-builds", name: "Custom Builds", note: "Collapsed into AI Accelerators.", dec: "D05" },
  { route: "how-we-work-v1", name: "How we work (previous)", note: "Kept for comparison against the four-step journey.", dec: "D08" },
  { route: "work-v1", name: "Case studies (previous)", note: "Single content type, accelerator and pillar filters. Replaced by Our Work.", dec: "D19" },
  { route: "contact-v1", name: "Contact (previous)", note: "Blueprint scoping-call framing, blue why-book band, pricing FAQ. Replaced by the conversation-shaped page.", dec: "D18" },
  { route: "about-v1", name: "About (previous)", note: "Partnering block, long founder story, expandable bios. Replaced by the short About.", dec: "D15" },
  { route: "about-pmv", name: "Purpose, Mission and Values", note: "Values move to How we work, purpose and mission to About.", dec: "D08" },
];

function DecisionsScreen({ go }) {
  const groups = {};
  DECISIONS.forEach((d) => { (groups[d.where] = groups[d.where] || []).push(d); });
  return (
    <div data-screen-label="00 Decisions">
      <section className="hero" style={{ paddingTop: 72, paddingBottom: 40 }}>
        <div className="container">
          <Eyebrow>Rebuild working page</Eyebrow>
          <h1 className="h-display" style={{ maxWidth: "18ch" }}>Nineteen <em>decisions</em> to walk through.</h1>
          <p className="lede" style={{ maxWidth: "62ch" }}>
            Merging the content brief into the build raises a set of calls only you can make. Each one is
            flagged in amber on the page where it bites, and listed here. Nothing is deleted yet: every
            superseded page is still reachable at the foot of this page, so you can compare before we cut.
          </p>
          <div className="cta-row">
            <Button variant="primary" size="lg" onClick={() => go("home")}>Start at the new Home <Icon name="arrow-right" size={16} className="arrow" /></Button>
            <Button variant="secondary" size="lg" onClick={() => go("ai-foundations")}>AI Foundations</Button>
            <Button variant="secondary" size="lg" onClick={() => go("accelerators")}>AI Accelerators</Button>
          </div>
        </div>
      </section>

      <section className="section section--paper" style={{ paddingTop: 40, paddingBottom: 56 }}>
        <div className="container">
          {Object.keys(groups).map((where) => (
            <div key={where} style={{ marginBottom: 40 }}>
              <div className="dec-group-head">
                <span className="dec-group-name">{where}</span>
                <span className="dec-group-count">{groups[where].length}</span>
              </div>
              <div className="dec-stack">
                {groups[where].map((d) => <Decision key={d.id} id={d.id} compact />)}
              </div>
            </div>
          ))}
        </div>
      </section>

      <section className="section section--white" style={{ paddingTop: 56, paddingBottom: 88 }}>
        <div className="container">
          <div className="section-head">
            <Eyebrow>Still on the site</Eyebrow>
            <h2 className="h-section">Superseded pages, kept until you say otherwise.</h2>
            <p className="lede">
              These are out of the navigation but still live at their old routes. Once a decision lands, the
              page either comes back into the structure or gets deleted with a redirect noted for the migration.
            </p>
          </div>
          <div className="sup-list">
            {SUPERSEDED.map((s) => (
              <button key={s.route} className="sup-row" onClick={() => go(s.route)}>
                <span className="sup-name">{s.name}</span>
                <span className="sup-note">{s.note}</span>
                <span className="sup-dec">{s.dec}</span>
                <Icon name="arrow-right" size={15} className="arrow" />
              </button>
            ))}
          </div>
        </div>
      </section>
    </div>
  );
}

window.DecisionsScreen = DecisionsScreen;
window.SUPERSEDED = SUPERSEDED;