67 lines
3.0 KiB
TypeScript
67 lines
3.0 KiB
TypeScript
import { Suspense } from "react";
|
||
import dynamic from "next/dynamic";
|
||
import { getDictionary } from "@/lib/dictionaries";
|
||
import { Hero } from "@/components/sections/Hero";
|
||
import { Features } from "@/components/sections/Features";
|
||
|
||
const SectionSkeleton = () => (
|
||
<div className="h-[500px] w-full animate-pulse bg-card/20 rounded-3xl my-10" />
|
||
);
|
||
|
||
// Тяжёлые интерактивные секции (framer-motion анимации, клиентские запросы к PocketBase,
|
||
// realtime-подписки) грузятся через next/dynamic, а не обычным import, чтобы не раздувать
|
||
// первый JS-бандл главной страницы: Hero и Features рендерятся сразу (статично, легче),
|
||
// а Pricing/FAQ/TerminalGuestbook/BlogPreview подгружаются отдельными чанками с плейсхолдером
|
||
// SectionSkeleton, пока грузится JS.
|
||
const Pricing = dynamic(
|
||
() => import("@/components/sections/Pricing").then((mod) => mod.Pricing),
|
||
{ loading: () => <SectionSkeleton /> },
|
||
);
|
||
const FAQ = dynamic(
|
||
() => import("@/components/sections/Faq").then((mod) => mod.FAQ),
|
||
{ loading: () => <SectionSkeleton /> },
|
||
);
|
||
const TerminalGuestbook = dynamic(
|
||
() =>
|
||
import("@/components/sections/TerminalGuestbook").then(
|
||
(mod) => mod.TerminalGuestbook,
|
||
),
|
||
{ loading: () => <SectionSkeleton /> },
|
||
);
|
||
const BlogPreview = dynamic(() =>
|
||
import("@/components/sections/BlogPreview").then((mod) => mod.BlogPreview),
|
||
);
|
||
|
||
export default async function Home({
|
||
params,
|
||
}: {
|
||
params: Promise<{ lang: string }>;
|
||
}) {
|
||
const { lang } = await params;
|
||
const dict = await getDictionary(lang);
|
||
|
||
// Читаем PB_PUBLIC_URL, а не NEXT_PUBLIC_PB_URL: Next.js статически подставляет
|
||
// NEXT_PUBLIC_*-переменные везде, где они встречаются в коде (в т.ч. внутри серверных
|
||
// компонентов), на этапе `next build` — так что чтение NEXT_PUBLIC_PB_URL здесь давало бы
|
||
// то же самое собранное-в-образ значение, что и в клиентском бандле. PB_PUBLIC_URL —
|
||
// обычная (не NEXT_PUBLIC_) переменная, поэтому читается по-настоящему заново при каждом
|
||
// запросе (см. подробный комментарий в app/[lang]/auth/auth-client.tsx про ACCOUNT_ORIGIN).
|
||
const pbUrl =
|
||
process.env.PB_PUBLIC_URL || "https://netrunner-vpn.com/cms-api";
|
||
|
||
return (
|
||
<>
|
||
<Hero dict={dict.hero} lang={lang} />
|
||
<Features dict={dict.features} />
|
||
<Pricing dict={dict.pricing} lang={lang} pbUrl={pbUrl} />
|
||
<TerminalGuestbook dict={dict.guestbook} pbUrl={pbUrl} />
|
||
|
||
<Suspense fallback={<SectionSkeleton />}>
|
||
<BlogPreview lang={lang} dict={dict.blog} />
|
||
</Suspense>
|
||
|
||
<FAQ dict={dict.faq} lang={lang} />
|
||
</>
|
||
);
|
||
}
|