134 lines
3.8 KiB
TypeScript
134 lines
3.8 KiB
TypeScript
import { notFound } from 'next/navigation';
|
|
import { getPageBySlug, getAllPages, getMediaById } from '@/lib/data';
|
|
import { Metadata } from 'next';
|
|
import { SEO } from '@/components/SEO';
|
|
import { ContentRenderer } from '@/components/content/ContentRenderer';
|
|
import { Breadcrumbs } from '@/components/content/Breadcrumbs';
|
|
import { Hero } from '@/components/content/Hero';
|
|
import { ContactForm } from '@/components/ContactForm';
|
|
import { ResponsiveSection, ResponsiveWrapper } from '@/components/layout/ResponsiveWrapper';
|
|
|
|
interface PageProps {
|
|
params: {
|
|
locale: string;
|
|
};
|
|
}
|
|
|
|
export async function generateStaticParams() {
|
|
const pages = await getAllPages();
|
|
// Filter for contact pages only
|
|
const contactPages = pages.filter(p => p.slug === 'contact' || p.slug === 'kontakt');
|
|
return contactPages.map((page) => ({
|
|
locale: page.locale,
|
|
}));
|
|
}
|
|
|
|
export async function generateMetadata({ params }: PageProps): Promise<Metadata> {
|
|
const { locale } = params;
|
|
const slug = locale === 'de' ? 'kontakt' : 'contact';
|
|
|
|
const page = await getPageBySlug(slug, locale);
|
|
|
|
if (!page) {
|
|
return {
|
|
title: 'Contact Not Found',
|
|
};
|
|
}
|
|
|
|
return {
|
|
title: page.title,
|
|
description: page.excerptHtml || '',
|
|
alternates: {
|
|
languages: {
|
|
de: '/de/kontakt',
|
|
en: '/en/contact',
|
|
},
|
|
},
|
|
};
|
|
}
|
|
|
|
export default async function ContactPage({ params }: PageProps) {
|
|
const { locale } = params;
|
|
const slug = locale === 'de' ? 'kontakt' : 'contact';
|
|
|
|
const page = await getPageBySlug(slug, locale);
|
|
|
|
if (!page) {
|
|
notFound();
|
|
}
|
|
|
|
// Get featured image if available
|
|
const featuredImage = page.featuredImage ? getMediaById(page.featuredImage) : null;
|
|
|
|
// Content is already processed during data export
|
|
const contentToDisplay = page.contentHtml && page.contentHtml.trim() !== ''
|
|
? page.contentHtml
|
|
: page.excerptHtml;
|
|
|
|
// Breadcrumb items
|
|
const breadcrumbItems = [
|
|
{ label: locale === 'de' ? 'Kontakt' : 'Contact' }
|
|
];
|
|
|
|
return (
|
|
<>
|
|
<SEO
|
|
title={page.title}
|
|
description={page.excerptHtml || ''}
|
|
/>
|
|
|
|
{/* Breadcrumbs */}
|
|
<Breadcrumbs
|
|
items={breadcrumbItems}
|
|
homeLabel={locale === 'de' ? 'Startseite' : 'Home'}
|
|
homeHref={`/${locale}`}
|
|
/>
|
|
|
|
{/* Hero Section with Featured Image */}
|
|
{featuredImage && (
|
|
<Hero
|
|
title={page.title}
|
|
subtitle={page.excerptHtml ? page.excerptHtml.replace(/<[^>]*>/g, '') : undefined}
|
|
backgroundImage={featuredImage.localPath}
|
|
backgroundAlt={page.title}
|
|
height="md"
|
|
variant="dark"
|
|
overlay={true}
|
|
overlayOpacity={0.5}
|
|
/>
|
|
)}
|
|
|
|
{/* Main Content */}
|
|
<ResponsiveSection padding="responsive" maxWidth="4xl">
|
|
{!featuredImage && (
|
|
<ResponsiveWrapper stackOnMobile={true} centerOnMobile={true} className="mb-8">
|
|
<h1 className="text-3xl sm:text-4xl font-bold text-gray-900 mb-4">
|
|
{page.title}
|
|
</h1>
|
|
{page.excerptHtml && (
|
|
<ContentRenderer
|
|
content={page.excerptHtml}
|
|
className="text-lg sm:text-xl text-gray-600 leading-relaxed"
|
|
/>
|
|
)}
|
|
</ResponsiveWrapper>
|
|
)}
|
|
|
|
{/* Content from WordPress */}
|
|
{contentToDisplay && (
|
|
<ResponsiveWrapper className="bg-white rounded-lg shadow-sm p-6 sm:p-8 mb-12" container={true} maxWidth="full">
|
|
<ContentRenderer
|
|
content={contentToDisplay}
|
|
className="prose prose-lg max-w-none"
|
|
/>
|
|
</ResponsiveWrapper>
|
|
)}
|
|
|
|
{/* Contact Form */}
|
|
<ResponsiveWrapper className="bg-gray-50 rounded-lg p-6 sm:p-8" container={true} maxWidth="full">
|
|
<ContactForm />
|
|
</ResponsiveWrapper>
|
|
</ResponsiveSection>
|
|
</>
|
|
);
|
|
} |