// Trove — static info pages: About, Contact, and the legal notices (Privacy, Cookies, Terms).
// One component, driven by the `page` prop, so they share a consistent layout.

function InfoPage({ page, onNavigate, onOpenWiki, onOpenTools, presale }) {
  const content = INFO_PAGES[page];
  if (!content) return null;

  return (
    <main style={{ maxWidth: 780, margin: '0 auto', padding: '56px 24px 90px' }}>
      <div className="t-micro" style={{ color: 'var(--gold-deep)', marginBottom: 12 }}>{content.kicker}</div>
      <h1 style={{ fontFamily: 'var(--font-serif)', fontWeight: 500, fontSize: 'clamp(32px, 4.4vw, 46px)', letterSpacing: '-.02em', lineHeight: 1.1, margin: '0 0 18px' }}>
        {content.title}
      </h1>
      {content.lead && (
        <p style={{ fontSize: 18, color: 'var(--fg-muted)', lineHeight: 1.55, margin: '0 0 8px', maxWidth: 620, textWrap: 'pretty' }}>{content.lead}</p>
      )}

      {content.render ? content.render({ onNavigate, onOpenWiki, onOpenTools, presale }) : (
        <div style={{ marginTop: 28, display: 'flex', flexDirection: 'column', gap: 26 }}>
          {content.sections.map((s, i) => (
            <section key={i}>
              {s.h && <h2 style={{ fontFamily: 'var(--font-serif)', fontWeight: 500, fontSize: 22, letterSpacing: '-.01em', margin: '0 0 10px' }}>{s.h}</h2>}
              {s.body && <p style={{ fontSize: 15.5, lineHeight: 1.65, color: 'var(--fg)', margin: '0 0 10px', textWrap: 'pretty' }}>{s.body}</p>}
              {s.list && (
                <ul style={{ margin: '4px 0 0', paddingLeft: 20, display: 'flex', flexDirection: 'column', gap: 8 }}>
                  {s.list.map((li, j) => <li key={j} style={{ fontSize: 15.5, lineHeight: 1.6, color: 'var(--fg)' }}>{li}</li>)}
                </ul>
              )}
            </section>
          ))}
        </div>
      )}

      {content.updated && (
        <p style={{ fontSize: 13, color: 'var(--fg-subtle)', marginTop: 36, paddingTop: 18, borderTop: '1px solid var(--border)' }}>
          Last updated: {content.updated}. Questions about this? Email <a href="mailto:hello@trove.education" style={{ color: 'var(--gold-deep)' }}>hello@trove.education</a>.
        </p>
      )}
    </main>
  );
}

