import type { Metadata } from 'next'
import { getTranslations } from 'next-intl/server'
import { Link } from '@/i18n/navigation'
import { CookieConsentButtons, ConsentStatus } from '@/components/CookieConsent'

export async function generateMetadata({ params }: { params: Promise<{ locale: string }> }): Promise<Metadata> {
  const { locale } = await params
  const t = await getTranslations({ locale, namespace: 'Legal' })
  return { title: t('cookies.title') }
}

export default async function CookiesPage() {
  const t = await getTranslations('Legal')
  return (
    <div className="main-page">
      <div className="middle-content">
        <div className="body-content">
          <div className="title-content">
            <h1>{t('cookies.title')}</h1>
          </div>
          <div className="box-content">
            <div className="body-box-content justified">
              <p>{t('cookies.p1')}</p>
              <br />
              <p>{t('cookies.p2')}</p>
              <p>{t('cookies.p3')}</p>
              <br />
              <p>{t('cookies.p4')}</p>
              <p>{t('cookies.p5')}</p>
              <br />
              <p>{t.rich('cookies.p6', { link: (c) => <Link href="/privacy-policy">{c}</Link> })}</p>
              <br />
              <hr />
              <br />
              <span>{t('cookies.h1cat')}</span>
              <br />
              <span className="second-brown">{t('cookies.necessaryTitle')}</span>
              <p>{t('cookies.necessaryDesc')}</p>

              <table className="ns-cookie-table">
                <thead>
                  <tr>
                    <th>{t('cookies.thCookie')}</th>
                    <th>{t('cookies.thProvider')}</th>
                    <th>{t('cookies.thPurpose')}</th>
                    <th>{t('cookies.thDuration')}</th>
                  </tr>
                </thead>
                {/* Las 3 cookies REALES de la web. Se comprobaron en un navegador
                    contra el sitio en producción: no hay ninguna más. */}
                <tbody>
                  <tr><td>NEXT_LOCALE</td><td>NightSpire</td><td>{t('cookies.nPurpose1')}</td><td>{t('cookies.durSession')}</td></tr>
                  <tr><td>ns_cookie_consent</td><td>NightSpire</td><td>{t('cookies.nPurpose2')}</td><td>{t('cookies.dur1Year')}</td></tr>
                  <tr><td>nightspire_session</td><td>NightSpire</td><td>{t('cookies.nPurpose3')}</td><td>{t('cookies.durSession')}</td></tr>
                </tbody>
              </table>

              <p className="third-brown">{t.rich('cookies.cfNote', { link: (c) => <a href="https://www.cloudflare.com/cookie-policy/" target="_blank" rel="noopener">{c}</a> })}</p>
              <br />
              <span className="second-brown">{t('cookies.noneTitle')}</span>
              <p>{t('cookies.noneDesc')}</p>

              <br />
              <span className="second-brown">{t('cookies.embeddedTitle')}</span>
              <p>{t('cookies.embeddedDesc')}</p>

              <table className="ns-cookie-table">
                <thead>
                  <tr>
                    <th>{t('cookies.thProvider')}</th>
                    <th>{t('cookies.thContentType')}</th>
                    <th>{t('cookies.thMoreInfo')}</th>
                  </tr>
                </thead>
                {/* Terceros que carga la web de verdad, medidos en el navegador. */}
                <tbody>
                  <tr><td>Cloudflare Turnstile</td><td>{t('cookies.embType1')}</td><td><a href="https://www.cloudflare.com/cookie-policy/" target="_blank" rel="noopener">{t('cookies.privacyPolicyLink')}</a></td></tr>
                  <tr><td>Wowhead (zamimg.com)</td><td>{t('cookies.embType2')}</td><td><a href="https://www.wowhead.com/privacy-policy" target="_blank" rel="noopener">{t('cookies.privacyPolicyLink')}</a></td></tr>
                  <tr><td>cdnjs (Cloudflare)</td><td>{t('cookies.embType3')}</td><td><a href="https://www.cloudflare.com/privacypolicy/" target="_blank" rel="noopener">{t('cookies.privacyPolicyLink')}</a></td></tr>
                  <tr><td>YouTube (Google)</td><td>{t('cookies.embType4')}</td><td><a href="https://policies.google.com/privacy" target="_blank" rel="noopener">{t('cookies.privacyPolicyLink')}</a></td></tr>
                </tbody>
              </table>

              <p className="third-brown">{t('cookies.embeddedNote')}</p>

              <br />
              <hr />
              <br />
              <span>{t('cookies.h2cat')}</span>
              <p>{t('cookies.deleteP')}</p>
              <ul>
                <li>{t('cookies.deleteLi1')}</li>
                <li>{t('cookies.deleteLi2')}</li>
                <li>{t('cookies.deleteLi3')}</li>
                <li>{t('cookies.deleteLi4')}</li>
              </ul>
              <br />
              <hr />
              <br />
              <span>{t('cookies.h3cat')}</span>
              <p>{t('cookies.consentP')}</p>

              <ConsentStatus />
              <CookieConsentButtons />
              <br />
              <hr />
              <br />
              <span>{t('cookies.h4cat')}</span>
              <p>{t.rich('cookies.moreInfoP', { link: (c) => <Link href="/contact-us">{c}</Link> })}</p>
              <br />
              <p className="grey-info2">{t('cookies.updated')}</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  )
}