import PageHero from "@/components/PageHero";
import { defaultContent } from "@/lib/content/defaults";
import { getContent } from "@/lib/content/service";
import { createContentMetadata } from "../seo";

export const dynamic = "force-dynamic";

export async function generateMetadata() {
  const content = await getContent("about");
  return createContentMetadata(content.seo, defaultContent.about.seo);
}

export default async function AboutPage() {
  const content = await getContent("about");
  const blocks = content.paragraphs.length > 0 ? content.paragraphs : [
    { title: content.companyDescription, text: content.workshopDescription },
    { title: content.philosophy, text: content.intro },
  ];

  return (
    <>
      <PageHero eyebrow={content.eyebrow} title={content.title}>
        {content.subtitle}
      </PageHero>
      <section className="section">
        <div className="container grid two">
          {blocks.map((block) => (
            <article key={block.title} className="card">
              <h2>{block.title}</h2>
              <p>{block.text}</p>
            </article>
          ))}
        </div>
      </section>
    </>
  );
}