import type { Metadata } from "next";
import Link from "next/link";
import { LegalLayout, type LegalSection } from "@/components/marketing/legal-layout";

export const metadata: Metadata = {
  title: "Cookie Policy",
  description: "The cookies and browser storage Fetcha uses on fetcha.co and in the dashboard, why each one exists, and how to control them.",
  alternates: { canonical: "/legal/cookies" },
};

const sections: LegalSection[] = [
  {
    id: "overview",
    title: "Overview",
    body: (
      <>
        <p>
          This Cookie Policy explains what cookies and similar browser storage Fetcha, operated from Québec, Canada, uses on <code>fetcha.co</code> (the marketing site, documentation and status pages) and in the dashboard at <code>fetcha.co/dashboard</code>. It complements the <Link href="/legal/privacy">Privacy Policy</Link>, which describes how we handle personal information more generally.
        </p>
        <p>
          The short version: <strong>we use only strictly necessary cookies</strong>. There are no advertising cookies, no third-party analytics, no social-media pixels and no cross-site tracking anywhere on our properties. Because nothing we set requires consent under Québec’s Law 25, PIPEDA or the EU ePrivacy rules, we do not show a cookie banner.
        </p>
      </>
    ),
  },
  {
    id: "what-are-cookies",
    title: "What cookies and similar technologies are",
    body: (
      <>
        <p>A cookie is a small text file that a website asks your browser to store and to send back on later visits. Cookies can be <strong>first-party</strong> (set by the site you are visiting) or <strong>third-party</strong> (set by another domain), and <strong>session</strong> (deleted when you close the browser or after a short inactivity period) or <strong>persistent</strong> (kept until an expiry date). Websites can also store small amounts of data in the browser’s <code>localStorage</code>, which behaves like a persistent cookie but is never sent to the server automatically.</p>
        <p>Fetcha sets only first-party cookies and one first-party <code>localStorage</code> key, all described below.</p>
      </>
    ),
  },
  {
    id: "cookies-we-use",
    title: "Cookies and storage we use",
    body: (
      <>
        <table>
          <thead>
            <tr>
              <th>Name</th>
              <th>Type</th>
              <th>Purpose</th>
              <th>Duration</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td><code>fetcha*</code> (session cookies, e.g. <code>fetcha.session_token</code>)</td>
              <td>Strictly necessary · first-party · HttpOnly, Secure, SameSite=Lax</td>
              <td>Keeps you signed in to the dashboard, identifies your session on the server, and protects forms and server actions against cross-site request forgery. Set only after you sign in.</td>
              <td>Until sign-out, or after a period of inactivity; renewed while you use the dashboard.</td>
            </tr>
            <tr>
              <td><code>fetcha_project</code></td>
              <td>Strictly necessary (preference) · first-party</td>
              <td>Remembers which project you last selected so the dashboard opens on the right project. Contains only a project identifier.</td>
              <td>Up to 1 year.</td>
            </tr>
            <tr>
              <td><code>theme</code> (localStorage)</td>
              <td>Preference · first-party · not sent to server</td>
              <td>Remembers your light, dark or system colour-scheme choice so the page does not flash the wrong theme on load.</td>
              <td>Until you clear browser storage.</td>
            </tr>
          </tbody>
        </table>
        <p>Signed-out visitors to the marketing site, documentation, pricing, changelog and status pages receive no cookies at all, apart from the theme preference if you toggle it.</p>
      </>
    ),
  },
  {
    id: "third-parties",
    title: "Third parties",
    body: (
      <>
        <p>We do not embed third-party scripts that set cookies. Fonts, icons and styles are served from our own domain. We do not use Google Analytics, Meta Pixel, LinkedIn Insight, session-replay tools or advertising networks. Aggregate traffic statistics we may look at are derived from our own server logs and do not rely on cookies.</p>
        <p>When self-serve checkout launches, the payment page may load a script from our payment processor to collect card details securely; that processor may set its own strictly necessary fraud-prevention cookies on its own domain during the payment step. We will update this policy before that happens.</p>
        <p>Links from our documentation to external sites (for example package registries or standards bodies) lead to sites with their own cookie practices, which we do not control.</p>
      </>
    ),
  },
  {
    id: "api-and-sdks",
    title: "The API, the SDKs and target websites",
    body: (
      <>
        <p>Calls to <code>https://www.fetcha.co/v1</code> are authenticated with a Bearer API key in a request header, not with cookies, and the API sets no cookies on your client.</p>
        <p>
          When you use the Fetch API to retrieve a third-party website, that website may set cookies in its response. Fetcha returns those cookies to you in the <code>cookies</code> field of the response and, if you use a sticky session, may replay cookies you send within that session so that multi-step flows work. Those cookies belong to the target website and to your application; Fetcha does not store them beyond the life of the request and the session, and they are redacted from our request logs. How you handle them is governed by your own privacy obligations and the <Link href="/legal/acceptable-use">Acceptable Use Policy</Link>.
        </p>
      </>
    ),
  },
  {
    id: "control",
    title: "How to control cookies",
    body: (
      <>
        <p>You can view, block and delete cookies in your browser settings. Common locations:</p>
        <ul>
          <li><strong>Chrome</strong>: Settings → Privacy and security → Third-party cookies / See all site data and permissions.</li>
          <li><strong>Safari</strong>: Settings → Privacy → Manage Website Data.</li>
          <li><strong>Firefox</strong>: Settings → Privacy &amp; Security → Cookies and Site Data.</li>
          <li><strong>Edge</strong>: Settings → Cookies and site permissions → Manage and delete cookies and site data.</li>
        </ul>
        <p>Because our cookies are strictly necessary, blocking them has consequences: without the <code>fetcha*</code> session cookie you cannot sign in to the dashboard, and without the project and theme preferences the dashboard will fall back to defaults on each visit. The API itself is unaffected by browser cookie settings. Signing out deletes the session cookie; clearing site data for <code>fetcha.co</code> removes everything listed above.</p>
      </>
    ),
  },
  {
    id: "changes",
    title: "Changes and contact",
    body: (
      <>
        <p>If we add a cookie, change a purpose or introduce any technology that requires consent, we will update this page, change the version and effective date at the top, and, where consent is required, ask for it before setting anything. Questions about cookies or browser storage: <a href="mailto:privacy@fetcha.co">privacy@fetcha.co</a>.</p>
      </>
    ),
  },
];

export default function CookiesPage() {
  return <LegalLayout title="Cookie Policy" current="/legal/cookies" summary="Fetcha uses only strictly necessary first-party cookies: a fetcha* session cookie when you sign in, a project preference and a theme preference. No advertising, analytics or third-party tracking, so no banner." sections={sections} />;
}