import type { Metadata } from "next";
import { getAllPosts } from "@/lib/blog";
import BlogList from "@/components/BlogList";

// Force SSR - always fetch fresh data
export const dynamic = 'force-dynamic';

export const metadata: Metadata = {
  title: "Blog AI i Case Studies — SZMYT AI Labs",
  description:
    "✓ Case studies wdrożeń AI ✓ Blog o sztucznej inteligencji dla firm ✓ Praktyczne porady i przykłady ✓ Najnowsze trendy w AI dla biznesu",
  keywords: [
    "blog AI",
    "case studies AI",
    "wdrożenia AI przykłady",
    "sztuczna inteligencja blog",
    "AI dla firm blog",
    "przykłady automatyzacji AI",
  ],
  openGraph: {
    title: "Blog AI i Case Studies — SZMYT AI Labs",
    description:
      "✓ Case studies wdrożeń AI ✓ Blog o sztucznej inteligencji dla firm ✓ Praktyczne porady i przykłady",
    url: "https://aiagentdlafirm.pl/blog/",
  },
  alternates: { canonical: "https://aiagentdlafirm.pl/blog/" },
};

const pageSchema = {
  "@context": "https://schema.org",
  "@type": "Blog",
  name: "Blog SZMYT AI Labs",
  url: "https://aiagentdlafirm.pl/blog/",
  description: "Blog o sztucznej inteligencji dla firm, case studies wdrożeń AI i praktyczne porady",
  publisher: {
    "@type": "Organization",
    name: "SZMYT AI Labs",
    url: "https://aiagentdlafirm.pl",
  },
  breadcrumb: {
    "@type": "BreadcrumbList",
    itemListElement: [
      { "@type": "ListItem", position: 1, name: "Strona główna", item: "https://aiagentdlafirm.pl/" },
      { "@type": "ListItem", position: 2, name: "Blog", item: "https://aiagentdlafirm.pl/blog/" },
    ],
  },
};

export default async function BlogPage() {
  const posts = await getAllPosts();

  return (
    <>
      <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(pageSchema) }} />
      <section className="relative min-h-screen py-20 px-4 pt-24 bg-gray-950">
        <div className="absolute inset-0 overflow-hidden">
          <div className="absolute top-1/4 left-1/2 -translate-x-1/2 w-[600px] h-[600px] bg-cyan-500/5 rounded-full blur-3xl" />
        </div>
        <div className="relative z-10 max-w-6xl mx-auto">
          <div className="text-center mb-14">
            <p className="text-cyan-400 font-medium tracking-widest uppercase text-sm mb-4">Blog & Case Studies</p>
            <h1 className="text-4xl md:text-6xl font-bold text-white mb-6">
              Wiedza z pierwszej ręki o <span className="text-cyan-400">AI dla firm</span>
            </h1>
            <p className="text-gray-400 text-lg max-w-2xl mx-auto">
              Przykłady wdrożeń, praktyczne porady i najnowsze trendy w automatyzacji biznesu z AI
            </p>
          </div>
          <BlogList posts={posts} />
        </div>
      </section>
    </>
  );
}