/* jedai-gallery.jsx — landing grid of tool cards. */

(function () {
  const { TOOLS } = window.JEDAI_DATA;
  const { Icon } = window.JEDAI_ICONS;

  function ToolCard({ tool, onPick }) {
    const isLive = tool.status === "live";
    const tilt = (Math.sin(tool.id.charCodeAt(0) * 13) * 1.6).toFixed(2);
    const style = {
      "--card-color": `var(${tool.colorVar})`,
      "--rot": `${tilt}deg`
    };
    return (
      <button
        type="button"
        className={"tool-card" + (isLive ? "" : " coming-soon")}
        style={style}
        onClick={() => isLive && onPick(tool.id)}
        disabled={!isLive}
      >
        <div className="tape"/>
        <div className="tc-icon">{Icon[tool.icon] ? Icon[tool.icon]() : null}</div>
        <div className="tc-title">{tool.label}</div>
        <div className="tc-desc">{tool.tagline}</div>
        <div className={"tc-tag " + (isLive ? "live" : "soon")}>
          {isLive ? "Live" : "Soon"}
        </div>
      </button>
    );
  }

  function JedaiGallery({ onPick }) {
    return (
      <div className="ws-output" style={{ paddingTop: 4 }}>
        <div className="gallery-intro">
          <div className="gi-mark">{Icon.brand()}</div>
          <p>
            <strong>JEDAI Tools</strong> — Just Educational AI Tools. Pick a tool
            below and an agent pipeline (planner → generator → validator → reviser
            → editor) will build materials to your scope-and-sequence. Every
            artifact is checked by a deterministic validator before you see it.
          </p>
        </div>

        <div className="gallery">
          {TOOLS.map((tool) => (
            <ToolCard key={tool.id} tool={tool} onPick={onPick}/>
          ))}
        </div>

        <div className="disclaimer">
          {Icon.info()}
          <span>
            Outputs are <strong>materials</strong>, not instruction. The validator
            confirms each passage meets your encoded decodability spec — it does
            not certify pedagogical or cultural appropriateness. Always
            teacher-review before classroom use. JEDAI Tools is not a substitute
            for explicit phonics teaching. Generated with permissively-licensed
            models (DeepSeek MIT, Qwen Apache 2.0) so outputs are yours to use,
            adapt, and sell.
          </span>
        </div>
      </div>
    );
  }

  window.JedaiGallery = JedaiGallery;
})();