adilallo
102 lines
2.7 KiB
TypeScript
102 lines
2.7 KiB
TypeScript
import dynamic from "next/dynamic";
|
|
import messages from "../messages/en/index";
|
|
import { getTranslation } from "../lib/i18n/getTranslation";
|
|
import HeroBanner from "./components/HeroBanner";
|
|
import AskOrganizer from "./components/AskOrganizer";
|
|
|
|
// Code split below-the-fold components to reduce initial bundle size
|
|
const LogoWall = dynamic(() => import("./components/LogoWall"), {
|
|
loading: () => (
|
|
<section className="py-[var(--spacing-scale-032)] min-h-[200px]" />
|
|
),
|
|
ssr: true,
|
|
});
|
|
|
|
const NumberedCards = dynamic(() => import("./components/NumberedCards"), {
|
|
loading: () => (
|
|
<section className="py-[var(--spacing-scale-032)] min-h-[300px]" />
|
|
),
|
|
ssr: true,
|
|
});
|
|
|
|
const RuleStack = dynamic(() => import("./components/RuleStack"), {
|
|
loading: () => (
|
|
<section className="py-[var(--spacing-scale-032)] min-h-[400px]" />
|
|
),
|
|
ssr: true,
|
|
});
|
|
|
|
const FeatureGrid = dynamic(() => import("./components/FeatureGrid"), {
|
|
loading: () => (
|
|
<section className="py-[var(--spacing-scale-032)] min-h-[500px]" />
|
|
),
|
|
ssr: true,
|
|
});
|
|
|
|
const QuoteBlock = dynamic(() => import("./components/QuoteBlock"), {
|
|
loading: () => (
|
|
<section className="py-[var(--spacing-scale-032)] min-h-[300px]" />
|
|
),
|
|
ssr: true,
|
|
});
|
|
|
|
export default function Page() {
|
|
// Use direct message access for server components
|
|
// This maintains type safety without requiring external i18n libraries
|
|
const t = (key: string) => getTranslation(messages, key);
|
|
|
|
const heroBannerData = {
|
|
title: t("heroBanner.title"),
|
|
subtitle: t("heroBanner.subtitle"),
|
|
description: t("heroBanner.description"),
|
|
ctaText: t("heroBanner.ctaText"),
|
|
ctaHref: t("heroBanner.ctaHref"),
|
|
};
|
|
|
|
const numberedCardsData = {
|
|
title: t("numberedCards.title"),
|
|
subtitle: t("numberedCards.subtitle"),
|
|
cards: [
|
|
{
|
|
text: t("numberedCards.cards.card1.text"),
|
|
iconShape: "blob",
|
|
iconColor: "green",
|
|
},
|
|
{
|
|
text: t("numberedCards.cards.card2.text"),
|
|
iconShape: "gear",
|
|
iconColor: "purple",
|
|
},
|
|
{
|
|
text: t("numberedCards.cards.card3.text"),
|
|
iconShape: "star",
|
|
iconColor: "orange",
|
|
},
|
|
],
|
|
};
|
|
|
|
const featureGridData = {
|
|
title: t("featureGrid.title"),
|
|
subtitle: t("featureGrid.subtitle"),
|
|
};
|
|
|
|
const askOrganizerData = {
|
|
title: t("askOrganizer.title"),
|
|
subtitle: t("askOrganizer.subtitle"),
|
|
buttonText: t("askOrganizer.buttonText"),
|
|
buttonHref: t("askOrganizer.buttonHref"),
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
<HeroBanner {...heroBannerData} />
|
|
<LogoWall />
|
|
<NumberedCards {...numberedCardsData} />
|
|
<RuleStack />
|
|
<FeatureGrid {...featureGridData} />
|
|
<QuoteBlock />
|
|
<AskOrganizer {...askOrganizerData} />
|
|
</div>
|
|
);
|
|
}
|