const INFO_PAGES = {
  about: {
    kicker: 'About Trove',
    title: 'Teaching resources worth keeping.',
    lead: 'Trove is a small, growing library of primary teaching resources for UK schools, built by teachers and checked by teachers.',
    sections: [
      { h: 'Why we started', body: 'Planning takes long enough without trawling through pages of near-misses. We wanted a place where every resource is worth downloading: clear, curriculum-aligned, and ready to use on Monday morning. So we are building one, one carefully made resource at a time.' },
      { h: 'Made by teachers', body: 'Everything is written and checked by people who have taught in UK primary classrooms. We use AI tools to help us work faster, but a teacher shapes, checks and signs off every resource before it goes near a pupil. Quality over quantity, always.' },
      { h: 'Mapped to the curriculum', body: 'Resources are tied to the England National Curriculum by subject, year group and objective, so you can see exactly what a resource covers and where it fits in your planning.' },
      { h: 'Free for everyone', body: 'Our interactive classroom tools, the Wiki and the School Calendar are free to use, with no account needed. They are our way of being useful to teachers whether or not you ever buy a thing.' },
    ],
    updated: '3 July 2026',
  },

  contact: {
    kicker: 'Contact',
    title: 'Get in touch.',
    lead: 'We are a small team and we read everything. Whether it is a question, a bug, or a resource you wish existed, we would love to hear from you.',
    render: ({ onOpenWiki }) => (
      <div style={{ marginTop: 30, display: 'flex', flexDirection: 'column', gap: 14 }}>
        {[
          { label: 'General enquiries', email: 'hello@trove.education', note: 'Questions about Trove, feedback, or just to say hello.' },
          { label: 'Support', email: 'admin@trove.education', note: 'Something not working, or a problem with a resource.' },
        ].map(c => (
          <a key={c.email} href={`mailto:${c.email}`} className="card"
            style={{ display: 'block', padding: '18px 20px', textDecoration: 'none', background: 'var(--surface)' }}>
            <div className="t-micro" style={{ color: 'var(--fg-subtle)', marginBottom: 6 }}>{c.label}</div>
            <div style={{ fontSize: 17, fontWeight: 700, color: 'var(--gold-deep)', marginBottom: 4 }}>{c.email}</div>
            <div style={{ fontSize: 14, color: 'var(--fg-muted)', lineHeight: 1.5 }}>{c.note}</div>
          </a>
        ))}
        <p style={{ fontSize: 14.5, color: 'var(--fg-muted)', lineHeight: 1.6, marginTop: 8 }}>
          Looking for a quick answer? The <button onClick={onOpenWiki} style={{ background: 'none', border: 0, padding: 0, cursor: 'pointer', color: 'var(--gold-deep)', fontWeight: 600, fontSize: 'inherit' }}>Wiki</button> covers a lot of common classroom questions.
        </p>
      </div>
    ),
  },

  privacy: {
    kicker: 'Legal',
    title: 'Privacy notice',
    lead: 'This notice explains what personal data Trove collects and how we use it. It is written to be readable, not to bury the point.',
    sections: [
      { h: 'Who we are', body: 'Trove is a small UK-based project making teaching resources and free tools for primary schools. If you have any questions about your data, email hello@trove.education.' },
      { h: 'What we collect', list: [
        'The free tools (Wiki, Tools and School Calendar) work without an account. Some settings, such as your light or dark theme, are saved in your own browser (local storage) on your device. That data stays with you and is not sent to us.',
        'If you contact us by email, we keep your message and email address so we can reply.',
        'We use Vercel Web Analytics to count page views. It is cookieless and does not store your IP address, so it cannot identify you.',
        'When accounts and purchases go live, we will collect the details needed to run them (such as your name, email and order history). This notice will be updated before that happens.',
      ] },
      { h: 'How we use it', body: 'To provide and improve the service, to respond to you, and to meet our legal obligations. We do not sell your personal data.' },
      { h: 'Your rights', body: 'Under UK GDPR you can ask to see the data we hold about you, ask us to correct or delete it, and object to certain uses. Email us and we will help. You can also complain to the Information Commissioner\'s Office (ICO).' },
    ],
    updated: '3 July 2026',
  },

  cookies: {
    kicker: 'Legal',
    title: 'Cookies & local storage',
    lead: 'Trove keeps its use of cookies and similar technologies to a minimum. Here is the full picture.',
    sections: [
      { h: 'What we use', body: 'The site uses your browser\'s local storage to remember your settings, such as whether you prefer the light or dark theme. This information stays on your device and is not used to track you across other websites.' },
      { h: 'Analytics', body: 'We use Vercel Web Analytics to count page views and see which pages are useful. It does not use cookies, does not store your IP address and cannot follow you to other websites, so there is nothing here for you to accept or refuse.' },
      { h: 'What we do not do', body: 'We do not use advertising cookies or third-party tracking pixels, and we do not sell any data about your visit.' },
      { h: 'Managing it', body: 'You can clear this data at any time through your browser settings. Clearing it will reset your saved theme on that device.' },
    ],
    updated: '3 July 2026',
  },

  terms: {
    kicker: 'Legal',
    title: 'Terms of use',
    lead: 'These terms cover how you may use the Trove website and its free tools. Terms for buying resources will be added before the library goes on sale.',
    sections: [
      { h: 'Using the site', body: 'You are welcome to use the free Wiki, Tools and School Calendar for your own teaching and planning. Please do not misuse the site or try to disrupt it for others.' },
      { h: 'Our content', body: 'The resources, articles and tools on Trove are our intellectual property or used with permission. You may use them in your own classroom, but please do not resell or redistribute them as your own.' },
      { h: 'No guarantees', body: 'We work hard to keep everything accurate and curriculum-aligned, but we provide the free tools "as is". Term dates and similar information are a guide and can vary by school and local authority. Always check against your own school\'s arrangements.' },
      { h: 'Changes', body: 'We may update these terms as Trove grows, particularly when paid resources and accounts launch. We will post the current version here.' },
    ],
    updated: '3 July 2026',
  },
};

window.InfoPage = InfoPage;