crabfit/frontend/src/app/[id]/page.tsx
2023-06-09 02:59:42 +10:00

56 lines
2 KiB
TypeScript

import { Trans } from 'react-i18next/TransWithoutContext'
import { Metadata } from 'next'
import { notFound } from 'next/navigation'
import { Temporal } from '@js-temporal/polyfill'
import Content from '/src/components/Content/Content'
import Copyable from '/src/components/Copyable/Copyable'
import { getEvent, getPeople } from '/src/config/api'
import { useTranslation } from '/src/i18n/server'
import { makeClass, relativeTimeFormat } from '/src/utils'
import EventAvailabilities from './EventAvailabilities'
import styles from './page.module.scss'
interface PageProps {
params: { id: string }
}
export const generateMetadata = async ({ params }: PageProps): Promise<Metadata> => {
const event = await getEvent(params.id).catch(() => undefined)
const { t } = await useTranslation('event')
return {
title: event?.name ?? t('error.title'),
}
}
const Page = async ({ params }: PageProps) => {
const event = await getEvent(params.id).catch(() => undefined)
const people = await getPeople(params.id).catch(() => undefined)
if (!event || !people) notFound()
const { t, i18n } = await useTranslation(['common', 'event'])
return <>
<Content>
<h1 className={styles.name}>{event.name}</h1>
<span
className={styles.date}
title={Temporal.Instant.fromEpochSeconds(event.created_at).toLocaleString(i18n.language, { dateStyle: 'long' })}
>{t('common:created', { date: relativeTimeFormat(Temporal.Instant.fromEpochSeconds(event.created_at), i18n.language) })}</span>
<Copyable className={styles.info}>
{`https://crab.fit/${event.id}`}
</Copyable>
<p className={makeClass(styles.info, styles.noPrint)}>
<Trans i18nKey="event:nav.shareinfo" t={t} i18n={i18n}>_<a href={`mailto:?subject=${encodeURIComponent(t<string>('event:nav.email_subject', { event_name: event.name }))}&body=${encodeURIComponent(`${t('event:nav.email_body')} https://crab.fit/${event.id}`)}`}>_</a>_</Trans>
</p>
</Content>
<EventAvailabilities event={event} people={people} />
</>
}
export default Page