Files
GNX-WEB/gnx-react/app/services/[slug]/page.tsx
Iliyan Angelov 76c857b4f5 update
2025-10-10 21:54:39 +03:00

91 lines
3.0 KiB
TypeScript

import { notFound } from 'next/navigation';
import Header from "@/components/shared/layout/header/Header";
import ServiceDetailsBanner from "@/components/shared/banners/ServiceDetailsBanner";
import ServiceDetails from "@/components/pages/services/ServiceDetails";
import ServiceFeatures from "@/components/pages/services/ServiceFeatures";
import ServiceDeliverables from "@/components/pages/services/ServiceDeliverables";
import ServiceProcess from "@/components/pages/services/ServiceProcess";
import Transform from "@/components/pages/services/Transform";
import Footer from "@/components/shared/layout/footer/Footer";
import ServicesScrollProgressButton from "@/components/pages/services/ServicesScrollProgressButton";
import ServicesInitAnimations from "@/components/pages/services/ServicesInitAnimations";
import { serviceService, Service } from "@/lib/api/serviceService";
import { generateServiceMetadata } from "@/lib/seo/metadata";
import { ServiceSchema, BreadcrumbSchema } from "@/components/shared/seo/StructuredData";
interface ServicePageProps {
params: Promise<{
slug: string;
}>;
}
// Generate static params for all services (optional - for better performance)
export async function generateStaticParams() {
try {
const services = await serviceService.getServices();
return services.results.map((service: Service) => ({
slug: service.slug,
}));
} catch (error) {
console.error('Error generating static params:', error);
return [];
}
}
// Generate enhanced metadata for each service page
export async function generateMetadata({ params }: ServicePageProps) {
try {
const { slug } = await params;
const service = await serviceService.getServiceBySlug(slug);
return generateServiceMetadata(service);
} catch (error) {
return {
title: 'Service Not Found - GNX',
description: 'The requested service could not be found.',
};
}
}
const ServicePage = async ({ params }: ServicePageProps) => {
let service: Service;
try {
const { slug } = await params;
service = await serviceService.getServiceBySlug(slug);
} catch (error) {
console.error('Error fetching service:', error);
notFound();
}
// Breadcrumb data for structured data
const breadcrumbItems = [
{ name: 'Home', url: '/' },
{ name: 'Services', url: '/services' },
{ name: service.title, url: `/services/${service.slug}` },
];
return (
<div className="enterprise-app">
{/* SEO Structured Data */}
<ServiceSchema service={service} />
<BreadcrumbSchema items={breadcrumbItems} />
<Header />
<main className="enterprise-main">
<ServiceDetailsBanner service={service} />
<ServiceDetails service={service} />
<ServiceFeatures service={service} />
<ServiceDeliverables service={service} />
<Transform service={service} />
<ServiceProcess service={service} />
</main>
<Footer />
<ServicesScrollProgressButton />
<ServicesInitAnimations />
</div>
);
};
export default ServicePage;