import { ServicesMarketingPage } from "./services-marketing-page";
import { getPublicPageSeo } from "@/lib/public-page-seo";
import { resolveOgImageUrl } from "@/lib/site-og-image";
import { SERVICES, SERVICES_FAQS } from "@/lib/services-data";
import type { Metadata } from "next";

const SITE_URL = (process.env.NEXT_PUBLIC_SITE_URL || "https://nizamify.com").replace(/\/$/, "");

export async function generateMetadata(): Promise<Metadata> {
  const seo = await getPublicPageSeo("services");
  const title = seo?.metaTitle?.trim() || seo?.title?.trim() || "Services";
  const description =
    seo?.metaDescription?.trim() ||
    "Custom software solutions and hardware installation services from Nizamify — business, home, and manufacturing automation across Pakistan.";
  const canonical = "/services";
  const keywords = Array.isArray(seo?.metaKeywords) && seo.metaKeywords.length > 0
    ? seo.metaKeywords
    : ["Nizamify services", "business automation Pakistan", "custom software Pakistan", "smart device installation"];
  const image = resolveOgImageUrl(seo?.image);

  return {
    title,
    description,
    keywords,
    alternates: { canonical },
    openGraph: {
      title,
      description,
      url: `${SITE_URL}${canonical}`,
      type: "website",
      images: [{ url: image }],
    },
    twitter: {
      card: "summary_large_image",
      title,
      description,
      images: [image],
    },
  };
}

const itemListSchema = {
  "@context": "https://schema.org",
  "@type": "ItemList",
  itemListElement: SERVICES.map((service, i) => ({
    "@type": "ListItem",
    position: i + 1,
    item: {
      "@type": "Service",
      name: service.name,
      description: service.shortDescription,
      url: `${SITE_URL}/services/${service.slug}`,
      provider: { "@type": "Organization", name: "Nizamify", url: SITE_URL },
      areaServed: "PK",
    },
  })),
};

const faqSchema = {
  "@context": "https://schema.org",
  "@type": "FAQPage",
  mainEntity: SERVICES_FAQS.map((f) => ({
    "@type": "Question",
    name: f.question,
    acceptedAnswer: { "@type": "Answer", text: f.answer },
  })),
};

const breadcrumbSchema = {
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  itemListElement: [
    { "@type": "ListItem", position: 1, name: "Home", item: `${SITE_URL}/` },
    { "@type": "ListItem", position: 2, name: "Services", item: `${SITE_URL}/services` },
  ],
};

export default function ServicesPage() {
  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(itemListSchema) }}
      />
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(faqSchema) }}
      />
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(breadcrumbSchema) }}
      />
      <ServicesMarketingPage />
    </>
  );
}