import sql from "@/lib/db";
import ServicesClient from "@/components/ServicesClient";
import { Metadata } from "next";

export async function generateMetadata(): Promise<Metadata> {
    return {
        title: "Hizmetlerimiz",
        description: "Muğla Dijital olarak sunduğumuz profesyonel dijital medya, sosyal medya yönetimi ve reklam çözümlerimizi inceleyin.",
        alternates: {
            canonical: "/services",
        },
        openGraph: {
            title: "Hizmetlerimiz | Muğla Dijital",
            description: "Dijital dünyada fark yaratan profesyonel hizmetlerimiz.",
            url: "https://mugladijitalmedya.com/services",
        }
    };
}

export default async function ServicesPage() {
    const [services, locations] = await Promise.all([
        // Reverting to SELECT * to fix build error while investigating missing columns
        sql`SELECT * FROM services ORDER BY display_order ASC`,
        sql`SELECT * FROM locations ORDER BY display_order ASC`
    ]);

    const servicesSchema = {
        "@context": "https://schema.org",
        "@type": "ItemList",
        "itemListElement": (services || []).map((service: any, index: number) => ({
            "@type": "ListItem",
            "position": index + 1,
            "item": {
                "@type": "Service",
                "name": service.title,
                "description": service.description,
                "provider": {
                    "@type": "Organization",
                    "name": "Muğla Dijital"
                }
            }
        }))
    };

    return (
        <>
            <script
                type="application/ld+json"
                dangerouslySetInnerHTML={{ __html: JSON.stringify(servicesSchema) }}
            />
            <ServicesClient services={services || []} locations={locations || []} />
        </>
    );
}