From 7bba30b21c011ec858b601e8620d1e9bfea8e68c Mon Sep 17 00:00:00 2001
From: Lenny Peters <mr.lennypeters@gmail.com>
Date: Fri, 22 Dec 2023 18:42:02 -0800
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20addressing=20changes?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                             |  6 ++--
 pages/404.tsx                                 |  2 +-
 pages/500.tsx                                 |  2 +-
 pages/_error.tsx                              |  2 +-
 pages/about.tsx                               | 26 +++++++++------
 pages/blog/[slug].tsx                         |  2 +-
 pages/index.tsx                               | 32 +++++++++++--------
 .../Footer}/Footer.test.tsx                   |  2 +-
 src/components/{ => Footer}/Footer.tsx        |  0
 .../Header}/Header.test.tsx                   |  2 +-
 src/components/{ => Header}/Header.tsx        |  1 -
 .../Layout}/Layout.test.tsx                   |  9 +++++-
 src/components/{ => Layout}/Layout.tsx        | 18 +++++------
 .../Main}/Main.test.tsx                       |  2 +-
 src/components/{ => Main}/Main.tsx            |  0
 .../PageProfileCard/PageProfileCard.test.tsx  | 30 +++++++++++++++++
 .../{ => PageProfileCard}/PageProfileCard.tsx |  3 +-
 .../PostList}/PostList.test.tsx               |  4 +--
 src/components/{ => PostList}/PostList.tsx    |  1 -
 .../ErrorBoundry.test.tsx                     |  2 +-
 src/{components => utils}/ErrorBoundry.tsx    |  0
 21 files changed, 94 insertions(+), 52 deletions(-)
 rename src/{__tests__ => components/Footer}/Footer.test.tsx (90%)
 rename src/components/{ => Footer}/Footer.tsx (100%)
 rename src/{__tests__ => components/Header}/Header.test.tsx (94%)
 rename src/components/{ => Header}/Header.tsx (95%)
 rename src/{__tests__ => components/Layout}/Layout.test.tsx (80%)
 rename src/components/{ => Layout}/Layout.tsx (68%)
 rename src/{__tests__ => components/Main}/Main.test.tsx (94%)
 rename src/components/{ => Main}/Main.tsx (100%)
 create mode 100644 src/components/PageProfileCard/PageProfileCard.test.tsx
 rename src/components/{ => PageProfileCard}/PageProfileCard.tsx (88%)
 rename src/{__tests__ => components/PostList}/PostList.test.tsx (94%)
 rename src/components/{ => PostList}/PostList.tsx (93%)
 rename src/{__tests__ => utils}/ErrorBoundry.test.tsx (96%)
 rename src/{components => utils}/ErrorBoundry.tsx (100%)

