Re-use same logo for both Header and Simplenav

aaroncurtisyoga · Dec 9, 2024 · a4b498a · a4b498a
1 parent 8063634
commit a4b498a
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 25 deletions.
diff --git a/_components/Header/Logo.tsx b/_components/Header/Logo.tsx
@@ -1,24 +1,11 @@
 import { FC } from "react";
-import Link from "next/link";
-import { NavbarBrand, NavbarContent } from "@nextui-org/react";
 import { merriweather } from "@/app/fonts";
 
-interface LogoProps {
-  setIsMenuOpen: (isOpen: boolean) => void;
-}
-const Logo: FC<LogoProps> = ({ setIsMenuOpen }) => {
+const Logo: FC = () => {
   return (
-    <NavbarContent>
-      <NavbarBrand data-testid="navbar-brand">
-        <Link href={"/"} onClick={() => setIsMenuOpen(false)}>
-          <h1
-            className={`sm:flex font-extrabold text-xl ${merriweather.className}`}
-          >
-            Aaron Curtis Yoga
-          </h1>
-        </Link>
-      </NavbarBrand>
-    </NavbarContent>
+    <h1 className={`sm:flex font-extrabold text-xl ${merriweather.className}`}>
+      Aaron Curtis Yoga
+    </h1>
   );
 };
 

diff --git a/_components/Header/index.tsx b/_components/Header/index.tsx
@@ -1,8 +1,9 @@
 "use client";
 
 import { FC, useEffect, useState } from "react";
+import Link from "next/link";
 import { useUser } from "@clerk/nextjs";
-import { Navbar } from "@nextui-org/react";
+import { Navbar, NavbarBrand, NavbarContent } from "@nextui-org/react";
 import DesktopNavbarContent from "@/_components/Header/DesktopNavbarContent";
 import Logo from "@/_components/Header/Logo";
 import MobileNavbarContent from "@/_components/Header/MobileNavbarContent";
@@ -56,12 +57,20 @@ const Header: FC = () => {
         ],
       }}
     >
-      <Logo setIsMenuOpen={setIsMenuOpen} />
+      <NavbarContent>
+        <NavbarBrand data-testid="navbar-brand">
+          <Link href={"/"} onClick={() => setIsMenuOpen(false)}>
+            <Logo />
+          </Link>
+        </NavbarBrand>
+      </NavbarContent>
+
       <MobileNavbarContent
         isMenuOpen={isMenuOpen}
         menuItems={menuItems}
         setIsMenuOpen={setIsMenuOpen}
       />
+
       <DesktopNavbarContent isLoaded={isLoaded} menuItems={menuItems} />
     </Navbar>
   );

diff --git a/app/(auth)/_components/SimpleNav.tsx b/app/(auth)/_components/SimpleNav.tsx
@@ -1,18 +1,14 @@
 import Link from "next/link";
 import { Navbar, NavbarBrand, NavbarContent } from "@nextui-org/react";
-import { merriweather } from "@/app/fonts";
+import Logo from "@/_components/Header/Logo";
 
 const SimpleNav = () => {
   return (
     <Navbar isBordered maxWidth="xl">
       <NavbarContent>
         <NavbarBrand>
           <Link href={"/"}>
-            <p
-              className={`sm:flex font-semibold text-inherit ${merriweather.className}`}
-            >
-              Aaron Curtis Yoga
-            </p>
+            <Logo />
           </Link>
         </NavbarBrand>
       </NavbarContent>