created the navbar for home page

src/RootImport.js

@@ -1,5 +1,7 @@
+// Components
 export { default as Error } from "./Sections/Error";
 export { default as Nav } from "./components/navbar/Nav";
+export { default as HomeNav } from "./components/navbar/HomeNav";
 export { default as Home } from "./Sections/Home";
 export { default as Auth } from "./Sections/Auth";
 export { default as PrivateRoute } from "./Sections/user/PrivateRoute";
@@ -12,3 +14,6 @@ export { default as AddWaste } from "./components/waste/AddWaste";
 export { default as setUser } from "./store/slice/userSlice";
 export { default as WasteProductCard } from "./components/home/WasteProductCard";
 export { default as UserCard } from "./components/home/UserCard";
+
+// Assets
+export { default as LOGO } from "./assets/bg.png";

src/Sections/Home.jsx

@@ -1,11 +1,13 @@
 import { useNavigate } from "react-router-dom";
+import { HomeNav } from "../RootImport.js";
 
 const Home = () => {
   const navigate = useNavigate();
 
   return (
     <>
       <section className="w-full min-h-screen flex flex-col items-center bg-black">
+        <HomeNav />
         <div className="w-full m-1 flex flex-col items-center justify-between">
           <h1 className="text-7xl md:text-9xl font-black capitalize bg-gradient-to-r from-fuchsia-400 via-pink-400 to-fuchsia-500 text-transparent bg-clip-text m-1">
             Recyclez

src/components/navbar/HomeNav.jsx

@@ -0,0 +1,55 @@
+import { LOGO } from "../../RootImport.js";
+import { useNavigate } from "react-router-dom";
+import { useSelector } from "react-redux";
+
+const HomeNav = () => {
+  const navigate = useNavigate();
+  const { token } = useSelector((state) => state.auth);
+
+  return (
+    <>
+      <nav className="bg-black shadow-md shadow-slate-100 w-full px-5 py-2 flex flex-row items-center justify-between mb-3">
+        <h1
+          className="flex flex-row items-center justify-between font-black cursor-pointer p-2 m-1 bg-white rounded-full text-slate-700 text-xl"
+          onClick={() => {
+            navigate("/");
+          }}
+        >
+          <img
+            src={LOGO}
+            alt="logo"
+            width={40}
+            height={40}
+            className="w-11 h-auto rounded-full shadow-sm mx-1"
+          />
+          Recyclez
+        </h1>
+        <div className="flex flex-row items-center justify-evenly mx-1">
+          {token ? (
+            <button
+              type="button"
+              onClick={() => {
+                navigate("/user/dashboard");
+              }}
+              className="px-2 py-3 rounded-full text-white hover:underline mx-1"
+            >
+              Dashboard
+            </button>
+          ) : (
+            <button
+              type="button"
+              onClick={() => {
+                navigate("/auth");
+              }}
+              className="px-2 py-3 rounded-full text-white hover:underline mx-1"
+            >
+              Login
+            </button>
+          )}
+        </div>
+      </nav>
+    </>
+  );
+};
+
+export default HomeNav;