feat: harden portfolio and add SEO foundations

app/components/Experience.test.tsx

@@ -0,0 +1,127 @@
+import { render, screen, within } from "@testing-library/react";
+import type { HTMLAttributes, ReactNode } from "react";
+import type { PortfolioExperience } from "@/lib/portfolio-data";
+import Experience from "./Experience";
+
+type MotionProps = HTMLAttributes<HTMLElement> & {
+  initial?: unknown;
+  whileInView?: unknown;
+  viewport?: unknown;
+  variants?: unknown;
+  whileHover?: unknown;
+  whileTap?: unknown;
+  transition?: unknown;
+};
+
+jest.mock("motion/react", () => {
+  const createMotionElement =
+    (Tag: "div" | "article") =>
+    ({
+      children,
+      initial: _initial,
+      whileInView: _whileInView,
+      viewport: _viewport,
+      variants: _variants,
+      whileHover: _whileHover,
+      whileTap: _whileTap,
+      transition: _transition,
+      ...props
+    }: MotionProps & { children?: ReactNode }) => (
+      <Tag {...props}>{children}</Tag>
+    );
+
+  return {
+    motion: {
+      div: createMotionElement("div"),
+      article: createMotionElement("article"),
+    },
+    useReducedMotion: () => false,
+  };
+});
+
+jest.mock("./Section", () => ({
+  Section: ({
+    children,
+    id,
+    title,
+  }: {
+    children?: ReactNode;
+    id?: string;
+    title?: string;
+  }) => (
+    <section id={id}>
+      <h2>{title}</h2>
+      {children}
+    </section>
+  ),
+}));
+
+jest.mock("./animations/DrawLine", () => ({
+  DrawLine: () => null,
+}));
+
+function experience({
+  id,
+  title,
+  period,
+  featured,
+}: {
+  id: string;
+  title: string;
+  period: string;
+  featured: boolean;
+}): PortfolioExperience {
+  return {
+    id,
+    title,
+    company: "Empresa",
+    period,
+    location: "Remoto",
+    type: "Software",
+    description: "Descrição",
+    achievements: [],
+    technologies: [],
+    featured,
+  };
+}
+
+describe("Experience", () => {
+  it("renders only featured experiences from newest to oldest", () => {
+    render(
+      <Experience
+        experiences={[
+          experience({
+            id: "hidden",
+            title: "Oculta",
+            period: "2026 - Atual",
+            featured: false,
+          }),
+          experience({
+            id: "older",
+            title: "Mais antiga",
+            period: "2019 - 2021",
+            featured: true,
+          }),
+          experience({
+            id: "recent",
+            title: "Mais recente",
+            period: "2024 - Atual",
+            featured: true,
+          }),
+        ]}
+      />,
+    );
+
+    expect(
+      screen.queryByRole("heading", { name: "Oculta" }),
+    ).not.toBeInTheDocument();
+    expect(
+      screen
+        .getAllByRole("article")
+        .map(
+          (article) =>
+            within(article).getByRole("heading", { level: 3 }).textContent,
+        ),
+    ).toEqual(["Mais recente", "Mais antiga"]);
+  });
+});