// DEMIURGE — RESEARCH INDEX (/research)
// Add real entries to RESEARCH to publish them — no page rewrite needed.
// Schema: { slug, title, type, summary, date, author, url, status }
// Types: 'article' | 'note' | 'architecture' | 'experiment' | 'case-study' | 'evaluation'
// Leave RESEARCH empty until genuine publications exist. Do not fabricate.
const RESEARCH = [];

const TYPE_LABEL = {
  article: 'Article', note: 'Technical note', architecture: 'Architecture',
  experiment: 'Experiment', 'case-study': 'Case study', evaluation: 'Evaluation'
};

const ResearchIndex = () => {
  const published = RESEARCH.filter(r => r.status !== 'draft');
  return (
    <React.Fragment>
      <a href="#main" className="lp-skip">Skip to content</a>
      <div className="lp-starfield" aria-hidden="true"></div>
      <div className="lp-vignette" aria-hidden="true"></div>
      <SiteNav/>
      <main id="main" className="page-wrap">
        <section className="page-hero">
          <div className="lp">
            <div className="lp-eyebrow">/ Research</div>
            <h1 className="page-h1">Research &amp; technical notes</h1>
            <p className="page-lede">
              Architecture papers, evaluations, experiments, and field notes from building operator systems
              that carry real work. We publish here only what we have actually done and can stand behind.
            </p>
          </div>
        </section>
        <section className="page-body">
          <div className="lp">
            {published.length === 0 ? (
              <div className="empty-state">
                <div className="es-icon" aria-hidden="true"></div>
                <h2 style={{fontFamily: 'Instrument Serif', fontStyle: 'italic', fontWeight: 400, color: '#f5f1e6', fontSize: 26, margin: '0 0 10px'}}>
                  Research publications are being prepared
                </h2>
                <p style={{maxWidth: 520, margin: '0 auto', lineHeight: 1.6}}>
                  We are documenting our operator architectures and evaluations for publication. Rather than
                  post filler, we are waiting until each note is real and reviewable. Want to be told when the
                  first ones land?
                </p>
                <div style={{marginTop: 22, display: 'flex', gap: 12, justifyContent: 'center', flexWrap: 'wrap'}}>
                  <a href="/contact?intent=other&source=research" className="lp-btn primary">Notify me</a>
                  <a href="/manifesto" className="lp-btn">Read the manifesto</a>
                </div>
              </div>
            ) : (
              <div className="card-grid">
                {published.map(r => {
                  const Wrapper = r.url ? 'a' : 'div';
                  return (
                    <Wrapper key={r.slug} {...(r.url ? { href: r.url } : {})} className="card" style={{textDecoration: 'none'}}>
                      <div className="k">{TYPE_LABEL[r.type] || 'Research'}{r.date ? ` · ${r.date}` : ''}</div>
                      <h3>{r.title}</h3>
                      <p>{r.summary}</p>
                      {r.author ? <div style={{fontFamily: 'Geist Mono', fontSize: 11, color: '#4a4f6b'}}>{r.author}</div> : null}
                    </Wrapper>
                  );
                })}
              </div>
            )}
          </div>
        </section>
      </main>
      <SiteFooter/>
    </React.Fragment>
  );
};
ReactDOM.createRoot(document.getElementById('root')).render(<ResearchIndex/>);
