Merge pull request #2 from ad956/feature/gym-member

🎨 Add Dashboard Route & Clean Up Navigation UI
ad956 · Oct 30, 2024 · b450aad · b450aad
2 parents ed8234b + 4329f9c
commit b450aad
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 39 deletions.
diff --git a/client/src/components/Sidebar/index.jsx b/client/src/components/Sidebar/index.jsx
@@ -36,7 +36,7 @@ export default function Sidebar() {
   };
 
   const sidebarItems = [
-    { label: "Dashboard", path: "/user/dashboard", icon: getIcon("Dashboard") },
+    { label: "Dashboard", path: "/user/", icon: getIcon("Dashboard") },
     { label: "QR Code", path: "/user/qrcode", icon: getIcon("QRCode") },
     {
       label: "Membership",

diff --git a/client/src/pages/user/components/Headbar/index.jsx b/client/src/pages/user/components/Headbar/index.jsx
@@ -5,44 +5,32 @@ import { NavLink } from "react-router-dom";
 
 export default function Headbar({ userData }) {
   return (
-    <header className="bg-white shadow-md text-gray-800 py-3 px-8">
-      <div className="max-w-7xl mx-auto flex justify-between items-center">
-        <div className="flex items-center gap-4">
-          <Image
-            src="https://i.pinimg.com/736x/fc/ce/92/fcce92b6dd2ebb5259426a424a6f983d.jpg"
-            alt="FitConnect"
-            width={40}
-            height={40}
-            className="object-contain"
-          />
-          <h1 className="text-2xl font-bold text-blue-600">FitConnect</h1>
-        </div>
-        <div className="flex items-center gap-6">
-          <div className="flex items-center bg-blue-50 rounded-lg px-4 py-2">
-            <FaCoins className="text-yellow-500 mr-2" />
-            <div>
-              <p className="font-semibold text-blue-600">
-                {userData.creditPoints} pts
-              </p>
-              <p className="text-xs text-gray-500">Credit Balance</p>
-            </div>
-          </div>
-          <div className="flex items-center gap-3">
-            <User
-              name={"Anand"}
-              avatarProps={{
-                src: "https://i.pinimg.com/736x/fc/ce/92/fcce92b6dd2ebb5259426a424a6f983d.jpg",
-              }}
-              className=""
-              description={
-                <NavLink
-                  href={`/settings`}
-                  className="text-xs text-primary"
-                >{`@${"ad956"}`}</NavLink>
-              }
-            />
+    <header className="grid place-items-end bg-white shadow-md text-gray-800 py-3 px-8">
+      <div className="flex items-center gap-6">
+        <div className="flex items-center bg-blue-50 rounded-lg px-4 py-2">
+          <FaCoins className="text-yellow-500 mr-2" />
+          <div>
+            <p className="font-semibold text-blue-600">
+              {userData.creditPoints} pts
+            </p>
+            <p className="text-xs text-gray-500">Credit Balance</p>
           </div>
         </div>
+        <div className="flex items-center gap-3">
+          <User
+            name={"Anand"}
+            avatarProps={{
+              src: "https://i.pinimg.com/736x/fc/ce/92/fcce92b6dd2ebb5259426a424a6f983d.jpg",
+            }}
+            className=""
+            description={
+              <NavLink
+                href={`/settings`}
+                className="text-xs text-primary"
+              >{`@${"ad956"}`}</NavLink>
+            }
+          />
+        </div>
       </div>
     </header>
   );

diff --git a/client/src/pages/user/index.jsx b/client/src/pages/user/index.jsx
@@ -1,4 +1,4 @@
-import { Layout } from "@components";
+import { Layout, PageNotFound } from "@components";
 import { Routes, Route } from "react-router-dom";
 import {
   Dashboard,
@@ -39,11 +39,12 @@ export default function UserLayout() {
         <Headbar userData={userData} />
         <section className="flex-1 overflow-y-auto">
           <Routes>
-            <Route path="/dashboard" element={<Dashboard />} />
+            <Route path="/" element={<Dashboard />} />
             <Route path="/qrcode" element={<p>Profile</p>} />
             <Route path="/membership" element={<Membership />} />
             <Route path="/transactions" element={<Transactions />} />
             <Route path="/profile" element={<Profile />} />
+            <Route path="*" element={<PageNotFound />} />
           </Routes>
         </section>
       </div>