steffo/festa
steffo/festa
1
Fork 0
mirror of https://github.com/Steffo99/festa.git synced 2024-12-22 22:54:22 +00:00
Code Activity

Change a few things in the event page

Browse source
This commit is contained in:
Steffo 2022-07-17 06:20:52 +02:00
parent 4b70723007
commit 94e31d361b
Signed by: steffo
GPG key ID: 6965406171929D01
1 changed files with 9 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
pages/events/[slug].tsx
View file

@ -4,10 +4,9 @@ import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
import { default as Head } from 'next/head' import { default as Head } from 'next/head'
import defaultPostcard from "../../public/postcards/adi-goldstein-Hli3R6LKibo-unsplash.jpg" import defaultPostcard from "../../public/postcards/adi-goldstein-Hli3R6LKibo-unsplash.jpg"
import { Postcard } from '../../components/postcard/changer' import { Postcard } from '../../components/postcard/changer'
import { ViewEvent } from '../../components/events/views/event'
import useSWR from 'swr' import useSWR from 'swr'
import { Event } from '@prisma/client' import { Event } from '@prisma/client'
import { EditableFilePicker, EditableText } from '../../components/generic/editable/inputs' import { EditableMarkdown, EditableText } from '../../components/generic/editable/inputs'
import { EditingContext, EditingMode } from '../../components/generic/editable/base' import { EditingContext, EditingMode } from '../../components/generic/editable/base'
import { useCallback, useContext, useState } from 'react' import { useCallback, useContext, useState } from 'react'
import { ToolBar } from '../../components/generic/toolbar/bar' import { ToolBar } from '../../components/generic/toolbar/bar'
@ -16,7 +15,6 @@ import { ToolToggleVisibility } from '../../components/postcard/toolbar/toolTogg
import { WIPBanner } from '../../components/generic/wip/banner' import { WIPBanner } from '../../components/generic/wip/banner'
import { AuthContext } from '../../components/auth/base' import { AuthContext } from '../../components/auth/base'
import { useDefinedContext } from '../../utils/definedContext' import { useDefinedContext } from '../../utils/definedContext'
import { asleep } from '../../utils/asleep'
import { ViewContent } from '../../components/generic/views/content' import { ViewContent } from '../../components/generic/views/content'
import { useAxios } from '../../components/auth/requests' import { useAxios } from '../../components/auth/requests'
@ -38,14 +36,10 @@ type PageEventProps = {
const PageEvent: NextPage<PageEventProps> = ({ slug }) => { const PageEvent: NextPage<PageEventProps> = ({ slug }) => {
const { t } = useTranslation() const { t } = useTranslation()
const { data, error, mutate } = useSWR<Event>(`/api/events/${slug}`) const { data, mutate } = useSWR<Event>(`/api/events/${slug}`)
const [auth, _setAuth] = useDefinedContext(AuthContext) const [auth, _setAuth] = useDefinedContext(AuthContext)
const axios = useAxios() const axios = useAxios()
const displayTitle = data?.name ?? slug
const displayPostcard = data?.postcard ?? defaultPostcard
const displayDescription = data?.description ?? ""
const save = useCallback( const save = useCallback(
async () => { async () => {
await axios.patch(`/api/events/${slug}`, data) await axios.patch(`/api/events/${slug}`, data)
@ -56,26 +50,26 @@ const PageEvent: NextPage<PageEventProps> = ({ slug }) => {
return <> return <>
<Head> <Head>
<title key="title">{displayTitle} - {t("siteTitle")}</title> <title key="title">{data?.name ?? slug} - {t("siteTitle")}</title>
</Head> </Head>
<Postcard <Postcard
src={displayPostcard} src={data?.postcard || defaultPostcard}
/> />
<WIPBanner /> <WIPBanner />
<EditingContext.Provider value={useState<EditingMode>(EditingMode.VIEW)}> <EditingContext.Provider value={useState<EditingMode>(EditingMode.VIEW)}>
<ViewContent <ViewContent
title={ title={
<EditableText <EditableText
value={displayTitle} value={data?.name ?? slug}
onChange={e => mutate(async state => state ? { ...state, name: e.target.value } : undefined, { revalidate: false })} onChange={e => mutate(async state => state ? { ...state, name: e.target.value } : undefined, { revalidate: false })}
/> />
} }
content={<> content={
<EditableText <EditableMarkdown
value={displayDescription} value={data?.description ?? ""}
onChange={e => mutate(async state => state ? { ...state, description: e.target.value } : undefined, { revalidate: false })} onChange={e => mutate(async state => state ? { ...state, description: e.target.value } : undefined, { revalidate: false })}
/> />
</>} }
/> />
<ToolBar vertical="vadapt" horizontal="right"> <ToolBar vertical="vadapt" horizontal="right">
<ToolToggleVisibility /> <ToolToggleVisibility />