/* global React, ReactDOM, Nav, ArchiveHeader, CardGrid, Signup, Footer, useResearch */
/* Standalone full-listing page for Research or Media.
   The host HTML sets window.ARCHIVE_KIND = 'research' | 'media'. */
const HOME = 'index.html';

const KIND = window.ARCHIVE_KIND === 'media' ? 'media' : 'research';
const C = window.SITE_CONTENT || { posts: [], media: [] };

const CONFIG = {
  research: {
    kicker: 'Publications · 1971 Capital',
    title: 'Research',
    lede: null,
    items: C.posts || [],
  },
  media: {
    kicker: 'Appearances · 1971 Capital',
    title: 'Media',
    lede: null,
    items: C.media || [],
  },
};

function ArchiveApp() {
  const cfg = CONFIG[KIND];
  // Research pulls live from the Substack feed; Media stays curated in content.js.
  const liveResearch = useResearch();
  const items = KIND === 'research' ? liveResearch : cfg.items;
  return (
    <div className="site">
      <Nav base={HOME} />
      <ArchiveHeader kicker={cfg.kicker} title={cfg.title} lede={cfg.lede} />
      <section className="collection archive-collection">
        <div className="wrap">
          <CardGrid items={items} kind={KIND} />
          <div className="more-row">
            <a className="more-link mono" href={HOME}>
              <span className="arw" style={{ transform: 'scaleX(-1)' }}>→</span> Back to home
            </a>
          </div>
        </div>
      </section>
      <Signup />
      <Footer base={HOME} />
    </div>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<ArchiveApp />);