From c57c2e031ba7eb528dca9bb5945de2f25a5ce17e Mon Sep 17 00:00:00 2001
From: sankhadip-roy <sankhadiproy23@gmail.com>
Date: Mon, 2 Sep 2024 02:38:32 +0530
Subject: [PATCH] path update

---
 frontend/src/components/Navbar.jsx | 197 +++++++++++++++--------------
 1 file changed, 101 insertions(+), 96 deletions(-)

diff --git a/frontend/src/components/Navbar.jsx b/frontend/src/components/Navbar.jsx
index 2c37e68..2097aba 100644
--- a/frontend/src/components/Navbar.jsx
+++ b/frontend/src/components/Navbar.jsx
@@ -1,109 +1,114 @@
 import React from "react";
 import {
-    Navbar,
-    Collapse,
-    Typography,
-    IconButton,
+  Navbar,
+  Collapse,
+  Typography,
+  IconButton,
 } from "@material-tailwind/react";
 import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline";
-import { useRecoilValue } from 'recoil';
-import { userloggedin } from '../atom/userAtom'
-
+import { useRecoilValue } from "recoil";
+import { userloggedin } from "../atom/userAtom";
 
 function NavList() {
-    const loggedUser = useRecoilValue(userloggedin);
-    return (
-        loggedUser == 'anonymous-not-loggedin' ? (
-
-            < ul className="my-2 flex flex-col gap-2 lg:mb-0 lg:mt-0 lg:flex-row lg:items-center lg:gap-6" >
-                <Typography
-                    as="li"
-                    variant="small"
-                    color="blue-gray"
-                    className="p-1 font-medium"
-                >
-                    <a href="http://localhost:5173/fetchusers" className="flex items-center hover:text-blue-500 transition-colors">
-                        Allusers
-                    </a>
-                </Typography>
-                <Typography
-                    as="li"
-                    variant="small"
-                    color="blue-gray"
-                    className="p-1 font-medium"
-                >
-                    <a href="http://localhost:5173/register" className="flex items-center hover:text-blue-500 transition-colors">
-                        Register
-                    </a>
-                </Typography>
-                <Typography
-                    as="li"
-                    variant="small"
-                    color="blue-gray"
-                    className="p-1 font-medium"
-                >
-                    <a href="http://localhost:5173/login" className="flex items-center hover:text-blue-500 transition-colors">
-                        Login
-                    </a>
-                </Typography>
-
-            </ul >
-        ) : (
-            <Typography
-                as="li"
-                variant="small"
-                color="blue-gray"
-                className="p-1 font-medium"
-            >
-                <p>User logged in as : {loggedUser}</p>
-            </Typography>)
-    );
+  const loggedUser = useRecoilValue(userloggedin);
+  return loggedUser == "anonymous-not-loggedin" ? (
+    <ul className="my-2 flex flex-col gap-2 lg:mb-0 lg:mt-0 lg:flex-row lg:items-center lg:gap-6">
+      <Typography
+        as="li"
+        variant="small"
+        color="blue-gray"
+        className="p-1 font-medium"
+      >
+        <a
+          href="/fetchusers"
+          className="flex items-center hover:text-blue-500 transition-colors"
+        >
+          Allusers
+        </a>
+      </Typography>
+      <Typography
+        as="li"
+        variant="small"
+        color="blue-gray"
+        className="p-1 font-medium"
+      >
+        <a
+          href="/register"
+          className="flex items-center hover:text-blue-500 transition-colors"
+        >
+          Register
+        </a>
+      </Typography>
+      <Typography
+        as="li"
+        variant="small"
+        color="blue-gray"
+        className="p-1 font-medium"
+      >
+        <a
+          href="/login"
+          className="flex items-center hover:text-blue-500 transition-colors"
+        >
+          Login
+        </a>
+      </Typography>
+    </ul>
+  ) : (
+    <Typography
+      as="li"
+      variant="small"
+      color="blue-gray"
+      className="p-1 font-medium"
+    >
+      <p>User logged in as : {loggedUser}</p>
+    </Typography>
+  );
 }
 
 export function NavbarSimple() {
-    const [openNav, setOpenNav] = React.useState(false);
+  const [openNav, setOpenNav] = React.useState(false);
 
-    const handleWindowResize = () =>
-        window.innerWidth >= 960 && setOpenNav(false);
+  const handleWindowResize = () =>
+    window.innerWidth >= 960 && setOpenNav(false);
 
-    React.useEffect(() => {
-        window.addEventListener("resize", handleWindowResize);
+  React.useEffect(() => {
+    window.addEventListener("resize", handleWindowResize);
 
-        return () => {
-            window.removeEventListener("resize", handleWindowResize);
-        };
-    }, []);
+    return () => {
+      window.removeEventListener("resize", handleWindowResize);
+    };
+  }, []);
 
-    return (
-        <Navbar className="mx-auto max-w-screen-xl px-6 py-3">
-            <div className="flex items-center justify-between text-blue-gray-900">
-                <Typography
-                    as="a"
-                    href="#"
-                    variant="h6"
-                    className="mr-4 cursor-pointer py-1.5"
-                >
-                    Chat Room
-                </Typography>
-                <div className="hidden lg:block">
-                    <NavList />
-                </div>
-                <IconButton
-                    variant="text"
-                    className="ml-auto h-6 w-6 text-inherit hover:bg-transparent focus:bg-transparent active:bg-transparent lg:hidden"
-                    ripple={false}
-                    onClick={() => setOpenNav(!openNav)}
-                >
-                    {openNav ? (
-                        <XMarkIcon className="h-6 w-6" strokeWidth={2} />
-                    ) : (
-                        <Bars3Icon className="h-6 w-6" strokeWidth={2} />
-                    )}
-                </IconButton>
-            </div>
-            <Collapse open={openNav}>
-                <NavList />
-            </Collapse>
-        </Navbar>
-    );
-}
\ No newline at end of file
+  return (
+    <Navbar className="mx-auto max-w-screen-xl px-6 py-3">
+      <div className="flex items-center justify-between text-blue-gray-900">
+        <Typography
+          as="a"
+          href="#"
+          variant="h6"
+          className="mr-4 cursor-pointer py-1.5"
+        >
+          Chat Room
+        </Typography>
+        <div className="hidden lg:block">
+          <NavList />
+        </div>
+        <IconButton
+          variant="text"
+          className="ml-auto h-6 w-6 text-inherit hover:bg-transparent focus:bg-transparent active:bg-transparent lg:hidden"
+          ripple={false}
+          onClick={() => setOpenNav(!openNav)}
+        >
+          {openNav ? (
+            <XMarkIcon className="h-6 w-6" strokeWidth={2} />
+          ) : (
+            <Bars3Icon className="h-6 w-6" strokeWidth={2} />
+          )}
+        </IconButton>
+      </div>
+      <Collapse open={openNav}>
+        <NavList />
+      </Collapse>
+    </Navbar>
+  );
+}