---
import {
  aiLabApiExamples,
  aiLabDetailedSources,
  aiLabExamples,
  aiLabHero,
  aiLabInfraNotes,
  aiLabMetrics,
  aiLabVisuals,
  aiLabWorkflow,
} from "../data/ai-lab";
import { ventureDesk } from "../data/profile";
import BaseLayout from "../layouts/BaseLayout.astro";

const [gilliganTech, blueNoteLogic] = ventureDesk;
---

<BaseLayout
  title="AI Lab | Dave Gilligan"
  description="A fully developed AI Lab issue covering CorpusAI, live use cases, European infrastructure, API examples, and Blue Note Logic implementation work."
>
  <main class="ai-lab-page">
    <section class="container ai-lab-hero">
      <div class="ai-lab-hero__copy">
        <span class="eyebrow">{aiLabHero.eyebrow}</span>
        <h1>{aiLabHero.title}</h1>
        <p class="ai-lab-hero__lede">{aiLabHero.lede}</p>

        <div class="ai-lab-hero__actions">
          <a class="button button--dark" href="https://ai.bluenotelogic.com/" target="_blank" rel="noreferrer">
            Visit CorpusAI
          </a>
          <a class="button button--soft" href="#api-examples">See API examples</a>
        </div>
      </div>

      <aside class="ai-lab-hero__visual">
        <figure class="panel ai-lab-poster">
          <img src={aiLabVisuals.hero} alt="Custom editorial illustration for the AI Lab hero." />
        </figure>
        <article class="panel ai-lab-credit">
          <div class="capsule__kicker">
            <span>Source posture</span>
            <span>Blue Note Logic Inc</span>
          </div>
          <p>{aiLabHero.note}</p>
          <p>
            <strong>{blueNoteLogic.name}</strong>: {blueNoteLogic.summary}
          </p>
          <p>
            <strong>{gilliganTech.name}</strong>: {gilliganTech.summary}
          </p>
        </article>
      </aside>
    </section>

    <section class="container ai-lab-metrics">
      {aiLabMetrics.map((metric) => (
        <article class="ai-lab-metric">
          <strong>{metric.value}</strong>
          <span>{metric.label}</span>
          <p>{metric.detail}</p>
        </article>
      ))}
    </section>

    <section class="container ai-lab-split">
      <article class="panel ai-lab-story">
        <div class="capsule__kicker">
          <span>Live demo</span>
          <span>Do Better Norge corpus</span>
        </div>
        <h2>The public demo is already a serious corpus.</h2>
        <p>
          The official CorpusAI site does not hide behind a toy example. It says the live demo runs
          on a Norwegian legal intelligence corpus built for Do Better Norge, with more than 1,100
          documents spanning family law, ECHR case law, child welfare, and data privacy.
        </p>
        <p>
          It also advertises a free Norwegian Family Law corpus with 4,754 documents, including 773
          court decisions, plus Barneloven, Barnevernsloven, Supreme Court material, and ECHR case
          law. That gives the AI Lab page something better than buzzwords: a demonstrable stack.
        </p>
      </article>

      <figure class="panel ai-lab-diagram">
        <img src={aiLabVisuals.corpus} alt="Custom editorial illustration showing multiple corpora flowing into one query layer." />
      </figure>
    </section>

    <section class="container ai-lab-usecases">
      <div class="section-header">
        <div class="section-header__title">Detailed Examples</div>
        <div class="section-header__meta">
          These are paraphrased from the official CorpusAI use-case examples. The point is not
          generic “AI for everyone,” but specific document-heavy work that benefits from citations.
        </div>
      </div>

      <div class="ai-lab-usecases__grid">
        {aiLabExamples.map((example) => (
          <article class="panel ai-lab-case">
            <span>{example.industry}</span>
            <h3>{example.title}</h3>
            <p class="ai-lab-case__prompt">{example.prompt}</p>
            <p>{example.outcome}</p>
          </article>
        ))}
      </div>
    </section>

    <section class="container ai-lab-workbench">
      <div class="section-header">
        <div class="section-header__title">How It Actually Gets Built</div>
        <div class="section-header__meta">
          The official pitch combines software and service: discovery, corpus building, workflow
          integration, and team training.
        </div>
      </div>

      <div class="ai-lab-workbench__grid">
        {aiLabWorkflow.map((item) => (
          <article class="ai-lab-step">
            <span>{item.step}</span>
            <strong>{item.title}</strong>
            <p>{item.summary}</p>
          </article>
        ))}
      </div>
    </section>

    <section class="container ai-lab-infra">
      <article class="panel ai-lab-infra__lead">
        <div class="capsule__kicker">
          <span>Infrastructure</span>
          <span>EEA by design</span>
        </div>
        <h2>European compute, source-grounded systems, and a hard line on data export.</h2>
        <p>
          The infrastructure section on the official site is unusually specific: three dedicated
          cloud servers, Hetzner locations in Helsinki and Nuremberg, RTX PRO 6000 Blackwell GPUs,
          96GB VRAM, encrypted inter-node traffic, and an explicit “zero data export” posture.
        </p>
        <ul class="ai-lab-infra__list">
          {aiLabInfraNotes.map((note) => <li>{note}</li>)}
        </ul>
      </article>

      <figure class="panel ai-lab-infra__visual">
        <img src={aiLabVisuals.api} alt="Custom editorial illustration showing API, search, and infrastructure flow." />
      </figure>
    </section>

    <section id="api-examples" class="container ai-lab-api">
      <div class="section-header">
        <div class="section-header__title">Developer Desk</div>
        <div class="section-header__meta">
          These examples are adapted from the public CorpusAI REST API examples shown on the official site.
        </div>
      </div>

      <div class="ai-lab-api__grid">
        {aiLabApiExamples.map((example) => (
          <article class="panel ai-lab-code">
            <div class="capsule__kicker">
              <span>{example.title}</span>
              <span>{example.endpoint}</span>
            </div>
            <div class="ai-lab-code__block">
              <p>Request</p>
              <pre><code>{example.request}</code></pre>
            </div>
            <div class="ai-lab-code__block">
              <p>Response</p>
              <pre><code>{example.response}</code></pre>
            </div>
          </article>
        ))}
      </div>
    </section>

    <section class="container source-block">
      <div class="section-header">
        <div class="section-header__title">Source Credits</div>
        <div class="section-header__meta">
          Everything on this page is editorialized, but the examples, infrastructure claims, and API
          framing are credited to the official Blue Note Logic properties below.
        </div>
      </div>

      <div class="source-list">
        {aiLabDetailedSources.map((source) => (
          <article>
            <a href={source.href} target="_blank" rel="noreferrer">{source.label}</a>
            <p>{source.note}</p>
          </article>
        ))}
      </div>
    </section>
  </main>
</BaseLayout>
