84 lines
3.2 KiB
TypeScript
84 lines
3.2 KiB
TypeScript
import type { Metadata } from 'next'
|
|
import { Navigation } from '@/components/navigation'
|
|
import { Footer } from '@/components/footer'
|
|
import { RichText } from '@/components/rich-text'
|
|
import { METHODS, frappeCall } from '@/lib/lukenya-api'
|
|
import { formatEventDate } from '@/lib/event-types'
|
|
|
|
export const revalidate = 60
|
|
|
|
export const metadata: Metadata = {
|
|
title: 'Terms and Privacy | 10 Million Trees Marathon',
|
|
description: 'Participation terms, indemnity, privacy notice and consent documents for the Lukenya University Marathon.',
|
|
}
|
|
|
|
interface LegalDoc {
|
|
name: string
|
|
document_type: string
|
|
slug: string
|
|
version: string
|
|
title: string
|
|
summary: string | null
|
|
body: string
|
|
effective_from: string | null
|
|
required: boolean
|
|
applies_to: string
|
|
}
|
|
|
|
async function documents(): Promise<LegalDoc[]> {
|
|
try {
|
|
return (await frappeCall<LegalDoc[]>(METHODS.legalDocuments, { revalidate: 60 })) || []
|
|
} catch {
|
|
return []
|
|
}
|
|
}
|
|
|
|
export default async function LegalPage() {
|
|
const docs = await documents()
|
|
return (
|
|
<div className="min-h-screen bg-white">
|
|
<Navigation />
|
|
<section className="bg-[#006838] pt-32 pb-14 px-4">
|
|
<div className="max-w-3xl mx-auto text-center">
|
|
<h1 className="text-3xl md:text-4xl font-extrabold text-white mb-3">Terms, Privacy and Consent</h1>
|
|
<p className="text-white/80">The documents every runner agrees to when they enter. Each shows its version and when it took effect.</p>
|
|
</div>
|
|
</section>
|
|
<section className="py-12 px-4">
|
|
<div className="max-w-3xl mx-auto">
|
|
{docs.length === 0 ? (
|
|
<p className="text-[#6b7280]">The documents couldn't be loaded just now. Please try again shortly.</p>
|
|
) : (
|
|
<>
|
|
<nav aria-label="Documents" className="mb-10">
|
|
<ul className="flex flex-wrap gap-2">
|
|
{docs.map((d) => (
|
|
<li key={d.slug}>
|
|
<a href={`#${d.slug}`} className="inline-block rounded-full border border-[#006838] px-4 py-1.5 text-sm font-semibold text-[#006838] hover:bg-[#006838] hover:text-white">
|
|
{d.title}
|
|
</a>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</nav>
|
|
{docs.map((d) => (
|
|
<article key={d.slug} id={d.slug} className="scroll-mt-28 border-t border-[#e5e7eb] py-10">
|
|
<h2 className="text-2xl font-bold text-[#111518]">{d.title}</h2>
|
|
<p className="mt-1 mb-5 text-sm text-[#6b7280]">
|
|
Version {d.version}
|
|
{d.effective_from ? ` · effective ${formatEventDate(d.effective_from.slice(0, 10))}` : ''}
|
|
{d.required ? '' : ' · optional'}
|
|
{d.applies_to === 'Under 18 only' ? ' · for runners under 18' : ''}
|
|
</p>
|
|
<RichText html={d.body} className="prose-legal space-y-4 text-[15px] leading-relaxed text-[#374151] [&_a]:text-[#006838] [&_a]:underline [&_ul]:list-disc [&_ul]:pl-6 [&_ol]:list-decimal [&_ol]:pl-6" />
|
|
</article>
|
|
))}
|
|
</>
|
|
)}
|
|
</div>
|
|
</section>
|
|
<Footer />
|
|
</div>
|
|
)
|
|
}
|