diff --git a/package-lock.json b/package-lock.json
index 1bf6edb..959e83b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5221,9 +5221,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001566",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001566.tgz",
-      "integrity": "sha512-ggIhCsTxmITBAMmK8yZjEhCO5/47jKXPu6Dha/wuCS4JePVL+3uiDEBuhu2aIoT+bqTOR8L76Ip1ARL9xYsEJA==",
+      "version": "1.0.30001571",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001571.tgz",
+      "integrity": "sha512-tYq/6MoXhdezDLFZuCO/TKboTzuQ/xR5cFdgXPfDtM7/kchBO3b4VWghE/OAi/DV7tTdhmLjZiZBZi1fA/GheQ==",
       "funding": [
         {
           "type": "opencollective",
diff --git a/pages/404.tsx b/pages/404.tsx
index 28e6fd9..0563100 100644
--- a/pages/404.tsx
+++ b/pages/404.tsx
@@ -1,6 +1,6 @@
 import Head from "next/head";
 import Image from "next/image";
-import Layout from "../src/components/Layout";
+import Layout from "../src/components/Layout/Layout";
 import { links } from "../src/utils/links";
 
 const Custom404 = () => {
diff --git a/pages/500.tsx b/pages/500.tsx
index e4a219d..2445356 100644
--- a/pages/500.tsx
+++ b/pages/500.tsx
@@ -1,5 +1,5 @@
 import Head from "next/head";
-import Layout from "../src/components/Layout";
+import Layout from "../src/components/Layout/Layout";
 import { links } from "../src/utils/links";
 
 const Custom500 = () => {
diff --git a/pages/_error.tsx b/pages/_error.tsx
index e88eea5..9972ba3 100644
--- a/pages/_error.tsx
+++ b/pages/_error.tsx
@@ -1,6 +1,6 @@
 import Head from "next/head";
 import PropTypes from "prop-types";
-import Layout from "../src/components/Layout";
+import Layout from "../src/components/Layout/Layout";
 import { links } from "../src/utils/links";
 
 const Error = ({ statusCode }) => {
diff --git a/pages/about.tsx b/pages/about.tsx
index 234d389..7b26166 100644
--- a/pages/about.tsx
+++ b/pages/about.tsx
@@ -1,5 +1,5 @@
 import Head from "next/head";
-import Layout from "../src/components/Layout";
+import Layout from "../src/components/Layout/Layout";
 import { getAllCards } from "../src/utils/contentfulPosts";
 import { links } from "../src/utils/links";
 
@@ -34,20 +34,26 @@ const About = ({ cards }) => {
 };
 
 export async function getStaticProps() {
-  const res = await getAllCards("card");
-  const cards = res;
+  try {
+    const res = await getAllCards("card");
+    const cards = res;
 
-  if (!cards) {
+    if (!cards) {
+      return {
+        notFound: true,
+      };
+    }
+
+    return {
+      props: {
+        cards,
+      },
+    };
+  } catch (error) {
     return {
       notFound: true,
     };
   }
-
-  return {
-    props: {
-      cards,
-    },
-  };
 }
 
 export default About;
diff --git a/pages/blog/[slug].tsx b/pages/blog/[slug].tsx
index ab900e9..6c4b568 100644
--- a/pages/blog/[slug].tsx
+++ b/pages/blog/[slug].tsx
@@ -1,6 +1,6 @@
 import Head from "next/head";
 import Image from "next/image";
-import Layout from "../../src/components/Layout";
+import Layout from "../../src/components/Layout/Layout";
 import { getAllPosts, getPostBySlug } from "../../src/utils/contentfulPosts";
 import { links } from "../../src/utils/links";
 
diff --git a/pages/index.tsx b/pages/index.tsx
index f088382..d22b68e 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -1,6 +1,6 @@
 import Head from "next/head";
-import Layout from "../src/components/Layout";
-import PostList from "../src/components/PostList";
+import Layout from "../src/components/Layout/Layout";
+import PostList from "../src/components/PostList/PostList";
 import { links } from "../src/utils/links";
 import { getAllPosts } from "../src/utils/contentfulPosts";
 
@@ -36,20 +36,26 @@ const HomePage = ({ posts }) => {
 export default HomePage;
 
 export async function getStaticProps() {
-  const res = await getAllPosts("posts");
-  const posts = res.map((p) => {
-    return p.fields;
-  });
+  try {
+    const res = await getAllPosts("posts");
+    const posts = res.map((p) => {
+      return p.fields;
+    });
 
-  if (!posts) {
+    if (!posts) {
+      return {
+        notFound: true,
+      };
+    }
+
+    return {
+      props: {
+        posts,
+      },
+    };
+  } catch (error) {
     return {
       notFound: true,
     };
   }
-
-  return {
-    props: {
-      posts,
-    },
-  };
 }
diff --git a/src/__tests__/Footer.test.tsx b/src/components/Footer/Footer.test.tsx
similarity index 90%
rename from src/__tests__/Footer.test.tsx
rename to src/components/Footer/Footer.test.tsx
index c33b17d..8a2816e 100644
--- a/src/__tests__/Footer.test.tsx
+++ b/src/components/Footer/Footer.test.tsx
@@ -1,7 +1,7 @@
 import { render, waitFor } from "@testing-library/react";
 import "@testing-library/jest-dom";
 
-import Footer from "../components/Footer";
+import Footer from "./Footer";
 
 describe("Footer Component", () => {
   test("should have the copyright in the footer", async () => {
diff --git a/src/components/Footer.tsx b/src/components/Footer/Footer.tsx
similarity index 100%
rename from src/components/Footer.tsx
rename to src/components/Footer/Footer.tsx
diff --git a/src/__tests__/Header.test.tsx b/src/components/Header/Header.test.tsx
similarity index 94%
rename from src/__tests__/Header.test.tsx
rename to src/components/Header/Header.test.tsx
index 212d57e..bbbe00c 100644
--- a/src/__tests__/Header.test.tsx
+++ b/src/components/Header/Header.test.tsx
@@ -1,6 +1,6 @@
 import { render, cleanup, waitFor } from "@testing-library/react";
 import "@testing-library/jest-dom";
-import Header from "../components/Header";
+import Header from "./Header";
 
 describe("Header", () => {
   afterEach(cleanup);
diff --git a/src/components/Header.tsx b/src/components/Header/Header.tsx
similarity index 95%
rename from src/components/Header.tsx
rename to src/components/Header/Header.tsx
index 31e2aca..6acd4ba 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -1,4 +1,3 @@
-/* eslint-disable react/no-unknown-property */
 import Link from "next/link";
 
 type Props = {
diff --git a/src/__tests__/Layout.test.tsx b/src/components/Layout/Layout.test.tsx
similarity index 80%
rename from src/__tests__/Layout.test.tsx
rename to src/components/Layout/Layout.test.tsx
index 91327fe..23693ef 100644
--- a/src/__tests__/Layout.test.tsx
+++ b/src/components/Layout/Layout.test.tsx
@@ -7,7 +7,7 @@ import {
 } from "@testing-library/react";
 import "@testing-library/jest-dom";
 
-import Layout from "../components/Layout";
+import Layout from "./Layout";
 
 describe("Layout", () => {
   const links = [
@@ -22,6 +22,11 @@ describe("Layout", () => {
       id: 1,
     },
   ];
+
+  it("renders without crashing", () => {
+    render(<Layout links={links} />);
+  });
+
   beforeEach(() => {
     jest.resetAllMocks();
     cleanup();
@@ -41,7 +46,9 @@ describe("Layout", () => {
       fireEvent.click(link);
     });
     // // assert
+    expect(container.querySelector("#wrap")).toBeInTheDocument();
     expect(container.querySelector(".wrap")).toBeInTheDocument();
+    expect(container.querySelector(".wrap .active")).toBeInTheDocument();
     // // cleanup
   });
 });
diff --git a/src/components/Layout.tsx b/src/components/Layout/Layout.tsx
similarity index 68%
rename from src/components/Layout.tsx
rename to src/components/Layout/Layout.tsx
index 7a38c23..d6c9e85 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout/Layout.tsx
@@ -1,8 +1,8 @@
 import { useState } from "react";
 import PropTypes from "prop-types";
-import Header from "./Header";
-import PageProfileCard from "./PageProfileCard";
-import Footer from "./Footer";
+import Header from "../Header/Header";
+import PageProfileCard from "../PageProfileCard/PageProfileCard";
+import Footer from "../Footer/Footer";
 
 const Layout = ({ children, links }) => {
   const [active, setActive] = useState(false);
@@ -14,13 +14,11 @@ const Layout = ({ children, links }) => {
     <div className={active === false ? "wrap" : "wrap active"} id="wrap">
       <Header handleClick={() => handleClick} active={active} links={links} />
       <main id="content" role="main">
-        <>
-          <PageProfileCard
-            jobRole="Software Engineer & Internet Lover"
-            twitterHandle="@loonz206"
-          />
-          {children}
-        </>
+        <PageProfileCard
+          jobRole="Software Engineer & Internet Lover"
+          twitterHandle="@loonz206"
+        />
+        {children}
       </main>
       <Footer />
     </div>
diff --git a/src/__tests__/Main.test.tsx b/src/components/Main/Main.test.tsx
similarity index 94%
rename from src/__tests__/Main.test.tsx
rename to src/components/Main/Main.test.tsx
index 9d5287b..5102008 100644
--- a/src/__tests__/Main.test.tsx
+++ b/src/components/Main/Main.test.tsx
@@ -1,7 +1,7 @@
 import { render, cleanup, act } from "@testing-library/react";
 import "@testing-library/jest-dom";
 
-import Main from "../components/Main";
+import Main from "./Main";
 
 describe("Main", () => {
   // cleanup
diff --git a/src/components/Main.tsx b/src/components/Main/Main.tsx
similarity index 100%
rename from src/components/Main.tsx
rename to src/components/Main/Main.tsx
diff --git a/src/components/PageProfileCard/PageProfileCard.test.tsx b/src/components/PageProfileCard/PageProfileCard.test.tsx
new file mode 100644
index 0000000..afa27e9
--- /dev/null
+++ b/src/components/PageProfileCard/PageProfileCard.test.tsx
@@ -0,0 +1,30 @@
+import { cleanup, render } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import PageProfileCard from "./PageProfileCard";
+
+describe("<PageProfileCard/>", () => {
+  const twitterHandle = "test";
+  const jobRole = "test";
+  beforeEach(() => {
+    jest.clearAllMocks();
+    cleanup();
+  });
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    cleanup();
+  });
+  it("should render an image and a link for the navigation", async () => {
+    const { container } = render(
+      <PageProfileCard twitterHandle={twitterHandle} jobRole={jobRole} />
+    );
+
+    const displayedImage = container.querySelector("img");
+
+    expect(displayedImage.src).toBe(
+      "http://localhost/_next/image?url=%2Fimg.jpg&w=640&q=75"
+    );
+    expect(displayedImage.alt).toBe("logo");
+    expect(container.querySelector(".nav-link")).toBeInTheDocument();
+  });
+});
diff --git a/src/components/PageProfileCard.tsx b/src/components/PageProfileCard/PageProfileCard.tsx
similarity index 88%
rename from src/components/PageProfileCard.tsx
rename to src/components/PageProfileCard/PageProfileCard.tsx
index e1b49c9..47e8b2c 100644
--- a/src/components/PageProfileCard.tsx
+++ b/src/components/PageProfileCard/PageProfileCard.tsx
@@ -1,7 +1,6 @@
-/* eslint-disable react/no-unknown-property */
 import Link from "next/link";
 import Image from "next/image";
-import Logo from "../assets/logo.svg";
+import Logo from "../../assets/logo.svg";
 
 const PageProfileCard = ({ twitterHandle, jobRole }) => {
   const handle = `https://twitter.com/${twitterHandle}`;
diff --git a/src/__tests__/PostList.test.tsx b/src/components/PostList/PostList.test.tsx
similarity index 94%
rename from src/__tests__/PostList.test.tsx
rename to src/components/PostList/PostList.test.tsx
index 14be0dc..163fd0c 100644
--- a/src/__tests__/PostList.test.tsx
+++ b/src/components/PostList/PostList.test.tsx
@@ -1,6 +1,6 @@
 import { cleanup, render } from "@testing-library/react";
 import "@testing-library/jest-dom";
-import PostList from "../components/PostList";
+import PostList from "./PostList";
 
 describe("<PostList/>", () => {
   const date = `Wed Jul 05 2023 20:35:15 GMT-0700 (Pacific Daylight Time)`;
@@ -19,9 +19,7 @@ describe("<PostList/>", () => {
         imageCover={imageCover}
       />
     );
-
     const displayedImage = container.querySelector("img");
-
     expect(displayedImage.src).toBe(
       "http://localhost/_next/image?url=https%3A%2F%2Fplacehold.it%2F720%2F405&w=1920&q=75"
     );
diff --git a/src/components/PostList.tsx b/src/components/PostList/PostList.tsx
similarity index 93%
rename from src/components/PostList.tsx
rename to src/components/PostList/PostList.tsx
index 0fb11c9..31503a4 100644
--- a/src/components/PostList.tsx
+++ b/src/components/PostList/PostList.tsx
@@ -1,4 +1,3 @@
-/* eslint-disable react/no-unknown-property */
 import Link from "next/link";
 import Image from "next/image";
 
diff --git a/src/__tests__/ErrorBoundry.test.tsx b/src/utils/ErrorBoundry.test.tsx
similarity index 96%
rename from src/__tests__/ErrorBoundry.test.tsx
rename to src/utils/ErrorBoundry.test.tsx
index cc0eda5..31e4428 100644
--- a/src/__tests__/ErrorBoundry.test.tsx
+++ b/src/utils/ErrorBoundry.test.tsx
@@ -1,5 +1,5 @@
 import { render } from "@testing-library/react";
-import ErrorBoundary from "../components/ErrorBoundry";
+import ErrorBoundary from "./ErrorBoundry";
 
 describe("<ErrorBoundry/>", () => {
   beforeEach(() => {
diff --git a/src/components/ErrorBoundry.tsx b/src/utils/ErrorBoundry.tsx
similarity index 100%
rename from src/components/ErrorBoundry.tsx
rename to src/utils/ErrorBoundry.tsx