From 171f3dc52d9f6b45d7fb6ae33a3cf1bdf8e395e6 Mon Sep 17 00:00:00 2001
From: Jashwanth-rit <158207370+Jashwanth-rit@users.noreply.github.com>
Date: Sun, 20 Oct 2024 21:30:06 +0530
Subject: [PATCH 1/2] jashwanth/navlogin

---
 client/src/components/Navbar.jsx        |  26 +++--
 client/src/components/ReviewDetails.jsx |   2 +-
 client/src/components/StepOne.jsx       | 138 +++++++++++++-----------
 3 files changed, 94 insertions(+), 72 deletions(-)

diff --git a/client/src/components/Navbar.jsx b/client/src/components/Navbar.jsx
index 9791d499..067e0aeb 100644
--- a/client/src/components/Navbar.jsx
+++ b/client/src/components/Navbar.jsx
@@ -258,6 +258,12 @@ const Navbar = ({ isAuthenticated, user, handleLogout }) => {
             <FaHome />
             <p className="font-bold text-lg hover:brightness-50">Home</p>
           </NavLink>
+
+          <NavLink to="/" className="flex justify-center items-center gap-2">
+            <FaUser />
+            <p className="font-bold text-lg hover:brightness-50">Profile</p>
+          </NavLink>
+
           <NavLink
             to="/about"
             className="flex justify-center items-center gap-2"
@@ -320,17 +326,15 @@ const Navbar = ({ isAuthenticated, user, handleLogout }) => {
         </div>
 
         <div className="flex gap-3">
-          {localStorage?.getItem('token') ? (
-            <button
-              className={`${
-                dark === 'dark'
-                  ? 'bg-gray-900 text-gray-100'
-                  : 'bg-white text-black'
-              } flex gap-2 items-center px-5 py-1 rounded-lg font-bold hover:brightness-75`}
-              onClick={handleLogout}
-            >
-              Log Out
-            </button>
+          {localStorage?.getItem('basicDetails') ? (
+            <>
+              <button
+                className="bg-white px-5 py-1 rounded-lg text-black font-bold hover:brightness-75 ml-10"
+                onClick={handleLogout}
+              >
+                Log Out
+              </button>
+            </>
           ) : (
             <div className="flex gap-5">
               <NavLink
diff --git a/client/src/components/ReviewDetails.jsx b/client/src/components/ReviewDetails.jsx
index bb2eafb7..117307d4 100644
--- a/client/src/components/ReviewDetails.jsx
+++ b/client/src/components/ReviewDetails.jsx
@@ -88,7 +88,6 @@ function ReviewDetails() {
 
       if (response.ok) {
         notify('Registration successful', 'success');
-        navigate('/login');
       } else {
         notify(data.message || 'An error occurred. Please try again.', 'warn');
       }
@@ -98,6 +97,7 @@ function ReviewDetails() {
     } finally {
       setIsLoading(false);
     }
+    navigate('/');
   };
 
   return (
diff --git a/client/src/components/StepOne.jsx b/client/src/components/StepOne.jsx
index dbab49f5..eee5007a 100644
--- a/client/src/components/StepOne.jsx
+++ b/client/src/components/StepOne.jsx
@@ -79,7 +79,6 @@ function StepOne() {
 
     return newErrors;
   };
-
   const handleContinue = (e) => {
     e.preventDefault();
 
@@ -91,23 +90,29 @@ function StepOne() {
       }));
       return;
     }
-    nextStep();
+
+    // Store basicDetails in localStorage
+    localStorage.setItem('basicDetails', JSON.stringify(basicDetails));
+
+    nextStep(); // Move to the next step
   };
 
   return (
     <>
       <form
-        className={`auth-form ${dark === 'dark'
-          ? 'bg-gray-900 text-yellow-400'
-          : 'bg-white text-gray-700'
-          }`}
+        className={`auth-form ${
+          dark === 'dark'
+            ? 'bg-gray-900 text-yellow-400'
+            : 'bg-white text-gray-700'
+        }`}
       >
         <div className="form-section">
           <label
-            className={`auth-form ${dark === 'dark'
-              ? 'bg-gray-900 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`auth-form ${
+              dark === 'dark'
+                ? 'bg-gray-900 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
           >
             User Type:
           </label>
@@ -115,10 +120,11 @@ function StepOne() {
             name="type"
             value={basicDetails.type}
             onChange={handleChange}
-            className={`${dark === 'dark'
-              ? 'bg-gray-800 text-yellow-400 border-yellow-400'
-              : 'bg-white text-gray-700 border-gray-300'
-              }`}
+            className={`${
+              dark === 'dark'
+                ? 'bg-gray-800 text-yellow-400 border-yellow-400'
+                : 'bg-white text-gray-700 border-gray-300'
+            }`}
           >
             <option value="user">User</option>
             <option value="hospital">Hospital</option>
@@ -128,10 +134,11 @@ function StepOne() {
         <div className="form-section">
           <label
             htmlFor="name"
-            className={`auth-form ${dark === 'dark'
-              ? 'bg-gray-900 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`auth-form ${
+              dark === 'dark'
+                ? 'bg-gray-900 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
             style={{ display: 'inline' }}
           >
             Name: <span style={{ color: 'red' }}>*</span>
@@ -144,10 +151,11 @@ function StepOne() {
             onChange={handleChange}
             placeholder="John Doe"
             required
-            className={`${dark === 'dark'
-              ? 'bg-gray-800 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`${
+              dark === 'dark'
+                ? 'bg-gray-800 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
           />
           {errors.frontend.name && (
             <span className="error">{errors.frontend.name}</span>
@@ -157,10 +165,11 @@ function StepOne() {
         <div className="form-section">
           <label
             htmlFor="phone"
-            className={`auth-form ${dark === 'dark'
-              ? 'bg-gray-900 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`auth-form ${
+              dark === 'dark'
+                ? 'bg-gray-900 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
             style={{ display: 'inline' }}
           >
             Phone: <span style={{ color: 'red' }}>*</span>
@@ -173,10 +182,11 @@ function StepOne() {
             value={basicDetails.phone}
             onChange={handleChange}
             required
-            className={`${dark === 'dark'
-              ? 'bg-gray-800 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`${
+              dark === 'dark'
+                ? 'bg-gray-800 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
           />
           {errors.frontend.phone && (
             <span className="error">{errors.frontend.phone}</span>
@@ -186,10 +196,11 @@ function StepOne() {
         <div className="form-section">
           <label
             htmlFor="email"
-            className={`auth-form ${dark === 'dark'
-              ? 'bg-gray-900 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`auth-form ${
+              dark === 'dark'
+                ? 'bg-gray-900 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
             style={{ display: 'inline' }}
           >
             Email: <span style={{ color: 'red' }}>*</span>
@@ -202,10 +213,11 @@ function StepOne() {
             value={basicDetails.email}
             onChange={handleChange}
             required
-            className={`${dark === 'dark'
-              ? 'bg-gray-800 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`${
+              dark === 'dark'
+                ? 'bg-gray-800 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
           />
           {errors.frontend.email && (
             <span className="error">{errors.frontend.email}</span>
@@ -214,10 +226,11 @@ function StepOne() {
 
         <div className="form-section">
           <label
-            className={`auth-form ${dark === 'dark'
-              ? 'bg-gray-900 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`auth-form ${
+              dark === 'dark'
+                ? 'bg-gray-900 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
             style={{ display: 'inline' }}
           >
             Password: <span style={{ color: 'red' }}>*</span>
@@ -230,10 +243,11 @@ function StepOne() {
               value={basicDetails.password}
               onChange={handleChange}
               required
-              className={`${dark === 'dark'
-                ? 'bg-gray-800 text-yellow-400'
-                : 'bg-white text-gray-700'
-                }`}
+              className={`${
+                dark === 'dark'
+                  ? 'bg-gray-800 text-yellow-400'
+                  : 'bg-white text-gray-700'
+              }`}
             />
             <button
               type="button"
@@ -250,10 +264,11 @@ function StepOne() {
 
         <div className="form-section">
           <label
-            className={`auth-form ${dark === 'dark'
-              ? 'bg-gray-900 text-yellow-400'
-              : 'bg-white text-gray-700'
-              }`}
+            className={`auth-form ${
+              dark === 'dark'
+                ? 'bg-gray-900 text-yellow-400'
+                : 'bg-white text-gray-700'
+            }`}
             style={{ display: 'inline' }}
           >
             Confirm Password: <span style={{ color: 'red' }}>*</span>
@@ -266,10 +281,11 @@ function StepOne() {
               value={basicDetails.confirmPassword}
               onChange={handleChange}
               required
-              className={`${dark === 'dark'
-                ? 'bg-gray-800 text-yellow-400'
-                : 'bg-white text-gray-700'
-                }`}
+              className={`${
+                dark === 'dark'
+                  ? 'bg-gray-800 text-yellow-400'
+                  : 'bg-white text-gray-700'
+              }`}
             />
             <button
               type="button"
@@ -287,10 +303,11 @@ function StepOne() {
         <div className="register-button">
           <button
             type="submit"
-            className={`auth-button ${dark === 'dark'
-              ? 'bg-yellow-400 text-gray-900 hover:bg-yellow-500'
-              : 'bg-blue-600 text-white hover:bg-blue-700'
-              }`}
+            className={`auth-button ${
+              dark === 'dark'
+                ? 'bg-yellow-400 text-gray-900 hover:bg-yellow-500'
+                : 'bg-blue-600 text-white hover:bg-blue-700'
+            }`}
             onClick={handleContinue}
           >
             Continue
@@ -299,8 +316,9 @@ function StepOne() {
 
         <Link
           to="/login"
-          className={`toggle-auth-button text-center ${dark === 'dark' ? 'text-yellow-400' : 'text-gray-700'
-            }`}
+          className={`toggle-auth-button text-center ${
+            dark === 'dark' ? 'text-yellow-400' : 'text-gray-700'
+          }`}
         >
           Already have an account? Login
         </Link>

From 4969e2a675524211ba20e735934de74a5eb642ec Mon Sep 17 00:00:00 2001
From: Jashwanth-rit <158207370+Jashwanth-rit@users.noreply.github.com>
Date: Sun, 20 Oct 2024 22:04:00 +0530
Subject: [PATCH 2/2] jashwanth/navregist

---
 client/src/components/Navbar.jsx | 40 ++++++++++++++++----------------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/client/src/components/Navbar.jsx b/client/src/components/Navbar.jsx
index 067e0aeb..3fa813ca 100644
--- a/client/src/components/Navbar.jsx
+++ b/client/src/components/Navbar.jsx
@@ -26,6 +26,10 @@ const Navbar = ({ isAuthenticated, user, handleLogout }) => {
   const handleToggleMode = () => {
     setDark(dark === 'light' ? 'dark' : 'light');
   };
+  const handleLogoutlocal = () => {
+    localStorage.removeItem('basicDetails');
+    window.location.reload();
+  };
 
   // Scroll event listener
   const controlNavbar = useCallback(() => {
@@ -212,7 +216,7 @@ const Navbar = ({ isAuthenticated, user, handleLogout }) => {
             </NavLink>
           )}
 
-          {isAuthenticated ? (
+          {localStorage.getItem('basicDetails') ? (
             <button
               className="bg-white px-5 py-1 rounded-lg text-black font-bold hover:brightness-75"
               onClick={handleLogout}
@@ -258,12 +262,6 @@ const Navbar = ({ isAuthenticated, user, handleLogout }) => {
             <FaHome />
             <p className="font-bold text-lg hover:brightness-50">Home</p>
           </NavLink>
-
-          <NavLink to="/" className="flex justify-center items-center gap-2">
-            <FaUser />
-            <p className="font-bold text-lg hover:brightness-50">Profile</p>
-          </NavLink>
-
           <NavLink
             to="/about"
             className="flex justify-center items-center gap-2"
@@ -280,19 +278,19 @@ const Navbar = ({ isAuthenticated, user, handleLogout }) => {
           </NavLink>
 
           <NavLink to="/labtest" className="flex items-baseline gap-2">
-            <MdOutlineLocalHospital className="mr-0.5 relative top-[5px] " />{' '}
+            <MdOutlineLocalHospital className="mr-0.5 relative top-[4px] text-xl" />{' '}
             <p className="font-bold text-lg hover:brightness-50">Lab Test</p>
           </NavLink>
 
           {/* Add the new Hospitals Around Link for Desktop */}
           <NavLink to="/hospitals-around" className="flex items-baseline gap-2">
-            <FaHospitalAlt className="mr-0.5 relative top-[3px] " />
+            <FaHospitalAlt className="mr-0.5 relative top-[3px] text-xl" />
             <p className="font-bold text-lg hover:brightness-50">
               Hospitals Around
             </p>
           </NavLink>
 
-          {isAuthenticated ? (
+          {localStorage.getItem('basicDetails') ? (
             <>
               <NavLink to="/profile" className="flex items-baseline gap-2">
                 <FaUser />
@@ -317,7 +315,7 @@ const Navbar = ({ isAuthenticated, user, handleLogout }) => {
             </>
           ) : (
             <NavLink to="/registerOPD" className="flex items-baseline gap-2">
-              <MdOutlineLocalHospital className="mr-0.5 relative top-[5px] " />
+              <MdOutlineLocalHospital className="mr-0.5 relative top-[4px] text-xl" />
               <p className="font-bold text-lg hover:brightness-50">
                 Instant OPD
               </p>
@@ -326,15 +324,17 @@ const Navbar = ({ isAuthenticated, user, handleLogout }) => {
         </div>
 
         <div className="flex gap-3">
-          {localStorage?.getItem('basicDetails') ? (
-            <>
-              <button
-                className="bg-white px-5 py-1 rounded-lg text-black font-bold hover:brightness-75 ml-10"
-                onClick={handleLogout}
-              >
-                Log Out
-              </button>
-            </>
+          {localStorage.getItem('basicDetails') ? (
+            <button
+              className={`${
+                dark === 'dark'
+                  ? 'bg-gray-900 text-gray-100'
+                  : 'bg-white text-black'
+              } flex gap-2 items-center px-5 py-1 rounded-lg font-bold hover:brightness-75 ml-32`}
+              onClick={handleLogoutlocal}
+            >
+              Log Out
+            </button>
           ) : (
             <div className="flex gap-5">
               <NavLink