carmanagement/apps/homepage/src/app/[locale]/[mode]/page.tsx

import styles from '@/components/homepage/Homepage.module.css';
import {
  ComparisonSection,
  FaqSection,
  FinalCtaSection,
  HeroSection,
  IntegrationsSection,
  ModulesSection,
  PricingSection,
  ResultsSection,
  RolesSection,
  SecuritySection,
  TrustSection,
  WorkflowSection,
} from '@/components/homepage/sections';
import { buildHomepageContent } from '@/content/homepage-model';
import { getPublicIntegrationConfig } from '@/lib/integrations/environment';
import { isLocale, isMode, localizedModePath, type Locale } from '@/lib/localization/config';
import { getMessages } from '@/lib/localization/messages';
import { buildLocalizedMetadata } from '@/lib/metadata/build-metadata';
import type { ThemePreference } from '@/lib/theme/config';
import type { Metadata } from 'next';
import { notFound } from 'next/navigation';

interface LocalePageProps {
  params: Promise<{ locale: string; mode: string }>;
}

export async function generateMetadata({ params }: LocalePageProps): Promise<Metadata> {
  const { locale: localeValue, mode: modeValue } = await params;
  if (!isLocale(localeValue)) notFound();
  if (!isMode(modeValue)) notFound();
  const messages = getMessages(localeValue);
  return buildLocalizedMetadata({
    locale: localeValue,
    mode: modeValue,
    routeId: 'home',
    title: messages.homepage.meta.title,
    description: messages.homepage.meta.description,
    indexable: true,
  });
}

export default async function LocaleHomePage({ params }: LocalePageProps) {
  const { locale: localeValue, mode: modeValue } = await params;
  if (!isLocale(localeValue)) notFound();
  if (!isMode(modeValue)) notFound();

  const locale: Locale = localeValue;
  const mode: ThemePreference = modeValue;
  const messages = getMessages(locale);
  const content = buildHomepageContent(messages.homepage, messages.shell, locale);
  const integrationConfig = getPublicIntegrationConfig();
  const homePath = localizedModePath('home', locale, mode);

  return (
    <main id="main-content" className={styles.main} tabIndex={-1}>
      <HeroSection
        content={content.hero}
        homePath={homePath}
      />
      <TrustSection content={content.trust} />
      <ComparisonSection content={content.comparison} />
      <WorkflowSection content={content.workflow} />
      <RolesSection content={content.roles} />
      <ModulesSection content={content.modules} />
      <ResultsSection content={content.results} />
      <IntegrationsSection content={content.integrations} />
      <SecuritySection content={content.security} />
      <PricingSection
        content={content.pricing}
        locale={locale}
        themePreference={mode}
        homePath={homePath}
        demoSubmissionEnabled={integrationConfig.demoSubmissionEnabled}
      />
      <FaqSection content={content.faq} />
      <FinalCtaSection
        content={content.final}
      />
    </main>
  );
}