{event.name} - {t("siteTitle")}

import { Event, User } from "@prisma/client"; import { NextPageContext } from "next"; import { useTranslation } from "next-i18next"; import { serverSideTranslations } from "next-i18next/serverSideTranslations"; import Head from "next/head"; import { ChangeEvent, FormEventHandler, useCallback, useState } from "react"; import { ToolBar } from "../../components/tools/ToolBar"; import { EditableMarkdown } from "../../components/editable/EditableMarkdown"; import { EditableText } from "../../components/editable/EditableText"; import { ToolToggleEditing } from "../../components/tools/ToolToggleEditing"; import { EditingContext } from "../../contexts/editing"; import { database } from "../../utils/prismaClient"; import { Postcard } from "../../components/postcard/Postcard"; import { ViewContent } from "../../components/view/ViewContent"; import { EditablePostcard } from "../../components/editable/EditablePostcard"; import { ViewEvent } from "../../components/view/ViewEvent"; import { EditableDateTime } from "../../components/editable/EditableDateTime"; import { FormDateRange } from "../../components/FormDateRange"; import { ToolToggleVisible } from "../../components/tools/ToolToggleVisible"; export async function getServerSideProps(context: NextPageContext) { const slug = context.query.slug as string if(typeof slug === "object") { return {notFound: true} } const event = await database.event.findUnique({ where: {slug}, include: {creator: true} }) if(!event) { return {notFound: true} } return { props: { event, ...(await serverSideTranslations(context.locale ?? "it-IT", ["common"])) } } } type PageEventDetailProps = { event: Event & {creator: User} } export default function PageEventDetail({event}: PageEventDetailProps) { const {t} = useTranslation() const editState = useState(false) const [title, setTitle] = useState(event.name) const [description, setDescription] = useState(event.description) const [postcard, setPostcard] = useState(event.postcard) const [startingAt, setStartingAt] = useState(event.startingAt?.toISOString() ?? null) const [endingAt, setEndingAt] = useState(event.endingAt?.toISOString() ?? null) const setPostcardBlob = useCallback( (e: ChangeEvent) => { const file = e.target.files![0] if(!file) { setPostcard(null) return } const blobUrl = URL.createObjectURL(file) setPostcard(blobUrl) }, [] ) return <> {event.name} - {t("siteTitle")} ) => setTitle(e.target.value)} placeholder={t("eventDetailsTitlePlaceholder")} /> } postcard={ } description={ ) => setDescription(e.target.value)} rows={3} placeholder={t("eventDetailsDescriptionPlaceholder")} /> } datetime={ ) => setStartingAt(e.target.value), }} endProps={{ value: endingAt ?? undefined, onChange: (e: ChangeEvent) => setEndingAt(e.target.value), }} /> } /> }