31 lines
797 B
TypeScript
31 lines
797 B
TypeScript
import { format, parseISO } from 'date-fns'
|
|
|
|
interface Event {
|
|
date: string
|
|
headline: string
|
|
description: string
|
|
}
|
|
|
|
export function Events({ props: events }: { props: Event[] }) {
|
|
return (
|
|
<div className="-mt-2 flex w-full flex-col gap-2 py-4">
|
|
{events.map(event => (
|
|
<div
|
|
key={event.date}
|
|
className="flex shrink-0 flex-col gap-1 rounded-lg bg-zinc-800 p-4"
|
|
>
|
|
<div className="text-sm text-zinc-400">
|
|
{format(parseISO(event.date), 'dd LLL, yyyy')}
|
|
</div>
|
|
<div className="text-base font-bold text-zinc-200">
|
|
{event.headline}
|
|
</div>
|
|
<div className="text-zinc-500">
|
|
{event.description.slice(0, 70)}...
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|