import Hero from "@/components/content/Hero";
import Testimonials from "@/components/content/Testimonials";
import SectionLabel from "@/components/layout/SectionLabel";
import AccentLink from "@/components/navigation/AccentLink";

type Testimonial = {
  name: string;
  title: string;
  avatar?: string;
  quote: string;
};

const testimonialsData: Testimonial[] = [
  {
    name: "Sarah Chen",
    title: "Senior Software Engineer · Patient Platforms",
    quote:
      "Working with Angel was the first time I saw someone treat Claude Code as a real engineering tool instead of a toy. He’d built half a workflow before the rest of us figured out it was possible.",
  },
  {
    name: "Marcus Whitfield",
    title: "Staff Frontend Engineer",
    quote:
      "He owned the component library end-to-end and ran the migration without breaking a single screen. Quiet shipper — you only notice his work when you go looking for it.",
  },
  {
    name: "Priya Anand",
    title: "Product Designer",
    quote:
      "Angel is the rare engineer who actually reads designs and asks questions when something feels off. Half my polish budget got returned to me on the projects he was on.",
  },
  {
    name: "Daniel Okafor",
    title: "Engineering Manager",
    quote:
      "He’s at his best when the problem doesn’t fit cleanly into one stack. I’d hand him an ambiguous brief and a week later he’d come back with a working prototype and a plan.",
  },
];

export default function HomePage() {
  return (
    <div>
      <Hero label="Angel Mankel">
        <div className="space-y-5">
          <p className="font-serif italic text-3xl leading-[1.3]">
            I’m a creator at heart.
          </p>

          <p className="text-[19px] leading-[1.65]">
            Building software people rely on — and understanding what makes those
            people tick — is what drives my greatest ambitions.
          </p>

          <p className="text-[19px] leading-[1.65]">
            I’m the kind of engineer who picks up whatever the problem needs and
            keeps digging — into the code, and into the people it’s meant for.
            The throughline isn’t a stack, it’s the curiosity.
          </p>
        </div>
      </Hero>
      <SectionLabel label="Selected Projects" />
      <AccentLink label="See all projects" link="/projects" />
      <SectionLabel label="What people say" />
      <Testimonials items={testimonialsData} />
    </div>
  );
}