church-website/src/app/(home)/gruppe/[slug]/page.tsx
2025-07-09 12:16:44 +02:00

93 lines
No EOL
2.5 KiB
TypeScript

import styles from "./styles.module.scss"
import { ImageWithText } from '@/compositions/ImageWithText/ImageWithText'
import { fetchGroup } from '@/fetch/group'
import { notFound } from 'next/navigation'
import { fetchEvents } from '@/fetch/events'
import { Section } from '@/components/Section/Section'
import { Title } from '@/components/Title/Title'
import { Container } from '@/components/Container/Container'
import { HR } from '@/components/HorizontalRule/HorizontalRule'
import { TextDiv } from '@/components/Text/TextDiv'
import { Col } from '@/components/Flex/Col'
import { Row } from '@/components/Flex/Row'
import { RawHTML } from '@/components/RawHTML/RawHTML'
import { Blocks } from '@/compositions/Blocks/Blocks'
import { getPhoto } from '@/utils/dto/gallery'
import { isAuthenticated } from '@/utils/auth'
import { AdminMenu } from '@/components/AdminMenu/AdminMenu'
import { GroupEvents } from '@/compositions/GroupEvents/GroupEvents'
export default async function GroupPage({ params }: { params: Promise<{slug: string}>}) {
const slug = (await params).slug
const groups = await fetchGroup(slug)
if(!groups || groups.docs.length === 0) {
notFound();
}
const {id, shortDescription, photo,name, text_html, content } = groups.docs[0]
const media = getPhoto("tablet", photo)
const authenticated = await isAuthenticated();
return (
<>
{ media &&
<ImageWithText
title={name}
backgroundColor={"soft"}
text={shortDescription}
image={media}
schema={"contrast"}
/>
}
{typeof photo !== "object" &&
<Section paddingBottom={"medium"}>
<Container>
<Title title={name} />
<TextDiv text={shortDescription} />
</Container>
<HR />
</Section>
}
<Section paddingBottom={"small"}>
<Container>
<Row>
<Col>
<div className={styles.content}>
{ text_html &&
<RawHTML html={text_html} />
}
</div>
</Col>
<Col>
<GroupEvents id={id} />
</Col>
</Row>
</Container>
</Section>
{ content && content.length > 0 &&
<Blocks content={content} />
}
{ content && content.length == 0 &&
<Section padding={"medium"}></Section>
}
<AdminMenu
collection={"group"}
id={id}
isAuthenticated={authenticated}
/>
</>
)
}