From d3dd8445ff0bda91fcb4176bd2aa58f8e9bb158d Mon Sep 17 00:00:00 2001
From: Telkens <stivenmg77@gmail.com>
Date: Mon, 2 Oct 2023 20:05:29 -0500
Subject: [PATCH 1/2] Added categories section in the navbar

---
 .gitignore                               |  2 +-
 src/app/container_page.tsx               |  6 +++++-
 src/app/layout.tsx                       |  6 +-----
 src/app/products/page.tsx                |  1 -
 src/components/categories/categories.tsx | 17 +++++++++++++++++
 src/components/navBar/navBar.tsx         |  6 +++---
 src/types/icons.d.ts                     |  2 +-
 7 files changed, 28 insertions(+), 12 deletions(-)
 create mode 100644 src/components/categories/categories.tsx

diff --git a/.gitignore b/.gitignore
index 8f322f0..100bd8f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,7 +4,7 @@
 /node_modules
 /.pnp
 .pnp.js
-
+.env
 # testing
 /coverage
 
diff --git a/src/app/container_page.tsx b/src/app/container_page.tsx
index 303fab9..f4e222e 100644
--- a/src/app/container_page.tsx
+++ b/src/app/container_page.tsx
@@ -1,5 +1,6 @@
 import Footer from '~/components/footer/Footer';
 import NavBar from '~/components/navBar/navBar';
+import Categories from '~/components/categories/categories';
 
 type ContainerPageProps = {
   children: React.ReactNode;
@@ -18,7 +19,10 @@ export function ContainerPage({
     <>
       {typeof nav === 'boolean' && nav ? <NavBar /> : nav}
       {header && header}
-      <main className="min-h-screen overflow-hidden mx-auto">{children}</main>
+      <main className="min-h-screen overflow-hidden mx-auto">
+        <Categories/>
+        {children}
+      </main>
       {footer && <Footer />}
     </>
   );
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 640cd85..4c46aef 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,6 +1,6 @@
 'use client';
 import './globals.css';
-import type { Metadata } from 'next';
+
 import { Inter } from 'next/font/google';
 
 import { AuthContextProvider } from '../context/AuthContext';
@@ -8,10 +8,6 @@ import { ThemeProvider } from 'next-themes';
 
 const inter = Inter({ subsets: ['latin'] });
 
-export const metadata: Metadata = {
-  title: 'Create Next App',
-  description: 'Generated by create next app',
-};
 
 export default function RootLayout({
   children,
diff --git a/src/app/products/page.tsx b/src/app/products/page.tsx
index ba7cf29..931c244 100644
--- a/src/app/products/page.tsx
+++ b/src/app/products/page.tsx
@@ -2,6 +2,5 @@ import { ContainerPage } from '../container_page';
 
 export default function Landing() {
   return <ContainerPage>
-    Products page
   </ContainerPage>;
 }
diff --git a/src/components/categories/categories.tsx b/src/components/categories/categories.tsx
new file mode 100644
index 0000000..d250452
--- /dev/null
+++ b/src/components/categories/categories.tsx
@@ -0,0 +1,17 @@
+const Categories = () => {
+    return(
+        <div className="hidden w-full h-[60px] md:block mt-16 bg-opacity-70 bg-white shadow">
+            <ul className="flex justify-around items-center w-full h-full font-medium">
+                <li>Repuestos</li>
+                <li>Exterior</li>
+                <li>Bombillos</li>
+                <li>Farolas</li>
+                <li>Stops</li>
+                <li>Exploradoras</li>
+                <li>Audio</li>
+                <li>Interior</li>
+            </ul>
+        </div>
+    )
+}
+export default Categories;
\ No newline at end of file
diff --git a/src/components/navBar/navBar.tsx b/src/components/navBar/navBar.tsx
index 4b4a8ab..debfa2d 100644
--- a/src/components/navBar/navBar.tsx
+++ b/src/components/navBar/navBar.tsx
@@ -23,8 +23,8 @@ const NavBar: FC<NavBarProps> = ({}) => {
 
   return (
     <div>
-      <div className="z-50 fixed top-0 bg-opacity-70 bg-white w-full backdrop-blur-sm flex-col shadow-sm">
-        <nav className="p-4 flex items-center h-[60px] justify-between mx-auto">
+      <div className="z-50 fixed top-0 bg-opacity-70 bg-white w-full backdrop-blur-sm flex-col">
+        <nav className="p-4 flex items-center h-[60px] justify-between mx-auto my-1">
           {/* Contenedor lado izquierdo menu hamburguesa-imagenes*/}
           <div className="flex items-center gap-2">
             {/* Icono hamburguesa */}
@@ -68,7 +68,7 @@ const NavBar: FC<NavBarProps> = ({}) => {
             <div className="flex items-center justify-center ">
               <InputField
                 style={{ width: '50vw' }}
-                className="shadow-md bg-opacity-70 bg-white "
+                className="bg-opacity-70 bg-white "
                 placeholder="Buscar Productos"
                 leftIcon={<Icon icon="SearchIcon" />}
               />
diff --git a/src/types/icons.d.ts b/src/types/icons.d.ts
index fb3def8..584064a 100644
--- a/src/types/icons.d.ts
+++ b/src/types/icons.d.ts
@@ -1 +1 @@
-export type IconTypes = | 'CardCredit' | 'CarShoping' | 'Cash' | 'Close' | 'Facebook' | 'HamburguerClose' | 'HamburguerOpen' | 'Heart' | 'icon' | 'Instagram' | 'Login' | 'MapLocation' | 'Moon' | 'quotationMarks' | 'SearchIcon' | 'Shield' | 'Sun' | 'Truck' | 'warranty' | 'Whatsapp' 
\ No newline at end of file
+export type IconTypes = | 'CarShoping' | 'CardCredit' | 'Cash' | 'Close' | 'Facebook' | 'HamburguerClose' | 'HamburguerOpen' | 'Heart' | 'Instagram' | 'Login' | 'MapLocation' | 'Moon' | 'SearchIcon' | 'Shield' | 'Sun' | 'Truck' | 'Whatsapp' | 'icon' | 'quotationMarks' | 'warranty' 
\ No newline at end of file

From 620bad791543df0754d14bfd96f5c1f57da6c721 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Johan=20Mej=C3=ADa?=
 <109983506+JohanMejia77@users.noreply.github.com>
Date: Tue, 3 Oct 2023 16:48:07 -0500
Subject: [PATCH 2/2] Update container_page.tsx

Fixed bug of categories navbar
---
 src/app/container_page.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/app/container_page.tsx b/src/app/container_page.tsx
index f4e222e..158a328 100644
--- a/src/app/container_page.tsx
+++ b/src/app/container_page.tsx
@@ -1,6 +1,8 @@
+'use client'
 import Footer from '~/components/footer/Footer';
 import NavBar from '~/components/navBar/navBar';
 import Categories from '~/components/categories/categories';
+import { usePathname } from 'next/navigation';
 
 type ContainerPageProps = {
   children: React.ReactNode;
@@ -15,12 +17,13 @@ export function ContainerPage({
   footer = true,
   children,
 }: ContainerPageProps) {
+  const pathname = usePathname();
   return (
     <>
       {typeof nav === 'boolean' && nav ? <NavBar /> : nav}
       {header && header}
       <main className="min-h-screen overflow-hidden mx-auto">
-        <Categories/>
+        {pathname !== '/' && <Categories />}
         {children}
       </main>
       {footer && <Footer />}