This commit is contained in:
Andras Schmelczer 2026-05-14 20:42:48 +01:00
parent 273d7a83ee
commit 084117cea8
48 changed files with 2283 additions and 890 deletions

View file

@ -1,22 +1,30 @@
import { lazy, Suspense } from 'react';
import { useTranslation } from 'react-i18next';
import { CheckIcon } from '../ui/icons/CheckIcon';
import { LogoIcon } from '../ui/icons/LogoIcon';
import HomeFinalCta from '../home/HomeFinalCta';
import { usePageMeta } from '../../hooks/usePageMeta';
import {
SEO_LANDING_PAGES,
getLocalizedSeoLandingPage,
type SeoFaq,
type SeoLandingKey,
type SeoLink,
type SeoSection,
} from '../../lib/seoLandingPages';
import { safeJsonLd } from '../../lib/json-ld';
const PUBLIC_URL = 'https://perfect-postcode.co.uk';
const ProductShowcase = lazy(() => import('../home/ProductShowcase'));
function ProductShowcaseFallback() {
return (
<div className="mx-auto min-h-[28rem] max-w-6xl rounded-lg bg-navy-900" aria-hidden="true" />
);
}
function JsonLd({ data }: { data: unknown }) {
return (
<script
type="application/ld+json"
dangerouslySetInnerHTML={{ __html: JSON.stringify(data).replace(/</g, '\\u003c') }}
/>
<script type="application/ld+json" dangerouslySetInnerHTML={{ __html: safeJsonLd(data) }} />
);
}
@ -91,9 +99,10 @@ export default function SeoLandingPage({
pageKey: SeoLandingKey;
onOpenDashboard: () => void;
}) {
const { t } = useTranslation();
const page = SEO_LANDING_PAGES[pageKey];
const { t, i18n } = useTranslation();
const page = getLocalizedSeoLandingPage(pageKey, i18n.language);
const url = `${PUBLIC_URL}${page.path}`;
usePageMeta(page.metaTitle, page.metaDescription);
return (
<main className="flex-1 overflow-y-auto bg-warm-50 text-navy-950 dark:bg-navy-950 dark:text-warm-100">
@ -138,7 +147,7 @@ export default function SeoLandingPage({
<div className="mt-8 flex flex-col gap-3 sm:flex-row">
<button
onClick={onOpenDashboard}
className="rounded-lg bg-coral-500 px-6 py-3 font-semibold text-white shadow-lg shadow-coral-500/25 transition-colors hover:bg-coral-600"
className="rounded-lg border border-[#d27a11] bg-[#f09a22] px-6 py-3 font-semibold text-navy-950 shadow-lg shadow-[#7a3905]/25 transition-colors hover:bg-[#df8614]"
>
{page.cta}
</button>
@ -152,6 +161,14 @@ export default function SeoLandingPage({
</div>
</section>
<section className="bg-navy-950 px-6 py-12 md:px-10 md:py-16">
<div className="mx-auto max-w-6xl">
<Suspense fallback={<ProductShowcaseFallback />}>
<ProductShowcase className="mx-auto" />
</Suspense>
</div>
</section>
<section className="mx-auto grid max-w-6xl gap-8 px-6 py-12 md:grid-cols-[0.85fr_1.15fr] md:px-10 md:py-16">
<div>
<div className="inline-flex items-center gap-2 rounded-md border border-teal-200 bg-teal-50 px-3 py-1.5 text-sm font-semibold text-teal-700 dark:border-teal-400/30 dark:bg-teal-400/10 dark:text-teal-200">
@ -228,6 +245,13 @@ export default function SeoLandingPage({
</div>
<LinkGrid links={page.relatedLinks} />
</section>
<section className="mx-auto max-w-6xl px-6 pb-16 md:px-10">
<HomeFinalCta
onOpenDashboard={onOpenDashboard}
trackingLocation={`seo_${pageKey}_bottom`}
/>
</section>
</main>
);
}