Merge branch 'main' into dependabot/npm_and_yarn/storybook-8.3.0

src/app/(about-me)/__tests__/AboutMeHero.test.tsx

@@ -1,11 +1,12 @@
-// import { render } from "../../../../utilities";
-// import { screen } from "@testing-library/react";
-// import AboutMeHeroSection from "../_components/AboutMeHero";
+import { render } from "../../../../utilities";
+import { screen } from "@testing-library/react";
+import AboutMeHeroSection from "../_components/AboutMeHero";
 
 describe("About Me Hero Component Tests Suite", () => {
  it("should render the component properly with static header texts", () => {
- // render(<AboutMeHeroSection />);
- // expect(screen.getByRole("heading", { name: /arman/i })).toBeInTheDocument();
- // expect(screen.getByTestId("about-me-subtitle")).toBeInTheDocument();
+ render(<AboutMeHeroSection />);
+
+ expect(screen.getByRole("heading", { name: /arman/i })).toBeInTheDocument();
+ expect(screen.getByTestId("about-me-subtitle")).toBeInTheDocument();
  });
 });

src/app/(about-me)/__tests__/page.test.tsx

@@ -0,0 +1,28 @@
+import { render } from "../../../../utilities";
+import { screen } from "@testing-library/react";
+import Page, { metadata } from "../about-me/page";
+
+describe("About me page test suite", () => {
+ it("should render the page properly", () => {
+ render(<Page />);
+ const pageMainSection = screen.getByTestId("about-me-page");
+
+ // sections
+ const aboutMeHeroSection = screen.getByTestId("about-me-hero-section");
+
+ expect(pageMainSection).toBeInTheDocument();
+
+ expect(aboutMeHeroSection).toBeInTheDocument();
+ });
+
+ it("should have correct metadata", () => {
+ // You might need to test this indirectly or through a utility
+ expect(metadata).toEqual(
+ expect.objectContaining({
+ title: "Arman Ahmadi - About me",
+ description:
+ "Hi, I'm Arman! I'm based in the Netherlands and work as a backend engineer at Onefit/Urban Sports Club.",
+ }),
+ );
+ });
+});

src/app/(about-me)/_components/AboutMeHero.tsx

@@ -13,7 +13,10 @@ import Image from "next/image";
 
 const AboutMeHeroSection = () => {
  return (
- <section className="mt-4 md:mt-16 md:space-y-10">
+ <section
+ className="mt-4 md:mt-16 md:space-y-10"
+ data-testid="about-me-hero-section"
+ >
  <header className="hidden md:block">
  <h1
  className={`text-[2.5rem] font-bold leading-10 text-text-primary ${firaCode.className}`}
@@ -63,7 +66,7 @@ const AboutMeHeroSection = () => {
  width={300}
  height={300}
  decoding="sync"
- placeholder="blur"
+ // placeholder="blur"
  sizes="(max-width: 640px) 26vw, (max-width: 1024px) 26vw, (max-width: 1280px) 26vw, (max-width: 1560px) 14vw, 15vw"
  quality={70}
  loading="lazy"
@@ -77,7 +80,7 @@ const AboutMeHeroSection = () => {
  width={300}
  height={300}
  decoding="sync"
- placeholder="blur"
+ // placeholder="blur"
  sizes="(max-width: 640px) 26vw, (max-width: 1024px) 26vw, (max-width: 1280px) 14vw, (max-width: 1560px) 14vw, 15vw"
  quality={70}
  loading="lazy"

src/app/(about-me)/about-me/page.tsx

@@ -1,18 +1,9 @@
-import dynamic from "next/dynamic";
 import { Metadata } from "next";
 
 import AboutMeHeroSection from "../_components/AboutMeHero";
 import JsonLd from "@/components/seo/JsonLd";
-
-const DynamicConnectSection = dynamic(
- () => import("../_components/ConnectSection"),
- { ssr: false },
-);
-
-const DynamicWorkExperienceSection = dynamic(
- () => import("../_components/WorkExperienceSection"),
- { ssr: false },
-);
+import ConnectSection from "../_components/ConnectSection";
+import WorkExperienceSection from "../_components/WorkExperienceSection";
 
 export const metadata: Metadata = {
  title: "Arman Ahmadi - About me",
@@ -59,10 +50,10 @@ const Page = () => {
  };
 
  return (
- <main className="min-h-svh">
+ <main className="min-h-svh" data-testid="about-me-page">
  <AboutMeHeroSection />
- <DynamicConnectSection />
- <DynamicWorkExperienceSection />
+ <ConnectSection />
+ <WorkExperienceSection />
 
  {/* JSON+LD data */}
  <JsonLd data={jsonLd} />

src/utils/__test__/pagination-utils.test.ts

@@ -0,0 +1,33 @@
+import getTotalArticlesPage from "../pagination-utils";
+
+describe("Pagination utils tests suite", () => {
+ it("should return correct number of pages when totalArticles divides evenly by showPerPage", () => {
+ expect(getTotalArticlesPage(100, 10)).toBe(10);
+ expect(getTotalArticlesPage(50, 25)).toBe(2);
+ expect(getTotalArticlesPage(30, 15)).toBe(2);
+ });
+
+ it("should return correct number of pages when totalArticles does not divide evenly by showPerPage", () => {
+ expect(getTotalArticlesPage(101, 10)).toBe(11); // Rounded up
+ expect(getTotalArticlesPage(55, 25)).toBe(3);
+ expect(getTotalArticlesPage(31, 15)).toBe(3);
+ });
+
+ it("should return 0 when totalArticles is 0", () => {
+ expect(getTotalArticlesPage(0, 10)).toBe(0);
+ });
+
+ it("should return totalArticles as the number of pages when showPerPage is 1", () => {
+ expect(getTotalArticlesPage(100, 1)).toBe(100);
+ expect(getTotalArticlesPage(25, 1)).toBe(25);
+ });
+
+ it("should handle large numbers correctly", () => {
+ expect(getTotalArticlesPage(1000000, 1000)).toBe(1000);
+ expect(getTotalArticlesPage(1000000, 3)).toBe(333334); // Rounded up
+ });
+
+ it("should handle case when showPerPage is larger than totalArticles", () => {
+ expect(getTotalArticlesPage(5, 10)).toBe(1); // Even though we can fit all articles in one page
+ });
+});

src/utils/__test__/validators.test.ts

@@ -0,0 +1,16 @@
+import { emailValidateHandler } from "../validators";
+
+describe("VALIDATORS TESTS SUITE", () => {
+ describe("emailValidateHandler tests suite", () => {
+ it("should return true if email is valid", () => {
+ const validEmail = "[email protected]";
+ const result = emailValidateHandler(validEmail);
+ expect(result).toBe(true);
+ });
+
+ it("should return false if email is invalid", () => {
+ const invalidEmail = "test@example";
+ expect(emailValidateHandler(invalidEmail)).toBe(false);
+ });
+ });
+});