From d2dea792e2ad533a673c084074eb6f15cad0dc6c Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sat, 4 Jul 2026 20:46:49 +0530
Subject: [PATCH 01/24] Added Login Page Design

---
 client/src/pages/signup.jsx | 174 ++++++++++++++++++++++++++++++++++--
 1 file changed, 168 insertions(+), 6 deletions(-)

diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index ac5ec91..7e1bb38 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -4,13 +4,175 @@ import { Mail, Lock, User, ArrowRight } from "lucide-react";
 
 function Signup() {
   return (
-    <div className=" min-h-screen  bg-blue-400 flex justify-center items-center">      
-      <div className="bg-gray-500 h-100 w-100 rounded-3xl ">
-        <h1 className="text-3xl font-bold text-white text-center pt-2">SignUp</h1>
-          <div className="m-6 flex flex-col">
-            <label className="text-red-500" htmlFor="name">USERNAME</label>
-            <input id ="name" placeholder="Enter your username" className="mt-2 p-2 bg-white rounded text-black" type="text" />
+    <div className=" min-h-screen  bg-linear-to-br from-[#6A89A7] via-[#BDDDFC] via-[#88BDF2] to-[#384959] flex justify-center items-center">
+      <div className="flex w-full max-w-6xl min-h-[650px] rounded-3xl overflow-hidden shadow-2xl bg-white">
+        {/* /left side */}
+        <div className="flex-1 bg-linear-to-br from-[#3B0764] via-[#7E1E68] to-[#F97316] text-white p-10 flex flex-col justify-center">
+          <h1 className="text-4xl font-bold mb-6">
+            Developer Collaboration Platform
+          </h1>
+          <p className="text-slate-300 leading-7">
+            Join thousands of developers to collaborate on projects, share
+            ideas, participate in discussions, and build amazing software
+            together.
+          </p>
+        </div>
+
+        {/* right side */}
+        <div className="flex-1 bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] flex items-center justify-center">
+          <div className="w-full max-w-md p-8">
+            <h2 className="text-3xl font-bold text-slate-800">
+              Create Account
+            </h2>
+            <p className=" text-slate-500 mt-2 mb-8">
+              Join the developer community today.
+            </p>
+
+            {/* username */}
+            <div className="mb-5">
+              <label
+                htmlFor="username"
+                className="block text-sm font-medium mb-2"
+              >
+                Username
+              </label>
+              <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+                <User size={18} className="text-violet-500" />
+                <input
+                  className="ml-3 w-full outline-none bg-transparent"
+                  id="username"
+                  type="text"
+                  placeholder="enter username"
+                />
+              </div>
+            </div>
+
+            {/* email */}
+            <div className="mb-5">
+              <label htmlFor="email" className="block text-sm font-medium mb-2">
+                Email
+              </label>
+              <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+                <Mail size={18} className="text-violet-500" />
+                <input
+                  className="ml-3 w-full outline-none bg-transparent"
+                  id="email"
+                  type="email"
+                  placeholder="enter email"
+                />
+              </div>
+            </div>
+
+            {/* role selection */}
+            <label
+              htmlFor="roleSelect"
+              className="block text-sm font-medium mb-2"
+            >
+              Role
+            </label>
+            <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+              <select
+                name="roleSelection"
+                id="roleSelect"
+                className="w-full bg-transparent outline-none text-slate-700 cursor-pointer"
+              >
+                <option value="" disabled selected>
+                  Select your role
+                </option>
+                <option value="project_manager">Project Manager</option>
+                <option value="Developer">Developer</option>
+                <option value="frontend_developer">Frontend Developer</option>
+                <option value="backend_developer">Backend Developer</option>
+                <option value="cloud_engineer">Cloud Engineer</option>
+                <option value="data_scientist">Data Scientist</option>
+                <option value="Intern">Intern</option>
+              </select>
+            </div>
+
+            {/* password */}
+            <div className="mb-5">
+              <label
+                htmlFor="password"
+                className="block text-sm font-medium mb-2"
+              >
+                Password
+              </label>
+              <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+                <Lock size={18} className="text-violet-500" />
+                <input
+                  className="ml-3 w-full outline-none bg-transparent"
+                  id="password"
+                  type="password"
+                  placeholder="enter password"
+                />
+              </div>
+            </div>
+
+            {/* confirm password */}
+            <div className="mb-5">
+              <label
+                htmlFor="confirmPassword"
+                className="block text-sm font-medium mb-2"
+              >
+                Confirm Password
+              </label>
+              <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+                <Lock size={18} className="text-violet-500" />
+                <input
+                  className="ml-3 w-full outline-none bg-transparent"
+                  id="confirmPassword"
+                  type="password"
+                  placeholder="confirm password"
+                />
+              </div>
+            </div>
+
+            {/* terms and policy checkbox */}
+            <div className="flex items-center mb-6">
+              <input
+                className="h-4 w-4 rounded border-slate-300 text-blue-600 mr-3"
+                type="checkbox"
+              />
+              <span className="text-sm text-gray-600">
+                I agree to the terms and policy
+              </span>
+            </div>
+
+            {/* create account button */}
+            <button className="w-full rounded-xl bg-linear-to-br from-blue-600 to-violet-600 hover:from-blue-700 hover:to-violet-700 text-white py-3 font-semibold flex justify-center items-center hover:scale-[1.02] active:scale-95 transition-all duration-200 gap-2 ">
+              Create Account
+              <ArrowRight size={18} />
+            </button>
+
+            {/* divider */}
+            <div className="flex items-center my-6">
+              <div className="flex-1 border-t"></div>
+              <span className="mx-4 text-sm text-gray-400">OR</span>
+              <div className="flex-1 border-t"></div>
+            </div>
+
+            {/*Login with google button  */}
+            <button className="w-full rounded-xl border py-3 flex items-center justify-center gap-2 hover:bg-slate-100 transition duration-200">
+              <Mail size={18} />
+              Continue with Google
+            </button>
+
+            {/* login with github button */}
+            <button className="w-full rounded-xl border py-3 mt-3 gap-2 flex items-center justify-center hover:bg-slate-100 transition duration-200">
+              <Mail size={18} />
+              Continue with Github
+            </button>
+            <p className="text-center mt-6 text-sm text-slate-600">
+              Already have an account?{" "}
+              <Link
+                to="/login"
+                className="text-blue-600 font-semibold hover:underline"
+              >
+                Sign In
+              </Link>
+            </p>
           </div>
+        </div>
       </div>
     </div>
   );

From 68dba6d11fa170df09e69c34d45ba235a789fe20 Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Sat, 4 Jul 2026 21:28:47 +0530
Subject: [PATCH 02/24] did sizing on signup page and built initial login page

---
 client/src/App.jsx          |  5 ++-
 client/src/pages/login.jsx  | 26 +++++++++++++++
 client/src/pages/signup.jsx | 64 ++++++++++++++++++-------------------
 3 files changed, 60 insertions(+), 35 deletions(-)
 create mode 100644 client/src/pages/login.jsx

diff --git a/client/src/App.jsx b/client/src/App.jsx
index f081195..68f2599 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -1,5 +1,5 @@
 import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom";
-// import Login from "./pages/Login";
+import Login from "./pages/login";
 import Signup from "./pages/signup";
 import "./index.css";
 
@@ -7,9 +7,8 @@ function App() {
   return (
     <BrowserRouter>
       <Routes>
-        {/* <Route path="/login" element={<Login />} /> */}
+        <Route path="/login" element={<Login />} />
         <Route path="/signup" element={<Signup />} />
-        {/* Redirect root to login for now */}
         <Route path="/" element={<Navigate to="/signup" replace />} />
       </Routes>
     </BrowserRouter>
diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
new file mode 100644
index 0000000..84e9743
--- /dev/null
+++ b/client/src/pages/login.jsx
@@ -0,0 +1,26 @@
+import { useState } from "react";
+import { Link } from "react-router-dom";
+import { Mail, Lock, User, ArrowRight } from "lucide-react";
+
+function Login() {
+  return(
+    <div className="min-h-screen bg-[#0F0E47] flex items-center justify-center">
+      <div className="bg-[#8686AC] h-120 w-100 rounded-2xl">
+        <div id="login-icon" className="flex items-center justify-center">
+          <h1 className="text-[#272757] mt-2 text-3xl font-bold">Login</h1>
+        </div>
+        <div id="fields">
+          <div id="name" className="mt-14 text-[#0F0E47] flex flex-col">
+            <label htmlFor="name" className="ml-4 ">Username</label>
+            <input type="text" className="border-2 w-90 ml-4 p-1" placeholder="Enter You UserName" />
+          </div>
+          <div id="password" className="mt-2 text-[#0F0E47] flex flex-col">
+            <label htmlFor="name" className="ml-4 ">Password</label>
+            <input type="text" className="border-2 w-90 ml-4 p-1" placeholder="Enter Your Password" />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+export default Login;
\ No newline at end of file
diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index 7e1bb38..ed07fda 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -4,11 +4,11 @@ import { Mail, Lock, User, ArrowRight } from "lucide-react";
 
 function Signup() {
   return (
-    <div className=" min-h-screen  bg-linear-to-br from-[#6A89A7] via-[#BDDDFC] via-[#88BDF2] to-[#384959] flex justify-center items-center">
-      <div className="flex w-full max-w-6xl min-h-[650px] rounded-3xl overflow-hidden shadow-2xl bg-white">
+    <div className="m-0 min-h-screen bg-linear-to-br from-[#6A89A7] via-[#BDDDFC] via-[#88BDF2] to-[#384959] flex justify-center items-center">
+      <div id="window" className="max-w-3xl h-160 flex rounded-3xl overflow-hidden shadow-2xl bg-white scale-90">
         {/* /left side */}
-        <div className="flex-1 bg-linear-to-br from-[#3B0764] via-[#7E1E68] to-[#F97316] text-white p-10 flex flex-col justify-center">
-          <h1 className="text-4xl font-bold mb-6">
+        <div className="flex-1 bg-linear-to-br from-[#3B0764] via-[#7E1E68] to-[#F97316] text-white p-5 flex flex-col justify-center">
+          <h1 className="text-4xl font-bold mb-3">
             Developer Collaboration Platform
           </h1>
           <p className="text-slate-300 leading-7">
@@ -20,26 +20,26 @@ function Signup() {
 
         {/* right side */}
         <div className="flex-1 bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] flex items-center justify-center">
-          <div className="w-full max-w-md p-8">
+          <div className="w-full max-w-md p-4">
             <h2 className="text-3xl font-bold text-slate-800">
               Create Account
             </h2>
-            <p className=" text-slate-500 mt-2 mb-8">
+            <p className=" text-slate-500 mt-1 mb-4">
               Join the developer community today.
             </p>
 
             {/* username */}
-            <div className="mb-5">
+            <div className="mb-3">
               <label
                 htmlFor="username"
-                className="block text-sm font-medium mb-2"
+                className="block text-sm font-medium mb-1"
               >
                 Username
               </label>
-              <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+              <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
                 <User size={18} className="text-violet-500" />
                 <input
-                  className="ml-3 w-full outline-none bg-transparent"
+                  className="ml-1 w-full outline-none bg-transparent"
                   id="username"
                   type="text"
                   placeholder="enter username"
@@ -48,14 +48,14 @@ function Signup() {
             </div>
 
             {/* email */}
-            <div className="mb-5">
-              <label htmlFor="email" className="block text-sm font-medium mb-2">
+            <div className="mb-2">
+              <label htmlFor="email" className="block text-sm font-medium mb-1">
                 Email
               </label>
-              <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+              <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
                 <Mail size={18} className="text-violet-500" />
                 <input
-                  className="ml-3 w-full outline-none bg-transparent"
+                  className="ml-1 w-full outline-none bg-transparent"
                   id="email"
                   type="email"
                   placeholder="enter email"
@@ -66,11 +66,11 @@ function Signup() {
             {/* role selection */}
             <label
               htmlFor="roleSelect"
-              className="block text-sm font-medium mb-2"
+              className="block text-sm font-medium mb-1"
             >
               Role
             </label>
-            <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+            <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
               <select
                 name="roleSelection"
                 id="roleSelect"
@@ -90,17 +90,17 @@ function Signup() {
             </div>
 
             {/* password */}
-            <div className="mb-5">
+            <div className="mb-2">
               <label
                 htmlFor="password"
-                className="block text-sm font-medium mb-2"
+                className="block text-sm font-medium mb-1"
               >
                 Password
               </label>
-              <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+              <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
                 <Lock size={18} className="text-violet-500" />
                 <input
-                  className="ml-3 w-full outline-none bg-transparent"
+                  className="ml-1 w-full outline-none bg-transparent"
                   id="password"
                   type="password"
                   placeholder="enter password"
@@ -109,17 +109,17 @@ function Signup() {
             </div>
 
             {/* confirm password */}
-            <div className="mb-5">
+            <div className="mb-2">
               <label
                 htmlFor="confirmPassword"
-                className="block text-sm font-medium mb-2"
+                className="block text-sm font-medium mb-1"
               >
                 Confirm Password
               </label>
-              <div className="flex items-center border rounded-xl px-4 py-3  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
+              <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
                 <Lock size={18} className="text-violet-500" />
                 <input
-                  className="ml-3 w-full outline-none bg-transparent"
+                  className="ml-1 w-full outline-none bg-transparent"
                   id="confirmPassword"
                   type="password"
                   placeholder="confirm password"
@@ -128,9 +128,9 @@ function Signup() {
             </div>
 
             {/* terms and policy checkbox */}
-            <div className="flex items-center mb-6">
+            <div className="flex items-center mb-3">
               <input
-                className="h-4 w-4 rounded border-slate-300 text-blue-600 mr-3"
+                className="h-2 w-2 rounded border-slate-300 text-blue-600 mr-1"
                 type="checkbox"
               />
               <span className="text-sm text-gray-600">
@@ -139,30 +139,30 @@ function Signup() {
             </div>
 
             {/* create account button */}
-            <button className="w-full rounded-xl bg-linear-to-br from-blue-600 to-violet-600 hover:from-blue-700 hover:to-violet-700 text-white py-3 font-semibold flex justify-center items-center hover:scale-[1.02] active:scale-95 transition-all duration-200 gap-2 ">
+            <button className="w-full rounded-xl bg-linear-to-br from-blue-600 to-violet-600 hover:from-blue-700 hover:to-violet-700 text-white py-1 font-semibold flex justify-center items-center hover:scale-[1.02] active:scale-95 transition-all duration-200 gap-2 ">
               Create Account
               <ArrowRight size={18} />
             </button>
 
             {/* divider */}
-            <div className="flex items-center my-6">
+            <div className="flex items-center my-3">
               <div className="flex-1 border-t"></div>
-              <span className="mx-4 text-sm text-gray-400">OR</span>
+              <span className="mx-2 text-sm text-gray-400">OR</span>
               <div className="flex-1 border-t"></div>
             </div>
 
             {/*Login with google button  */}
-            <button className="w-full rounded-xl border py-3 flex items-center justify-center gap-2 hover:bg-slate-100 transition duration-200">
+            <button className="w-full rounded-xl border py-1 flex items-center justify-center gap-2 hover:bg-slate-100 transition duration-200">
               <Mail size={18} />
               Continue with Google
             </button>
 
             {/* login with github button */}
-            <button className="w-full rounded-xl border py-3 mt-3 gap-2 flex items-center justify-center hover:bg-slate-100 transition duration-200">
+            <button className="w-full rounded-xl border py-1 mt-1 gap-2 flex items-center justify-center hover:bg-slate-100 transition duration-200">
               <Mail size={18} />
               Continue with Github
             </button>
-            <p className="text-center mt-6 text-sm text-slate-600">
+            <p className="text-center mt-3 text-sm text-slate-600">
               Already have an account?{" "}
               <Link
                 to="/login"

From 58a10ad72c553e3f7be1b5210bf2e910b8d78e9f Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Sat, 4 Jul 2026 21:48:19 +0530
Subject: [PATCH 03/24] improved signup frontend css

---
 client/src/pages/signup.jsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index ed07fda..7ce4d9e 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -4,10 +4,10 @@ import { Mail, Lock, User, ArrowRight } from "lucide-react";
 
 function Signup() {
   return (
-    <div className="m-0 min-h-screen bg-linear-to-br from-[#6A89A7] via-[#BDDDFC] via-[#88BDF2] to-[#384959] flex justify-center items-center">
+    <div className="m-0 min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-center">
       <div id="window" className="max-w-3xl h-160 flex rounded-3xl overflow-hidden shadow-2xl bg-white scale-90">
         {/* /left side */}
-        <div className="flex-1 bg-linear-to-br from-[#3B0764] via-[#7E1E68] to-[#F97316] text-white p-5 flex flex-col justify-center">
+        <div className="flex-1 bg-linear-to-br from-[#4747b0] via-[#460562] via-[#ce41ce] to-[#4e064bec] text-white p-5 flex flex-col justify-center">
           <h1 className="text-4xl font-bold mb-3">
             Developer Collaboration Platform
           </h1>
@@ -139,7 +139,7 @@ function Signup() {
             </div>
 
             {/* create account button */}
-            <button className="w-full rounded-xl bg-linear-to-br from-blue-600 to-violet-600 hover:from-blue-700 hover:to-violet-700 text-white py-1 font-semibold flex justify-center items-center hover:scale-[1.02] active:scale-95 transition-all duration-200 gap-2 ">
+            <button className="w-full rounded-xl bg-linear-to-br from-[#ED80E9] to-[#9400D3] hover:from-purple-950 hover:to-purple-600 text-white py-1 font-semibold flex justify-center items-center hover:scale-[1.02] active:scale-95 transition-all duration-200 gap-2 ">
               Create Account
               <ArrowRight size={18} />
             </button>

From 77e36080db62070dfaf8b654f07448de1d4a9e02 Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sun, 5 Jul 2026 11:14:18 +0530
Subject: [PATCH 04/24] Signup page modified to scale to all device sizes and
 bug fixes

---
 client/src/pages/signup.jsx | 299 +++++++++++++++++++++---------------
 1 file changed, 171 insertions(+), 128 deletions(-)

diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index 7ce4d9e..9eedd55 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -1,181 +1,224 @@
-import { useState } from "react";
 import { Link } from "react-router-dom";
 import { Mail, Lock, User, ArrowRight } from "lucide-react";
 
 function Signup() {
   return (
-    <div className="m-0 min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-center">
-      <div id="window" className="max-w-3xl h-160 flex rounded-3xl overflow-hidden shadow-2xl bg-white scale-90">
-        {/* /left side */}
-        <div className="flex-1 bg-linear-to-br from-[#4747b0] via-[#460562] via-[#ce41ce] to-[#4e064bec] text-white p-5 flex flex-col justify-center">
-          <h1 className="text-4xl font-bold mb-3">
-            Developer Collaboration Platform
-          </h1>
-          <p className="text-slate-300 leading-7">
-            Join thousands of developers to collaborate on projects, share
-            ideas, participate in discussions, and build amazing software
-            together.
-          </p>
+    <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-start lg:items-center px-4 py-6 sm:px-6 sm:py-10 lg:px-8 lg:py-6">
+      <form
+        id="window"
+        className="w-full max-w-5xl flex flex-col lg:flex-row rounded-3xl lg:rounded-[36px] overflow-hidden bg-white border border-white/20 shadow-2xl lg:min-h-[680px]"
+      >
+        {/* Left Side */}
+        <div className="relative lg:basis-[38%] shrink-0 min-h-[200px] sm:min-h-[240px] lg:min-h-full px-6 py-8 sm:px-8 sm:py-10 bg-linear-to-br from-[#4747b0] via-[#460562] via-[#ce41ce] to-[#4e064bec] text-white flex flex-col justify-center items-center lg:items-start text-center lg:text-left">
+          <div className="absolute inset-0 bg-gradient-to-br from-white/5 via-transparent to-black/10"></div>
+
+          <div className="relative z-10 w-full max-w-sm lg:max-w-none mx-auto lg:mx-0">
+            <h1 className="text-2xl sm:text-3xl lg:text-[38px] xl:text-[42px] font-bold leading-tight mb-4 lg:mb-6">
+              Developer Collaboration Platform
+            </h1>
+
+            <p className="text-slate-200 leading-relaxed text-sm sm:text-base lg:text-lg max-w-[280px] mx-auto lg:mx-0">
+              Join thousands of developers to collaborate on projects, share
+              ideas, participate in discussions, and build amazing software
+              together.
+            </p>
+          </div>
         </div>
 
-        {/* right side */}
-        <div className="flex-1 bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] flex items-center justify-center">
-          <div className="w-full max-w-md p-4">
-            <h2 className="text-3xl font-bold text-slate-800">
+        {/* Right Side */}
+        <div className="lg:basis-[62%] bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] flex items-center justify-center py-2 lg:py-6 overflow-y-auto">
+          <div className="relative w-full max-w-[760px] px-5 py-6 sm:px-8 sm:py-8">
+            <h2 className="text-2xl sm:text-3xl font-bold text-slate-800">
               Create Account
             </h2>
-            <p className=" text-slate-500 mt-1 mb-4">
+            <p className="mt-1 mb-6 text-sm sm:text-base text-slate-500">
               Join the developer community today.
             </p>
 
-            {/* username */}
-            <div className="mb-3">
-              <label
-                htmlFor="username"
-                className="block text-sm font-medium mb-1"
-              >
-                Username
-              </label>
-              <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
-                <User size={18} className="text-violet-500" />
-                <input
-                  className="ml-1 w-full outline-none bg-transparent"
-                  id="username"
-                  type="text"
-                  placeholder="enter username"
-                />
+            {/* Username & Role */}
+            <div className="grid grid-cols-1 sm:grid-cols-2 gap-4 mb-4">
+              <div>
+                <label
+                  htmlFor="username"
+                  className="block text-sm font-semibold text-slate-700 mb-1.5"
+                >
+                  Username
+                </label>
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                  <User size={18} className="text-violet-500 shrink-0" />
+                  <input
+                    id="username"
+                    type="text"
+                    placeholder="Enter username"
+                    className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
+                  />
+                </div>
               </div>
-            </div>
 
-            {/* email */}
-            <div className="mb-2">
-              <label htmlFor="email" className="block text-sm font-medium mb-1">
-                Email
-              </label>
-              <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
-                <Mail size={18} className="text-violet-500" />
-                <input
-                  className="ml-1 w-full outline-none bg-transparent"
-                  id="email"
-                  type="email"
-                  placeholder="enter email"
-                />
+              <div>
+                <label
+                  htmlFor="roleSelect"
+                  className="block text-sm font-semibold text-slate-700 mb-1.5"
+                >
+                  Role
+                </label>
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                  <select
+                    id="roleSelect"
+                    className="w-full appearance-none bg-transparent outline-none text-slate-700 cursor-pointer text-sm sm:text-base"
+                  >
+                    <option value="">Select your role</option>
+                    <option value="project_manager">Project Manager</option>
+                    <option value="developer">Developer</option>
+                    <option value="frontend_developer">
+                      Frontend Developer
+                    </option>
+                    <option value="backend_developer">Backend Developer</option>
+                    <option value="fullstack_developer">
+                      Full Stack Developer
+                    </option>
+                  </select>
+                </div>
               </div>
             </div>
 
-            {/* role selection */}
-            <label
-              htmlFor="roleSelect"
-              className="block text-sm font-medium mb-1"
-            >
-              Role
-            </label>
-            <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
-              <select
-                name="roleSelection"
-                id="roleSelect"
-                className="w-full bg-transparent outline-none text-slate-700 cursor-pointer"
-              >
-                <option value="" disabled selected>
-                  Select your role
-                </option>
-                <option value="project_manager">Project Manager</option>
-                <option value="Developer">Developer</option>
-                <option value="frontend_developer">Frontend Developer</option>
-                <option value="backend_developer">Backend Developer</option>
-                <option value="cloud_engineer">Cloud Engineer</option>
-                <option value="data_scientist">Data Scientist</option>
-                <option value="Intern">Intern</option>
-              </select>
-            </div>
-
-            {/* password */}
-            <div className="mb-2">
+            {/* Email */}
+            <div className="mb-4">
               <label
-                htmlFor="password"
-                className="block text-sm font-medium mb-1"
+                htmlFor="email"
+                className="block text-sm font-semibold text-slate-700 mb-1.5"
               >
-                Password
+                Email Address
               </label>
-              <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
-                <Lock size={18} className="text-violet-500" />
+              <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                <Mail size={18} className="text-violet-500 shrink-0" />
                 <input
-                  className="ml-1 w-full outline-none bg-transparent"
-                  id="password"
-                  type="password"
-                  placeholder="enter password"
+                  id="email"
+                  type="email"
+                  placeholder="Enter your email address"
+                  className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                 />
               </div>
             </div>
 
-            {/* confirm password */}
-            <div className="mb-2">
-              <label
-                htmlFor="confirmPassword"
-                className="block text-sm font-medium mb-1"
-              >
-                Confirm Password
-              </label>
-              <div className="flex items-center border rounded-xl px-2 py-1  focus-within:border-blue-600 focus-within:ring-2 focus-within:ring-violet-400 transition">
-                <Lock size={18} className="text-violet-500" />
-                <input
-                  className="ml-1 w-full outline-none bg-transparent"
-                  id="confirmPassword"
-                  type="password"
-                  placeholder="confirm password"
-                />
+            {/* Password & Confirm Password */}
+            <div className="grid grid-cols-1 sm:grid-cols-2 gap-4 mb-4">
+              <div>
+                <label
+                  htmlFor="password"
+                  className="block text-sm font-semibold text-slate-700 mb-1.5"
+                >
+                  Password
+                </label>
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                  <Lock size={18} className="text-violet-500 shrink-0" />
+                  <input
+                    id="password"
+                    type="password"
+                    placeholder="Enter password"
+                    className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
+                  />
+                </div>
+              </div>
+
+              <div>
+                <label
+                  htmlFor="confirmPassword"
+                  className="block text-sm font-semibold text-slate-700 mb-1.5"
+                >
+                  Confirm Password
+                </label>
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                  <Lock size={18} className="text-violet-500 shrink-0" />
+                  <input
+                    id="confirmPassword"
+                    type="password"
+                    placeholder="Confirm password"
+                    className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
+                  />
+                </div>
               </div>
             </div>
 
-            {/* terms and policy checkbox */}
-            <div className="flex items-center mb-3">
+            {/* Terms & Privacy */}
+            <div className="flex items-start gap-3 mt-5 mb-5">
               <input
-                className="h-2 w-2 rounded border-slate-300 text-blue-600 mr-1"
+                id="terms"
                 type="checkbox"
+                className="mt-1 h-4 w-4 shrink-0 rounded border-slate-300 accent-violet-600 cursor-pointer"
               />
-              <span className="text-sm text-gray-600">
-                I agree to the terms and policy
-              </span>
+              <label
+                htmlFor="terms"
+                className="text-sm leading-6 text-slate-600 cursor-pointer"
+              >
+                I agree to the{" "}
+                <Link
+                  to="/terms"
+                  className="font-medium text-violet-600 hover:underline"
+                >
+                  Terms of Service
+                </Link>{" "}
+                and{" "}
+                <Link
+                  to="/privacy"
+                  className="font-medium text-violet-600 hover:underline"
+                >
+                  Privacy Policy
+                </Link>
+              </label>
             </div>
 
-            {/* create account button */}
-            <button className="w-full rounded-xl bg-linear-to-br from-[#ED80E9] to-[#9400D3] hover:from-purple-950 hover:to-purple-600 text-white py-1 font-semibold flex justify-center items-center hover:scale-[1.02] active:scale-95 transition-all duration-200 gap-2 ">
+            {/* Create Account Button */}
+            <button
+              type="submit"
+              className="w-full rounded-xl bg-gradient-to-r from-[#9400D3] via-[#C026D3] to-[#ED80E9] py-3.5 text-white font-semibold flex items-center justify-center gap-2 hover:from-[#ED80E9] hover:via-[#C026D3] hover:to-[#9400D3] hover:shadow-lg hover:-translate-y-0.5 active:scale-[0.98] transition-all duration-500 cursor-pointer"
+            >
               Create Account
               <ArrowRight size={18} />
             </button>
 
-            {/* divider */}
-            <div className="flex items-center my-3">
-              <div className="flex-1 border-t"></div>
-              <span className="mx-2 text-sm text-gray-400">OR</span>
-              <div className="flex-1 border-t"></div>
+            {/* Divider */}
+            <div className="flex items-center my-5">
+              <div className="flex-1 border-t border-slate-300"></div>
+              <span className="mx-4 text-xs font-semibold text-slate-400 uppercase tracking-wider">
+                Or
+              </span>
+              <div className="flex-1 border-t border-slate-300"></div>
             </div>
 
-            {/*Login with google button  */}
-            <button className="w-full rounded-xl border py-1 flex items-center justify-center gap-2 hover:bg-slate-100 transition duration-200">
-              <Mail size={18} />
-              Continue with Google
-            </button>
+            {/* Social Buttons */}
+            <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
+              <button
+                type="button"
+                className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
+              >
+                <Mail size={16} className="text-red-500" />
+                Google
+              </button>
+              <button
+                type="button"
+                className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
+              >
+                <Mail size={16} className="text-slate-800" />
+                GitHub
+              </button>
+            </div>
 
-            {/* login with github button */}
-            <button className="w-full rounded-xl border py-1 mt-1 gap-2 flex items-center justify-center hover:bg-slate-100 transition duration-200">
-              <Mail size={18} />
-              Continue with Github
-            </button>
-            <p className="text-center mt-3 text-sm text-slate-600">
+            {/* Login Link */}
+            <p className="mt-6 text-center text-sm text-slate-600">
               Already have an account?{" "}
               <Link
                 to="/login"
-                className="text-blue-600 font-semibold hover:underline"
+                className="font-semibold text-violet-600 hover:text-violet-700 hover:underline transition-colors"
               >
                 Sign In
               </Link>
             </p>
           </div>
         </div>
-      </div>
+      </form>
     </div>
   );
 }
 
-export default Signup;
+export default Signup;
\ No newline at end of file

From 523ab09e1efa0c9adf8d4afdd793947b8d50c4eb Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Sun, 5 Jul 2026 21:01:56 +0530
Subject: [PATCH 05/24] made login css and added google and github svg's

---
 client/src/assets/github.svg |  19 +++++
 client/src/assets/google.svg |   2 +
 client/src/pages/login.jsx   | 149 +++++++++++++++++++++++++++++++----
 client/src/pages/signup.jsx  |   6 +-
 4 files changed, 160 insertions(+), 16 deletions(-)
 create mode 100644 client/src/assets/github.svg
 create mode 100644 client/src/assets/google.svg

diff --git a/client/src/assets/github.svg b/client/src/assets/github.svg
new file mode 100644
index 0000000..84e4d2f
--- /dev/null
+++ b/client/src/assets/github.svg
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    
+    <title>github [#142]</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+
+</defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Dribbble-Light-Preview" transform="translate(-140.000000, -7559.000000)" fill="#000000">
+            <g id="icons" transform="translate(56.000000, 160.000000)">
+                <path d="M94,7399 C99.523,7399 104,7403.59 104,7409.253 C104,7413.782 101.138,7417.624 97.167,7418.981 C96.66,7419.082 96.48,7418.762 96.48,7418.489 C96.48,7418.151 96.492,7417.047 96.492,7415.675 C96.492,7414.719 96.172,7414.095 95.813,7413.777 C98.04,7413.523 100.38,7412.656 100.38,7408.718 C100.38,7407.598 99.992,7406.684 99.35,7405.966 C99.454,7405.707 99.797,7404.664 99.252,7403.252 C99.252,7403.252 98.414,7402.977 96.505,7404.303 C95.706,7404.076 94.85,7403.962 94,7403.958 C93.15,7403.962 92.295,7404.076 91.497,7404.303 C89.586,7402.977 88.746,7403.252 88.746,7403.252 C88.203,7404.664 88.546,7405.707 88.649,7405.966 C88.01,7406.684 87.619,7407.598 87.619,7408.718 C87.619,7412.646 89.954,7413.526 92.175,7413.785 C91.889,7414.041 91.63,7414.493 91.54,7415.156 C90.97,7415.418 89.522,7415.871 88.63,7414.304 C88.63,7414.304 88.101,7413.319 87.097,7413.247 C87.097,7413.247 86.122,7413.234 87.029,7413.87 C87.029,7413.87 87.684,7414.185 88.139,7415.37 C88.139,7415.37 88.726,7417.2 91.508,7416.58 C91.513,7417.437 91.522,7418.245 91.522,7418.489 C91.522,7418.76 91.338,7419.077 90.839,7418.982 C86.865,7417.627 84,7413.783 84,7409.253 C84,7403.59 88.478,7399 94,7399" id="github-[#142]">
+
+</path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/client/src/assets/google.svg b/client/src/assets/google.svg
new file mode 100644
index 0000000..3ffa2aa
--- /dev/null
+++ b/client/src/assets/google.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="-3 0 262 262" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid"><path d="M255.878 133.451c0-10.734-.871-18.567-2.756-26.69H130.55v48.448h71.947c-1.45 12.04-9.283 30.172-26.69 42.356l-.244 1.622 38.755 30.023 2.685.268c24.659-22.774 38.875-56.282 38.875-96.027" fill="#4285F4"/><path d="M130.55 261.1c35.248 0 64.839-11.605 86.453-31.622l-41.196-31.913c-11.024 7.688-25.82 13.055-45.257 13.055-34.523 0-63.824-22.773-74.269-54.25l-1.531.13-40.298 31.187-.527 1.465C35.393 231.798 79.49 261.1 130.55 261.1" fill="#34A853"/><path d="M56.281 156.37c-2.756-8.123-4.351-16.827-4.351-25.82 0-8.994 1.595-17.697 4.206-25.82l-.073-1.73L15.26 71.312l-1.335.635C5.077 89.644 0 109.517 0 130.55s5.077 40.905 13.925 58.602l42.356-32.782" fill="#FBBC05"/><path d="M130.55 50.479c24.514 0 41.05 10.589 50.479 19.438l36.844-35.974C195.245 12.91 165.798 0 130.55 0 79.49 0 35.393 29.301 13.925 71.947l42.211 32.783c10.59-31.477 39.891-54.251 74.414-54.251" fill="#EB4335"/></svg>
\ No newline at end of file
diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index 84e9743..f232c69 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -1,25 +1,146 @@
 import { useState } from "react";
 import { Link } from "react-router-dom";
 import { Mail, Lock, User, ArrowRight } from "lucide-react";
+import googleIcon from "../assets/google.svg";
+import githubIcon from "../assets/github.svg";
 
 function Login() {
   return(
-    <div className="min-h-screen bg-[#0F0E47] flex items-center justify-center">
-      <div className="bg-[#8686AC] h-120 w-100 rounded-2xl">
-        <div id="login-icon" className="flex items-center justify-center">
-          <h1 className="text-[#272757] mt-2 text-3xl font-bold">Login</h1>
-        </div>
-        <div id="fields">
-          <div id="name" className="mt-14 text-[#0F0E47] flex flex-col">
-            <label htmlFor="name" className="ml-4 ">Username</label>
-            <input type="text" className="border-2 w-90 ml-4 p-1" placeholder="Enter You UserName" />
-          </div>
-          <div id="password" className="mt-2 text-[#0F0E47] flex flex-col">
-            <label htmlFor="name" className="ml-4 ">Password</label>
-            <input type="text" className="border-2 w-90 ml-4 p-1" placeholder="Enter Your Password" />
+    <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] py-24 flex justify-center items-start lg:items-center px-4 py-6 sm:px-22 sm:py-24 lg:py-2">
+      <form
+        id="login-window"
+        className="w-full flex flex-col lg:flex-row lg:max-w-2xl rounded-3xl lg:rounded-[36px] overflow-hidden bg-white border border-white/20 shadow-2xl lg:min-h-[500px]"
+      >
+
+        {/* Right Side */}
+        <div className="lg:basis-[100%] bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] flex items-center justify-center py-2 lg:py-6 overflow-y-auto">
+          <div className="relative w-full max-w-[760px] px-5 py-6 sm:px-8 sm:py-8">
+            <h1 className="text-2xl sm:text-3xl font-bold text-slate-800">
+              Login into your Account
+            </h1>
+            <p className="mt-1 mb-6 text-sm sm:text-base text-slate-500">
+              Please enter your login credentials :
+            </p>
+
+            {/* Username & Role */}
+            <div className="grid grid-cols-1 sm:grid-cols-1 gap-4 mb-4">
+              <div>
+                <label
+                  htmlFor="username"
+                  className="block text-sm font-semibold text-slate-700 mb-1.5"
+                >
+                  Username
+                </label>
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                  <User size={18} className="text-violet-500 shrink-0" />
+                  <input
+                    id="username"
+                    type="text"
+                    placeholder="Enter username"
+                    className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
+                  />
+                </div>
+              </div>
+            </div>
+
+            {/* Password & Confirm Password */}
+            <div className="grid grid-cols-1 sm:grid-cols-1 gap-4 mb-4">
+              <div>
+                <label
+                  htmlFor="password"
+                  className="block text-sm font-semibold text-slate-700 mb-1.5"
+                >
+                  Password
+                </label>
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                  <Lock size={18} className="text-violet-500 shrink-0" />
+                  <input
+                    id="password"
+                    type="password"
+                    placeholder="Enter password"
+                    className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
+                  />
+                </div>
+              </div>
+            </div>
+
+            {/* Terms & Privacy */}
+            <div className="flex items-start gap-3 mt-5 mb-5">
+              <input
+                id="terms"
+                type="checkbox"
+                className="mt-1 h-4 w-4 shrink-0 rounded border-slate-300 accent-violet-600 cursor-pointer"
+              />
+              <label
+                htmlFor="terms"
+                className="text-sm leading-6 text-slate-600 cursor-pointer"
+              >
+                I agree to the{" "}
+                <Link
+                  to="/terms"
+                  className="font-medium text-violet-600 hover:underline"
+                >
+                  Terms of Service
+                </Link>{" "}
+                and{" "}
+                <Link
+                  to="/privacy"
+                  className="font-medium text-violet-600 hover:underline"
+                >
+                  Privacy Policy
+                </Link>
+              </label>
+            </div>
+
+            {/* Login Button */}
+            <button
+              type="submit"
+              className="w-full rounded-xl bg-gradient-to-r from-[#9400D3] via-[#C026D3] to-[#ED80E9] py-3.5 text-white font-semibold flex items-center justify-center gap-2 hover:from-[#ED80E9] hover:via-[#C026D3] hover:to-[#9400D3] hover:shadow-lg hover:-translate-y-0.5 active:scale-[0.98] transition-all duration-500 cursor-pointer"
+            >
+              Login
+              <ArrowRight size={18} />
+            </button>
+
+            {/* Divider */}
+            <div className="flex items-center my-5">
+              <div className="flex-1 border-t border-slate-300"></div>
+              <span className="mx-4 text-xs font-semibold text-slate-400 uppercase tracking-wider">
+                Or
+              </span>
+              <div className="flex-1 border-t border-slate-300"></div>
+            </div>
+
+            {/* Social Buttons */}
+            <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
+              <button
+                type="button"
+                className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
+              >
+                <img src={googleIcon} alt="Google" className="w-5 h-5" />
+                Google
+              </button>
+              <button
+                type="button"
+                className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
+              >
+                <img src={githubIcon} alt="Google" className="w-5 h-5" />
+                GitHub
+              </button>
+            </div>
+
+            {/* Signup Link */}
+            <p className="mt-6 text-center text-sm text-slate-600">
+              Don't have an account?{" "}
+              <Link
+                to="/signup"
+                className="font-semibold text-violet-600 hover:text-violet-700 hover:underline transition-colors"
+              >
+                Sign Up
+              </Link>
+            </p>
           </div>
         </div>
-      </div>
+      </form>
     </div>
   );
 }
diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index 9eedd55..cb82f4c 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -1,5 +1,7 @@
 import { Link } from "react-router-dom";
 import { Mail, Lock, User, ArrowRight } from "lucide-react";
+import googleIcon from "../assets/google.svg";
+import githubIcon from "../assets/github.svg";
 
 function Signup() {
   return (
@@ -192,14 +194,14 @@ function Signup() {
                 type="button"
                 className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
               >
-                <Mail size={16} className="text-red-500" />
+                <img src={googleIcon} alt="Google" className="w-5 h-5" />
                 Google
               </button>
               <button
                 type="button"
                 className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
               >
-                <Mail size={16} className="text-slate-800" />
+                <img src={githubIcon} alt="Google" className="w-5 h-5" />
                 GitHub
               </button>
             </div>

From 9b36f03071e2d499faa8e914874c8e892a6ce8c0 Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sun, 5 Jul 2026 21:32:49 +0530
Subject: [PATCH 06/24] removed basis and added full width in login

---
 client/src/pages/login.jsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index f232c69..3105187 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -6,15 +6,15 @@ import githubIcon from "../assets/github.svg";
 
 function Login() {
   return(
-    <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] py-24 flex justify-center items-start lg:items-center px-4 py-6 sm:px-22 sm:py-24 lg:py-2">
+    <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-start lg:items-center px-4 py-6 sm:px-8  lg:px-20">
       <form
         id="login-window"
-        className="w-full flex flex-col lg:flex-row lg:max-w-2xl rounded-3xl lg:rounded-[36px] overflow-hidden bg-white border border-white/20 shadow-2xl lg:min-h-[500px]"
+        className="w-full max-w-2xl rounded-3xl lg:rounded-[36px] overflow-hidden bg-white border border-white/20 shadow-2xl lg:min-h-[500px]"
       >
 
         {/* Right Side */}
-        <div className="lg:basis-[100%] bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] flex items-center justify-center py-2 lg:py-6 overflow-y-auto">
-          <div className="relative w-full max-w-[760px] px-5 py-6 sm:px-8 sm:py-8">
+        <div className="w-full bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] flex items-center justify-center py-2 lg:py-6 overflow-y-auto">
+          <div className="w-full p-8">
             <h1 className="text-2xl sm:text-3xl font-bold text-slate-800">
               Login into your Account
             </h1>
@@ -31,7 +31,7 @@ function Login() {
                 >
                   Username
                 </label>
-                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-3 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
                   <User size={18} className="text-violet-500 shrink-0" />
                   <input
                     id="username"
@@ -52,7 +52,7 @@ function Login() {
                 >
                   Password
                 </label>
-                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-3 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
                   <Lock size={18} className="text-violet-500 shrink-0" />
                   <input
                     id="password"
@@ -95,7 +95,7 @@ function Login() {
             {/* Login Button */}
             <button
               type="submit"
-              className="w-full rounded-xl bg-gradient-to-r from-[#9400D3] via-[#C026D3] to-[#ED80E9] py-3.5 text-white font-semibold flex items-center justify-center gap-2 hover:from-[#ED80E9] hover:via-[#C026D3] hover:to-[#9400D3] hover:shadow-lg hover:-translate-y-0.5 active:scale-[0.98] transition-all duration-500 cursor-pointer"
+              className="w-full rounded-xl bg-gradient-to-r from-[#9400D3] via-[#C026D3] to-[#ED80E9] py-3 text-white font-semibold flex items-center justify-center gap-2 hover:from-[#ED80E9] hover:via-[#C026D3] hover:to-[#9400D3] hover:shadow-lg hover:-translate-y-0.5 active:scale-[0.98] transition-all duration-500 cursor-pointer"
             >
               Login
               <ArrowRight size={18} />

From b6baf0f2030678c1abc49de82748d73f0819796a Mon Sep 17 00:00:00 2001
From: soham-andhale <soham.andhale3@gmail.com>
Date: Mon, 6 Jul 2026 22:41:41 +0530
Subject: [PATCH 07/24] created forgot password page

---
 client/src/App.jsx                  |  2 ++
 client/src/pages/forgotpassword.jsx | 11 +++++++++++
 2 files changed, 13 insertions(+)
 create mode 100644 client/src/pages/forgotpassword.jsx

diff --git a/client/src/App.jsx b/client/src/App.jsx
index 68f2599..7955844 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -1,6 +1,7 @@
 import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom";
 import Login from "./pages/login";
 import Signup from "./pages/signup";
+import Forgotpassword from "./pages/forgotpassword";
 import "./index.css";
 
 function App() {
@@ -9,6 +10,7 @@ function App() {
       <Routes>
         <Route path="/login" element={<Login />} />
         <Route path="/signup" element={<Signup />} />
+        <Route path="/forgotpassword" element={<Forgotpassword />} />
         <Route path="/" element={<Navigate to="/signup" replace />} />
       </Routes>
     </BrowserRouter>
diff --git a/client/src/pages/forgotpassword.jsx b/client/src/pages/forgotpassword.jsx
new file mode 100644
index 0000000..7a4a41c
--- /dev/null
+++ b/client/src/pages/forgotpassword.jsx
@@ -0,0 +1,11 @@
+import { useState } from "react";
+import { Link } from "react-router-dom";
+import { Mail, Lock, User, ArrowRight } from "lucide-react";
+
+function Forgotpassword(){
+    return(
+        <div></div>
+    )
+}
+
+export default Forgotpassword;
\ No newline at end of file

From ab3e4807fcd7e459da37b57436e56392a01a1b25 Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Mon, 6 Jul 2026 22:48:04 +0530
Subject: [PATCH 08/24] added toggle password feature in login and signup page

---
 client/src/assets/eyeOff.svg |  8 ++++++++
 client/src/assets/eyeOn.svg  |  9 +++++++++
 client/src/pages/login.jsx   | 16 ++++++++++++++--
 client/src/pages/signup.jsx  | 25 +++++++++++++++++++++++--
 4 files changed, 54 insertions(+), 4 deletions(-)
 create mode 100644 client/src/assets/eyeOff.svg
 create mode 100644 client/src/assets/eyeOn.svg

diff --git a/client/src/assets/eyeOff.svg b/client/src/assets/eyeOff.svg
new file mode 100644
index 0000000..5a0b98a
--- /dev/null
+++ b/client/src/assets/eyeOff.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.4955 7.44088C3.54724 8.11787 2.77843 8.84176 2.1893 9.47978C0.857392 10.9222 0.857393 13.0778 2.1893 14.5202C3.9167 16.391 7.18879 19 12 19C13.2958 19 14.4799 18.8108 15.5523 18.4977L13.8895 16.8349C13.2936 16.9409 12.6638 17 12 17C7.9669 17 5.18832 14.82 3.65868 13.1634C3.03426 12.4872 3.03426 11.5128 3.65868 10.8366C4.23754 10.2097 4.99526 9.50784 5.93214 8.87753L4.4955 7.44088Z" fill="#0F0F0F"/>
+<path d="M8.53299 11.4784C8.50756 11.6486 8.49439 11.8227 8.49439 12C8.49439 13.933 10.0614 15.5 11.9944 15.5C12.1716 15.5 12.3458 15.4868 12.516 15.4614L8.53299 11.4784Z" fill="#0F0F0F"/>
+<path d="M15.4661 12.4471L11.5473 8.52829C11.6937 8.50962 11.8429 8.5 11.9944 8.5C13.9274 8.5 15.4944 10.067 15.4944 12C15.4944 12.1515 15.4848 12.3007 15.4661 12.4471Z" fill="#0F0F0F"/>
+<path d="M18.1118 15.0928C19.0284 14.4702 19.7715 13.7805 20.3413 13.1634C20.9657 12.4872 20.9657 11.5128 20.3413 10.8366C18.8117 9.18002 16.0331 7 12 7C11.3594 7 10.7505 7.05499 10.1732 7.15415L8.50483 5.48582C9.5621 5.1826 10.7272 5 12 5C16.8112 5 20.0833 7.60905 21.8107 9.47978C23.1426 10.9222 23.1426 13.0778 21.8107 14.5202C21.2305 15.1486 20.476 15.8603 19.5474 16.5284L18.1118 15.0928Z" fill="#0F0F0F"/>
+<path d="M2.00789 3.42207C1.61736 3.03155 1.61736 2.39838 2.00789 2.00786C2.39841 1.61733 3.03158 1.61733 3.4221 2.00786L22.0004 20.5862C22.391 20.9767 22.391 21.6099 22.0004 22.0004C21.6099 22.3909 20.9767 22.3909 20.5862 22.0004L2.00789 3.42207Z" fill="#0F0F0F"/>
+</svg>
\ No newline at end of file
diff --git a/client/src/assets/eyeOn.svg b/client/src/assets/eyeOn.svg
new file mode 100644
index 0000000..4d27ebc
--- /dev/null
+++ b/client/src/assets/eyeOn.svg
@@ -0,0 +1,9 @@
+<?xml version="1.0" ?>
+
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#000000" width="800px" height="800px" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg">
+
<title/>
+
<g>
+
<path d="M94.9936,44.6718C83.6788,27.7025,70.155,11.9989,48,11.9989S12.3212,27.7025,1.0064,44.6718a6.0063,6.0063,0,0,0,0,6.6564C12.3212,68.2975,25.845,84.0011,48,84.0011S83.6788,68.2975,94.9936,51.3282A6.0063,6.0063,0,0,0,94.9936,44.6718ZM48,72.0007C35.2672,72.0007,25.3294,65.21,13.2646,48,25.3294,30.7905,35.2672,23.9993,48,23.9993S70.6706,30.7905,82.7354,48C70.6706,65.21,60.7328,72.0007,48,72.0007Z"/>
+
<path d="M48,36A12,12,0,1,0,60,48,12.0161,12.0161,0,0,0,48,36Z"/>
+
</g>
+
</svg>
\ No newline at end of file
diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index 3105187..7c5cd15 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -3,8 +3,12 @@ import { Link } from "react-router-dom";
 import { Mail, Lock, User, ArrowRight } from "lucide-react";
 import googleIcon from "../assets/google.svg";
 import githubIcon from "../assets/github.svg";
+import eyeOn from "../assets/eyeOn.svg"
+import eyeOff from "../assets/eyeOff.svg"
 
 function Login() {
+  const [showPassword, setShowPassword] = useState(false);
+
   return(
     <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-start lg:items-center px-4 py-6 sm:px-8  lg:px-20">
       <form
@@ -52,14 +56,22 @@ function Login() {
                 >
                   Password
                 </label>
-                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-3 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                <div className="relative flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-3 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
                   <Lock size={18} className="text-violet-500 shrink-0" />
                   <input
                     id="password"
-                    type="password"
+                    type={showPassword ? "text" : "password"}
                     placeholder="Enter password"
                     className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                   />
+                  <button 
+                  type="button"
+                  onClick={()=>setShowPassword(!showPassword)} 
+                  className="cursor-pointer">
+                    <img src={showPassword ? eyeOff : eyeOn} 
+                    alt="toggle-password"
+                    className="w-5 h-5" />
+                  </button>
                 </div>
               </div>
             </div>
diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index cb82f4c..b97c1fa 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -2,8 +2,13 @@ import { Link } from "react-router-dom";
 import { Mail, Lock, User, ArrowRight } from "lucide-react";
 import googleIcon from "../assets/google.svg";
 import githubIcon from "../assets/github.svg";
+import eyeOn from "../assets/eyeOn.svg";
+import eyeOff from "../assets/eyeOff.svg";
+import { useState } from "react";
 
 function Signup() {
+  const [showPassword,setShowPassword] = useState(false);
+  const [ConfirmPassword,setConfirmPassword] = useState(false);
   return (
     <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-start lg:items-center px-4 py-6 sm:px-6 sm:py-10 lg:px-8 lg:py-6">
       <form
@@ -116,10 +121,18 @@ function Signup() {
                   <Lock size={18} className="text-violet-500 shrink-0" />
                   <input
                     id="password"
-                    type="password"
+                    type={showPassword ? "text" : "password"}
                     placeholder="Enter password"
                     className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                   />
+                  <button 
+                  type="button"
+                  onClick={()=>setShowPassword(!showPassword)}
+                  className="cursor-pointer"
+                  >
+                    <img src={showPassword ? eyeOff:eyeOn} alt="toggle-icon" 
+                    className="w-5 h-5" />
+                  </button>
                 </div>
               </div>
 
@@ -134,10 +147,18 @@ function Signup() {
                   <Lock size={18} className="text-violet-500 shrink-0" />
                   <input
                     id="confirmPassword"
-                    type="password"
+                    type={ConfirmPassword ? "text":"password"}
                     placeholder="Confirm password"
                     className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                   />
+                  <button 
+                  type="button"
+                  onClick={()=>setConfirmPassword(!ConfirmPassword)}
+                  className="cursor-pointer"
+                  >
+                    <img src={ConfirmPassword ? eyeOff:eyeOn} alt="toggle-password"
+                    className="w-5 h-5" />
+                  </button>
                 </div>
               </div>
             </div>

From eff09e70b54ea5f1a7ad80c62e0ecca884a5a412 Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Wed, 8 Jul 2026 21:54:21 +0530
Subject: [PATCH 09/24] setup and created prisma schema

---
 README.md                                      | 15 +++++++++++----
 client/src/pages/signup.jsx                    |  2 ++
 server/package-lock.json                       | 18 ++++++++++++++++++
 server/package.json                            |  1 +
 server/{prisma.config.ts => prisma.config.js}  |  6 ++----
 .../20260708161847_init/migration.sql          | 12 ++++++++++++
 server/prisma/migrations/migration_lock.toml   |  3 +++
 server/prisma/schema.prisma                    | 10 ++++++++++
 8 files changed, 59 insertions(+), 8 deletions(-)
 rename server/{prisma.config.ts => prisma.config.js} (55%)
 create mode 100644 server/prisma/migrations/20260708161847_init/migration.sql
 create mode 100644 server/prisma/migrations/migration_lock.toml

diff --git a/README.md b/README.md
index 51f10c3..8378129 100644
--- a/README.md
+++ b/README.md
@@ -17,6 +17,10 @@ Developer-Collaboration-Platform
 │  │  ├─ App.css
 │  │  ├─ App.jsx
 │  │  ├─ assets
+│  │  │  ├─ eyeOff.svg
+│  │  │  ├─ eyeOn.svg
+│  │  │  ├─ github.svg
+│  │  │  ├─ google.svg
 │  │  │  ├─ hero.png
 │  │  │  ├─ react.svg
 │  │  │  └─ vite.svg
@@ -28,11 +32,13 @@ Developer-Collaboration-Platform
 │  │  ├─ index.css
 │  │  ├─ main.jsx
 │  │  ├─ pages
+│  │  │  ├─ forgotpassword.jsx
+│  │  │  ├─ login.jsx
+│  │  │  └─ signup.jsx
 │  │  ├─ services
 │  │  ├─ styles
 │  │  └─ utils
 │  └─ vite.config.js
-├─ docs
 ├─ LICENSE
 ├─ README.md
 └─ server
@@ -46,8 +52,9 @@ Developer-Collaboration-Platform
       ├─ config
       ├─ controllers
       ├─ middleware
-      ├─ models
       ├─ server.js
       ├─ services
-      └─ utils
-```
+      ├─ utils
+      └─ validators
+
+```
\ No newline at end of file
diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index b97c1fa..f9af6b7 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -1,3 +1,5 @@
+// signup.jsx
+
 import { Link } from "react-router-dom";
 import { Mail, Lock, User, ArrowRight } from "lucide-react";
 import googleIcon from "../assets/google.svg";
diff --git a/server/package-lock.json b/server/package-lock.json
index f253983..754e3e1 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -17,6 +17,7 @@
         "jsonwebtoken": "^9.0.3"
       },
       "devDependencies": {
+        "@types/node": "^26.1.1",
         "nodemon": "^3.1.14",
         "prisma": "^7.8.0"
       }
@@ -415,6 +416,16 @@
       "devOptional": true,
       "license": "MIT"
     },
+    "node_modules/@types/node": {
+      "version": "26.1.1",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-26.1.1.tgz",
+      "integrity": "sha512-nxAkRSVkN1Y0JC1W8ky/fTfkGsMmcrRsbx+3XoZE+rMOX71kLYTV7fLXpqud1GpbpP5TuffXFqfX7fH2GgZREw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~8.3.0"
+      }
+    },
     "node_modules/@types/react": {
       "version": "19.2.17",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.17.tgz",
@@ -2476,6 +2487,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/undici-types": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-8.3.0.tgz",
+      "integrity": "sha512-j375ScV60dom+YkPFIfTLcOiPxkN/buHz5GobjLhixFuANaNs3C9l4GmrWqejgXWJ7BbJcFYpTEUkS1Ge8bpZQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/unpipe": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
diff --git a/server/package.json b/server/package.json
index b88a3e4..9d90078 100644
--- a/server/package.json
+++ b/server/package.json
@@ -18,6 +18,7 @@
     "jsonwebtoken": "^9.0.3"
   },
   "devDependencies": {
+    "@types/node": "^26.1.1",
     "nodemon": "^3.1.14",
     "prisma": "^7.8.0"
   }
diff --git a/server/prisma.config.ts b/server/prisma.config.js
similarity index 55%
rename from server/prisma.config.ts
rename to server/prisma.config.js
index 831a20f..d14ee13 100644
--- a/server/prisma.config.ts
+++ b/server/prisma.config.js
@@ -1,5 +1,3 @@
-// This file was generated by Prisma, and assumes you have installed the following:
-// npm install --save-dev prisma dotenv
 import "dotenv/config";
 import { defineConfig } from "prisma/config";
 
@@ -9,6 +7,6 @@ export default defineConfig({
     path: "prisma/migrations",
   },
   datasource: {
-    url: process.env["DATABASE_URL"],
+    url: process.env.DATABASE_URL,
   },
-});
+});
\ No newline at end of file
diff --git a/server/prisma/migrations/20260708161847_init/migration.sql b/server/prisma/migrations/20260708161847_init/migration.sql
new file mode 100644
index 0000000..aaadb06
--- /dev/null
+++ b/server/prisma/migrations/20260708161847_init/migration.sql
@@ -0,0 +1,12 @@
+-- CreateTable
+CREATE TABLE "User" (
+    "id" SERIAL NOT NULL,
+    "username" TEXT NOT NULL,
+    "email" TEXT NOT NULL,
+    "password" TEXT NOT NULL,
+    "role" TEXT NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "User_pkey" PRIMARY KEY ("id")
+);
diff --git a/server/prisma/migrations/migration_lock.toml b/server/prisma/migrations/migration_lock.toml
new file mode 100644
index 0000000..044d57c
--- /dev/null
+++ b/server/prisma/migrations/migration_lock.toml
@@ -0,0 +1,3 @@
+# Please do not edit this file manually
+# It should be added in your version-control system (e.g., Git)
+provider = "postgresql"
diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index 10c4de8..f7308e4 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -11,3 +11,13 @@ generator client {
 datasource db {
   provider = "postgresql"
 }
+
+model User {
+  id Int @id @default(autoincrement())
+  username String
+  email String
+  password String
+  role String 
+  createdAt DateTime @default(now())
+  updatedAt DateTime @updatedAt
+}
\ No newline at end of file

From 54cd2c74069355b22e5b6384c0a8fe4d6feed1e9 Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Thu, 9 Jul 2026 21:49:30 +0530
Subject: [PATCH 10/24] added route,controller in backend and setup backend
 server

---
 client/package-lock.json                  | 311 +++++++++++++++++++++-
 client/package.json                       |   1 +
 server/package.json                       |   5 +-
 server/src/app.js                         |  23 ++
 server/src/config/prisma.js               |   0
 server/src/controllers/auth.controller.js |  21 ++
 server/src/routes/auth.routes.js          |   7 +
 server/src/server.js                      |  10 +
 server/src/services/auth.service.js       |   0
 server/src/validators/auth.validator.js   |   0
 10 files changed, 375 insertions(+), 3 deletions(-)
 create mode 100644 server/src/config/prisma.js
 create mode 100644 server/src/controllers/auth.controller.js
 create mode 100644 server/src/routes/auth.routes.js
 create mode 100644 server/src/services/auth.service.js
 create mode 100644 server/src/validators/auth.validator.js

diff --git a/client/package-lock.json b/client/package-lock.json
index 93eacf3..69fa9ae 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.0.0",
       "dependencies": {
         "@tailwindcss/vite": "^4.3.2",
+        "axios": "^1.18.1",
         "lucide-react": "^1.23.0",
         "react": "^19.2.7",
         "react-dom": "^19.2.7",
@@ -1169,6 +1170,18 @@
         "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
       }
     },
+    "node_modules/agent-base": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
+      "integrity": "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 6.0.0"
+      }
+    },
     "node_modules/ajv": {
       "version": "6.15.0",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.15.0.tgz",
@@ -1186,6 +1199,24 @@
         "url": "https://github.com/sponsors/epoberezkin"
       }
     },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
+      "license": "MIT"
+    },
+    "node_modules/axios": {
+      "version": "1.18.1",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.18.1.tgz",
+      "integrity": "sha512-3nTvFlvpn9Zu/RkHUqtc7/+al4UpRW5az71ap5zccp6e8RAYEzhMTecX8Dz1wWDYrPpUoB1HAQEGEAEvUr7S9g==",
+      "license": "MIT",
+      "dependencies": {
+        "follow-redirects": "^1.16.0",
+        "form-data": "^4.0.5",
+        "https-proxy-agent": "^5.0.1",
+        "proxy-from-env": "^2.1.0"
+      }
+    },
     "node_modules/balanced-match": {
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
@@ -1256,6 +1287,19 @@
         "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
       }
     },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/caniuse-lite": {
       "version": "1.0.30001799",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001799.tgz",
@@ -1277,6 +1321,18 @@
       ],
       "license": "CC-BY-4.0"
     },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "license": "MIT",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/convert-source-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
@@ -1323,7 +1379,6 @@
       "version": "4.4.3",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
       "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "^2.1.3"
@@ -1344,6 +1399,15 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/detect-libc": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
@@ -1353,6 +1417,20 @@
         "node": ">=8"
       }
     },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/electron-to-chromium": {
       "version": "1.5.381",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.381.tgz",
@@ -1373,6 +1451,51 @@
         "node": ">=10.13.0"
       }
     },
+    "node_modules/es-define-property": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-object-atoms": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.2.tgz",
+      "integrity": "sha512-HWcBoN6NileqtSydK2FqHbS/LoDd2pqrnQHLyJzBj4kOp/ky2MWMN694xOfkK8/SnUsW2DH7EfyVlydKCsm1Zw==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-set-tostringtag": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/escalade": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
@@ -1670,6 +1793,42 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/follow-redirects": {
+      "version": "1.16.0",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.16.0.tgz",
+      "integrity": "sha512-y5rN/uOsadFT/JfYwhxRS5R7Qce+g3zG97+JrtFZlC9klX/W5hD7iiLzScI4nZqUS7DNUdhPgw4xI8W2LuXlUw==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/form-data": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.6.tgz",
+      "integrity": "sha512-vKatAh4SlVfgbv+YtmhiRjhEMJsYpsG1Y2rMQtR+SVSbytsSD1YGzDIcrAJmdFec88u/+VoGmxnl+80gL1tRCQ==",
+      "license": "MIT",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "es-set-tostringtag": "^2.1.0",
+        "hasown": "^2.0.4",
+        "mime-types": "^2.1.35"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@@ -1684,6 +1843,15 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
+    "node_modules/function-bind": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/gensync": {
       "version": "1.0.0-beta.2",
       "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -1694,6 +1862,43 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/get-intrinsic": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "function-bind": "^1.1.2",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/glob-parent": {
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
@@ -1720,12 +1925,63 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/gopd": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/graceful-fs": {
       "version": "4.2.11",
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
       "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
       "license": "ISC"
     },
+    "node_modules/has-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-tostringtag": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
+      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
+      "license": "MIT",
+      "dependencies": {
+        "has-symbols": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/hasown": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.4.tgz",
+      "integrity": "sha512-T2UbfbBEF32wiepXIsMlTW9+dDYC6wMh/t/vYA4tuOMKqWz/n3vr1NFSxQiyP+zk2mXsoMA/i/7qV6LKut1t1A==",
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/hermes-estree": {
       "version": "0.25.1",
       "resolved": "https://registry.npmjs.org/hermes-estree/-/hermes-estree-0.25.1.tgz",
@@ -1743,6 +1999,19 @@
         "hermes-estree": "0.25.1"
       }
     },
+    "node_modules/https-proxy-agent": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz",
+      "integrity": "sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==",
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "6",
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/ignore": {
       "version": "5.3.2",
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
@@ -2173,6 +2442,36 @@
         "@jridgewell/sourcemap-codec": "^1.5.5"
       }
     },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/minimatch": {
       "version": "10.2.5",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.2.5.tgz",
@@ -2193,7 +2492,6 @@
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/nanoid": {
@@ -2357,6 +2655,15 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/proxy-from-env": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-2.1.0.tgz",
+      "integrity": "sha512-cJ+oHTW1VAEa8cJslgmUZrc+sjRKgAKl3Zyse6+PV38hZe/V6Z14TbCuXcan9F9ghlz4QrFr2c92TNF82UkYHA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
diff --git a/client/package.json b/client/package.json
index 7569686..e4b78a7 100644
--- a/client/package.json
+++ b/client/package.json
@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@tailwindcss/vite": "^4.3.2",
+    "axios": "^1.18.1",
     "lucide-react": "^1.23.0",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
diff --git a/server/package.json b/server/package.json
index 9d90078..cec574e 100644
--- a/server/package.json
+++ b/server/package.json
@@ -1,9 +1,12 @@
 {
   "name": "server",
   "version": "1.0.0",
+  "type": "module",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "dev": "nodemon src/server.js",
+    "start": "node src/server.js"
   },
   "keywords": [],
   "author": "",
diff --git a/server/src/app.js b/server/src/app.js
index e69de29..29eaec6 100644
--- a/server/src/app.js
+++ b/server/src/app.js
@@ -0,0 +1,23 @@
+import express from "express";
+import cors from "cors";
+
+import route from "./routes/auth.routes.js";
+
+const app = express();
+
+// Middleware
+app.use(cors());
+app.use(express.json());
+
+// Routes
+app.use("/api/auth",route);
+
+// default route
+app.get("/",(req,res) => {
+  res.json({
+    success: true,
+    message: "Developer Collaboration Platform API running"
+  });
+});
+
+export default app;
\ No newline at end of file
diff --git a/server/src/config/prisma.js b/server/src/config/prisma.js
new file mode 100644
index 0000000..e69de29
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
new file mode 100644
index 0000000..6455add
--- /dev/null
+++ b/server/src/controllers/auth.controller.js
@@ -0,0 +1,21 @@
+export const registerUser = async(req,res) => {
+  try {
+    console.log(req.body);
+
+    return res.status(201).json(
+      {
+        success: true,
+        messege: "Register API working",
+        data: req.body
+      }
+    );
+  } catch (error) {
+    
+    return res.status(500).json(
+      {
+        success: false,
+        messege: "Internal Service error"
+      }
+    );
+  }
+};
\ No newline at end of file
diff --git a/server/src/routes/auth.routes.js b/server/src/routes/auth.routes.js
new file mode 100644
index 0000000..c651787
--- /dev/null
+++ b/server/src/routes/auth.routes.js
@@ -0,0 +1,7 @@
+import express from "express";
+import {registerUser} from "../controllers/auth.controller.js"
+
+const route = express.Router();
+route.post("/register",registerUser);
+
+export default route;
\ No newline at end of file
diff --git a/server/src/server.js b/server/src/server.js
index e69de29..394fe9f 100644
--- a/server/src/server.js
+++ b/server/src/server.js
@@ -0,0 +1,10 @@
+import dotenv from "dotenv";
+import app from "./app.js";
+
+dotenv.config();
+
+const PORT = process.env.PORT || 6000;
+
+app.listen(PORT, ()=> {
+  console.log(`✅ server running: ${PORT}`);
+});
\ No newline at end of file
diff --git a/server/src/services/auth.service.js b/server/src/services/auth.service.js
new file mode 100644
index 0000000..e69de29
diff --git a/server/src/validators/auth.validator.js b/server/src/validators/auth.validator.js
new file mode 100644
index 0000000..e69de29

From 1fb9f4ed147cc7997f13d15f296a4d3032669545 Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Fri, 10 Jul 2026 23:36:19 +0530
Subject: [PATCH 11/24] Implemented Account Creation Logic

---
 client/src/pages/signup.jsx               |  116 ++-
 server/package-lock.json                  | 1145 +--------------------
 server/package.json                       |    4 +-
 server/prisma/schema.prisma               |    9 +-
 server/src/controllers/auth.controller.js |  101 +-
 5 files changed, 250 insertions(+), 1125 deletions(-)

diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index f9af6b7..02c03f4 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -11,10 +11,76 @@ import { useState } from "react";
 function Signup() {
   const [showPassword,setShowPassword] = useState(false);
   const [ConfirmPassword,setConfirmPassword] = useState(false);
+  const [formData, setFormData] = useState({
+    username: "",
+    roleSelect: "",
+    email: "",
+    password: "",
+    confirmPassword: "",
+  });
+  const [error, setError] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleChange = (e)=>{
+    setFormData({ ...formData, [e.target.id]: e.target.value});
+  };
+
+  const handleSubmit = async (e)=>{
+    e.preventDefault(); //Avoids page Refreshing
+    setError("");
+
+     if (formData.username.length < 3)
+       return setError("Username must be at least 3 characters.");
+     if (formData.username.includes(" "))
+       return setError("Username cannot contain spaces.");
+     const passwordRegex = /^(?=.*[0-9])(?=.*[!@#$%^&*(),.?":{}|<>]).{8,}$/;
+     if (!passwordRegex.test(formData.password))
+       return setError("Password must be at least 8 chars, with 1 number and 1 special char.");
+     if (formData.password !== formData.confirmPassword)
+       return setError("Passwords do not match!");
+     if (!formData.roleSelect) 
+      return setError("Please select a role.");
+
+
+    try{
+      setIsLoading(true);
+      const response = await fetch("http://localhost:5000/api/auth/register",
+        {
+          method: "POST",
+          headers: {"Content-Type": "application/json"},
+          body: JSON.stringify({
+            username: formData.username,
+            role: formData.roleSelect,
+            email: formData.email,
+            password: formData.password,
+          }),
+        }
+      );
+
+      const data = await response.json();
+
+      if(!response.ok){
+        throw new Error(data.message || "Registration failed");
+      }
+
+      alert("Account created Successfully");
+      console.log(data);
+    }
+
+    catch (err){
+      setError(err.message);
+    }
+
+    finally {
+      setIsLoading(false);
+    }
+  };
+
   return (
     <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-start lg:items-center px-4 py-6 sm:px-6 sm:py-10 lg:px-8 lg:py-6">
       <form
         id="window"
+        onSubmit={handleSubmit}
         className="w-full max-w-5xl flex flex-col lg:flex-row rounded-3xl lg:rounded-[36px] overflow-hidden bg-white border border-white/20 shadow-2xl lg:min-h-[680px]"
       >
         {/* Left Side */}
@@ -43,7 +109,7 @@ function Signup() {
             <p className="mt-1 mb-6 text-sm sm:text-base text-slate-500">
               Join the developer community today.
             </p>
-
+            {error && <p className="text-red-500 text-sm mb-4">{error}</p>}
             {/* Username & Role */}
             <div className="grid grid-cols-1 sm:grid-cols-2 gap-4 mb-4">
               <div>
@@ -58,6 +124,10 @@ function Signup() {
                   <input
                     id="username"
                     type="text"
+                    minLength={3}
+                    required
+                    value={formData.username}
+                    onChange={handleChange}
                     placeholder="Enter username"
                     className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                   />
@@ -74,6 +144,9 @@ function Signup() {
                 <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
                   <select
                     id="roleSelect"
+                    required
+                    value={formData.roleSelect}
+                    onChange={handleChange}
                     className="w-full appearance-none bg-transparent outline-none text-slate-700 cursor-pointer text-sm sm:text-base"
                   >
                     <option value="">Select your role</option>
@@ -104,6 +177,9 @@ function Signup() {
                 <input
                   id="email"
                   type="email"
+                  required
+                  value={formData.email}
+                  onChange={handleChange}
                   placeholder="Enter your email address"
                   className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                 />
@@ -124,16 +200,23 @@ function Signup() {
                   <input
                     id="password"
                     type={showPassword ? "text" : "password"}
+                    minLength={8}
+                    required
+                    value={formData.password}
+                    onChange={handleChange}
                     placeholder="Enter password"
                     className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                   />
-                  <button 
-                  type="button"
-                  onClick={()=>setShowPassword(!showPassword)}
-                  className="cursor-pointer"
+                  <button
+                    type="button"
+                    onClick={() => setShowPassword(!showPassword)}
+                    className="cursor-pointer"
                   >
-                    <img src={showPassword ? eyeOff:eyeOn} alt="toggle-icon" 
-                    className="w-5 h-5" />
+                    <img
+                      src={showPassword ? eyeOff : eyeOn}
+                      alt="toggle-icon"
+                      className="w-5 h-5"
+                    />
                   </button>
                 </div>
               </div>
@@ -149,17 +232,22 @@ function Signup() {
                   <Lock size={18} className="text-violet-500 shrink-0" />
                   <input
                     id="confirmPassword"
-                    type={ConfirmPassword ? "text":"password"}
+                    type={ConfirmPassword ? "text" : "password"}
+                    value={formData.confirmPassword}
+                    onChange={handleChange}
                     placeholder="Confirm password"
                     className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                   />
-                  <button 
-                  type="button"
-                  onClick={()=>setConfirmPassword(!ConfirmPassword)}
-                  className="cursor-pointer"
+                  <button
+                    type="button"
+                    onClick={() => setConfirmPassword(!ConfirmPassword)}
+                    className="cursor-pointer"
                   >
-                    <img src={ConfirmPassword ? eyeOff:eyeOn} alt="toggle-password"
-                    className="w-5 h-5" />
+                    <img
+                      src={ConfirmPassword ? eyeOff : eyeOn}
+                      alt="toggle-password"
+                      className="w-5 h-5"
+                    />
                   </button>
                 </div>
               </div>
diff --git a/server/package-lock.json b/server/package-lock.json
index 754e3e1..1cc2625 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.0.0",
       "license": "ISC",
       "dependencies": {
-        "@prisma/client": "^7.8.0",
+        "@prisma/client": "^5.14.0",
         "bcrypt": "^6.0.0",
         "cors": "^2.8.6",
         "dotenv": "^17.4.2",
@@ -19,403 +19,77 @@
       "devDependencies": {
         "@types/node": "^26.1.1",
         "nodemon": "^3.1.14",
-        "prisma": "^7.8.0"
+        "prisma": "^5.14.0"
       }
     },
-    "node_modules/@electric-sql/pglite": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/@electric-sql/pglite/-/pglite-0.4.1.tgz",
-      "integrity": "sha512-mZ9NzzUSYPOCnxHH1oAHPRzoMFJHY472raDKwXl/+6oPbpdJ7g8LsCN4FSaIIfkiCKHhb3iF/Zqo3NYxaIhU7Q==",
-      "devOptional": true,
-      "license": "Apache-2.0"
-    },
-    "node_modules/@electric-sql/pglite-socket": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/@electric-sql/pglite-socket/-/pglite-socket-0.1.1.tgz",
-      "integrity": "sha512-p2hoXw3Z3LQHwTeikdZNsFBOvXGqKY2hk51BBw+8NKND8eoH+8LFOtW9Z8CQKmTJ2qqGYu82ipqiyFZOTTXNfw==",
-      "devOptional": true,
-      "license": "Apache-2.0",
-      "bin": {
-        "pglite-server": "dist/scripts/server.js"
-      },
-      "peerDependencies": {
-        "@electric-sql/pglite": "0.4.1"
-      }
-    },
-    "node_modules/@electric-sql/pglite-tools": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/@electric-sql/pglite-tools/-/pglite-tools-0.3.1.tgz",
-      "integrity": "sha512-C+T3oivmy9bpQvSxVqXA1UDY8cB9Eb9vZHL9zxWwEUfDixbXv4G3r2LjoTdR33LD8aomR3O9ZXEO3XEwr/cUCA==",
-      "devOptional": true,
-      "license": "Apache-2.0",
-      "peerDependencies": {
-        "@electric-sql/pglite": "0.4.1"
-      }
-    },
-    "node_modules/@hono/node-server": {
-      "version": "1.19.11",
-      "resolved": "https://registry.npmjs.org/@hono/node-server/-/node-server-1.19.11.tgz",
-      "integrity": "sha512-dr8/3zEaB+p0D2n/IUrlPF1HZm586qgJNXK1a9fhg/PzdtkK7Ksd5l312tJX2yBuALqDYBlG20QEbayqPyxn+g==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=18.14.1"
-      },
-      "peerDependencies": {
-        "hono": "^4"
-      }
-    },
-    "node_modules/@kurkle/color": {
-      "version": "0.3.4",
-      "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.4.tgz",
-      "integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/@prisma/client": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/@prisma/client/-/client-7.8.0.tgz",
-      "integrity": "sha512-HFp3Dawv/3sU3JtlPha90IB+48lS7zHiH4LKZPjmcE8YH5P9DOXGPvo8dqOtO7MqLDd1p2hOWMcFlRT1DMblHw==",
+      "version": "5.22.0",
+      "resolved": "https://registry.npmjs.org/@prisma/client/-/client-5.22.0.tgz",
+      "integrity": "sha512-M0SVXfyHnQREBKxCgyo7sffrKttwE6R8PMq330MIUF0pTwjUhLbW84pFDlf06B27XyCR++VtjugEnIHdr07SVA==",
+      "hasInstallScript": true,
       "license": "Apache-2.0",
-      "dependencies": {
-        "@prisma/client-runtime-utils": "7.8.0"
-      },
       "engines": {
-        "node": "^20.19 || ^22.12 || >=24.0"
+        "node": ">=16.13"
       },
       "peerDependencies": {
-        "prisma": "*",
-        "typescript": ">=5.4.0"
+        "prisma": "*"
       },
       "peerDependenciesMeta": {
         "prisma": {
           "optional": true
-        },
-        "typescript": {
-          "optional": true
         }
       }
     },
-    "node_modules/@prisma/client-runtime-utils": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/@prisma/client-runtime-utils/-/client-runtime-utils-7.8.0.tgz",
-      "integrity": "sha512-5NQZztQ0oY/ADFkmd9gPuweH5A1/CCY8YQPorLLO0Mu6a87mY5gsnDkzmFmIHs9NFaLnZojzgddFVN4RpKYrdw==",
-      "license": "Apache-2.0"
-    },
-    "node_modules/@prisma/config": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/@prisma/config/-/config-7.8.0.tgz",
-      "integrity": "sha512-HFESzd9rx2ZQxlK+TL7tu1HPvCqrHiL6LCxYykI2c34mvaUuIVVl3lYuicJD/MNnzgPnyeBEMlK4WTomJCV5jw==",
-      "devOptional": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "c12": "3.3.4",
-        "deepmerge-ts": "7.1.5",
-        "effect": "3.20.0",
-        "empathic": "2.0.0"
-      }
-    },
     "node_modules/@prisma/debug": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/@prisma/debug/-/debug-7.8.0.tgz",
-      "integrity": "sha512-p+QZReysDUqXC+mk17q9a+Y/qzh4c2KYliDK30buYUyfrGeTGSyfmc0AIrJRhZJrLHhRiJa9Au/J72h3C+szvA==",
+      "version": "5.22.0",
+      "resolved": "https://registry.npmjs.org/@prisma/debug/-/debug-5.22.0.tgz",
+      "integrity": "sha512-AUt44v3YJeggO2ZU5BkXI7M4hu9BF2zzH2iF2V5pyXT/lRTyWiElZ7It+bRH1EshoMRxHgpYg4VB6rCM+mG5jQ==",
       "devOptional": true,
       "license": "Apache-2.0"
     },
-    "node_modules/@prisma/dev": {
-      "version": "0.24.3",
-      "resolved": "https://registry.npmjs.org/@prisma/dev/-/dev-0.24.3.tgz",
-      "integrity": "sha512-ffHlQuKXZiaDt9Go0OnCTdJZrHxK0k7omJKNV86/VjpsXu5EIHZLK0T7JSWgvNlJwh56kW9JFu9v0qJciFzepg==",
-      "devOptional": true,
-      "license": "ISC",
-      "dependencies": {
-        "@electric-sql/pglite": "0.4.1",
-        "@electric-sql/pglite-socket": "0.1.1",
-        "@electric-sql/pglite-tools": "0.3.1",
-        "@hono/node-server": "1.19.11",
-        "@prisma/get-platform": "7.2.0",
-        "@prisma/query-plan-executor": "7.2.0",
-        "@prisma/streams-local": "0.1.2",
-        "foreground-child": "3.3.1",
-        "get-port-please": "3.2.0",
-        "hono": "^4.12.8",
-        "http-status-codes": "2.3.0",
-        "pathe": "2.0.3",
-        "proper-lockfile": "4.1.2",
-        "remeda": "2.33.4",
-        "std-env": "3.10.0",
-        "valibot": "1.2.0",
-        "zeptomatch": "2.1.0"
-      }
-    },
     "node_modules/@prisma/engines": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/@prisma/engines/-/engines-7.8.0.tgz",
-      "integrity": "sha512-jx3rCnNNrt5uzbkKlegtQ2GZHxSlihMCzutgT/BP6UIDF1r9tDI39hV/0T/cHZgzJ3ELbuQPXlVZy+Y1n0pcgw==",
+      "version": "5.22.0",
+      "resolved": "https://registry.npmjs.org/@prisma/engines/-/engines-5.22.0.tgz",
+      "integrity": "sha512-UNjfslWhAt06kVL3CjkuYpHAWSO6L4kDCVPegV6itt7nD1kSJavd3vhgAEhjglLJJKEdJ7oIqDJ+yHk6qO8gPA==",
       "devOptional": true,
       "hasInstallScript": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@prisma/debug": "7.8.0",
-        "@prisma/engines-version": "7.8.0-6.3c6e192761c0362d496ed980de936e2f3cebcd3a",
-        "@prisma/fetch-engine": "7.8.0",
-        "@prisma/get-platform": "7.8.0"
+        "@prisma/debug": "5.22.0",
+        "@prisma/engines-version": "5.22.0-44.605197351a3c8bdd595af2d2a9bc3025bca48ea2",
+        "@prisma/fetch-engine": "5.22.0",
+        "@prisma/get-platform": "5.22.0"
       }
     },
     "node_modules/@prisma/engines-version": {
-      "version": "7.8.0-6.3c6e192761c0362d496ed980de936e2f3cebcd3a",
-      "resolved": "https://registry.npmjs.org/@prisma/engines-version/-/engines-version-7.8.0-6.3c6e192761c0362d496ed980de936e2f3cebcd3a.tgz",
-      "integrity": "sha512-fJPQxCkLgA5EayWaW8eArgCvjJ+N+Kz3VyeNKMEeYiQC4alNkxRKFVAGxv/ZUzuJISKqdw+zGeDbS6mn6RCPOA==",
+      "version": "5.22.0-44.605197351a3c8bdd595af2d2a9bc3025bca48ea2",
+      "resolved": "https://registry.npmjs.org/@prisma/engines-version/-/engines-version-5.22.0-44.605197351a3c8bdd595af2d2a9bc3025bca48ea2.tgz",
+      "integrity": "sha512-2PTmxFR2yHW/eB3uqWtcgRcgAbG1rwG9ZriSvQw+nnb7c4uCr3RAcGMb6/zfE88SKlC1Nj2ziUvc96Z379mHgQ==",
       "devOptional": true,
       "license": "Apache-2.0"
     },
-    "node_modules/@prisma/engines/node_modules/@prisma/get-platform": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/@prisma/get-platform/-/get-platform-7.8.0.tgz",
-      "integrity": "sha512-WlxgRGnolL8VH2EmkH1R/DkKNr/mVdS3G2h42IZFFZ3eUrH9OT6t73kIOSlkkrv50wG123Iq8d96ufv5LlZktw==",
-      "devOptional": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@prisma/debug": "7.8.0"
-      }
-    },
     "node_modules/@prisma/fetch-engine": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/@prisma/fetch-engine/-/fetch-engine-7.8.0.tgz",
-      "integrity": "sha512-gwB0Euiz/DDRyxFRpLXYlK3RfaZUj1c5dAYMuhZYfApg7arknJlcb9bIsOHDppJmbqYaVA+yBIiFMDBfprsNPQ==",
+      "version": "5.22.0",
+      "resolved": "https://registry.npmjs.org/@prisma/fetch-engine/-/fetch-engine-5.22.0.tgz",
+      "integrity": "sha512-bkrD/Mc2fSvkQBV5EpoFcZ87AvOgDxbG99488a5cexp5Ccny+UM6MAe/UFkUC0wLYD9+9befNOqGiIJhhq+HbA==",
       "devOptional": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@prisma/debug": "7.8.0",
-        "@prisma/engines-version": "7.8.0-6.3c6e192761c0362d496ed980de936e2f3cebcd3a",
-        "@prisma/get-platform": "7.8.0"
-      }
-    },
-    "node_modules/@prisma/fetch-engine/node_modules/@prisma/get-platform": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/@prisma/get-platform/-/get-platform-7.8.0.tgz",
-      "integrity": "sha512-WlxgRGnolL8VH2EmkH1R/DkKNr/mVdS3G2h42IZFFZ3eUrH9OT6t73kIOSlkkrv50wG123Iq8d96ufv5LlZktw==",
-      "devOptional": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@prisma/debug": "7.8.0"
+        "@prisma/debug": "5.22.0",
+        "@prisma/engines-version": "5.22.0-44.605197351a3c8bdd595af2d2a9bc3025bca48ea2",
+        "@prisma/get-platform": "5.22.0"
       }
     },
     "node_modules/@prisma/get-platform": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/@prisma/get-platform/-/get-platform-7.2.0.tgz",
-      "integrity": "sha512-k1V0l0Td1732EHpAfi2eySTezyllok9dXb6UQanajkJQzPUGi3vO2z7jdkz67SypFTdmbnyGYxvEvYZdZsMAVA==",
-      "devOptional": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@prisma/debug": "7.2.0"
-      }
-    },
-    "node_modules/@prisma/get-platform/node_modules/@prisma/debug": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/@prisma/debug/-/debug-7.2.0.tgz",
-      "integrity": "sha512-YSGTiSlBAVJPzX4ONZmMotL+ozJwQjRmZweQNIq/ER0tQJKJynNkRB3kyvt37eOfsbMCXk3gnLF6J9OJ4QWftw==",
-      "devOptional": true,
-      "license": "Apache-2.0"
-    },
-    "node_modules/@prisma/query-plan-executor": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/@prisma/query-plan-executor/-/query-plan-executor-7.2.0.tgz",
-      "integrity": "sha512-EOZmNzcV8uJ0mae3DhTsiHgoNCuu1J9mULQpGCh62zN3PxPTd+qI9tJvk5jOst8WHKQNwJWR3b39t0XvfBB0WQ==",
-      "devOptional": true,
-      "license": "Apache-2.0"
-    },
-    "node_modules/@prisma/streams-local": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/@prisma/streams-local/-/streams-local-0.1.2.tgz",
-      "integrity": "sha512-l49yTxKKF2odFxaAXTmwmkBKL3+bVQ1tFOooGifu4xkdb9NMNLxHj27XAhTylWZod8I+ISGM5erU1xcl/oBCtg==",
+      "version": "5.22.0",
+      "resolved": "https://registry.npmjs.org/@prisma/get-platform/-/get-platform-5.22.0.tgz",
+      "integrity": "sha512-pHhpQdr1UPFpt+zFfnPazhulaZYCUqeIcPpJViYoq9R+D/yw4fjE+CtnsnKzPYm0ddUbeXUzjGVGIRVgPDCk4Q==",
       "devOptional": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "ajv": "^8.12.0",
-        "better-result": "^2.7.0",
-        "env-paths": "^3.0.0",
-        "proper-lockfile": "^4.1.2"
-      },
-      "engines": {
-        "bun": ">=1.3.6",
-        "node": ">=22.0.0"
-      }
-    },
-    "node_modules/@prisma/studio-core": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@prisma/studio-core/-/studio-core-0.27.3.tgz",
-      "integrity": "sha512-AADjNFPdsrglxHQVTmHFqv6DuKQZ5WY4p5/gVFY017twvNrSwpLJ9lqUbYYxEu2W7nbvVxTZA8deJ8LseNALsw==",
-      "devOptional": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@radix-ui/react-toggle": "1.1.10",
-        "chart.js": "4.5.1"
-      },
-      "engines": {
-        "node": "^20.19 || ^22.12 || >=24.0",
-        "pnpm": "8"
-      },
-      "peerDependencies": {
-        "@types/react": "^18.0.0 || ^19.0.0",
-        "react": "^18.0.0 || ^19.0.0",
-        "react-dom": "^18.0.0 || ^19.0.0"
-      }
-    },
-    "node_modules/@radix-ui/primitive": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.1.3.tgz",
-      "integrity": "sha512-JTF99U/6XIjCBo0wqkU5sK10glYe27MRRsfwoiq5zzOEZLHU3A3KCMa5X/azekYRCJ0HlwI0crAXS/5dEHTzDg==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/@radix-ui/react-compose-refs": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.1.2.tgz",
-      "integrity": "sha512-z4eqJvfiNnFMHIIvXP3CY57y2WJs5g2v3X0zm9mEJkrkNv4rDxu+sg9Jh8EkXyeqBkB7SOcboo9dMVqhyrACIg==",
-      "devOptional": true,
-      "license": "MIT",
-      "peerDependencies": {
-        "@types/react": "*",
-        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@radix-ui/react-primitive": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.1.3.tgz",
-      "integrity": "sha512-m9gTwRkhy2lvCPe6QJp4d3G1TYEUHn/FzJUtq9MjH46an1wJU+GdoGC5VLof8RX8Ft/DlpshApkhswDLZzHIcQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "@radix-ui/react-slot": "1.2.3"
-      },
-      "peerDependencies": {
-        "@types/react": "*",
-        "@types/react-dom": "*",
-        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
-        "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        },
-        "@types/react-dom": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@radix-ui/react-slot": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.2.3.tgz",
-      "integrity": "sha512-aeNmHnBxbi2St0au6VBVC7JXFlhLlOnvIIlePNniyUNAClzmtAUEY8/pBiK3iHjufOlwA+c20/8jngo7xcrg8A==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "@radix-ui/react-compose-refs": "1.1.2"
-      },
-      "peerDependencies": {
-        "@types/react": "*",
-        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@radix-ui/react-toggle": {
-      "version": "1.1.10",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-toggle/-/react-toggle-1.1.10.tgz",
-      "integrity": "sha512-lS1odchhFTeZv3xwHH31YPObmJn8gOg7Lq12inrr0+BH/l3Tsq32VfjqH1oh80ARM3mlkfMic15n0kg4sD1poQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "@radix-ui/primitive": "1.1.3",
-        "@radix-ui/react-primitive": "2.1.3",
-        "@radix-ui/react-use-controllable-state": "1.2.2"
-      },
-      "peerDependencies": {
-        "@types/react": "*",
-        "@types/react-dom": "*",
-        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
-        "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        },
-        "@types/react-dom": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@radix-ui/react-use-controllable-state": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.2.2.tgz",
-      "integrity": "sha512-BjasUjixPFdS+NKkypcyyN5Pmg83Olst0+c6vGov0diwTEo6mgdqVR6hxcEgFuh4QrAs7Rc+9KuGJ9TVCj0Zzg==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "@radix-ui/react-use-effect-event": "0.0.2",
-        "@radix-ui/react-use-layout-effect": "1.1.1"
-      },
-      "peerDependencies": {
-        "@types/react": "*",
-        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@radix-ui/react-use-effect-event": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-use-effect-event/-/react-use-effect-event-0.0.2.tgz",
-      "integrity": "sha512-Qp8WbZOBe+blgpuUT+lw2xheLP8q0oatc9UpmiemEICxGvFLYmHm9QowVZGHtJlGbS6A6yJ3iViad/2cVjnOiA==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "@radix-ui/react-use-layout-effect": "1.1.1"
-      },
-      "peerDependencies": {
-        "@types/react": "*",
-        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@radix-ui/react-use-layout-effect": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.1.1.tgz",
-      "integrity": "sha512-RbJRS4UWQFkzHTTwVymMTUv8EqYhOp8dOOviLj2ugtTiXRaRQS7GLGxZTLL1jWhMeoSCf5zmcZkqTl9IiYfXcQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "peerDependencies": {
-        "@types/react": "*",
-        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        }
+        "@prisma/debug": "5.22.0"
       }
     },
-    "node_modules/@standard-schema/spec": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz",
-      "integrity": "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/@types/node": {
       "version": "26.1.1",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-26.1.1.tgz",
@@ -426,17 +100,6 @@
         "undici-types": "~8.3.0"
       }
     },
-    "node_modules/@types/react": {
-      "version": "19.2.17",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.17.tgz",
-      "integrity": "sha512-MXfmqaVPEVgkBT/aY0aGCkRWWtByiYQXo3xdQ8r5RzuFrPiRn8Gar2tQdXSUQ2GKV3bkXckek89V8wQBY2Q/Aw==",
-      "devOptional": true,
-      "license": "MIT",
-      "peer": true,
-      "dependencies": {
-        "csstype": "^3.2.2"
-      }
-    },
     "node_modules/accepts": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/accepts/-/accepts-2.0.0.tgz",
@@ -450,23 +113,6 @@
         "node": ">= 0.6"
       }
     },
-    "node_modules/ajv": {
-      "version": "8.20.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.20.0.tgz",
-      "integrity": "sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "fast-deep-equal": "^3.1.3",
-        "fast-uri": "^3.0.1",
-        "json-schema-traverse": "^1.0.0",
-        "require-from-string": "^2.0.2"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/epoberezkin"
-      }
-    },
     "node_modules/anymatch": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
@@ -481,16 +127,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/aws-ssl-profiles": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/aws-ssl-profiles/-/aws-ssl-profiles-1.1.2.tgz",
-      "integrity": "sha512-NZKeq9AfyQvEeNlN0zSYAaWrmBffJh3IELMZfRpJVWgrpEbtEpnjvzqBPf+mxoI287JohRDoa+/nsfqqiZmF6g==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 6.0.0"
-      }
-    },
     "node_modules/balanced-match": {
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
@@ -515,13 +151,6 @@
         "node": ">= 18"
       }
     },
-    "node_modules/better-result": {
-      "version": "2.9.2",
-      "resolved": "https://registry.npmjs.org/better-result/-/better-result-2.9.2.tgz",
-      "integrity": "sha512-WIFoBPCdnTOdk9inkE1ZRvCZ4P0CpSkAiLlchC65N7n9DcjZ3NhqkBOlafzpOVnO8ixyi37kicmSJ3ENhPZl7Q==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/binary-extensions": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
@@ -613,35 +242,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/c12": {
-      "version": "3.3.4",
-      "resolved": "https://registry.npmjs.org/c12/-/c12-3.3.4.tgz",
-      "integrity": "sha512-cM0ApFQSBXuourJejzwv/AuPRvAxordTyParRVcHjjtXirtkzM0uK2L9TTn9s0cXZbG7E55jCivRQzoxYmRAlA==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "chokidar": "^5.0.0",
-        "confbox": "^0.2.4",
-        "defu": "^6.1.6",
-        "dotenv": "^17.3.1",
-        "exsolve": "^1.0.8",
-        "giget": "^3.2.0",
-        "jiti": "^2.6.1",
-        "ohash": "^2.0.11",
-        "pathe": "^2.0.3",
-        "perfect-debounce": "^2.1.0",
-        "pkg-types": "^2.3.0",
-        "rc9": "^3.0.1"
-      },
-      "peerDependencies": {
-        "magicast": "*"
-      },
-      "peerDependenciesMeta": {
-        "magicast": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/call-bind-apply-helpers": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
@@ -671,42 +271,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/chart.js": {
-      "version": "4.5.1",
-      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.5.1.tgz",
-      "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "@kurkle/color": "^0.3.0"
-      },
-      "engines": {
-        "pnpm": ">=8"
-      }
-    },
-    "node_modules/chokidar": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-5.0.0.tgz",
-      "integrity": "sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "readdirp": "^5.0.0"
-      },
-      "engines": {
-        "node": ">= 20.19.0"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
-    "node_modules/confbox": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.2.4.tgz",
-      "integrity": "sha512-ysOGlgTFbN2/Y6Cg3Iye8YKulHw+R2fNXHrgSmXISQdMnomY6eNDprVdW9R5xBguEqI954+S6709UyiO7B+6OQ==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/content-disposition": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-1.1.0.tgz",
@@ -764,29 +328,6 @@
         "url": "https://opencollective.com/express"
       }
     },
-    "node_modules/cross-spawn": {
-      "version": "7.0.6",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
-      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "path-key": "^3.1.0",
-        "shebang-command": "^2.0.0",
-        "which": "^2.0.1"
-      },
-      "engines": {
-        "node": ">= 8"
-      }
-    },
-    "node_modules/csstype": {
-      "version": "3.2.3",
-      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
-      "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "peer": true
-    },
     "node_modules/debug": {
       "version": "4.4.3",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
@@ -804,33 +345,6 @@
         }
       }
     },
-    "node_modules/deepmerge-ts": {
-      "version": "7.1.5",
-      "resolved": "https://registry.npmjs.org/deepmerge-ts/-/deepmerge-ts-7.1.5.tgz",
-      "integrity": "sha512-HOJkrhaYsweh+W+e74Yn7YStZOilkoPb6fycpwNLKzSPtruFs48nYis0zy5yJz1+ktUhHxoRDJ27RQAWLIJVJw==",
-      "devOptional": true,
-      "license": "BSD-3-Clause",
-      "engines": {
-        "node": ">=16.0.0"
-      }
-    },
-    "node_modules/defu": {
-      "version": "6.1.7",
-      "resolved": "https://registry.npmjs.org/defu/-/defu-6.1.7.tgz",
-      "integrity": "sha512-7z22QmUWiQ/2d0KkdYmANbRUVABpZ9SNYyH5vx6PZ+nE5bcC0l7uFvEfHlyld/HcGBFTL536ClDt3DEcSlEJAQ==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/denque": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/denque/-/denque-2.1.0.tgz",
-      "integrity": "sha512-HVQE3AAb/pxF8fQAoiqpvg9i3evqug3hoiwakOyZAwJm+6vZehbkYXZ0l4JxS+I3QxM97v5aaRNhj8v5oBhekw==",
-      "devOptional": true,
-      "license": "Apache-2.0",
-      "engines": {
-        "node": ">=0.10"
-      }
-    },
     "node_modules/depd": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
@@ -840,13 +354,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/destr": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/destr/-/destr-2.0.5.tgz",
-      "integrity": "sha512-ugFTXCtDZunbzasqBxrK93Ik/DRYsO6S/fedkWEMKqt04xZ4csmnmwGDBAb07QWNaGMAmnTIemsYZCksjATwsA==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/dotenv": {
       "version": "17.4.2",
       "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-17.4.2.tgz",
@@ -888,27 +395,6 @@
       "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
       "license": "MIT"
     },
-    "node_modules/effect": {
-      "version": "3.20.0",
-      "resolved": "https://registry.npmjs.org/effect/-/effect-3.20.0.tgz",
-      "integrity": "sha512-qMLfDJscrNG8p/aw+IkT9W7fgj50Z4wG5bLBy0Txsxz8iUHjDIkOgO3SV0WZfnQbNG2VJYb0b+rDLMrhM4+Krw==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "@standard-schema/spec": "^1.0.0",
-        "fast-check": "^3.23.1"
-      }
-    },
-    "node_modules/empathic": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/empathic/-/empathic-2.0.0.tgz",
-      "integrity": "sha512-i6UzDscO/XfAcNYD75CfICkmfLedpyPDdozrLMmQc5ORaQcdMoc21OnlEylMIqI7U8eniKrPMxxtj8k0vhmJhA==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=14"
-      }
-    },
     "node_modules/encodeurl": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
@@ -918,19 +404,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/env-paths": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/env-paths/-/env-paths-3.0.0.tgz",
-      "integrity": "sha512-dtJUTepzMW3Lm/NPxRf3wP4642UWhjL2sQxc+ym2YMj1m/H2zDNQOlezafzkHwn6sMstjHTwG6iQQsctDW/b1A==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/es-define-property": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
@@ -1007,71 +480,17 @@
         "router": "^2.2.0",
         "send": "^1.1.0",
         "serve-static": "^2.2.0",
-        "statuses": "^2.0.1",
-        "type-is": "^2.0.1",
-        "vary": "^1.1.2"
-      },
-      "engines": {
-        "node": ">= 18"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/express"
-      }
-    },
-    "node_modules/exsolve": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/exsolve/-/exsolve-1.1.0.tgz",
-      "integrity": "sha512-D+42+T12DdIlJM3uepa55qGiL3sYdLBOxIl2ifQCzCHz4c7eiolaHsi3BIqEr7JxBzxv2pYZQX9kw16ziMcEmw==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/fast-check": {
-      "version": "3.23.2",
-      "resolved": "https://registry.npmjs.org/fast-check/-/fast-check-3.23.2.tgz",
-      "integrity": "sha512-h5+1OzzfCC3Ef7VbtKdcv7zsstUQwUDlYpUTvjeUsJAssPgLn7QzbboPtL5ro04Mq0rPOsMzl7q5hIbRs2wD1A==",
-      "devOptional": true,
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://github.com/sponsors/dubzzz"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/fast-check"
-        }
-      ],
-      "license": "MIT",
-      "dependencies": {
-        "pure-rand": "^6.1.0"
-      },
-      "engines": {
-        "node": ">=8.0.0"
-      }
-    },
-    "node_modules/fast-deep-equal": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
-      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/fast-uri": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.3.tgz",
-      "integrity": "sha512-i70LwGWUduXqzicKXWshooq+sWL1K3WUU5rKZNG/0i3a1OSoX3HqhH5WbWwTmqWfor4urUakGPiRQcleRZTwOg==",
-      "devOptional": true,
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/fastify"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/fastify"
-        }
-      ],
-      "license": "BSD-3-Clause"
+        "statuses": "^2.0.1",
+        "type-is": "^2.0.1",
+        "vary": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
     },
     "node_modules/fill-range": {
       "version": "7.1.1",
@@ -1107,23 +526,6 @@
         "url": "https://opencollective.com/express"
       }
     },
-    "node_modules/foreground-child": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
-      "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",
-      "devOptional": true,
-      "license": "ISC",
-      "dependencies": {
-        "cross-spawn": "^7.0.6",
-        "signal-exit": "^4.0.1"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/forwarded": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
@@ -1166,16 +568,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/generate-function": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.3.1.tgz",
-      "integrity": "sha512-eeB5GfMNeevm/GRYq20ShmsaGcmI81kIX2K9XQx5miC8KdHaC6Jm0qQ8ZNeGOi7wYB8OsdxKs+Y2oVuTFuVwKQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "is-property": "^1.0.2"
-      }
-    },
     "node_modules/get-intrinsic": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
@@ -1200,13 +592,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/get-port-please": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/get-port-please/-/get-port-please-3.2.0.tgz",
-      "integrity": "sha512-I9QVvBw5U/hw3RmWpYKRumUeaDgxTPd401x364rLmWBJcOQ753eov1eTgzDqRG9bqFIfDc7gfzcQEWrUri3o1A==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/get-proto": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
@@ -1220,16 +605,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/giget": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/giget/-/giget-3.3.0.tgz",
-      "integrity": "sha512-gzi2D96p+AMfDcmJHGDj3KJ9NRiwvlFAU5yfa3ROwWZmFUjX4P43x3BcyRaOMMLto1vUo7C+86+MFhYTl6Ryiw==",
-      "devOptional": true,
-      "license": "MIT",
-      "bin": {
-        "giget": "dist/cli.mjs"
-      }
-    },
     "node_modules/glob-parent": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
@@ -1255,27 +630,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/graceful-fs": {
-      "version": "4.2.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
-      "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
-      "devOptional": true,
-      "license": "ISC"
-    },
-    "node_modules/grammex": {
-      "version": "3.1.12",
-      "resolved": "https://registry.npmjs.org/grammex/-/grammex-3.1.12.tgz",
-      "integrity": "sha512-6ufJOsSA7LcQehIJNCO7HIBykfM7DXQual0Ny780/DEcJIpBlHRvcqEBWGPYd7hrXL2GJ3oJI1MIhaXjWmLQOQ==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/graphmatch": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/graphmatch/-/graphmatch-1.1.1.tgz",
-      "integrity": "sha512-5ykVn/EXM1hF0XCaWh05VbYvEiOL2lY1kBxZtaYsyvjp7cmWOU1XsAdfQBwClraEofXDT197lFbXOEVMHpvQOg==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@@ -1310,16 +664,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/hono": {
-      "version": "4.12.27",
-      "resolved": "https://registry.npmjs.org/hono/-/hono-4.12.27.tgz",
-      "integrity": "sha512-1yrb/+w6HWQJrUCLkJ2IF5jNIPvvFkblV5RNOYl6bV+OA6p9GLcMpHFFGTosSvHvcAUibuUukRqhlYI4z32C7Q==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=16.9.0"
-      }
-    },
     "node_modules/http-errors": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz",
@@ -1340,13 +684,6 @@
         "url": "https://opencollective.com/express"
       }
     },
-    "node_modules/http-status-codes": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/http-status-codes/-/http-status-codes-2.3.0.tgz",
-      "integrity": "sha512-RJ8XvFvpPM/Dmc5SV+dC4y5PCeOhT3x1Hq0NU3rjGeg5a/CqlhZ7uudknPwZFz4aeAXDcbAyaeP7GAo9lvngtA==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/iconv-lite": {
       "version": "0.7.2",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.7.2.tgz",
@@ -1437,37 +774,6 @@
       "integrity": "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==",
       "license": "MIT"
     },
-    "node_modules/is-property": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
-      "integrity": "sha512-Ks/IoX00TtClbGQr4TWXemAnktAQvYB7HzcCxDGqEZU6oCmb2INHuOoKxbtR+HFkmYWBKv/dOZtGRiAjDhj92g==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/isexe": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
-      "devOptional": true,
-      "license": "ISC"
-    },
-    "node_modules/jiti": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.7.0.tgz",
-      "integrity": "sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "bin": {
-        "jiti": "lib/jiti-cli.mjs"
-      }
-    },
-    "node_modules/json-schema-traverse": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
-      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/jsonwebtoken": {
       "version": "9.0.3",
       "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-9.0.3.tgz",
@@ -1553,29 +859,6 @@
       "integrity": "sha512-Sb487aTOCr9drQVL8pIxOzVhafOjZN9UU54hiN8PU3uAiSV7lx1yYNpbNmex2PK6dSJoNTSJUUswT651yww3Mg==",
       "license": "MIT"
     },
-    "node_modules/long": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/long/-/long-5.3.2.tgz",
-      "integrity": "sha512-mNAgZ1GmyNhD7AuqnTG3/VQ26o760+ZYBPKjPvugO8+nLbYfX6TVpJPseBvopbdY+qpZ/lKUnmEc1LeZYS3QAA==",
-      "devOptional": true,
-      "license": "Apache-2.0"
-    },
-    "node_modules/lru.min": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/lru.min/-/lru.min-1.1.4.tgz",
-      "integrity": "sha512-DqC6n3QQ77zdFpCMASA1a3Jlb64Hv2N2DciFGkO/4L9+q/IpIAuRlKOvCXabtRW6cQf8usbmM6BE/TOPysCdIA==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "bun": ">=1.0.0",
-        "deno": ">=1.30.0",
-        "node": ">=8.0.0"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/wellwelwel"
-      }
-    },
     "node_modules/math-intrinsics": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
@@ -1653,40 +936,6 @@
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
       "license": "MIT"
     },
-    "node_modules/mysql2": {
-      "version": "3.15.3",
-      "resolved": "https://registry.npmjs.org/mysql2/-/mysql2-3.15.3.tgz",
-      "integrity": "sha512-FBrGau0IXmuqg4haEZRBfHNWB5mUARw6hNwPDXXGg0XzVJ50mr/9hb267lvpVMnhZ1FON3qNd4Xfcez1rbFwSg==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "aws-ssl-profiles": "^1.1.1",
-        "denque": "^2.1.0",
-        "generate-function": "^2.3.1",
-        "iconv-lite": "^0.7.0",
-        "long": "^5.2.1",
-        "lru.min": "^1.0.0",
-        "named-placeholders": "^1.1.3",
-        "seq-queue": "^0.0.5",
-        "sqlstring": "^2.3.2"
-      },
-      "engines": {
-        "node": ">= 8.0"
-      }
-    },
-    "node_modules/named-placeholders": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/named-placeholders/-/named-placeholders-1.1.6.tgz",
-      "integrity": "sha512-Tz09sEL2EEuv5fFowm419c1+a/jSMiBjI9gHxVLrVdbUkkNUUfjsVYs9pVZu5oCon/kmRh9TfLEObFtkVxmY0w==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "lru.min": "^1.1.0"
-      },
-      "engines": {
-        "node": ">=8.0.0"
-      }
-    },
     "node_modules/negotiator": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz",
@@ -1814,13 +1063,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/ohash": {
-      "version": "2.0.11",
-      "resolved": "https://registry.npmjs.org/ohash/-/ohash-2.0.11.tgz",
-      "integrity": "sha512-RdR9FQrFwNBNXAr4GixM8YaRZRJ5PUWbKYbE5eOsrwAjJW0q2REGcf79oYPsLyskQCZG1PLN+S/K1V00joZAoQ==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/on-finished": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
@@ -1851,16 +1093,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/path-key": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
-      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/path-to-regexp": {
       "version": "8.4.2",
       "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.4.2.tgz",
@@ -1871,20 +1103,6 @@
         "url": "https://opencollective.com/express"
       }
     },
-    "node_modules/pathe": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
-      "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/perfect-debounce": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/perfect-debounce/-/perfect-debounce-2.1.0.tgz",
-      "integrity": "sha512-LjgdTytVFXeUgtHZr9WYViYSM/g8MkcTPYDlPa3cDqMirHjKiSZPYd6DoL7pK8AJQr+uWkQvCjHNdiMqsrJs+g==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/picomatch": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
@@ -1898,85 +1116,26 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
-    "node_modules/pkg-types": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-2.3.1.tgz",
-      "integrity": "sha512-y+ichcgc2LrADuhLNAx8DFjVfgz91pRxfZdI3UDhxHvcVEZsenLO+7XaU5vOp0u/7V/wZ+plyuQxtrDlZJ+yeg==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "confbox": "^0.2.4",
-        "exsolve": "^1.0.8",
-        "pathe": "^2.0.3"
-      }
-    },
-    "node_modules/postgres": {
-      "version": "3.4.7",
-      "resolved": "https://registry.npmjs.org/postgres/-/postgres-3.4.7.tgz",
-      "integrity": "sha512-Jtc2612XINuBjIl/QTWsV5UvE8UHuNblcO3vVADSrKsrc6RqGX6lOW1cEo3CM2v0XG4Nat8nI+YM7/f26VxXLw==",
-      "devOptional": true,
-      "license": "Unlicense",
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "type": "individual",
-        "url": "https://github.com/sponsors/porsager"
-      }
-    },
     "node_modules/prisma": {
-      "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/prisma/-/prisma-7.8.0.tgz",
-      "integrity": "sha512-yfN4yrw7HV9kEJhoy1+jgah0jafEIQsf7uWouSsM8MvJtlubsk+kM7AIBWZ8+GJl74Yj3c+nbYqBkMOxtsZ3Lw==",
+      "version": "5.22.0",
+      "resolved": "https://registry.npmjs.org/prisma/-/prisma-5.22.0.tgz",
+      "integrity": "sha512-vtpjW3XuYCSnMsNVBjLMNkTj6OZbudcPPTPYHqX0CJfpcdWciI1dM8uHETwmDxxiqEwCIE6WvXucWUetJgfu/A==",
       "devOptional": true,
       "hasInstallScript": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@prisma/config": "7.8.0",
-        "@prisma/dev": "0.24.3",
-        "@prisma/engines": "7.8.0",
-        "@prisma/studio-core": "0.27.3",
-        "mysql2": "3.15.3",
-        "postgres": "3.4.7"
+        "@prisma/engines": "5.22.0"
       },
       "bin": {
         "prisma": "build/index.js"
       },
       "engines": {
-        "node": "^20.19 || ^22.12 || >=24.0"
-      },
-      "peerDependencies": {
-        "better-sqlite3": ">=9.0.0",
-        "typescript": ">=5.4.0"
+        "node": ">=16.13"
       },
-      "peerDependenciesMeta": {
-        "better-sqlite3": {
-          "optional": true
-        },
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/proper-lockfile": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/proper-lockfile/-/proper-lockfile-4.1.2.tgz",
-      "integrity": "sha512-TjNPblN4BwAWMXU8s9AEz4JmQxnD1NNL7bNOY/AKUzyamc379FWASUhc/K1pL2noVb+XmZKLL68cjzLsiOAMaA==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "graceful-fs": "^4.2.4",
-        "retry": "^0.12.0",
-        "signal-exit": "^3.0.2"
+      "optionalDependencies": {
+        "fsevents": "2.3.3"
       }
     },
-    "node_modules/proper-lockfile/node_modules/signal-exit": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
-      "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==",
-      "devOptional": true,
-      "license": "ISC"
-    },
     "node_modules/proxy-addr": {
       "version": "2.0.7",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
@@ -1997,23 +1156,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/pure-rand": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/pure-rand/-/pure-rand-6.1.0.tgz",
-      "integrity": "sha512-bVWawvoZoBYpp6yIoQtQXHZjmz35RSVHnUOTefl8Vcjr8snTPY1wnpSPMWekcFwbxI6gtmT7rSYPFvz71ldiOA==",
-      "devOptional": true,
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://github.com/sponsors/dubzzz"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/fast-check"
-        }
-      ],
-      "license": "MIT"
-    },
     "node_modules/qs": {
       "version": "6.15.3",
       "resolved": "https://registry.npmjs.org/qs/-/qs-6.15.3.tgz",
@@ -2058,86 +1200,6 @@
         "node": ">= 0.10"
       }
     },
-    "node_modules/rc9": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/rc9/-/rc9-3.0.1.tgz",
-      "integrity": "sha512-gMDyleLWVE+i6Sgtc0QbbY6pEKqYs97NGi6isHQPqYlLemPoO8dxQ3uGi0f4NiP98c+jMW6cG1Kx9dDwfvqARQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "defu": "^6.1.6",
-        "destr": "^2.0.5"
-      }
-    },
-    "node_modules/react": {
-      "version": "19.2.7",
-      "resolved": "https://registry.npmjs.org/react/-/react-19.2.7.tgz",
-      "integrity": "sha512-HNe9WslTbXmFK8o8cmwgAeJFSBvt1bPdHCVKtaaV+WlAN36mpT4hcRpwbf3fY56ar2oIXzsBpOAiIRHAdY0OlQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "peer": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/react-dom": {
-      "version": "19.2.7",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.7.tgz",
-      "integrity": "sha512-t0BRVXvbiE/o20Hfw669rLbMCDWtYZLvmJigy2f0MxsXF+71pxhR3xOkspmsO8h3ZlNzyibAmtCa3l4lYKk6gQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "peer": true,
-      "dependencies": {
-        "scheduler": "^0.27.0"
-      },
-      "peerDependencies": {
-        "react": "^19.2.7"
-      }
-    },
-    "node_modules/readdirp": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-5.0.0.tgz",
-      "integrity": "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 20.19.0"
-      },
-      "funding": {
-        "type": "individual",
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
-    "node_modules/remeda": {
-      "version": "2.33.4",
-      "resolved": "https://registry.npmjs.org/remeda/-/remeda-2.33.4.tgz",
-      "integrity": "sha512-ygHswjlc/opg2VrtiYvUOPLjxjtdKvjGz1/plDhkG66hjNjFr1xmfrs2ClNFo/E6TyUFiwYNh53bKV26oBoMGQ==",
-      "devOptional": true,
-      "license": "MIT",
-      "funding": {
-        "url": "https://github.com/sponsors/remeda"
-      }
-    },
-    "node_modules/require-from-string": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
-      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/retry": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/retry/-/retry-0.12.0.tgz",
-      "integrity": "sha512-9LkiTwjUh6rT555DtE9rTX+BKByPfrMzEAtnlEtdEwr3Nkffwiihqe2bWADg+OQRjt9gl6ICdmB/ZFDCGAtSow==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 4"
-      }
-    },
     "node_modules/router": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz",
@@ -2180,14 +1242,6 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
       "license": "MIT"
     },
-    "node_modules/scheduler": {
-      "version": "0.27.0",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
-      "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==",
-      "devOptional": true,
-      "license": "MIT",
-      "peer": true
-    },
     "node_modules/semver": {
       "version": "7.8.5",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.5.tgz",
@@ -2226,12 +1280,6 @@
         "url": "https://opencollective.com/express"
       }
     },
-    "node_modules/seq-queue": {
-      "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/seq-queue/-/seq-queue-0.0.5.tgz",
-      "integrity": "sha512-hr3Wtp/GZIc/6DAGPDcV4/9WoZhjrkXsi5B/07QgX8tsdc6ilr7BFM6PM6rbdAX1kFSDYeZGLipIZZKyQP0O5Q==",
-      "devOptional": true
-    },
     "node_modules/serve-static": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-2.2.1.tgz",
@@ -2257,29 +1305,6 @@
       "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==",
       "license": "ISC"
     },
-    "node_modules/shebang-command": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
-      "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "shebang-regex": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/shebang-regex": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
-      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/side-channel": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.1.tgz",
@@ -2352,19 +1377,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/signal-exit": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-      "devOptional": true,
-      "license": "ISC",
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/simple-update-notifier": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/simple-update-notifier/-/simple-update-notifier-2.0.0.tgz",
@@ -2378,16 +1390,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/sqlstring": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/sqlstring/-/sqlstring-2.3.3.tgz",
-      "integrity": "sha512-qC9iz2FlN7DQl3+wjwn3802RTyjCx7sDvfQEXchwa6CWOx07/WVfh91gBmQ9fahw8snwGEWU3xGzOt4tFyHLxg==",
-      "devOptional": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
     "node_modules/statuses": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
@@ -2397,13 +1399,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/std-env": {
-      "version": "3.10.0",
-      "resolved": "https://registry.npmjs.org/std-env/-/std-env-3.10.0.tgz",
-      "integrity": "sha512-5GS12FdOZNliM5mAOxFRg7Ir0pWz8MdpYm6AY6VPkGpbA7ZzmbzNcBJQ0GPvvyWgcY7QAhCgf9Uy89I03faLkg==",
-      "devOptional": true,
-      "license": "MIT"
-    },
     "node_modules/supports-color": {
       "version": "5.5.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -2503,21 +1498,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/valibot": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/valibot/-/valibot-1.2.0.tgz",
-      "integrity": "sha512-mm1rxUsmOxzrwnX5arGS+U4T25RdvpPjPN4yR0u9pUBov9+zGVtO84tif1eY4r6zWxVxu3KzIyknJy3rxfRZZg==",
-      "devOptional": true,
-      "license": "MIT",
-      "peerDependencies": {
-        "typescript": ">=5"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/vary": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
@@ -2527,38 +1507,11 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/which": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
-      "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
-      "devOptional": true,
-      "license": "ISC",
-      "dependencies": {
-        "isexe": "^2.0.0"
-      },
-      "bin": {
-        "node-which": "bin/node-which"
-      },
-      "engines": {
-        "node": ">= 8"
-      }
-    },
     "node_modules/wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
       "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
       "license": "ISC"
-    },
-    "node_modules/zeptomatch": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/zeptomatch/-/zeptomatch-2.1.0.tgz",
-      "integrity": "sha512-KiGErG2J0G82LSpniV0CtIzjlJ10E04j02VOudJsPyPwNZgGnRKQy7I1R7GMyg/QswnE4l7ohSGrQbQbjXPPDA==",
-      "devOptional": true,
-      "license": "MIT",
-      "dependencies": {
-        "grammex": "^3.1.11",
-        "graphmatch": "^1.1.0"
-      }
     }
   }
 }
diff --git a/server/package.json b/server/package.json
index cec574e..7539087 100644
--- a/server/package.json
+++ b/server/package.json
@@ -13,7 +13,7 @@
   "license": "ISC",
   "description": "",
   "dependencies": {
-    "@prisma/client": "^7.8.0",
+    "@prisma/client": "^5.14.0",
     "bcrypt": "^6.0.0",
     "cors": "^2.8.6",
     "dotenv": "^17.4.2",
@@ -23,6 +23,6 @@
   "devDependencies": {
     "@types/node": "^26.1.1",
     "nodemon": "^3.1.14",
-    "prisma": "^7.8.0"
+    "prisma": "^5.14.0"
   }
 }
diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index f7308e4..7c8f6ee 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -4,18 +4,19 @@
 // Get a free hosted Postgres database in seconds: `npx create-db`
 
 generator client {
-  provider = "prisma-client"
-  output   = "../src/generated/prisma"
+  provider = "prisma-client-js"
+  engineType = "library"
 }
 
 datasource db {
   provider = "postgresql"
+  url      = env("DATABASE_URL")
 }
 
 model User {
   id Int @id @default(autoincrement())
-  username String
-  email String
+  username String  @unique 
+  email String  @unique 
   password String
   role String 
   createdAt DateTime @default(now())
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index 6455add..9da0110 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -1,20 +1,103 @@
+import bcrypt from "bcrypt";
+import { PrismaClient } from "@prisma/client";
+
+const prisma = new PrismaClient({});
+
+
 export const registerUser = async(req,res) => {
   try {
-    console.log(req.body);
+    const {username, email, role, password} = req.body;
+
+    if(!username || !email || !role || !password){
+      return res.status(400).json({
+        success: false,
+        message: "All fields are required.",
+      });
+    }
+
+    if(username.length<3 || username.includes(" ")){
+      return res.status(400).json(
+        {
+          success: false,
+          message: "Username must be at least 3 characters and contain no spaces."
+        }
+      );
+    }
+
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    if(!emailRegex.test(email)){
+      return res.status(400).json(
+        {
+          success: false,
+          message: "Please provide a valid email address."
+        }
+      );
+    }
+
+    const passwordRegex = /^(?=.*[0-9])(?=.*[!@#$%^&*(),.?":{}|<>]).{8,}$/;
+    if (!passwordRegex.test(password)) {
+      return res.status(400).json({
+        success: false,
+        message: "Password must be at least 8 characters long, and include at least one number and one special character."
+      });
+    }
+
+    const validRoles = [
+      "project_manager",
+      "developer",
+      "frontend_developer",
+      "backend_developer",
+      "fullstack_developer",
+    ];
+    if (!validRoles.includes(role)) {
+      return res
+        .status(400)
+        .json({ success: false, message: "Invalid role selected." });
+    }
+
+    const existingUser = await prisma.user.findFirst({
+      where: {
+        OR: [{ email}, {username}],
+      },
+    });
+
+    if(existingUser){
+      return res.status(409).json({
+        success: false,
+        message: "A user with this email or username already exists.",
+      });
+    }
+
+    const saltRounds = 10;
+    const hashedPassword = await bcrypt.hash(password, saltRounds);
+
+    const newUser = await prisma.user.create({
+      data: {
+        username,
+        email,
+        role,
+        password: hashedPassword,
+      },
+    });
+
+    return res.status(201).json({
+      success: true,
+      message: "User registered successfully!",
+      data:{
+          id: newUser.id,
+          username: newUser.username,
+          email: newUser.email,
+          role: newUser.role,
+        },
+    })
 
-    return res.status(201).json(
-      {
-        success: true,
-        messege: "Register API working",
-        data: req.body
-      }
-    );
   } catch (error) {
+    console.error("Database error during signup:", error);
     
     return res.status(500).json(
       {
         success: false,
-        messege: "Internal Service error"
+        message: "Internal Server Error"
       }
     );
   }

From 911037fc1f505636047b4f33321866f07c23c85d Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sat, 11 Jul 2026 22:05:39 +0530
Subject: [PATCH 12/24] added login login, JWT WebToken, session cookies

---
 client/src/App.jsx                            |  5 ++
 .../src/components/common/ProtectedRoute.jsx  | 13 +++
 client/src/main.jsx                           | 11 ++-
 client/src/pages/dashboard.jsx                | 11 +++
 client/src/pages/login.jsx                    | 83 +++++++++++++----
 package-lock.json                             | 40 +++++++++
 package.json                                  |  5 ++
 server/src/app.js                             |  8 +-
 server/src/controllers/auth.controller.js     | 88 +++++++++++++++++++
 server/src/routes/auth.routes.js              |  3 +-
 10 files changed, 245 insertions(+), 22 deletions(-)
 create mode 100644 client/src/components/common/ProtectedRoute.jsx
 create mode 100644 client/src/pages/dashboard.jsx
 create mode 100644 package-lock.json
 create mode 100644 package.json

diff --git a/client/src/App.jsx b/client/src/App.jsx
index 7955844..86cee9d 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -2,6 +2,8 @@ import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom";
 import Login from "./pages/login";
 import Signup from "./pages/signup";
 import Forgotpassword from "./pages/forgotpassword";
+import Dashboard from "./pages/dashboard";
+import ProtectedRoute from "./components/common/ProtectedRoute";
 import "./index.css";
 
 function App() {
@@ -11,6 +13,9 @@ function App() {
         <Route path="/login" element={<Login />} />
         <Route path="/signup" element={<Signup />} />
         <Route path="/forgotpassword" element={<Forgotpassword />} />
+
+        
+        <Route path="/dashboard" element={<ProtectedRoute><Dashboard /></ProtectedRoute>} />
         <Route path="/" element={<Navigate to="/signup" replace />} />
       </Routes>
     </BrowserRouter>
diff --git a/client/src/components/common/ProtectedRoute.jsx b/client/src/components/common/ProtectedRoute.jsx
new file mode 100644
index 0000000..7e69458
--- /dev/null
+++ b/client/src/components/common/ProtectedRoute.jsx
@@ -0,0 +1,13 @@
+import {Navigate} from "react-router-dom";
+
+function ProtectedRoute({children}){
+    const user = localStorage.getItem("user");
+
+    if(!user){
+        return <Navigate to="/login" replace />; 
+    }
+
+    return children;
+}
+
+export default ProtectedRoute;
\ No newline at end of file
diff --git a/client/src/main.jsx b/client/src/main.jsx
index b9a1a6d..124e659 100644
--- a/client/src/main.jsx
+++ b/client/src/main.jsx
@@ -1,7 +1,10 @@
-import { StrictMode } from 'react'
-import { createRoot } from 'react-dom/client'
-import './index.css'
-import App from './App.jsx'
+import { StrictMode } from 'react';
+import { createRoot } from 'react-dom/client';
+import axios from "axios";
+import './index.css';
+import App from './App.jsx';
+
+axios.defaults.withCredentials = true;
 
 createRoot(document.getElementById('root')).render(
   <StrictMode>
diff --git a/client/src/pages/dashboard.jsx b/client/src/pages/dashboard.jsx
new file mode 100644
index 0000000..cba5f7e
--- /dev/null
+++ b/client/src/pages/dashboard.jsx
@@ -0,0 +1,11 @@
+import React, { PureComponent } from 'react'
+
+export class Dashboard extends PureComponent {
+  render() {
+    return (
+      <div>welcome to dashboard</div>
+    )
+  }
+}
+
+export default Dashboard;
\ No newline at end of file
diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index 7c5cd15..f06eb43 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -1,5 +1,6 @@
-import { useState } from "react";
-import { Link } from "react-router-dom";
+import { use, useState } from "react";
+import { Link, useNavigate } from "react-router-dom";
+import axios from "axios";
 import { Mail, Lock, User, ArrowRight } from "lucide-react";
 import googleIcon from "../assets/google.svg";
 import githubIcon from "../assets/github.svg";
@@ -8,14 +9,50 @@ import eyeOff from "../assets/eyeOff.svg"
 
 function Login() {
   const [showPassword, setShowPassword] = useState(false);
+  const [formData, setFormData] = useState({username: "", password: ""});
+  const [error, setError] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  const navigate= useNavigate();
 
-  return(
+  const handleChange = (e) =>{
+    setFormData({
+      ...formData,
+      [e.target.id]: e.target.value,
+    });
+  };
+
+  const handleSubmit = async (e)=>{
+    e.preventDefault();
+    setError("");
+    setIsLoading(true);
+
+    try {
+      const response = await axios.post("http://localhost:5000/api/auth/login", formData);
+
+      if(response.data.success){
+
+        localStorage.setItem("user", JSON.stringify(response.data.data));
+
+        navigate("/dashboard");
+      }
+
+    } catch (err) {
+
+      const errorMessage = err.response?.data?.message || "Something went wrong. Please try again";
+      setError(errorMessage);  
+    }
+    finally{
+      setIsLoading(false);
+    }
+  }
+
+  return (
     <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-start lg:items-center px-4 py-6 sm:px-8  lg:px-20">
       <form
         id="login-window"
+        onSubmit={handleSubmit}
         className="w-full max-w-2xl rounded-3xl lg:rounded-[36px] overflow-hidden bg-white border border-white/20 shadow-2xl lg:min-h-[500px]"
       >
-
         {/* Right Side */}
         <div className="w-full bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] flex items-center justify-center py-2 lg:py-6 overflow-y-auto">
           <div className="w-full p-8">
@@ -25,8 +62,13 @@ function Login() {
             <p className="mt-1 mb-6 text-sm sm:text-base text-slate-500">
               Please enter your login credentials :
             </p>
+            {error && (
+              <div className="mb-4 p-3 bg-red-100 text-red-600 rounded-xl text-sm border border-red-200">
+                {error}
+              </div>
+            )}
 
-            {/* Username & Role */}
+            {/* Username */}
             <div className="grid grid-cols-1 sm:grid-cols-1 gap-4 mb-4">
               <div>
                 <label
@@ -40,14 +82,17 @@ function Login() {
                   <input
                     id="username"
                     type="text"
+                    value={formData.username}
+                    onChange={handleChange}
                     placeholder="Enter username"
+                    required
                     className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                   />
                 </div>
               </div>
             </div>
 
-            {/* Password & Confirm Password */}
+            {/* Password */}
             <div className="grid grid-cols-1 sm:grid-cols-1 gap-4 mb-4">
               <div>
                 <label
@@ -61,16 +106,21 @@ function Login() {
                   <input
                     id="password"
                     type={showPassword ? "text" : "password"}
+                    value={formData.password}
+                    onChange={handleChange}
                     placeholder="Enter password"
                     className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
                   />
-                  <button 
-                  type="button"
-                  onClick={()=>setShowPassword(!showPassword)} 
-                  className="cursor-pointer">
-                    <img src={showPassword ? eyeOff : eyeOn} 
-                    alt="toggle-password"
-                    className="w-5 h-5" />
+                  <button
+                    type="button"
+                    onClick={() => setShowPassword(!showPassword)}
+                    className="cursor-pointer"
+                  >
+                    <img
+                      src={showPassword ? eyeOff : eyeOn}
+                      alt="toggle-password"
+                      className="w-5 h-5"
+                    />
                   </button>
                 </div>
               </div>
@@ -107,10 +157,11 @@ function Login() {
             {/* Login Button */}
             <button
               type="submit"
-              className="w-full rounded-xl bg-gradient-to-r from-[#9400D3] via-[#C026D3] to-[#ED80E9] py-3 text-white font-semibold flex items-center justify-center gap-2 hover:from-[#ED80E9] hover:via-[#C026D3] hover:to-[#9400D3] hover:shadow-lg hover:-translate-y-0.5 active:scale-[0.98] transition-all duration-500 cursor-pointer"
+              disabled={isLoading}
+              className={`w-full rounded-xl bg-gradient-to-r from-[#9400D3] via-[#C026D3] to-[#ED80E9] py-3 text-white font-semibold flex items-center justify-center gap-2  transition-all duration-500 cursor-pointer ${isLoading ? "opacity-75 cursor-not-allowed" : "hover: from-[#ED80E9] hover: via-[#C026D3] hover:to-[#9400D3] hover:shadow-lg hover:-translate-y-0.5 active:scale-[0.98]"}`}
             >
-              Login
-              <ArrowRight size={18} />
+              {isLoading? "Login in...": "Login"}
+              {!isLoading && <ArrowRight size={18}/>}
             </button>
 
             {/* Divider */}
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..b87ab4f
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,40 @@
+{
+  "name": "Developer-Collaboration-Platform",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "dependencies": {
+        "cookie-parser": "^1.4.7"
+      }
+    },
+    "node_modules/cookie": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
+      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/cookie-parser": {
+      "version": "1.4.7",
+      "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.4.7.tgz",
+      "integrity": "sha512-nGUvgXnotP3BsjiLX2ypbQnWoGUPIIfHQNZkkC668ntrzGWEZVW70HDEB1qnNGMicPje6EttlIgzo51YSwNQGw==",
+      "license": "MIT",
+      "dependencies": {
+        "cookie": "0.7.2",
+        "cookie-signature": "1.0.6"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/cookie-signature": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
+      "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==",
+      "license": "MIT"
+    }
+  }
+}
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..0a258d8
--- /dev/null
+++ b/package.json
@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "cookie-parser": "^1.4.7"
+  }
+}
diff --git a/server/src/app.js b/server/src/app.js
index 29eaec6..36cc4f5 100644
--- a/server/src/app.js
+++ b/server/src/app.js
@@ -1,13 +1,19 @@
 import express from "express";
 import cors from "cors";
+import cookieParser from "cookie-parser";
 
 import route from "./routes/auth.routes.js";
 
 const app = express();
 
 // Middleware
-app.use(cors());
+app.use(cors({
+  origin: "http://localhost:5173",
+  credentials: true,
+}));
+
 app.use(express.json());
+app.use(cookieParser());
 
 // Routes
 app.use("/api/auth",route);
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index 9da0110..bc25be0 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -1,5 +1,6 @@
 import bcrypt from "bcrypt";
 import { PrismaClient } from "@prisma/client";
+import jwt from "jsonwebtoken";
 
 const prisma = new PrismaClient({});
 
@@ -100,5 +101,92 @@ export const registerUser = async(req,res) => {
         message: "Internal Server Error"
       }
     );
+  }
+};
+
+export const loginUser = async (req, res) =>{
+  try {
+    const {username, password} = req.body;
+
+    if(!username || !password){
+      return res.status(400).json(
+        {
+          success: false,
+          message: "Username and password are required.",
+        }
+      );
+    }
+
+    const user = await prisma.user.findFirst(
+      {
+        where: { username},
+      }
+    );
+
+    if(!user){
+      return res.status(401).json(
+        {
+          success: false,
+          message: "Invalid credentials.",
+        }
+      );
+    }
+
+    const isPasswordValid = await bcrypt.compare(password, user.password);
+
+    if(!isPasswordValid){
+      return res.status(401).json(
+        {
+          success: false,
+          message: "Invalid credentials.",
+        }
+      );
+    }
+
+    const token = jwt.sign(
+      {
+        id: user.id, username: user.username, role: user.role
+      },
+
+      process.env.JWT_SECRET || "fallback_secret_key",
+      {
+        expiresIn: "1d"
+      }
+    );
+
+    res.cookie("token", token,
+      {
+        httpOnly: true,
+        secure: process.env.NODE_ENV === "production",
+        sameSite: "strict",
+        maxAge: 24 * 60 * 60 * 1000,
+      }
+    );
+
+    return res.status(200).json(
+      {
+        success: true,
+        message: "Login Successful!",
+        token,
+        data:
+        {
+          id: user.id,
+          username: user.username,
+          email: user.email,
+          role: user.role,
+        },
+      }
+    );
+  } catch (error) {
+    console.error("Database Error during Login:", error);
+
+    return res.status(500).json(
+      {
+        success: false,
+        message: "Internal Server Error"
+      }
+    );
+    
+    
   }
 };
\ No newline at end of file
diff --git a/server/src/routes/auth.routes.js b/server/src/routes/auth.routes.js
index c651787..8222c15 100644
--- a/server/src/routes/auth.routes.js
+++ b/server/src/routes/auth.routes.js
@@ -1,7 +1,8 @@
 import express from "express";
-import {registerUser} from "../controllers/auth.controller.js"
+import {registerUser, loginUser} from "../controllers/auth.controller.js"
 
 const route = express.Router();
 route.post("/register",registerUser);
+route.post("/login", loginUser);
 
 export default route;
\ No newline at end of file

From 8c0345b3a3decaecc19cb1016e168bbc49d228cc Mon Sep 17 00:00:00 2001
From: soham-andhale <soham.andhale3@gmail.com>
Date: Sun, 12 Jul 2026 19:15:55 +0530
Subject: [PATCH 13/24] forgot password page

---
 client/src/pages/forgotpassword.jsx | 84 ++++++++++++++++++++++++++---
 1 file changed, 78 insertions(+), 6 deletions(-)

diff --git a/client/src/pages/forgotpassword.jsx b/client/src/pages/forgotpassword.jsx
index 7a4a41c..8c8d40d 100644
--- a/client/src/pages/forgotpassword.jsx
+++ b/client/src/pages/forgotpassword.jsx
@@ -1,11 +1,83 @@
 import { useState } from "react";
 import { Link } from "react-router-dom";
-import { Mail, Lock, User, ArrowRight } from "lucide-react";
+import { Mail, ArrowRight } from "lucide-react";
 
-function Forgotpassword(){
-    return(
-        <div></div>
-    )
+function ForgotPassword() {
+  return (
+    <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-center px-4 py-6 sm:px-8 lg:px-20">
+      <div className="w-full max-w-2xl rounded-3xl lg:rounded-[36px] overflow-hidden bg-white border border-white/20 shadow-2xl">
+
+        <div className="w-full bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] py-6">
+          <div className="w-full p-8">
+
+            {/* Heading */}
+            <h1 className="text-3xl font-bold text-slate-800">
+              Forgot Password
+            </h1>
+
+            <p className="mt-2 mb-8 text-slate-500">
+              Enter your registered email address and we'll send you a password
+              reset link.
+            </p>
+
+            {/* Email */}
+            <div className="mb-6">
+              <label
+                htmlFor="email"
+                className="block text-sm font-semibold text-slate-700 mb-1.5"
+              >
+                Email Address
+              </label>
+
+              <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-3 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                <Mail size={18} className="text-violet-500 shrink-0" />
+
+                <input
+                  id="email"
+                  type="email"
+                  placeholder="Enter your registered email"
+                  className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base"
+                />
+              </div>
+            </div>
+
+            {/* Button */}
+            <button
+              className="w-full rounded-xl bg-gradient-to-r from-[#9400D3] via-[#C026D3] to-[#ED80E9] py-3 text-white font-semibold flex items-center justify-center gap-2 hover:shadow-lg transition-all duration-300 cursor-pointer"
+            >
+              Send Reset Link
+              <ArrowRight size={18} />
+            </button>
+
+            {/* Divider */}
+            <div className="flex items-center my-6">
+              <div className="flex-1 border-t border-slate-300"></div>
+
+              <span className="mx-4 text-xs font-semibold text-slate-400 uppercase tracking-wider">
+                Or
+              </span>
+
+              <div className="flex-1 border-t border-slate-300"></div>
+            </div>
+
+            {/* Login Link */}
+            <p className="text-center text-sm text-slate-600">
+              Remember your password?{" "}
+              <Link
+                to="/login"
+                className="font-semibold text-violet-600 hover:text-violet-700 hover:underline"
+              >
+                Login
+              </Link>
+            </p>
+
+          </div>
+        </div>
+
+      </div>
+    </div>
+  );
 }
 
-export default Forgotpassword;
\ No newline at end of file
+export default ForgotPassword;
+

From 13910562d2c0c216d3a6b08fa8dbad9979fcdb48 Mon Sep 17 00:00:00 2001
From: soham-andhale <soham.andhale3@gmail.com>
Date: Sun, 12 Jul 2026 22:26:37 +0530
Subject: [PATCH 14/24] Updated login page

---
 client/src/pages/login.jsx | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index f06eb43..ab5e877 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -164,6 +164,17 @@ function Login() {
               {!isLoading && <ArrowRight size={18}/>}
             </button>
 
+            {/* Forgotpassword Link */}
+            <p className="mt-6 text-center text-sm text-slate-600">
+             Don't remember password?  {" "}
+              <Link
+                to="/ForgotPassword"
+                className="font-semibold text-violet-600 hover:text-violet-700 hover:underline transition-colors"
+              >
+              Forgot Password
+              </Link>
+            </p>
+
             {/* Divider */}
             <div className="flex items-center my-5">
               <div className="flex-1 border-t border-slate-300"></div>

From 5148cb2ce3bed50c7f23935205a4405f9c933d3b Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sun, 12 Jul 2026 23:19:50 +0530
Subject: [PATCH 15/24] Added Cloudflare Turnstile

---
 client/package-lock.json   | 11 +++++++++++
 client/package.json        |  1 +
 client/src/pages/login.jsx | 35 ++++++++++++++++++++++++++++++++---
 3 files changed, 44 insertions(+), 3 deletions(-)

diff --git a/client/package-lock.json b/client/package-lock.json
index 69fa9ae..d508300 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -8,6 +8,7 @@
       "name": "client",
       "version": "0.0.0",
       "dependencies": {
+        "@marsidev/react-turnstile": "^1.5.3",
         "@tailwindcss/vite": "^4.3.2",
         "axios": "^1.18.1",
         "lucide-react": "^1.23.0",
@@ -538,6 +539,16 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/@marsidev/react-turnstile": {
+      "version": "1.5.3",
+      "resolved": "https://registry.npmjs.org/@marsidev/react-turnstile/-/react-turnstile-1.5.3.tgz",
+      "integrity": "sha512-8Dij2jiNGNczq1U4EKpO4do2XepcTPxSMc2ZzvHndO+gcp68tvMULm27z2P99rGkdB89hc3452NZeu2Rti4g6A==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^17.0.2 || ^18.0.0 || ^19.0",
+        "react-dom": "^17.0.2 || ^18.0.0 || ^19.0"
+      }
+    },
     "node_modules/@napi-rs/wasm-runtime": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.6.tgz",
diff --git a/client/package.json b/client/package.json
index e4b78a7..9115a65 100644
--- a/client/package.json
+++ b/client/package.json
@@ -10,6 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@marsidev/react-turnstile": "^1.5.3",
     "@tailwindcss/vite": "^4.3.2",
     "axios": "^1.18.1",
     "lucide-react": "^1.23.0",
diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index f06eb43..dd14076 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -1,7 +1,8 @@
-import { use, useState } from "react";
+import { use, useState, useRef } from "react";
 import { Link, useNavigate } from "react-router-dom";
 import axios from "axios";
 import { Mail, Lock, User, ArrowRight } from "lucide-react";
+import { Turnstile } from "@marsidev/react-turnstile";
 import googleIcon from "../assets/google.svg";
 import githubIcon from "../assets/github.svg";
 import eyeOn from "../assets/eyeOn.svg"
@@ -13,6 +14,8 @@ function Login() {
   const [error, setError] = useState("");
   const [isLoading, setIsLoading] = useState(false);
   const navigate= useNavigate();
+  const [turnstileToken, setTurnstileToken] = useState("");
+  const turnstileRef = useRef();
 
   const handleChange = (e) =>{
     setFormData({
@@ -24,10 +27,22 @@ function Login() {
   const handleSubmit = async (e)=>{
     e.preventDefault();
     setError("");
+    
+    if (!turnstileToken) {
+      setError("Please complete the CAPTCHA.");
+      return;
+    }
+    
     setIsLoading(true);
 
     try {
-      const response = await axios.post("http://localhost:5000/api/auth/login", formData);
+
+      const payload = {
+        ...formData,
+        turnstileToken,
+      };
+
+      const response = await axios.post("http://localhost:5000/api/auth/login", payload);
 
       if(response.data.success){
 
@@ -39,7 +54,10 @@ function Login() {
     } catch (err) {
 
       const errorMessage = err.response?.data?.message || "Something went wrong. Please try again";
-      setError(errorMessage);  
+      setError(errorMessage);
+      
+      turnstileRef.current?.reset();
+      setTurnstileToken("");
     }
     finally{
       setIsLoading(false);
@@ -154,6 +172,17 @@ function Login() {
               </label>
             </div>
 
+            {/* Turnstile Widget */}
+
+            <div className="w-full flex justify-center mt-6 mb-6">
+              <Turnstile 
+                ref={turnstileRef} 
+                siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY} 
+                options={{ theme: 'light' }}
+                onSuccess={(token) => setTurnstileToken(token)}
+              />
+            </div>
+
             {/* Login Button */}
             <button
               type="submit"

From f1521be42e961391dea7597ebca70d173e030ad2 Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sun, 12 Jul 2026 23:24:26 +0530
Subject: [PATCH 16/24] Added logic in auth.controller for cloudflare turnstile

---
 server/src/controllers/auth.controller.js | 31 ++++++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index bc25be0..f56bb15 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -106,7 +106,7 @@ export const registerUser = async(req,res) => {
 
 export const loginUser = async (req, res) =>{
   try {
-    const {username, password} = req.body;
+    const { username, password, turnstileToken} = req.body;
 
     if(!username || !password){
       return res.status(400).json(
@@ -117,6 +117,35 @@ export const loginUser = async (req, res) =>{
       );
     }
 
+    if(!turnstileToken){
+      return res.status(400).json(
+        {
+          success: false,
+          message: "CAPTCHA token is missing."
+        }
+      );
+    }
+
+    const formData = new URLSearchParams();
+    formData.append("secret", process.env.TURNSTILE_SECRET_KEY);
+    formData.append("response", turnstileToken);
+
+    const verficationResponse = await fetch("https://challenges.cloudflare.com/turnstile/v0/siteverify", {
+      method: "POST",
+      body: formData,
+      headers: {'Content-Type': 'application/x-www-form-urlencoded'}
+    });
+
+    const verficationData = await verficationResponse.json();
+
+    if(!verficationData.success){
+      return res.status(403).json(
+        {
+          success: false,
+          message: "CAPTCHA validation failed. Please try again."
+        }
+      );
+    }
     const user = await prisma.user.findFirst(
       {
         where: { username},

From 0bbbbbd8f92b5c65f0f988925b68c9ae6600ea2a Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sat, 18 Jul 2026 23:24:29 +0530
Subject: [PATCH 17/24] built Dashboard

---
 client/package-lock.json                      | 401 +++++++++++++++++-
 client/package.json                           |   1 +
 client/src/App.jsx                            |   2 +-
 client/src/components/common/Card.jsx         |  13 +
 .../src/components/layout/KPIs/StatsCard.jsx  |  19 +
 .../src/components/layout/KPIs/StatsData.js   |  73 ++++
 .../src/components/layout/KPIs/StatsGrid.jsx  |  31 ++
 .../LowerMiddleSection/LowerMiddleSection.jsx |  20 +
 .../layout/LowerMiddleSection/OpenIssues.jsx  | 133 ++++++
 .../LowerMiddleSection/PullRequests.jsx       | 136 ++++++
 .../LowerMiddleSection/RecentActivity.jsx     | 113 +++++
 .../layout/MiddleSection/CICDStatus.jsx       |  70 +++
 .../layout/MiddleSection/CurrentSprint.jsx    | 111 +++++
 .../layout/MiddleSection/MiddleSection.jsx    |  20 +
 .../layout/MiddleSection/ProjectOverview.jsx  |  99 +++++
 client/src/components/layout/Navbar.jsx       |  67 +++
 .../RepositoryHealth.jsx                      | 111 +++++
 .../layout/RightSideSection/RightSideBar.jsx  |  18 +
 .../layout/RightSideSection/TeamChat.jsx      |  66 +++
 .../layout/RightSideSection/TeamMember.jsx    | 108 +++++
 .../RightSideSection/UpcomingEvents.jsx       |  63 +++
 client/src/components/layout/Sidebar.jsx      | 165 +++++++
 client/src/pages/dashboard.jsx                |  48 ++-
 dashboard_analysis.md                         | 119 ++++++
 24 files changed, 1996 insertions(+), 11 deletions(-)
 create mode 100644 client/src/components/common/Card.jsx
 create mode 100644 client/src/components/layout/KPIs/StatsCard.jsx
 create mode 100644 client/src/components/layout/KPIs/StatsData.js
 create mode 100644 client/src/components/layout/KPIs/StatsGrid.jsx
 create mode 100644 client/src/components/layout/LowerMiddleSection/LowerMiddleSection.jsx
 create mode 100644 client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
 create mode 100644 client/src/components/layout/LowerMiddleSection/PullRequests.jsx
 create mode 100644 client/src/components/layout/LowerMiddleSection/RecentActivity.jsx
 create mode 100644 client/src/components/layout/MiddleSection/CICDStatus.jsx
 create mode 100644 client/src/components/layout/MiddleSection/CurrentSprint.jsx
 create mode 100644 client/src/components/layout/MiddleSection/MiddleSection.jsx
 create mode 100644 client/src/components/layout/MiddleSection/ProjectOverview.jsx
 create mode 100644 client/src/components/layout/Navbar.jsx
 create mode 100644 client/src/components/layout/RepositoryHealthSection/RepositoryHealth.jsx
 create mode 100644 client/src/components/layout/RightSideSection/RightSideBar.jsx
 create mode 100644 client/src/components/layout/RightSideSection/TeamChat.jsx
 create mode 100644 client/src/components/layout/RightSideSection/TeamMember.jsx
 create mode 100644 client/src/components/layout/RightSideSection/UpcomingEvents.jsx
 create mode 100644 client/src/components/layout/Sidebar.jsx
 create mode 100644 dashboard_analysis.md

diff --git a/client/package-lock.json b/client/package-lock.json
index d508300..f90c286 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -15,6 +15,7 @@
         "react": "^19.2.7",
         "react-dom": "^19.2.7",
         "react-router-dom": "^7.18.1",
+        "recharts": "^3.9.2",
         "tailwindcss": "^4.3.2"
       },
       "devDependencies": {
@@ -576,6 +577,32 @@
         "url": "https://github.com/sponsors/Boshen"
       }
     },
+    "node_modules/@reduxjs/toolkit": {
+      "version": "2.12.0",
+      "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.12.0.tgz",
+      "integrity": "sha512-KiT+RzZbp6mQET+Mg+h2c97+9j1sNflUxQkIHI7Yuzf6Peu+OYpmkn6nbHWmLLWj+1ZODUJFwGZ7gx3L9R9EOw==",
+      "license": "MIT",
+      "dependencies": {
+        "@standard-schema/spec": "^1.0.0",
+        "@standard-schema/utils": "^0.3.0",
+        "immer": "^11.0.0",
+        "redux": "^5.0.1",
+        "redux-thunk": "^3.1.0",
+        "reselect": "^5.1.0"
+      },
+      "peerDependencies": {
+        "react": "^16.9.0 || ^17.0.0 || ^18 || ^19",
+        "react-redux": "^7.2.1 || ^8.1.3 || ^9.0.0"
+      },
+      "peerDependenciesMeta": {
+        "react": {
+          "optional": true
+        },
+        "react-redux": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@rolldown/binding-android-arm64": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.1.3.tgz",
@@ -824,6 +851,18 @@
       "integrity": "sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==",
       "license": "MIT"
     },
+    "node_modules/@standard-schema/spec": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz",
+      "integrity": "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==",
+      "license": "MIT"
+    },
+    "node_modules/@standard-schema/utils": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/@standard-schema/utils/-/utils-0.3.0.tgz",
+      "integrity": "sha512-e7Mew686owMaPJVNNLs55PUvgz371nKgwsc4vxE49zsODpJEnxgxRo2y/OKrqueavXgZNMDVj3DdHFlaSAeU8g==",
+      "license": "MIT"
+    },
     "node_modules/@tailwindcss/node": {
       "version": "4.3.2",
       "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.3.2.tgz",
@@ -1091,6 +1130,69 @@
         "tslib": "^2.4.0"
       }
     },
+    "node_modules/@types/d3-array": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-array/-/d3-array-3.2.2.tgz",
+      "integrity": "sha512-hOLWVbm7uRza0BYXpIIW5pxfrKe0W+D5lrFiAEYR+pb6w3N2SwSMaJbXdUfSEv+dT4MfHBLtn5js0LAWaO6otw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-color": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-3.1.3.tgz",
+      "integrity": "sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-ease": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-ease/-/d3-ease-3.0.2.tgz",
+      "integrity": "sha512-NcV1JjO5oDzoK26oMzbILE6HW7uVXOHLQvHshBUW4UMdZGfiY6v5BeQwh9a9tCzv+CeefZQHJt5SRgK154RtiA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-interpolate": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-interpolate/-/d3-interpolate-3.0.4.tgz",
+      "integrity": "sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-color": "*"
+      }
+    },
+    "node_modules/@types/d3-path": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-3.1.1.tgz",
+      "integrity": "sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-scale": {
+      "version": "4.0.9",
+      "resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-4.0.9.tgz",
+      "integrity": "sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-time": "*"
+      }
+    },
+    "node_modules/@types/d3-shape": {
+      "version": "3.1.8",
+      "resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-3.1.8.tgz",
+      "integrity": "sha512-lae0iWfcDeR7qt7rA88BNiqdvPS5pFVPpo5OfjElwNaT2yyekbM0C9vK+yqBqEmHr6lDkRnYNoTBYlAgJa7a4w==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-path": "*"
+      }
+    },
+    "node_modules/@types/d3-time": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-3.0.4.tgz",
+      "integrity": "sha512-yuzZug1nkAAaBlBBikKZTgzCeA+k1uy4ZFwWANOfKw5z5LRhV0gNA7gNkKm7HoK+HRN0wX3EkxGk0fpbWhmB7g==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-timer": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-timer/-/d3-timer-3.0.2.tgz",
+      "integrity": "sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==",
+      "license": "MIT"
+    },
     "node_modules/@types/esrecurse": {
       "version": "4.3.1",
       "resolved": "https://registry.npmjs.org/@types/esrecurse/-/esrecurse-4.3.1.tgz",
@@ -1116,7 +1218,7 @@
       "version": "19.2.17",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.17.tgz",
       "integrity": "sha512-MXfmqaVPEVgkBT/aY0aGCkRWWtByiYQXo3xdQ8r5RzuFrPiRn8Gar2tQdXSUQ2GKV3bkXckek89V8wQBY2Q/Aw==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "csstype": "^3.2.2"
@@ -1132,6 +1234,12 @@
         "@types/react": "^19.2.0"
       }
     },
+    "node_modules/@types/use-sync-external-store": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.6.tgz",
+      "integrity": "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg==",
+      "license": "MIT"
+    },
     "node_modules/@vitejs/plugin-react": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-6.0.3.tgz",
@@ -1332,6 +1440,15 @@
       ],
       "license": "CC-BY-4.0"
     },
+    "node_modules/clsx": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
+      "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/combined-stream": {
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
@@ -1383,9 +1500,130 @@
       "version": "3.2.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
       "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "MIT"
     },
+    "node_modules/d3-array": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-3.2.4.tgz",
+      "integrity": "sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==",
+      "license": "ISC",
+      "dependencies": {
+        "internmap": "1 - 2"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-color": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz",
+      "integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-ease": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz",
+      "integrity": "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-format": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-3.1.2.tgz",
+      "integrity": "sha512-AJDdYOdnyRDV5b6ArilzCPPwc1ejkHcoyFarqlPqT7zRYjhavcT3uSrqcMvsgh2CgoPbK3RCwyHaVyxYcP2Arg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-interpolate": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz",
+      "integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-path": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-3.1.0.tgz",
+      "integrity": "sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-scale": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-4.0.2.tgz",
+      "integrity": "sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2.10.0 - 3",
+        "d3-format": "1 - 3",
+        "d3-interpolate": "1.2.0 - 3",
+        "d3-time": "2.1.1 - 3",
+        "d3-time-format": "2 - 4"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-shape": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-3.2.0.tgz",
+      "integrity": "sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-path": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-time": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-3.1.0.tgz",
+      "integrity": "sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-time-format": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-4.1.0.tgz",
+      "integrity": "sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-time": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-timer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-3.0.1.tgz",
+      "integrity": "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/debug": {
       "version": "4.4.3",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
@@ -1403,6 +1641,12 @@
         }
       }
     },
+    "node_modules/decimal.js-light": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
+      "integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==",
+      "license": "MIT"
+    },
     "node_modules/deep-is": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
@@ -1507,6 +1751,16 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/es-toolkit": {
+      "version": "1.49.0",
+      "resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.49.0.tgz",
+      "integrity": "sha512-G5iZ6Pc/FNRY/soKZHC+TxGDD83rHUDXxzaWhGCX44vAv/tMs56WMusnm/KMNK+luUPsgA9U28cGr4RDlSzL2g==",
+      "license": "MIT",
+      "workspaces": [
+        "docs",
+        "benchmarks"
+      ]
+    },
     "node_modules/escalade": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
@@ -1715,6 +1969,12 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/eventemitter3": {
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz",
+      "integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==",
+      "license": "MIT"
+    },
     "node_modules/fast-deep-equal": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
@@ -2033,6 +2293,16 @@
         "node": ">= 4"
       }
     },
+    "node_modules/immer": {
+      "version": "11.1.15",
+      "resolved": "https://registry.npmjs.org/immer/-/immer-11.1.15.tgz",
+      "integrity": "sha512-VrNANlmnWQnh5COXIIOQXM9oOJw7naGKlBT74ZOOR6lpVXc3gFEu9FJLDFcpCJ2j+NWr8TIwtWD//T6ZX6TKiQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/immer"
+      }
+    },
     "node_modules/imurmurhash": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
@@ -2043,6 +2313,15 @@
         "node": ">=0.8.19"
       }
     },
+    "node_modules/internmap": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/internmap/-/internmap-2.0.3.tgz",
+      "integrity": "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/is-extglob": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
@@ -2706,6 +2985,36 @@
         "react": "^19.2.7"
       }
     },
+    "node_modules/react-is": {
+      "version": "19.2.7",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.2.7.tgz",
+      "integrity": "sha512-kZFnouyVv7eP/Phmrlo9FK+zcAdriZJvzxXHF1Sl1P377WSGe2G/JxVolhTrB/jeV47lKImhNUsijjHAAbcl/A==",
+      "license": "MIT",
+      "peer": true
+    },
+    "node_modules/react-redux": {
+      "version": "9.3.0",
+      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.3.0.tgz",
+      "integrity": "sha512-KQopgqFo/p/fgmAs5qz6p5RWaNAzq40WAu7fJIXnQpYxFPbJYtsJPWvGeF2rOBaY/kEuV77AVsX8TsQzKm+A/g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/use-sync-external-store": "^0.0.6",
+        "use-sync-external-store": "^1.4.0"
+      },
+      "peerDependencies": {
+        "@types/react": "^18.2.25 || ^19",
+        "react": "^18.0 || ^19",
+        "redux": "^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "redux": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/react-router": {
       "version": "7.18.1",
       "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.18.1.tgz",
@@ -2744,6 +3053,57 @@
         "react-dom": ">=18"
       }
     },
+    "node_modules/recharts": {
+      "version": "3.9.2",
+      "resolved": "https://registry.npmjs.org/recharts/-/recharts-3.9.2.tgz",
+      "integrity": "sha512-G4fy+Pk46RaXgwWMh+Nzhyo/lbFAVqXo9gtetlyehe6Ehge9CsgDuOTwQDD+i1+llaLktNBiNq4bhnGlDRXFtw==",
+      "license": "MIT",
+      "workspaces": [
+        "www"
+      ],
+      "dependencies": {
+        "@reduxjs/toolkit": "^1.9.0 || 2.x.x",
+        "clsx": "^2.1.1",
+        "decimal.js-light": "^2.5.1",
+        "es-toolkit": "^1.39.3",
+        "eventemitter3": "^5.0.1",
+        "immer": "^11.1.8",
+        "react-redux": "8.x.x || 9.x.x",
+        "reselect": "5.2.0",
+        "tiny-invariant": "^1.3.3",
+        "use-sync-external-store": "^1.2.2",
+        "victory-vendor": "^37.0.2"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-is": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/redux": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
+      "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
+      "license": "MIT"
+    },
+    "node_modules/redux-thunk": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-3.1.0.tgz",
+      "integrity": "sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw==",
+      "license": "MIT",
+      "peerDependencies": {
+        "redux": "^5.0.0"
+      }
+    },
+    "node_modules/reselect": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/reselect/-/reselect-5.2.0.tgz",
+      "integrity": "sha512-AgZ3UOZm3YndfrJ4OYjgrT7bmCm/1iqkjvEfH/oYjzh6PD2qw4QuT3jjnXIrpdt4MTpMXclMT3lXbmRY+XRakw==",
+      "license": "MIT"
+    },
     "node_modules/rolldown": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.1.3.tgz",
@@ -2850,6 +3210,12 @@
         "url": "https://opencollective.com/webpack"
       }
     },
+    "node_modules/tiny-invariant": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
+      "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==",
+      "license": "MIT"
+    },
     "node_modules/tinyglobby": {
       "version": "0.2.17",
       "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.17.tgz",
@@ -2927,6 +3293,37 @@
         "punycode": "^2.1.0"
       }
     },
+    "node_modules/use-sync-external-store": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.6.0.tgz",
+      "integrity": "sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/victory-vendor": {
+      "version": "37.3.6",
+      "resolved": "https://registry.npmjs.org/victory-vendor/-/victory-vendor-37.3.6.tgz",
+      "integrity": "sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ==",
+      "license": "MIT AND ISC",
+      "dependencies": {
+        "@types/d3-array": "^3.0.3",
+        "@types/d3-ease": "^3.0.0",
+        "@types/d3-interpolate": "^3.0.1",
+        "@types/d3-scale": "^4.0.2",
+        "@types/d3-shape": "^3.1.0",
+        "@types/d3-time": "^3.0.0",
+        "@types/d3-timer": "^3.0.0",
+        "d3-array": "^3.1.6",
+        "d3-ease": "^3.0.1",
+        "d3-interpolate": "^3.0.1",
+        "d3-scale": "^4.0.2",
+        "d3-shape": "^3.1.0",
+        "d3-time": "^3.0.0",
+        "d3-timer": "^3.0.1"
+      }
+    },
     "node_modules/vite": {
       "version": "8.1.0",
       "resolved": "https://registry.npmjs.org/vite/-/vite-8.1.0.tgz",
diff --git a/client/package.json b/client/package.json
index 9115a65..96c20b6 100644
--- a/client/package.json
+++ b/client/package.json
@@ -17,6 +17,7 @@
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
     "react-router-dom": "^7.18.1",
+    "recharts": "^3.9.2",
     "tailwindcss": "^4.3.2"
   },
   "devDependencies": {
diff --git a/client/src/App.jsx b/client/src/App.jsx
index 86cee9d..ac0dc6c 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -15,7 +15,7 @@ function App() {
         <Route path="/forgotpassword" element={<Forgotpassword />} />
 
         
-        <Route path="/dashboard" element={<ProtectedRoute><Dashboard /></ProtectedRoute>} />
+        <Route path="/signup" element={<ProtectedRoute><Dashboard /></ProtectedRoute>} />
         <Route path="/" element={<Navigate to="/signup" replace />} />
       </Routes>
     </BrowserRouter>
diff --git a/client/src/components/common/Card.jsx b/client/src/components/common/Card.jsx
new file mode 100644
index 0000000..0d544ee
--- /dev/null
+++ b/client/src/components/common/Card.jsx
@@ -0,0 +1,13 @@
+import React from "react";
+
+const Card = ({ children, className = "" }) => {
+  return (
+    <div
+      className={`bg-slate-900 border border-slate-800 rounded-2xl p-4 transition-all duration-300 hover:border-slate-700 ${className}`}
+    >
+      {children}
+    </div>
+  );
+};
+
+export default Card;
diff --git a/client/src/components/layout/KPIs/StatsCard.jsx b/client/src/components/layout/KPIs/StatsCard.jsx
new file mode 100644
index 0000000..6fe5aae
--- /dev/null
+++ b/client/src/components/layout/KPIs/StatsCard.jsx
@@ -0,0 +1,19 @@
+import React from "react";
+
+const StatsCard = ({ title, value, subtitle, icon: Icon, borderColor, bgColor, iconColor, hoverBorderColor, bgIcon}) => {
+  return (
+    <div
+      className={`bg-slate-900 border ${borderColor} ${bgColor} min-h-[160px] flex flex-col justify-between rounded-2xl p-5 text-white hover:scale-[1.02] ${hoverBorderColor} transition-all duration-300`}>
+      <div className="flex justify-between items-start">
+        <span className="text-[13px] text-slate-300 pr-2 line-clamp-2">{title}</span>
+        <div className={`p-3 rounded-full ${bgIcon}`}>
+          <Icon className={`${iconColor}`} size={16} />
+        </div>
+      </div>
+      <h2 className="text-3xl md:text-4xl lg:text-5xl font-bold mt-auto pt-2 truncate">{value}</h2>
+      <p className="text-xs text-slate-400 mt-2 truncate">{subtitle}</p>
+    </div>
+  );
+};
+
+export default StatsCard;
\ No newline at end of file
diff --git a/client/src/components/layout/KPIs/StatsData.js b/client/src/components/layout/KPIs/StatsData.js
new file mode 100644
index 0000000..cd9c9ba
--- /dev/null
+++ b/client/src/components/layout/KPIs/StatsData.js
@@ -0,0 +1,73 @@
+import React from "react";
+import { Folder, GitPullRequestArrow, Code, CircleAlert, CloudUpload, CloudUploadIcon, CheckCircle,   CheckCircle2Icon} from "lucide-react";
+
+const StatsData = [
+  {
+    title: "Active Projects",
+    value: 6,
+    subtitle: "2 from last week",
+    icon: Folder,
+    borderColor: "border-violet-500/30",
+    bgColor: "bg-gradient-to-br from-violet-950/60 to-slate-900",
+    iconColor: "text-violet-400",
+    bgIcon: "bg-violet-500/20",
+    hoverBorderColor: "hover:border-violet-400",
+  },
+  {
+    title: "Pull Requests",
+    value: 9,
+    subtitle: "4 Awaiting Review",
+    icon: GitPullRequestArrow,
+    borderColor: "border-sky-500/30",
+    bgColor: "bg-gradient-to-br from-cyan-950/60 to-slate-900",
+    iconColor: "text-sky-400",
+    bgIcon: "bg-sky-500/20",
+    hoverBorderColor: "hover:border-sky-400",
+  },
+  {
+    title: "Commits",
+    value: 156,
+    subtitle: "18% from last week",
+    icon: Code,
+    borderColor: "border-blue-500/30",
+    bgColor: "bg-gradient-to-br from-blue-950/60 to-slate-900",
+    iconColor: "text-blue-400",
+    bgIcon: "bg-blue-500/20",
+    hoverBorderColor: "hover:border-blue-400",
+  },
+  {
+    title: "Open Issues",
+    value: 18,
+    subtitle: "2 Critical",
+    icon: CircleAlert,
+    borderColor: "border-green-500/30",
+    bgColor: "bg-gradient-to-br from-green-950/60 to-slate-900",
+    iconColor: "text-green-400",
+    bgIcon: "bg-green-500/20",
+    hoverBorderColor: "hover:border-green-400",
+  },
+  {
+    title: "Deployments",
+    value: 4,
+    subtitle: "1 from last week",
+    icon: CloudUploadIcon,
+    borderColor: "border-orange-500/30",
+    bgColor: "bg-gradient-to-br from-orange-950/60 to-slate-900",
+    iconColor: "text-orange-400",
+    bgIcon: "bg-orange-500/20",
+    hoverBorderColor: "hover:border-orange-400",
+  },
+  {
+    title: "Tasks Done",
+    value: 32,
+    subtitle: "68% Completed",
+    icon: CheckCircle2Icon,
+    borderColor: "border-purple-500/30",
+    bgColor: "bg-gradient-to-br from-purple-950/60 to-slate-900",
+    iconColor: "text-purple-400",
+    bgIcon: "bg-purple-500/20",
+    hoverBorderColor: "hover:border-purple-400",
+  },
+];
+
+export default StatsData;
diff --git a/client/src/components/layout/KPIs/StatsGrid.jsx b/client/src/components/layout/KPIs/StatsGrid.jsx
new file mode 100644
index 0000000..a8e48e7
--- /dev/null
+++ b/client/src/components/layout/KPIs/StatsGrid.jsx
@@ -0,0 +1,31 @@
+import React from "react";
+import StatsCard from "./StatsCard.jsx";
+import StatsData from "./StatsData.js";
+
+
+
+const StatsGrid = () => {
+  return (
+    <div className="w-full bg-[#111827] rounded-2xl">
+      <div
+        className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6 gap-4 p-2">
+        {StatsData.map((stat) => (
+          <StatsCard
+            key={stat.title}
+            title={stat.title}
+            value={stat.value}
+            subtitle={stat.subtitle}
+            icon={stat.icon}
+            borderColor={stat.borderColor}
+            bgColor={stat.bgColor}
+            iconColor={stat.iconColor}
+            hoverBorderColor={stat.hoverBorderColor}
+            bgIcon={stat.bgIcon}
+          />
+        ))}
+      </div>
+    </div>
+  );
+};
+
+export default StatsGrid;
\ No newline at end of file
diff --git a/client/src/components/layout/LowerMiddleSection/LowerMiddleSection.jsx b/client/src/components/layout/LowerMiddleSection/LowerMiddleSection.jsx
new file mode 100644
index 0000000..27afc09
--- /dev/null
+++ b/client/src/components/layout/LowerMiddleSection/LowerMiddleSection.jsx
@@ -0,0 +1,20 @@
+import React from 'react'
+import { RecentActivity } from './RecentActivity';
+import { PullRequests } from './PullRequests';
+import { OpenIssues } from './OpenIssues';
+
+const LowerMiddleSection = () => {
+  return (
+    <div className="w-full bg-[#111827] rounded-2xl p-2">
+      <div className="grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3 gap-4 items-stretch">
+        <RecentActivity />
+        <PullRequests />
+        <div className="lg:col-span-2 2xl:col-span-1 h-full">
+        <OpenIssues />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default LowerMiddleSection;
\ No newline at end of file
diff --git a/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx b/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
new file mode 100644
index 0000000..db16a95
--- /dev/null
+++ b/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
@@ -0,0 +1,133 @@
+import React from "react";
+import Card from "../../common/Card";
+import { CircleAlert, AlertTriangle, Info } from "lucide-react";
+
+const openIssuesData = [
+  {
+    id: 218,
+    title: "Login redirect issue",
+    assignee: "Anas S.",
+    priority: "Critical",
+  },
+  {
+    id: 217,
+    title: "Data sync failure",
+    assignee: "Ankur Y.",
+    priority: "High",
+  },
+  {
+    id: 216,
+    title: "UI alignment bug",
+    assignee: "Sarah J.",
+    priority: "High",
+  },
+  {
+    id: 215,
+    title: "API validation error",
+    assignee: "Sumit S.",
+    priority: "Medium",
+  },
+  {
+    id: 214,
+    title: "Improve loading speed",
+    assignee: "Soham K.",
+    priority: "Low",
+  },
+];
+
+export const OpenIssues = () => {
+  const getPriorityStyles = (priority) => {
+    switch (priority) {
+      case "Critical":
+        return "bg-red-500/20 text-red-400";
+
+      case "High":
+        return "bg-orange-500/20 text-orange-400";
+
+      case "Medium":
+        return "bg-yellow-500/20 text-yellow-400";
+
+      case "Low":
+        return "bg-blue-500/20 text-blue-400";
+
+      default:
+        return "bg-slate-500/20 text-slate-400";
+    }
+  };
+
+  const getIconStyles = (priority) => {
+    switch (priority) {
+      case "Critical":
+        return "text-red-400";
+
+      case "High":
+        return "text-orange-400";
+
+      case "Medium":
+        return "text-yellow-400";
+
+      case "Low":
+        return "text-blue-400";
+
+      default:
+        return "text-slate-400";
+    }
+  };
+
+  return (
+    <Card className="h-full min-h-[320px] flex flex-col">
+      {/* Header */}
+      <div className="flex items-center justify-between mb-4">
+        <h3 className="text-lg font-semibold text-slate-100">Open Issues</h3>
+
+        <button className="text-sm text-indigo-400 hover:text-indigo-300 transition-colors cursor-pointer">
+          View All
+        </button>
+      </div>
+
+      {/* Issues List */}
+      <div>
+        {openIssuesData.map((issue) => (
+          <div
+            key={issue.id}
+            className="flex items-start justify-between py-1 border-b border-slate-800 last:border-none hover:bg-slate-800/20 px-2 rounded-lg transition-colors"
+          >
+            {/* Left */}
+            <div className="flex gap-3 flex-1 min-w-0">
+              <CircleAlert
+                size={16}
+                strokeWidth={1.75}
+                className={`mt-1 flex-shrink-0 ${getIconStyles(
+                  issue.priority,
+                )}`}
+              />
+
+              <div className="min-w-0">
+                <p className="text-xs text-slate-400">#{issue.id}</p>
+
+                <h4 className="text-sm text-slate-100 truncate">
+                  {issue.title}
+                </h4>
+
+                <p className="text-[10px] text-slate-400 mt-1">
+                  {issue.assignee}
+                </p>
+              </div>
+            </div>
+
+            {/* Right */}
+            <span
+              className={`px-2 py-1 rounded-md text-xs font-medium whitespace-nowrap ${getPriorityStyles(
+                issue.priority,
+              )}`}
+            >
+              {issue.priority}
+            </span>
+          </div>
+        ))}
+      </div>
+    </Card>
+  );
+};
+
+export default OpenIssues;
\ No newline at end of file
diff --git a/client/src/components/layout/LowerMiddleSection/PullRequests.jsx b/client/src/components/layout/LowerMiddleSection/PullRequests.jsx
new file mode 100644
index 0000000..c3f795a
--- /dev/null
+++ b/client/src/components/layout/LowerMiddleSection/PullRequests.jsx
@@ -0,0 +1,136 @@
+import React from "react";
+import Card from "../../common/Card";
+import { MessageSquare, GitPullRequest } from "lucide-react";
+
+const pullRequestsData = [
+  {
+    id: 144,
+    title: "Add OAuth authentication",
+    author: "Anas S.",
+    status: "Review",
+    comments: 3,
+  },
+  {
+    id: 142,
+    title: "Improve dashboard UI",
+    author: "Sarah J.",
+    status: "Approved",
+    comments: 2,
+  },
+  {
+    id: 141,
+    title: "Fix API rate limit issue",
+    author: "Ankur Y.",
+    status: "Changes Requested",
+    comments: 4,
+  },
+  {
+    id: 140,
+    title: "Update dependencies",
+    author: "Sumit S.",
+    status: "Review",
+    comments: 1,
+  },
+  {
+    id: 139,
+    title: "Add unit tests for utils",
+    author: "Soham K.",
+    status: "Approved",
+    comments: 2,
+  },
+];
+
+const getStatusStyles = (status) => {
+  switch (status) {
+    case "Approved":
+      return "bg-green-500/20 text-green-400";
+
+    case "Review":
+      return "bg-purple-500/20 text-purple-400";
+
+    case "Changes Requested":
+      return "bg-blue-500/20 text-blue-400";
+
+    default:
+      return "bg-slate-500/20 text-slate-400";
+  }
+};
+
+export const PullRequests = () => {
+  const getStatusStyles = (status) => {
+    switch (status) {
+      case "Approved":
+        return "bg-green-500/20 text-green-400";
+
+      case "Review":
+        return "bg-purple-500/20 text-purple-400";
+
+      case "Changes Requested":
+        return "bg-blue-500/20 text-blue-400";
+
+      default:
+        return "bg-slate-500/20 text-slate-400";
+    }
+  };
+
+  return (
+    <Card className="h-full min-h-[320px] flex flex-col">
+      {/* Header */}
+      <div className="flex items-center justify-between mb-2">
+        <h3 className="text-lg font-semibold text-slate-100">Pull Requests</h3>
+
+        <button className="text-sm text-indigo-400 hover:text-indigo-300 transition-colors cursor-pointer">
+          View All
+        </button>
+      </div>
+
+      {/* PR List */}
+      <div>
+        {pullRequestsData.map((pr) => (
+          <div
+            key={pr.id}
+            className="flex items-start justify-between py-1 border-b border-slate-800 last:border-none hover:bg-slate-800/20 px-2 rounded-lg transition-colors cursor-pointer"
+          >
+            {/* Left */}
+            <div className="flex gap-3 flex-1 min-w-0">
+              <GitPullRequest
+                size={18}
+                className="text-slate-400 mt-1 flex-shrink-0"
+              />
+
+              <div className="min-w-0">
+                <p className="text-xs text-indigo-400 font-medium">
+                  #{pr.id}
+                </p>
+
+                <h4 className="text-sm text-slate-100 truncate">
+                  {pr.title}
+                </h4>
+
+                <p className="text-[10px] text-slate-400 mt-1">by {pr.author}</p>
+              </div>
+            </div>
+
+            {/* Right */}
+            <div className="flex items-center gap-3 ml-3">
+              <span
+                className={`px-2 py-1 rounded-md text-xs font-medium whitespace-nowrap ${getStatusStyles(
+                  pr.status,
+                )}`}
+              >
+                {pr.status}
+              </span>
+
+              <div className="flex items-center gap-1 text-slate-400">
+                <MessageSquare size={14} />
+                <span className="text-xs">{pr.comments}</span>
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+    </Card>
+  );
+};
+
+export default PullRequests;
\ No newline at end of file
diff --git a/client/src/components/layout/LowerMiddleSection/RecentActivity.jsx b/client/src/components/layout/LowerMiddleSection/RecentActivity.jsx
new file mode 100644
index 0000000..ccc4ac2
--- /dev/null
+++ b/client/src/components/layout/LowerMiddleSection/RecentActivity.jsx
@@ -0,0 +1,113 @@
+import React from "react";
+import Card from "../../common/Card";
+import {MessageSquare, GitMerge, CircleDot, GitCommit, CheckCircle } from "lucide-react";
+
+const recentActivityStats = [
+  {
+    id: 1,
+    user: "Sarah J.",
+    action: "commented on PR #142",
+    time: "3 minutes ago",
+    icon: MessageSquare,
+    iconBg: "bg-emerald-500/20",
+    iconColor: "text-emerald-400",
+    avatar: "https://i.pravatar.cc/100?img=5",
+  },
+  {
+    id: 2,
+    user: "Ankur Y.",
+    action: "merged commit a3f5d2e into main",
+    time: "25 minutes ago",
+    icon: GitMerge,
+    iconBg: "bg-violet-500/20",
+    iconColor: "text-violet-400",
+    avatar: "https://i.pravatar.cc/100?img=12",
+  },
+  {
+    id: 3,
+    user: "Anas S.",
+    action: "created issue #218",
+    time: "1 hour ago",
+    icon: CircleDot,
+    iconBg: "bg-red-500/20",
+    iconColor: "text-red-400",
+    avatar: "https://i.pravatar.cc/100?img=15",
+  },
+  {
+    id: 4,
+    user: "Soham A.",
+    action: "pushed 3 commits to feature/auth",
+    time: "2 hours ago",
+    icon: GitCommit,
+    iconBg: "bg-cyan-500/20",
+    iconColor: "text-cyan-400",
+    avatar: "https://i.pravatar.cc/100?img=20",
+  },
+  {
+    id: 5,
+    user: "Sumit S.",
+    action: "closed issue #215",
+    time: "3 hours ago",
+    icon: CheckCircle,
+    iconBg: "bg-rose-500/20",
+    iconColor: "text-rose-400",
+    avatar: "https://i.pravatar.cc/100?img=25",
+  },
+];
+
+export const RecentActivity = () => {
+  return (
+    <Card className="h-full min-h-[320px] flex flex-col bg-slate-900/60 border border-slate-800 backdrop-blur-xl">
+      {/* Header */}
+      <div className="flex items-center justify-between mb-4">
+        <h3 className="text-lg font-semibold text-slate-100">
+          Recent Activity
+        </h3>
+
+        <button className="text-sm text-indigo-400 hover:text-indigo-300 transition-colors cursor-pointer">
+          View All
+        </button>
+      </div>
+
+      {/* Activity List */}
+      <div className="space-y-1">
+        {recentActivityStats.map((activity) => {
+          const Icon = activity.icon;
+
+          return (
+            <div
+              key={activity.id}
+              className="flex items-center gap-3 py-1 border-b border-slate-800 last:border-none hover:bg-slate-800/30 rounded-lg px-1 transition-colors cursor-pointer"
+            >
+              {/* Activity Icon */}
+              <div
+                className={`w-7 h-7 shrink-0 rounded-lg flex items-center justify-center ${activity.iconBg}`}
+              >
+                <Icon size={16} className={activity.iconColor} />
+              </div>
+
+              {/* Avatar */}
+              <img
+                src={activity.avatar}
+                alt={activity.user}
+                className="w-7 h-7 shrink-0 rounded-full object-cover"
+              />
+
+              {/* Content */}
+              <div className="flex-1 min-w-0">
+                <p className="text-sm text-slate-200 truncate">
+                  <span className="font-medium">{activity.user}</span>{" "}
+                  {activity.action}
+                </p>
+
+                <p className="text-xs text-slate-400 mt-1">{activity.time}</p>
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    </Card>
+  );
+};
+
+export default RecentActivity;
diff --git a/client/src/components/layout/MiddleSection/CICDStatus.jsx b/client/src/components/layout/MiddleSection/CICDStatus.jsx
new file mode 100644
index 0000000..e25c6e6
--- /dev/null
+++ b/client/src/components/layout/MiddleSection/CICDStatus.jsx
@@ -0,0 +1,70 @@
+import React from "react";
+import Card from "../../common/Card";
+import { ArrowRight } from "lucide-react";
+
+const pipelineSteps = [
+  {
+    name: "Build",
+    status: "Passed",
+    time: "2 min ago",
+    icon: "✅",
+    color: "text-green-400",
+  },
+  {
+    name: "Tests",
+    status: "143 Passed",
+    time: "2 min ago",
+    icon: "✅",
+    color: "text-green-400",
+  },
+  {
+    name: "Lint",
+    status: "Passed",
+    time: "2 min ago",
+    icon: "✅",
+    color: "text-green-400",
+  },
+  {
+    name: "Deployment",
+    status: "Deployed",
+    time: "5 min ago",
+    icon: "🚀",
+    color: "text-orange-400",
+  },
+];
+
+export const CICDStatus = () => {
+  return (
+    <Card className="h-full min-h-[320px] flex flex-col justify-between">
+      <h3 className="text-lg font-semibold text-slate-100">CI/CD Status</h3>
+
+      <div className="mt-4">
+        {pipelineSteps.map((step) => (
+          <div
+            key={step.name}
+            className="flex items-center justify-between py-4 border-b border-slate-800 gap-2">
+            <div className="text-sm text-slate-400">{step.name}</div>
+
+            <div
+              className={`flex items-center text-sm font-medium ${step.color}`}
+            >
+              <span>{step.icon}</span>
+              <span>{step.status}</span>
+            </div>
+
+            <div className="text-xs text-slate-500">{step.time}</div>
+          </div>
+        ))}
+      </div>
+
+      <div className="flex justify-center mt-4">
+        <button className=" flex items-center gap-2 text-sm text-indigo-400 hover:text-indigo-300 transition-colors cursor-pointer">
+          View Pipeline
+          <ArrowRight size={16} />
+        </button>
+      </div>
+    </Card>
+  );
+};
+
+export default CICDStatus;
diff --git a/client/src/components/layout/MiddleSection/CurrentSprint.jsx b/client/src/components/layout/MiddleSection/CurrentSprint.jsx
new file mode 100644
index 0000000..41281a0
--- /dev/null
+++ b/client/src/components/layout/MiddleSection/CurrentSprint.jsx
@@ -0,0 +1,111 @@
+import React from "react";
+import Card from "../../common/Card";
+
+const sprintData = {
+  sprintNumber: 12,
+  title: "Build Collaboration Core",
+  dateRange: "May 1 - May 15, 2025",
+  daysLeft: 14,
+  progress: 82,
+
+  storyPoints: {
+    completed: 92,
+    total: 112,
+  },
+
+  completedTasks: 23,
+  inProgressTasks: 6,
+  todoTasks: 11,
+};
+
+const StatItem = ({ label, value, className = "" }) => {
+  return (
+    <div className={className}>
+      <p className="text-xs text-slate-400">{label}</p>
+
+      <p className="mt-1 text-xl font-semibold text-slate-100 whitespace-nowrap">
+        {value}
+      </p>
+    </div>
+  );
+};
+
+export const CurrentSprint = () => {
+  const {
+    sprintNumber,
+    title,
+    dateRange,
+    daysLeft,
+    progress,
+    storyPoints,
+    completedTasks,
+    inProgressTasks,
+    todoTasks,
+  } = sprintData;
+
+  return (
+    <Card className="h-full min-h-[320px] flex flex-col justify-between">
+      {/* Header */}
+      <div className="flex items-center justify-between">
+        <h3 className="text-lg font-semibold text-slate-100">Current Sprint</h3>
+
+        <div className="px-3 py-1 text-xs rounded-lg border border-slate-700 bg-slate-800 text-slate-300">
+          Sprint {sprintNumber}
+        </div>
+      </div>
+
+      {/* Sprint Details */}
+      <div className="mt-5">
+        <h4 className="text-xl font-semibold text-white">
+          Sprint {sprintNumber} - {title}
+        </h4>
+
+        <p className="mt-2 text-sm text-slate-400">
+          {dateRange} ({daysLeft} days left)
+        </p>
+      </div>
+
+      {/* Progress */}
+      <div className="mt-5 flex items-center gap-3">
+        <div className="flex-1 h-2.5 bg-slate-800 rounded-full overflow-hidden">
+          <div
+            className="h-full rounded-full bg-cyan-500"
+            style={{ width: `${progress}%` }}
+          />
+        </div>
+
+        <span className="text-xl font-semibold text-white">{progress}%</span>
+      </div>
+
+      {/* Stats */}
+      <div className="mt-5 border-t border-slate-800 pt-5">
+        <div className="grid grid-cols-2 sm:grid-cols-4 gap-4 sm:gap-3">
+          <StatItem
+            label="Story Points"
+            value={
+              <>
+                {storyPoints.completed}
+                <span className="text-slate-500">
+                  {" / "}
+                  {storyPoints.total}
+                </span>
+              </>
+            }
+          />
+
+          <StatItem label="Completed" value={completedTasks}/>
+
+          <StatItem
+            label="In Progress"
+            value={inProgressTasks}
+
+          />
+
+          <StatItem label="To Do" value={todoTasks} />
+        </div>
+      </div>
+    </Card>
+  );
+};
+
+export default CurrentSprint;
diff --git a/client/src/components/layout/MiddleSection/MiddleSection.jsx b/client/src/components/layout/MiddleSection/MiddleSection.jsx
new file mode 100644
index 0000000..3d09ec6
--- /dev/null
+++ b/client/src/components/layout/MiddleSection/MiddleSection.jsx
@@ -0,0 +1,20 @@
+import React from 'react'
+import { CurrentSprint } from './CurrentSprint';
+import { ProjectOverview } from './ProjectOverview';
+import { CICDStatus } from './CICDStatus';
+
+const MiddleSection = () => {
+  return (
+    <div className="w-full bg-[#111827] rounded-2xl p-2">
+      <div className="grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3 gap-4 items-stretch">
+        <CurrentSprint />
+        <ProjectOverview />
+        <div className="lg:col-span-2 2xl:col-span-1 h-full">
+        <CICDStatus />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default MiddleSection;
\ No newline at end of file
diff --git a/client/src/components/layout/MiddleSection/ProjectOverview.jsx b/client/src/components/layout/MiddleSection/ProjectOverview.jsx
new file mode 100644
index 0000000..8b204c0
--- /dev/null
+++ b/client/src/components/layout/MiddleSection/ProjectOverview.jsx
@@ -0,0 +1,99 @@
+import React from "react";
+import Card from "../../common/Card";
+
+const ProjectData = {
+  projectName: "Developer Collaboration Platform",
+  projectDescription: "A unified platform to streamline teamwork for developers.",
+  progress: 72,
+  projectMembers: [
+    "A", "B" , "C" , "D",
+  ],
+  extraProjectMembers:3,
+  repositoryBranch: "main",
+
+}
+export const ProjectOverview = () => {
+  const {
+    projectName,
+    projectDescription,
+    progress,
+    projectMembers,
+    extraProjectMembers,
+    repositoryBranch
+  } = ProjectData;
+
+  return (
+    <Card className="h-full min-h-[320px] flex flex-col justify-between">
+      <div className="flex items-center justify-between">
+        <h3 className="text-lg font-semibold text-slate-100">
+          Project Overview
+        </h3>
+      </div>
+      <div className="mt-5 flex gap-3">
+        <div className="w-10 h-10 rounded-xl bg-purple-600 flex items-center justify-center text-white font-bold">
+          D
+        </div>
+        <div>
+          <h4 className="text-base font-semibold text-white">{projectName}</h4>
+          <p className="mt-1 text-sm text-slate-400">{projectDescription}</p>
+        </div>
+      </div>
+      <div className="mt-4">
+        <p className="text-sm text-slate-400">Overall Progress</p>
+
+        <div className="mt-3 flex items-center gap-3">
+          <div className="flex-1 h-2.5 bg-slate-800 rounded-full overflow-hidden">
+            <div
+              className="h-full bg-cyan-500 rounded-full"
+              style={{ width: `${progress}%` }}
+            />
+          </div>
+
+          <span className="text-xl font-semibold text-white">{progress}%</span>
+        </div>
+        <div className="mt-4 grid grid-cols-2">
+          <div>
+            <p className="text-sm text-slate-400">Members</p>
+
+            <div className="flex items-center mt-3">
+              <div className="w-7 h-7 rounded-full bg-red-500 border-2 border-slate-900"></div>
+
+              <div className="-ml-2 w-7 h-7 rounded-full bg-blue-500 border-2 border-slate-900"></div>
+
+              <div className="-ml-2 w-7 h-7 rounded-full bg-green-500 border-2 border-slate-900"></div>
+
+              <div className="-ml-2 w-7 h-7 rounded-full bg-yellow-500 border-2 border-slate-900"></div>
+
+              <div className="-ml-2 w-7 h-7 rounded-full bg-slate-700 border-2 border-slate-900 flex items-center justify-center text-xs text-white">
+                +{extraProjectMembers}
+              </div>
+            </div>
+          </div>
+          <div>
+            <p className="text-sm text-slate-400">Repository</p>
+
+            <div className="flex items-center gap-2 mt-3">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="16"
+                height="16"
+                fill="none"
+                stroke="currentColor"
+                strokeWidth="2"
+                viewBox="0 0 24 24"
+                className="text-slate-400"
+              >
+                <path d="M6 3v12" />
+                <circle cx="18" cy="6" r="3" />
+                <circle cx="6" cy="18" r="3" />
+                <path d="M18 9a9 9 0 0 1-9 9" />
+              </svg>
+
+              <span className="text-white font-medium">{repositoryBranch}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </Card>
+  );
+};
diff --git a/client/src/components/layout/Navbar.jsx b/client/src/components/layout/Navbar.jsx
new file mode 100644
index 0000000..ee0a5c8
--- /dev/null
+++ b/client/src/components/layout/Navbar.jsx
@@ -0,0 +1,67 @@
+import { Search, Bell, Menu, MessageCircle } from 'lucide-react';
+import React from 'react';
+import githubIcon from "/src/assets/github.svg";
+
+const Navbar = ({ toggleSidebar }) => {
+  return (
+    <div className="sticky top-0 z-40 flex items-center justify-between text-white px-4 md:px-8 py-2 border-b border-slate-800 bg-[#111827] rounded-2xl gap-2 md:gap-4">
+      <div className="flex items-center gap-4 flex-shrink-0">
+        <button
+          className="md:hidden p-2 bg-[#1c1f2e] rounded-lg text-white hover:bg-[#2a2e45] transition-colors"
+          onClick={toggleSidebar}
+        >
+          <Menu size={20} />
+        </button>
+        <div>
+          <h2 className="text-[18px] font-semibold tracking-tight text-slate-100 hidden sm:block">
+            Dashboard
+          </h2>
+          <p className="mt-1 text-[12px] text-slate-400 hidden lg:block">
+            Welcome back, Ankur! Here's what's happening with your projects.
+          </p>
+        </div>
+      </div>
+      <div className="hidden sm:block flex-1 max-w-xl mx-2 md:mx-8">
+        <search className="relative block group">
+          <Search
+            size={18}
+            className="absolute left-3 top-1/2 -translate-y-1/2 text-slate-400 transition-colors group-focus-within:text-violet-400"
+          />
+
+          <input
+            type="text"
+            placeholder="Search projects, repositories, files..."
+            className="w-full pl-10 pr-4 py-3 bg-slate-800/80 border border-slate-700 rounded-lg text-sm text-white placeholder:text-slate-400 outline-none transition-all duration-200 focus:border-violet-500 focus:ring-2 focus:ring-violet-500/20"
+          />
+        </search>
+      </div>
+      <div className="flex items-center gap-3 md:gap-4 flex-shrink-0">
+        <div className="relative">
+          <Bell
+            size={20}
+            className="hidden md:block text-slate-400 cursor-pointer transition-transform hover:text-slate-200 hover:scale-110"
+          />
+          <span className="hidden md:block absolute -top-0.5 -right-0.5 h-2 w-2 rounded-full bg-red-500 ring-2 ring-[#111827]" />
+        </div>
+
+        <MessageCircle
+          size={20}
+          className="hidden md:block text-slate-400 cursor-pointer transition-transform hover:text-slate-200 hover:scale-110 duration-300"
+        />
+
+        <div className="h-5 w-5 flex items-center justify-center font-medium cursor-pointer transition-transform hover:scale-110 duration-300">
+          <img
+            src={githubIcon}
+            alt="Google"
+            className="invert opacity-70 hover:opacity-100 transition-opacity"
+          />
+        </div>
+        <div className="h-9 w-9 rounded-full bg-violet-600 flex items-center justify-center font-medium hover:scale-110 cursor-pointer">
+          A
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default Navbar
\ No newline at end of file
diff --git a/client/src/components/layout/RepositoryHealthSection/RepositoryHealth.jsx b/client/src/components/layout/RepositoryHealthSection/RepositoryHealth.jsx
new file mode 100644
index 0000000..ef2c03d
--- /dev/null
+++ b/client/src/components/layout/RepositoryHealthSection/RepositoryHealth.jsx
@@ -0,0 +1,111 @@
+import React from "react";
+import { ResponsiveContainer, LineChart, Line } from "recharts";
+
+const repositoryHealthData = [
+  {
+    title: "Code Coverage",
+    value: "92%",
+    type: "progress",
+    progress: 92,
+    color: "bg-green-500",
+  },
+  {
+    title: "Test Passing Rate",
+    value: "98%",
+    type: "progress",
+    progress: 98,
+    color: "bg-green-500",
+  },
+  {
+    title: "Open Issues",
+    value: "18",
+    type: "chart",
+    chartColor: "#ef4444",
+  },
+  {
+    title: "Technical Debt",
+    value: "4.2 hrs",
+    type: "chart",
+    chartColor: "#f97316",
+  },
+  {
+    title: "Code Smells",
+    value: "12",
+    type: "chart",
+    chartColor: "#a855f7",
+  },
+  {
+    title: "Duplications",
+    value: "3.1%",
+    type: "chart",
+    chartColor: "#3b82f6",
+  },
+];
+
+const chartData = [
+  { value: 20 },
+  { value: 35 },
+  { value: 28 },
+  { value: 45 },
+  { value: 30 },
+  { value: 55 },
+  { value: 48 },
+];
+
+const HealthMetric = ({ title, value, type, progress, color, chartColor }) => {
+  return (
+    <div className="px-4 py-4 bg-[#111827] min-w-0 flex flex-col justify-between">
+      {/* Title */}
+      <h4 className="text-sm text-slate-400 mb-2 truncate">{title}</h4>
+
+      {/* Value */}
+      <p className="text-3xl font-semibold text-slate-100 mb-4">{value}</p>
+
+      {/* Progress Bars */}
+      {type === "progress" ? (
+        <div className="h-2 bg-slate-800 rounded-full overflow-hidden">
+          <div
+            className={`h-full rounded-full ${color}`}
+            style={{ width: `${progress}%` }}
+          />
+        </div>
+      ) : (
+        <div className="h-10">
+          <ResponsiveContainer width="100%" height="100%">
+            <LineChart data={chartData}>
+              <Line
+                type="monotone"
+                dataKey="value"
+                stroke={chartColor}
+                strokeWidth={2}
+                dot={false}
+              />
+            </LineChart>
+          </ResponsiveContainer>
+        </div>
+      )}
+    </div>
+  );
+};
+
+const RepositoryHealth = () => {
+  return (
+    <div className="w-full bg-[#111827] border border-slate-800 rounded-2xl overflow-hidden">
+      {/* Header */}
+      <div className="px-6 py-4 border-b border-slate-800">
+        <h3 className="text-lg font-semibold text-slate-100">
+          Repository Health
+        </h3>
+      </div>
+
+      {/* Metrics Grid */}
+      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-6 gap-px bg-slate-800">
+        {repositoryHealthData.map((item) => (
+          <HealthMetric key={item.title} {...item} />
+        ))}
+      </div>
+    </div>
+  );
+};
+
+export default RepositoryHealth;
diff --git a/client/src/components/layout/RightSideSection/RightSideBar.jsx b/client/src/components/layout/RightSideSection/RightSideBar.jsx
new file mode 100644
index 0000000..c0ddc95
--- /dev/null
+++ b/client/src/components/layout/RightSideSection/RightSideBar.jsx
@@ -0,0 +1,18 @@
+import React from 'react'
+import TeamMember from './TeamMember';
+import UpcomingEvents from './UpcomingEvents';
+import TeamChat from './TeamChat';
+
+export const RightSideBar = () => {
+  return (
+    <div className="w-full bg-[#111827] rounded-2xl p-2">
+      <div className="flex flex-col gap-4">
+        <TeamMember />
+        <UpcomingEvents />
+        <TeamChat />
+      </div>
+    </div>
+  );
+}
+
+export default RightSideBar;
\ No newline at end of file
diff --git a/client/src/components/layout/RightSideSection/TeamChat.jsx b/client/src/components/layout/RightSideSection/TeamChat.jsx
new file mode 100644
index 0000000..5276aab
--- /dev/null
+++ b/client/src/components/layout/RightSideSection/TeamChat.jsx
@@ -0,0 +1,66 @@
+import React from "react";
+
+const recentChats = [
+  {
+    id: 1,
+    name: "Soham A.",
+    time: "10:30 AM",
+    message: "OAuth flow is ready for review.",
+    avatar: "https://i.pravatar.cc/150?u=4",
+  },
+  {
+    id: 2,
+    name: "Ankur Y.",
+    time: "10:28 AM",
+    message: "Pushed the latest backend changes.",
+    avatar: "https://i.pravatar.cc/150?u=3",
+  },
+  {
+    id: 3,
+    name: "Sumit S.",
+    time: "10:25 AM",
+    message: "Updated the UI for the dashboard.",
+    avatar: "https://i.pravatar.cc/150?u=2",
+  },
+];
+
+export default function TeamChat() {
+  return (
+    <div className="bg-[#161822] rounded-xl p-5 border border-white/5">
+      <div className="flex items-center justify-between mb-4">
+        <h3 className="text-white font-semibold text-sm">
+          Team Chat <span className="text-[#8b92a5] font-normal">(Recent)</span>
+        </h3>
+        <a
+          href="#"
+          className="text-indigo-400 hover:text-indigo-300 text-xs hover:underline transition-colors"
+        >
+          View all
+        </a>
+      </div>
+
+      <div className="flex flex-col space-y-4">
+        {recentChats.map((chat) => (
+          <div key={chat.id} className="flex space-x-3 group cursor-pointer">
+            <img
+              src={chat.avatar}
+              alt={chat.name}
+              className="w-8 h-8 rounded-full border border-white/10 mt-0.5 flex-shrink-0"
+            />
+            <div className="flex-1 min-w-0">
+              <div className="flex items-center justify-between mb-0.5">
+                <p className="text-sm font-medium text-white group-hover:text-indigo-400 transition-colors truncate">
+                  {chat.name}
+                </p>
+                <p className="text-xs text-[#8b92a5] whitespace-nowrap ml-2">
+                  {chat.time}
+                </p>
+              </div>
+              <p className="text-xs text-[#8b92a5] truncate">{chat.message}</p>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/client/src/components/layout/RightSideSection/TeamMember.jsx b/client/src/components/layout/RightSideSection/TeamMember.jsx
new file mode 100644
index 0000000..d6cc6bd
--- /dev/null
+++ b/client/src/components/layout/RightSideSection/TeamMember.jsx
@@ -0,0 +1,108 @@
+import React from "react";
+
+export const teamMembers = [
+  {
+    id: 1,
+    name: "Ankur Y. (You)",
+    role: "Admin",
+    status: "Online",
+    statusColor: "bg-emerald-500",
+    avatar: "https://i.pravatar.cc/150?u=1",
+  },
+  {
+    id: 2,
+    name: "Sarah J.",
+    role: "Frontend Developer",
+    status: "Online",
+    statusColor: "bg-emerald-500",
+    avatar: "https://i.pravatar.cc/150?u=2",
+  },
+  {
+    id: 3,
+    name: "Soham A.",
+    role: "Backend Developer",
+    status: "Online",
+    statusColor: "bg-emerald-500",
+    avatar: "https://i.pravatar.cc/150?u=3",
+  },
+  {
+    id: 4,
+    name: "Anas S.",
+    role: "DevOps Engineer",
+    status: "Away",
+    statusColor: "bg-yellow-500",
+    avatar: "https://i.pravatar.cc/150?u=4",
+  },
+  {
+    id: 5,
+    name: "Sumit S.",
+    role: "QA Engineer",
+    status: "Offline",
+    statusColor: "bg-gray-500",
+    avatar: "https://i.pravatar.cc/150?u=5",
+  },
+  {
+    id: 6,
+    name: "Maria K.",
+    role: "UI/UX Designer",
+    status: "Online",
+    statusColor: "bg-emerald-500",
+    avatar: "https://i.pravatar.cc/150?u=6",
+  },
+];
+
+export default function TeamMember() {
+  return (
+    <div className="bg-[#161822] rounded-xl p-5 mb-4 border border-white/5">
+      <div className="flex items-center justify-between mb-4">
+        <h3 className="text-white font-semibold text-sm">Team Members</h3>
+        <a
+          href="#"
+          className="text-indigo-400 hover:text-indigo-300 text-xs hover:underline transition-colors"
+        >
+          View all
+        </a>
+      </div>
+
+      <div className="flex flex-col space-y-4">
+        {teamMembers.map((member) => (
+          <div
+            key={member.id}
+            className="flex items-center justify-between group cursor-pointer"
+          >
+            <div className="flex items-center space-x-3">
+              <img
+                src={member.avatar}
+                alt={member.name}
+                className="w-8 h-8 rounded-full border border-white/10"
+              />
+              <div>
+                <p className="text-sm font-medium text-white group-hover:text-indigo-400 transition-colors">
+                  {member.name}
+                </p>
+                <p className="text-xs text-[#8b92a5]">{member.role}</p>
+              </div>
+            </div>
+
+            <div className="flex items-center space-x-1.5">
+              <span
+                className={`w-1.5 h-1.5 rounded-full ${member.statusColor}`}
+              ></span>
+              <span
+                className={`text-xs ${
+                  member.status === "Online"
+                    ? "text-emerald-500"
+                    : member.status === "Away"
+                      ? "text-yellow-500"
+                      : "text-gray-500"
+                }`}
+              >
+                {member.status}
+              </span>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/client/src/components/layout/RightSideSection/UpcomingEvents.jsx b/client/src/components/layout/RightSideSection/UpcomingEvents.jsx
new file mode 100644
index 0000000..de364e7
--- /dev/null
+++ b/client/src/components/layout/RightSideSection/UpcomingEvents.jsx
@@ -0,0 +1,63 @@
+import React from "react";
+import { Calendar } from "lucide-react";
+
+const upcomingEvents = [
+  {
+    id: 1,
+    title: "Sprint Planning",
+    date: "May 14, 2025 • 10:00 AM",
+    color: "bg-purple-500/20",
+    iconColor: "text-purple-500",
+  },
+  {
+    id: 2,
+    title: "Code Review Sync",
+    date: "May 15, 2025 • 04:00 PM",
+    color: "bg-indigo-500/20",
+    iconColor: "text-indigo-500",
+  },
+  {
+    id: 3,
+    title: "Demo Day",
+    date: "May 16, 2025 • 11:00 AM",
+    color: "bg-blue-500/20",
+    iconColor: "text-blue-500",
+  },
+];
+
+export default function UpcomingEvents() {
+  return (
+    <div className="bg-[#161822] rounded-xl p-5 mb-4 border border-white/5">
+      <div className="flex items-center justify-between mb-4">
+        <h3 className="text-white font-semibold text-sm">Upcoming Events</h3>
+        <a
+          href="#"
+          className="text-indigo-400 hover:text-indigo-300 text-xs hover:underline transition-colors"
+        >
+          View calendar
+        </a>
+      </div>
+
+      <div className="flex flex-col space-y-4">
+        {upcomingEvents.map((event) => (
+          <div
+            key={event.id}
+            className="flex items-center space-x-3 group cursor-pointer"
+          >
+            <div
+              className={`w-10 h-10 rounded-lg flex items-center justify-center ${event.color}`}
+            >
+              <Calendar className={`w-5 h-5 ${event.iconColor}`} />
+            </div>
+            <div>
+              <p className="text-sm font-medium text-white group-hover:text-indigo-400 transition-colors">
+                {event.title}
+              </p>
+              <p className="text-xs text-[#8b92a5] mt-0.5">{event.date}</p>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/client/src/components/layout/Sidebar.jsx b/client/src/components/layout/Sidebar.jsx
new file mode 100644
index 0000000..32aba0e
--- /dev/null
+++ b/client/src/components/layout/Sidebar.jsx
@@ -0,0 +1,165 @@
+import { Book, BookAIcon, BookCheck, BookCopy, BookIcon, BookOpenText, BubblesIcon, Calendar, Calendar1Icon, ChartBar, CircleArrowDown, CircleCheck, Folder, GitBranchMinusIcon, GitCommit, GitCommitHorizontalIcon, GitCompare, GitMergeConflict, GitPullRequest, GitPullRequestArrow, HomeIcon, LucideGitCommit, LucideMirrorRectangular, MessageCircle, Settings, Ticket, User2, User2Icon, UserCircleIcon, UserIcon, UserRound, PanelLeftOpen, PanelLeftClose, LayoutDashboard, CircleUserRound} from "lucide-react";
+
+import {useState} from 'react'
+
+function Sidebar({ isOpen, setIsOpen }) {
+  const [isCollapsed, setIsCollapsed] = useState(false);
+    return (
+      <>
+        {isOpen && (
+          <div
+            className="fixed inset-0 z-40 bg-black/50 md:hidden"
+            onClick={() => setIsOpen(false)}
+          />
+        )}
+        <div
+          className={`flex flex-col ${`isCollapsed ? "w-12":"w-[240px]"`} h-full bg-[#0f111a] text-[#8b92a5] border-r border-[#ffffff]/10 fixed inset-y-0 left-0 z-50 transition-transform duration-300 ease-in-out md:relative md:translate-x-0 ${isOpen ? "translate-x-0" : "-translate-x-full"}`}
+        >
+          <div className="flex items-center justify-between h-16 p-4 text-white font-bold">
+            {!isCollapsed && <span className="whitespace nowrap">Devhub</span>}
+            <button
+              onClick={() => setIsCollapsed(!isCollapsed)}
+              className="p-1.5 rounded-lg hover:bg-[#1c1f2e] text-slate-400 hover:text-white transition-colors"
+            >
+              {isCollapsed ? (
+                <PanelLeftOpen size={20} className="cursor-pointer" />
+              ) : (
+                <PanelLeftClose size={20} className="cursor-pointer" />
+              )}
+            </button>
+          </div>
+          <div className="flex flex-col flex-1 overflow-y-auto px-4 gap-1 mt-2">
+            <div className="flex items-center h-10 px-3 gap-2 hover:bg-[#1c1f2e] hover:text-white rounded-lg font-medium cursor-pointer transition-colors">
+              <HomeIcon size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Dashboard
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 hover:bg-[#1c1f2e] hover:text-white rounded-lg cursor-pointer transition-colors">
+              <Folder size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Projects
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <CircleCheck size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Issues
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <GitPullRequestArrow
+                size={18}
+                className="text-slate-300 shrink-0"
+              />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Pull Requests
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <GitCommitHorizontalIcon
+                size={18}
+                className="text-slate-300 shrink-0"
+              />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Commits
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3  gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <CircleArrowDown size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Sprint
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <GitBranchMinusIcon
+                size={18}
+                className="text-slate-300 shrink-0"
+              />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                CI/CD
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <BookOpenText size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Wiki
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <MessageCircle size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Chat
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <Calendar size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Calender
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <UserRound size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Team
+              </span>
+            </div>
+            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+              <Settings size={18} className="text-slate-300 shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+              >
+                Settings
+              </span>
+            </div>
+          </div>
+          <div className="mt-auto border-t border-[#ffffff]/10 p-4 flex flex-col gap-2">
+            <div
+              className={`p-2 flex items-center rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer ${isCollapsed ? "justify-center" : "gap-2"}`}
+            >
+              <LayoutDashboard size={20} className="shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0 hidden" : "w-auto opacity-100 block"}`}
+              >
+                Workspace
+              </span>
+            </div>
+            <div
+              className={`p-2 flex items-center rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer ${isCollapsed ? "justify-center" : "gap-2"}`}
+            >
+              <CircleUserRound size={20} className="shrink-0" />
+              <span
+                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0 hidden" : "w-auto opacity-100 block"}`}
+              >
+                Profile
+              </span>
+            </div>
+          </div>
+        </div>
+      </>
+    );
+}
+
+export default Sidebar;
\ No newline at end of file
diff --git a/client/src/pages/dashboard.jsx b/client/src/pages/dashboard.jsx
index cba5f7e..ebedc99 100644
--- a/client/src/pages/dashboard.jsx
+++ b/client/src/pages/dashboard.jsx
@@ -1,11 +1,43 @@
-import React, { PureComponent } from 'react'
-
-export class Dashboard extends PureComponent {
-  render() {
-    return (
-      <div>welcome to dashboard</div>
-    )
-  }
+import React, { useState } from 'react'
+import Sidebar from "../components/layout/Sidebar.jsx";
+import Navbar from "../components/layout/Navbar.jsx";
+import StatsGrid from '../components/layout/KPIs/StatsGrid.jsx';
+import MiddleSection from '../components/layout/MiddleSection/MiddleSection.jsx';
+import LowerMiddleSection from '../components/layout/LowerMiddleSection/LowerMiddleSection.jsx';
+import RepositoryHealth from '../components/layout/RepositoryHealthSection/RepositoryHealth.jsx';
+import RightSideBar from '../components/layout/RightSideSection/RightSideBar.jsx';
+
+const Dashboard = () => {
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+
+      <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+
+
+        <div className="mt-4">
+          <StatsGrid />
+        </div>
+
+
+        <div className="mt-4 flex flex-col xl:flex-row gap-4 items-start">
+
+          <div className="flex-1 flex flex-col gap-4 min-w-0 w-full">
+            <MiddleSection />
+            <LowerMiddleSection />
+            <RepositoryHealth />
+          </div>
+
+          <aside className="w-full xl:w-[320px] flex-shrink-0 sticky top-4">
+            <RightSideBar />
+          </aside>
+        </div>
+      </main>
+    </div>
+  );
 }
 
 export default Dashboard;
\ No newline at end of file
diff --git a/dashboard_analysis.md b/dashboard_analysis.md
new file mode 100644
index 0000000..3e0e1de
--- /dev/null
+++ b/dashboard_analysis.md
@@ -0,0 +1,119 @@
+# Developer Collaboration Platform: Dashboard Analysis
+
+This document provides a comprehensive, element-by-element, section-by-section breakdown of the Developer Collaboration Platform dashboard design, analyzing the purpose, patterns, and metrics displayed.
+
+---
+
+## 1. Global & Structural Elements
+
+### Left Sidebar (Global Navigation)
+
+This is the primary routing mechanism for the application.
+
+* **Branding (Top Left):** The "DEVHUB" logo with the tagline "Code. Collaborate. Ship." establishes the platform's identity and core mission immediately.
+* **Active State Pattern:** The "Dashboard" item is highlighted with a purple background and an icon, clearly indicating the user's current location.
+* **Navigation Links:**
+  * *Projects, Issues, Pull Requests, Commits, Sprint, CI / CD, Wiki, Chat, Calendar, Team, Settings.*
+  * **Pattern:** This exhaustive list covers the entire software development lifecycle (SDLC). It implies this tool replaces Jira (Sprint/Issues), GitHub (PRs/Commits), Slack (Chat), and Jenkins (CI/CD).
+* **Notification Badges:** Small pills with numbers next to "Issues (18)" and "Pull Requests (9)".
+  * **Pattern:** Passive notification. It alerts the user to total volumes without needing to click into the section.
+* **Workspace Switcher:** A dropdown labeled "WORKSPACE: DevHub Team".
+  * **Pattern:** Multi-tenant/Context switching. Allows a user to exist in multiple organizations or teams without logging out.
+* **User Profile (Bottom Left):** "Alex R. (Admin)". Anchoring user settings to the bottom left is a standard SaaS UX pattern.
+
+### Top Header Bar
+
+* **Page Context:** Large text "Dashboard" with a welcoming subtext ("Welcome back, Alex!..."). This humanizes the interface.
+* **Global Search (⌘K):** A wide search bar dominating the header.
+  * **Pattern:** Command Palette. The `⌘K` hint suggests power-user functionality, allowing users to jump instantly to files, repos, or users without using the mouse.
+* **Global Actions (Top Right):**
+  * *Bell Icon:* System notifications with an unread badge (3).
+  * *GitHub Icon:* Indicates active integration with a version control provider.
+  * *Profile Dropdown:* Secondary access to user settings.
+
+---
+
+## 2. Top Row: The KPI (Key Performance Indicator) Cards
+
+These six cards provide the "10,000-foot view" of the entire workspace's health.
+
+* **Visual Pattern:** Each card uses a massive numeric value, a descriptive title, a localized context metric (e.g., "↑ 2 from last week"), a distinct color-coded icon, and a sparkline (mini-chart) to show the recent trend.
+
+1. **Active Projects (Purple):** KPI: `6`. Metric: Are we taking on more work? The upward sparkline and "↑ 2 from last week" shows growth in workload.
+2. **Pull Requests (Cyan):** KPI: `9`. Metric: The bottleneck indicator. "4 Awaiting Review" is the actionable insight here. If PRs pile up, development stalls.
+3. **Commits (7d) (Blue):** KPI: `156`. Metric: Velocity. Measures the raw output of code changes over a 7-day rolling window.
+4. **Open Issues (Green):** KPI: `18`. Metric: Defect/Task backlog. "2 Critical, 5 High" immediately triages the severity of the backlog.
+5. **Deployments (Orange):** KPI: `4`. Metric: Release cadence. How often is the team shipping to production or staging environments?
+6. **Tasks Done (Purple/Pink):** KPI: `32`. Metric: Sprint/Project completion rate. Includes a radial progress circle ("68% Completed") for quick visual digestion of overall progress.
+
+---
+
+## 3. Middle Section: Context & Progress
+
+This tier answers the question: *"What is the state of our current work?"*
+
+* **Current Sprint:**
+  * **Data:** "Sprint 12 – Build Collaboration Core". Shows dates and days left (14 days).
+  * **Visual Pattern:** A horizontal progress bar (82%) showing time elapsed or points burned down.
+  * **KPIs:** Breakdown of Story Points (Completed, In Progress, To Do). This is essential for Agile Scrum teams to gauge if they will meet their sprint goal.
+* **Project Overview:**
+  * **Data:** Focuses on a specific pinned or primary project ("Developer Collaboration Platform").
+  * **Visual Pattern:** A progress bar (72%) for overall completion.
+  * **Elements:** Shows active members (avatars) and the primary repository branch (`main`).
+* **CI / CD Status:**
+  * **Data:** Real-time state of the deployment pipeline.
+  * **Elements:** Breaks the pipeline into discrete steps: `Build`, `Tests` (shows exactly how many passed: 143), `Lint`, and `Deployment`.
+  * **Pattern:** Uses universal status indicators (Green Check = Passed, Red Rocket = Deployed/Failed depending on context, though here Deployed is marked with a rocket). Includes timestamps ("2 min ago") so developers know exactly how fresh this data is.
+
+---
+
+## 4. Lower Middle Section: Actionable Feeds
+
+This tier acts as the developer's immediate "To-Do" list and situational awareness feed.
+
+* **Recent Activity:**
+  * **Pattern:** An audit log/feed. Shows *who* did *what* and *when*.
+  * **Elements:** Icons denote the type of action (Comment, Merge, Issue Creation, Push). It provides social proof of work and keeps the team synchronized.
+* **Pull Requests:**
+  * **Data:** Specific, actionable PRs.
+  * **Elements:** Title, Author, Status Badge (`Review`, `Approved`, `Changes Requested`), and comment count.
+  * **UX Pattern:** Color-coded status badges let a developer instantly scan for PRs that are approved and ready to merge (Green) vs. those needing their review (Purple).
+* **Open Issues:**
+  * **Data:** Specific bugs or tasks.
+  * **Elements:** Issue ID, Title, Assignee, and Severity Badge.
+  * **UX Pattern:** Color-coded severity (`Critical` in red, `High` in orange, `Medium` in yellow, `Low` in blue) forces strict prioritization. The eye is immediately drawn to the red "Critical" issue.
+
+---
+
+## 5. Right Sidebar (Social & Scheduling)
+
+This column persists the "human" element of the collaboration platform.
+
+* **Team Members:**
+  * **Pattern:** Presence indicator. Shows avatars, names, roles, and a colored dot (Green = Online, Yellow = Away, Gray = Offline). This tells a developer exactly who is available to answer a question right now.
+* **Upcoming Events:**
+  * **Data:** Schedule integration. Shows Sprint Planning, Syncs, and Demo days.
+  * **Pattern:** Calendar widget pattern. Keeps developers aware of hard stops or meetings without needing to open Google Calendar or Outlook.
+* **Team Chat (Recent):**
+  * **Data:** A snippet of the latest messages from the platform's internal chat.
+  * **Pattern:** Integration of synchronous communication. Prevents the need to tab over to Slack to see the latest team-wide announcement.
+
+---
+
+## 6. Bottom Section: Repository Health
+
+This is the most technically focused section, aimed at maintaining code quality over time.
+
+* **Visual Pattern:** A horizontal row of specific code-quality KPIs, each with its own localized trend line (sparkline), acting as a "health monitor" for the codebase.
+* **Code Coverage (92%):** Metric: What percentage of the codebase is covered by automated tests? Green indicates a very healthy metric.
+* **Test Passing Rate (98%):** Metric: Are the tests flaky? A high passing rate means the CI pipeline is stable.
+* **Open Issues (18):** Duplicate from the KPI row, but placed here in the context of technical health. The red trendline indicates issues are rising.
+* **Technical Debt (4.2 hrs):** Metric: Estimated time required to fix known bad code/shortcuts. The orange trendline suggests tech debt is accumulating.
+* **Code Smells (12):** Metric: Static analysis indicators of poor design or implementation (usually provided by tools like SonarQube).
+* **Duplications (3.1%):** Metric: Percentage of copy-pasted or redundant code.
+
+---
+
+### Summary
+
+Every element in this dashboard is designed to answer a specific developer question without requiring a click. From "Is the build broken?" (CI/CD section) to "Who is online to review my code?" (Team section) to "Is our code quality degrading?" (Repository Health), the design uses dense but visually structured patterns to provide immediate answers.

From 0b6dd669520fc1c89aaf70294a5138d1e048d330 Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Tue, 4 Aug 2026 13:17:49 +0530
Subject: [PATCH 18/24] Implemented Access & Refresh Tokens

---
 client/src/App.jsx                            |   4 +-
 client/src/components/layout/Sidebar.jsx      |   3 +-
 .../migration.sql                             |  17 ++
 server/prisma/migrations/migration_lock.toml  |   4 +-
 server/prisma/schema.prisma                   |   5 +-
 server/src/controllers/auth.controller.js     | 283 ++++++++++--------
 server/src/utils/token.utils.js               |  38 +++
 7 files changed, 223 insertions(+), 131 deletions(-)
 create mode 100644 server/prisma/migrations/20260803110049_add_token_fields/migration.sql
 create mode 100644 server/src/utils/token.utils.js

diff --git a/client/src/App.jsx b/client/src/App.jsx
index ac0dc6c..ad3791a 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -15,8 +15,8 @@ function App() {
         <Route path="/forgotpassword" element={<Forgotpassword />} />
 
         
-        <Route path="/signup" element={<ProtectedRoute><Dashboard /></ProtectedRoute>} />
-        <Route path="/" element={<Navigate to="/signup" replace />} />
+        <Route path="/dashboard" element={<ProtectedRoute><Dashboard /></ProtectedRoute>} />
+        <Route path="/" element={<Navigate to="/login" replace />} />
       </Routes>
     </BrowserRouter>
   );
diff --git a/client/src/components/layout/Sidebar.jsx b/client/src/components/layout/Sidebar.jsx
index 32aba0e..9b90c22 100644
--- a/client/src/components/layout/Sidebar.jsx
+++ b/client/src/components/layout/Sidebar.jsx
@@ -162,4 +162,5 @@ function Sidebar({ isOpen, setIsOpen }) {
     );
 }
 
-export default Sidebar;
\ No newline at end of file
+export default Sidebar;
+
diff --git a/server/prisma/migrations/20260803110049_add_token_fields/migration.sql b/server/prisma/migrations/20260803110049_add_token_fields/migration.sql
new file mode 100644
index 0000000..5bf9aa5
--- /dev/null
+++ b/server/prisma/migrations/20260803110049_add_token_fields/migration.sql
@@ -0,0 +1,17 @@
+/*
+  Warnings:
+
+  - A unique constraint covering the columns `[username]` on the table `User` will be added. If there are existing duplicate values, this will fail.
+  - A unique constraint covering the columns `[email]` on the table `User` will be added. If there are existing duplicate values, this will fail.
+
+*/
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN     "forgotPasswordExpiry" TIMESTAMP(3),
+ADD COLUMN     "forgotPasswordToken" TEXT,
+ADD COLUMN     "refreshToken" TEXT;
+
+-- CreateIndex
+CREATE UNIQUE INDEX "User_username_key" ON "User"("username");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "User_email_key" ON "User"("email");
diff --git a/server/prisma/migrations/migration_lock.toml b/server/prisma/migrations/migration_lock.toml
index 044d57c..fbffa92 100644
--- a/server/prisma/migrations/migration_lock.toml
+++ b/server/prisma/migrations/migration_lock.toml
@@ -1,3 +1,3 @@
 # Please do not edit this file manually
-# It should be added in your version-control system (e.g., Git)
-provider = "postgresql"
+# It should be added in your version-control system (i.e. Git)
+provider = "postgresql"
\ No newline at end of file
diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index 7c8f6ee..efd20ae 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -18,7 +18,10 @@ model User {
   username String  @unique 
   email String  @unique 
   password String
-  role String 
+  role String
+  refreshToken          String?  
+  forgotPasswordToken   String?
+  forgotPasswordExpiry  DateTime?
   createdAt DateTime @default(now())
   updatedAt DateTime @updatedAt
 }
\ No newline at end of file
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index f56bb15..0744c59 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -1,45 +1,47 @@
 import bcrypt from "bcrypt";
 import { PrismaClient } from "@prisma/client";
+import {
+  generateAccessToken,
+  generateRefreshToken,
+  generateTemporaryToken,
+} from "../utils/token.utils.js";
 import jwt from "jsonwebtoken";
 
 const prisma = new PrismaClient({});
 
-
-export const registerUser = async(req,res) => {
+export const registerUser = async (req, res) => {
   try {
-    const {username, email, role, password} = req.body;
+    const { username, email, role, password } = req.body;
 
-    if(!username || !email || !role || !password){
+    if (!username || !email || !role || !password) {
       return res.status(400).json({
         success: false,
         message: "All fields are required.",
       });
     }
 
-    if(username.length<3 || username.includes(" ")){
-      return res.status(400).json(
-        {
-          success: false,
-          message: "Username must be at least 3 characters and contain no spaces."
-        }
-      );
+    if (username.length < 3 || username.includes(" ")) {
+      return res.status(400).json({
+        success: false,
+        message:
+          "Username must be at least 3 characters and contain no spaces.",
+      });
     }
 
     const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-    if(!emailRegex.test(email)){
-      return res.status(400).json(
-        {
-          success: false,
-          message: "Please provide a valid email address."
-        }
-      );
+    if (!emailRegex.test(email)) {
+      return res.status(400).json({
+        success: false,
+        message: "Please provide a valid email address.",
+      });
     }
 
     const passwordRegex = /^(?=.*[0-9])(?=.*[!@#$%^&*(),.?":{}|<>]).{8,}$/;
     if (!passwordRegex.test(password)) {
       return res.status(400).json({
         success: false,
-        message: "Password must be at least 8 characters long, and include at least one number and one special character."
+        message:
+          "Password must be at least 8 characters long, and include at least one number and one special character.",
       });
     }
 
@@ -58,11 +60,11 @@ export const registerUser = async(req,res) => {
 
     const existingUser = await prisma.user.findFirst({
       where: {
-        OR: [{ email}, {username}],
+        OR: [{ email }, { username }],
       },
     });
 
-    if(existingUser){
+    if (existingUser) {
       return res.status(409).json({
         success: false,
         message: "A user with this email or username already exists.",
@@ -84,138 +86,169 @@ export const registerUser = async(req,res) => {
     return res.status(201).json({
       success: true,
       message: "User registered successfully!",
-      data:{
-          id: newUser.id,
-          username: newUser.username,
-          email: newUser.email,
-          role: newUser.role,
-        },
-    })
-
+      data: {
+        id: newUser.id,
+        username: newUser.username,
+        email: newUser.email,
+        role: newUser.role,
+      },
+    });
   } catch (error) {
     console.error("Database error during signup:", error);
-    
-    return res.status(500).json(
-      {
-        success: false,
-        message: "Internal Server Error"
-      }
-    );
+
+    return res.status(500).json({
+      success: false,
+      message: "Internal Server Error",
+    });
   }
 };
 
-export const loginUser = async (req, res) =>{
+export const loginUser = async (req, res) => {
   try {
-    const { username, password, turnstileToken} = req.body;
-
-    if(!username || !password){
-      return res.status(400).json(
-        {
-          success: false,
-          message: "Username and password are required.",
-        }
-      );
+    const { username, password, turnstileToken } = req.body;
+
+    if (!username || !password) {
+      return res.status(400).json({
+        success: false,
+        message: "Username and password are required.",
+      });
     }
 
-    if(!turnstileToken){
-      return res.status(400).json(
-        {
-          success: false,
-          message: "CAPTCHA token is missing."
-        }
-      );
+    if (!turnstileToken) {
+      return res.status(400).json({
+        success: false,
+        message: "CAPTCHA token is missing.",
+      });
     }
 
     const formData = new URLSearchParams();
     formData.append("secret", process.env.TURNSTILE_SECRET_KEY);
     formData.append("response", turnstileToken);
 
-    const verficationResponse = await fetch("https://challenges.cloudflare.com/turnstile/v0/siteverify", {
-      method: "POST",
-      body: formData,
-      headers: {'Content-Type': 'application/x-www-form-urlencoded'}
-    });
+    const verficationResponse = await fetch(
+      "https://challenges.cloudflare.com/turnstile/v0/siteverify",
+      {
+        method: "POST",
+        body: formData,
+        headers: { "Content-Type": "application/x-www-form-urlencoded" },
+      },
+    );
 
     const verficationData = await verficationResponse.json();
 
-    if(!verficationData.success){
-      return res.status(403).json(
-        {
-          success: false,
-          message: "CAPTCHA validation failed. Please try again."
-        }
-      );
+    if (!verficationData.success) {
+      return res.status(403).json({
+        success: false,
+        message: "CAPTCHA validation failed. Please try again.",
+      });
     }
-    const user = await prisma.user.findFirst(
-      {
-        where: { username},
-      }
-    );
+    const user = await prisma.user.findFirst({
+      where: { username },
+    });
 
-    if(!user){
-      return res.status(401).json(
-        {
-          success: false,
-          message: "Invalid credentials.",
-        }
-      );
+    if (!user) {
+      return res.status(401).json({
+        success: false,
+        message: "Invalid credentials.",
+      });
     }
 
     const isPasswordValid = await bcrypt.compare(password, user.password);
 
-    if(!isPasswordValid){
-      return res.status(401).json(
-        {
-          success: false,
-          message: "Invalid credentials.",
-        }
-      );
+    if (!isPasswordValid) {
+      return res.status(401).json({
+        success: false,
+        message: "Invalid credentials.",
+      });
     }
+    const accessToken = generateAccessToken(user);
+    const refreshToken = generateRefreshToken(user);
 
-    const token = jwt.sign(
-      {
-        id: user.id, username: user.username, role: user.role
+    await prisma.user.update({
+      where: { id: user.id },
+      data: { refreshToken },
+    });
+
+    const cookieOptions = {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === "production",
+      sameSite: "strict",
+    };
+
+    res.cookie("accessToken", accessToken, {
+      ...cookieOptions,
+      maxAge: 24 * 60 * 60 * 1000,
+    }); // 1 Day
+    res.cookie("refreshToken", refreshToken, {
+      ...cookieOptions,
+      maxAge: 10 * 24 * 60 * 60 * 1000,
+    }); // 10 Days
+
+    return res.status(200).json({
+      success: true,
+      message: "Login Successful!",
+      accessToken,
+      refreshToken,
+      data: {
+        id: user.id,
+        username: user.username,
+        email: user.email,
+        role: user.role,
       },
+    });
+  } catch (error) {
+    console.error("Database Error during Login:", error);
 
-      process.env.JWT_SECRET || "fallback_secret_key",
-      {
-        expiresIn: "1d"
-      }
-    );
+    return res.status(500).json({
+      success: false,
+      message: "Internal Server Error",
+    });
+  }
+};
 
-    res.cookie("token", token,
-      {
-        httpOnly: true,
-        secure: process.env.NODE_ENV === "production",
-        sameSite: "strict",
-        maxAge: 24 * 60 * 60 * 1000,
-      }
-    );
+/*
+export const forgotPassword = async (req, res) => {
+  try {
+    const { email } = req.body;
 
-    return res.status(200).json(
-      {
-        success: true,
-        message: "Login Successful!",
-        token,
-        data:
-        {
-          id: user.id,
-          username: user.username,
-          email: user.email,
-          role: user.role,
-        },
-      }
-    );
+    if (!email) {
+      return res
+        .status(400)
+        .json({ success: false, message: "Email is required." });
+    }
+    const user = await prisma.user.findUnique({
+      where: { email },
+    });
+    if (!user) {
+      return res
+        .status(404)
+        .json({ success: false, message: "User not found." });
+    }
+    // 1. Generate the Temporary Token
+    const { unHashedToken, hashedToken, tokenExpiry } =
+      generateTemporaryToken();
+    // 2. Save the HASHED token and Expiry to the Database
+    await prisma.user.update({
+      where: { id: user.id },
+      data: {
+        forgotPasswordToken: hashedToken,
+        forgotPasswordExpiry: tokenExpiry,
+      },
+    });
+    // 3. (In a real app, you would send an email with the unHashedToken here)
+    // await sendEmail(user.email, `Reset URL: http://localhost:5173/reset-password/${unHashedToken}`);
+    return res.status(200).json({
+      success: true,
+      message:
+        "Password reset token generated successfully. Please check your email.",
+      resetToken: unHashedToken, // NOTE: Only returning this here for your testing! Remove this line when you implement real emails.
+    });
   } catch (error) {
-    console.error("Database Error during Login:", error);
-
-    return res.status(500).json(
-      {
-        success: false,
-        message: "Internal Server Error"
-      }
-    );
-    
-    
+    console.error("Error in forgotPassword:", error);
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal Server Error" });
   }
-};
\ No newline at end of file
+};
+
+*/
\ No newline at end of file
diff --git a/server/src/utils/token.utils.js b/server/src/utils/token.utils.js
new file mode 100644
index 0000000..5311cd3
--- /dev/null
+++ b/server/src/utils/token.utils.js
@@ -0,0 +1,38 @@
+import jwt from 'jsonwebtoken';
+import crypto from 'crypto';
+
+export const generateAccessToken = (user) =>{
+    return jwt.sign(
+        {
+            id: user.id,
+            email: user.email,
+            username: user.username
+        },
+        process.env.ACCESS_TOKEN_SECRET,
+        {expiresIn: process.env.ACCESS_TOKEN_EXPIRY}
+    );
+};
+
+export const generateRefreshToken = (user) =>{
+    return jwt.sign(
+        {
+            id: user.id,
+            email: user.email,
+            username: user.username
+        },
+        process.env.REFRESH_TOKEN_SECRET,
+        {expiresIn: process.env.REFRESH_TOKEN_EXPIRY}
+    );
+};
+
+export const generateTemporaryToken =() =>{
+    const unHashedToken = crypto.randomBytes(20).toString("hex");
+
+    const hashedToken = crypto
+        .createHash("sha256")
+        .update("hex");
+
+    const tokenExpiry = new Date(Date.now()+ 2*60*1000);
+
+    return {unHashedToken, hashedToken, tokenExpiry};
+};
\ No newline at end of file

From 75fdb02953d89f1a666f0a41040e3d136d1e05ba Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Tue, 4 Aug 2026 14:12:16 +0530
Subject: [PATCH 19/24] completed  google signup feature

---
 README.md                                     |  21 +-
 client/.gitignore                             |   3 +
 client/package-lock.json                      |  11 +
 client/package.json                           |   1 +
 client/src/App.jsx                            |   8 +-
 client/src/main.jsx                           |  22 +-
 client/src/pages/completeProfile.jsx          | 140 +++++++++++
 client/src/pages/signup.jsx                   |  38 ++-
 client/src/services/googleAuthService.js      |  32 +++
 server/.gitignore                             |   1 +
 server/package-lock.json                      | 232 ++++++++++++++++++
 server/package.json                           |   2 +
 .../migration.sql                             |  18 ++
 .../20260713132054_google_oauth/migration.sql |   2 +
 .../migration.sql                             |   3 +
 server/prisma/migrations/migration_lock.toml  |   4 +-
 server/prisma/schema.prisma                   |  18 +-
 server/src/controllers/auth.controller.js     | 214 ++++++++++++++++
 server/src/middleware/auth.middleware.js      |  32 +++
 server/src/routes/auth.routes.js              |  14 +-
 20 files changed, 793 insertions(+), 23 deletions(-)
 create mode 100644 client/src/pages/completeProfile.jsx
 create mode 100644 client/src/services/googleAuthService.js
 create mode 100644 server/prisma/migrations/20260713130332_add_google_oauth/migration.sql
 create mode 100644 server/prisma/migrations/20260713132054_google_oauth/migration.sql
 create mode 100644 server/prisma/migrations/20260716153106_add_profile_completed/migration.sql
 create mode 100644 server/src/middleware/auth.middleware.js

diff --git a/README.md b/README.md
index 8378129..f96e4cd 100644
--- a/README.md
+++ b/README.md
@@ -2,6 +2,7 @@
 
 A collaborative platform for developers to manage projects, tasks, discussions and team communication
 
+
 ```
 Developer-Collaboration-Platform
 ├─ client
@@ -32,29 +33,47 @@ Developer-Collaboration-Platform
 │  │  ├─ index.css
 │  │  ├─ main.jsx
 │  │  ├─ pages
+│  │  │  ├─ dashboard.jsx
 │  │  │  ├─ forgotpassword.jsx
 │  │  │  ├─ login.jsx
 │  │  │  └─ signup.jsx
 │  │  ├─ services
+│  │  │  └─ googleAuthService.js
 │  │  ├─ styles
 │  │  └─ utils
 │  └─ vite.config.js
 ├─ LICENSE
+├─ package-lock.json
+├─ package.json
 ├─ README.md
 └─ server
    ├─ package-lock.json
    ├─ package.json
    ├─ prisma
+   │  ├─ migrations
+   │  │  ├─ 20260708161847_init
+   │  │  │  └─ migration.sql
+   │  │  ├─ 20260713130332_add_google_oauth
+   │  │  │  └─ migration.sql
+   │  │  ├─ 20260713132054_google_oauth
+   │  │  │  └─ migration.sql
+   │  │  ├─ 20260716153106_add_profile_completed
+   │  │  │  └─ migration.sql
+   │  │  └─ migration_lock.toml
    │  └─ schema.prisma
-   ├─ prisma.config.ts
+   ├─ prisma.config.js
    └─ src
       ├─ app.js
       ├─ config
+      │  └─ prisma.js
       ├─ controllers
+      │  └─ auth.controller.js
       ├─ middleware
       ├─ server.js
       ├─ services
+      │  └─ auth.service.js
       ├─ utils
       └─ validators
+         └─ auth.validator.js
 
 ```
\ No newline at end of file
diff --git a/client/.gitignore b/client/.gitignore
index a547bf3..d823d0d 100644
--- a/client/.gitignore
+++ b/client/.gitignore
@@ -22,3 +22,6 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+
+.env
\ No newline at end of file
diff --git a/client/package-lock.json b/client/package-lock.json
index d508300..0246457 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.0.0",
       "dependencies": {
         "@marsidev/react-turnstile": "^1.5.3",
+        "@react-oauth/google": "^0.13.5",
         "@tailwindcss/vite": "^4.3.2",
         "axios": "^1.18.1",
         "lucide-react": "^1.23.0",
@@ -576,6 +577,16 @@
         "url": "https://github.com/sponsors/Boshen"
       }
     },
+    "node_modules/@react-oauth/google": {
+      "version": "0.13.5",
+      "resolved": "https://registry.npmjs.org/@react-oauth/google/-/google-0.13.5.tgz",
+      "integrity": "sha512-xQWri2s/3nNekZJ4uuov2aAfQYu83bN3864KcFqw2pK1nNbFurQIjPFDXhWaKH3IjYJ2r/9yyIIpsn5lMqrheQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": ">=16.8.0",
+        "react-dom": ">=16.8.0"
+      }
+    },
     "node_modules/@rolldown/binding-android-arm64": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.1.3.tgz",
diff --git a/client/package.json b/client/package.json
index 9115a65..1dc56d6 100644
--- a/client/package.json
+++ b/client/package.json
@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@marsidev/react-turnstile": "^1.5.3",
+    "@react-oauth/google": "^0.13.5",
     "@tailwindcss/vite": "^4.3.2",
     "axios": "^1.18.1",
     "lucide-react": "^1.23.0",
diff --git a/client/src/App.jsx b/client/src/App.jsx
index 86cee9d..77d0c99 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -4,6 +4,7 @@ import Signup from "./pages/signup";
 import Forgotpassword from "./pages/forgotpassword";
 import Dashboard from "./pages/dashboard";
 import ProtectedRoute from "./components/common/ProtectedRoute";
+import CompleteProfile from "./pages/completeProfile";
 import "./index.css";
 
 function App() {
@@ -14,7 +15,12 @@ function App() {
         <Route path="/signup" element={<Signup />} />
         <Route path="/forgotpassword" element={<Forgotpassword />} />
 
-        
+        <Route path="/complete-profile" element={
+          <ProtectedRoute>
+            <CompleteProfile />
+          </ProtectedRoute>
+          }
+        />
         <Route path="/dashboard" element={<ProtectedRoute><Dashboard /></ProtectedRoute>} />
         <Route path="/" element={<Navigate to="/signup" replace />} />
       </Routes>
diff --git a/client/src/main.jsx b/client/src/main.jsx
index 124e659..34ba2fd 100644
--- a/client/src/main.jsx
+++ b/client/src/main.jsx
@@ -1,13 +1,19 @@
-import { StrictMode } from 'react';
-import { createRoot } from 'react-dom/client';
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import { GoogleOAuthProvider } from "@react-oauth/google";
 import axios from "axios";
-import './index.css';
-import App from './App.jsx';
+
+import "./index.css";
+import App from "./App.jsx";
 
 axios.defaults.withCredentials = true;
 
-createRoot(document.getElementById('root')).render(
+createRoot(document.getElementById("root")).render(
   <StrictMode>
-    <App />
-  </StrictMode>,
-)
+    <GoogleOAuthProvider
+      clientId={import.meta.env.VITE_GOOGLE_CLIENT_ID}
+    >
+      <App />
+    </GoogleOAuthProvider>
+  </StrictMode>
+);
\ No newline at end of file
diff --git a/client/src/pages/completeProfile.jsx b/client/src/pages/completeProfile.jsx
new file mode 100644
index 0000000..c5413bb
--- /dev/null
+++ b/client/src/pages/completeProfile.jsx
@@ -0,0 +1,140 @@
+// client/src/pages/completeProfile.jsx
+
+import { useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { User, ArrowRight } from "lucide-react";
+import { completeProfile } from "../services/googleAuthService.js";
+
+function CompleteProfile() {
+  const [username, setUsername] = useState("");
+  const [role, setRole] = useState("");
+  const [error, setError] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+
+  const navigate = useNavigate();
+
+  const handleSubmit = async (event) => {
+    event.preventDefault();
+    setError("");
+
+    if (username.trim().length < 3) {
+      setError("Username must be at least 3 characters.");
+      return;
+    }
+
+    if (username.includes(" ")) {
+      setError("Username cannot contain spaces.");
+      return;
+    }
+
+    if (!role) {
+      setError("Please select a role.");
+      return;
+    }
+
+    try {
+      setIsLoading(true);
+
+      const result = await completeProfile({
+        username,
+        role,
+      });
+
+      // Updates the frontend login state used by ProtectedRoute.
+      localStorage.setItem("user", JSON.stringify(result.user));
+
+      navigate("/dashboard", { replace: true });
+    } catch (err) {
+      setError(
+        err.response?.data?.message ||
+          "Something went wrong. Please try again."
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex items-center justify-center px-4 py-6">
+      <form
+        onSubmit={handleSubmit}
+        className="w-full max-w-xl rounded-3xl bg-white border border-white/20 shadow-2xl overflow-hidden"
+      >
+        <div className="bg-linear-to-br from-[#FFFBF5] via-[#FFF7ED] to-[#FEF3C7] p-8 sm:p-10">
+          <h1 className="text-3xl font-bold text-slate-800">
+            Complete your profile
+          </h1>
+
+          <p className="mt-2 mb-8 text-slate-500">
+            Choose a username and role to finish setting up your account.
+          </p>
+
+          {error && (
+            <div className="mb-5 rounded-xl border border-red-200 bg-red-100 p-3 text-sm text-red-600">
+              {error}
+            </div>
+          )}
+
+          <div className="mb-5">
+            <label
+              htmlFor="username"
+              className="mb-1.5 block text-sm font-semibold text-slate-700"
+            >
+              Username
+            </label>
+
+            <div className="flex items-center rounded-xl border border-slate-300 bg-white px-3.5 py-3 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300">
+              <User size={18} className="shrink-0 text-violet-500" />
+
+              <input
+                id="username"
+                type="text"
+                value={username}
+                onChange={(event) => setUsername(event.target.value)}
+                placeholder="Choose a username"
+                minLength={3}
+                required
+                className="ml-3 w-full bg-transparent text-sm outline-none placeholder:text-slate-400 sm:text-base"
+              />
+            </div>
+          </div>
+
+          <div className="mb-7">
+            <label
+              htmlFor="role"
+              className="mb-1.5 block text-sm font-semibold text-slate-700"
+            >
+              Role
+            </label>
+
+            <select
+              id="role"
+              value={role}
+              onChange={(event) => setRole(event.target.value)}
+              required
+              className="w-full cursor-pointer rounded-xl border border-slate-300 bg-white px-3.5 py-3 text-sm text-slate-700 outline-none focus:border-violet-500 focus:ring-2 focus:ring-violet-300 sm:text-base"
+            >
+              <option value="">Select your role</option>
+              <option value="project_manager">Project Manager</option>
+              <option value="developer">Developer</option>
+              <option value="frontend_developer">Frontend Developer</option>
+              <option value="backend_developer">Backend Developer</option>
+              <option value="fullstack_developer">Full Stack Developer</option>
+            </select>
+          </div>
+
+          <button
+            type="submit"
+            disabled={isLoading}
+            className="flex w-full items-center justify-center gap-2 rounded-xl bg-gradient-to-r from-[#9400D3] via-[#C026D3] to-[#ED80E9] py-3.5 font-semibold text-white transition-all hover:shadow-lg disabled:cursor-not-allowed disabled:opacity-70"
+          >
+            {isLoading ? "Completing profile..." : "Complete Profile"}
+            {!isLoading && <ArrowRight size={18} />}
+          </button>
+        </div>
+      </form>
+    </div>
+  );
+}
+
+export default CompleteProfile;
\ No newline at end of file
diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index 02c03f4..5d03625 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -7,6 +7,10 @@ import githubIcon from "../assets/github.svg";
 import eyeOn from "../assets/eyeOn.svg";
 import eyeOff from "../assets/eyeOff.svg";
 import { useState } from "react";
+import { GoogleLogin } from "@react-oauth/google";
+import { googleLogin } from "../services/googleAuthService.js";
+import { useNavigate } from "react-router-dom";
+
 
 function Signup() {
   const [showPassword,setShowPassword] = useState(false);
@@ -20,6 +24,7 @@ function Signup() {
   });
   const [error, setError] = useState("");
   const [isLoading, setIsLoading] = useState(false);
+  const navigate = useNavigate();
 
   const handleChange = (e)=>{
     setFormData({ ...formData, [e.target.id]: e.target.value});
@@ -301,13 +306,42 @@ function Signup() {
 
             {/* Social Buttons */}
             <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
-              <button
+              {/* <button
                 type="button"
                 className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
               >
                 <img src={googleIcon} alt="Google" className="w-5 h-5" />
                 Google
-              </button>
+              </button> */}
+              <GoogleLogin
+                onSuccess={async (credentialResponse) => {
+                  try {
+                    const result = await googleLogin(
+                      credentialResponse.credential
+                    );
+
+                    localStorage.setItem(
+                      "user",
+                      JSON.stringify({
+                        ...result.user,
+                        profileCompleted: result.profileCompleted,
+                      })
+                    );
+
+                    if (result.profileCompleted) {
+                      navigate("/dashboard");
+                    } else {
+                      navigate("/complete-profile");
+                    }
+
+                  } catch (error) {
+                    console.error(error);
+                  }
+                }}
+                onError={() => {
+                  console.log("Login Failed");
+                }}
+              />
               <button
                 type="button"
                 className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
diff --git a/client/src/services/googleAuthService.js b/client/src/services/googleAuthService.js
new file mode 100644
index 0000000..f6f92d6
--- /dev/null
+++ b/client/src/services/googleAuthService.js
@@ -0,0 +1,32 @@
+import axios from "axios";
+
+const API_URL = "http://localhost:5000/api/auth";
+
+export const googleLogin = async (credential) => {
+  const response = await axios.post(
+    `${API_URL}/google`,
+    {
+      credential,
+    },
+    {
+      withCredentials: true,
+    }
+  );
+
+  return response.data;
+};
+
+export const completeProfile = async ({ username, role }) => {
+  const response = await axios.post(
+    `${API_URL}/complete-profile`,
+    {
+      username,
+      role,
+    },
+    {
+      withCredentials: true,
+    }
+  );
+
+  return response.data;
+};
\ No newline at end of file
diff --git a/server/.gitignore b/server/.gitignore
index 1907c03..5c026a6 100644
--- a/server/.gitignore
+++ b/server/.gitignore
@@ -1,2 +1,3 @@
 
 /src/generated/prisma
+.env
\ No newline at end of file
diff --git a/server/package-lock.json b/server/package-lock.json
index 1cc2625..6f8eb5e 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -11,9 +11,11 @@
       "dependencies": {
         "@prisma/client": "^5.14.0",
         "bcrypt": "^6.0.0",
+        "cookie-parser": "^1.4.7",
         "cors": "^2.8.6",
         "dotenv": "^17.4.2",
         "express": "^5.2.1",
+        "google-auth-library": "^10.9.0",
         "jsonwebtoken": "^9.0.3"
       },
       "devDependencies": {
@@ -113,6 +115,15 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/agent-base": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
+      "integrity": "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14"
+      }
+    },
     "node_modules/anymatch": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
@@ -137,6 +148,26 @@
         "node": "18 || 20 || >=22"
       }
     },
+    "node_modules/base64-js": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
+      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/bcrypt": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/bcrypt/-/bcrypt-6.0.0.tgz",
@@ -151,6 +182,15 @@
         "node": ">= 18"
       }
     },
+    "node_modules/bignumber.js": {
+      "version": "9.3.1",
+      "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-9.3.1.tgz",
+      "integrity": "sha512-Ko0uX15oIUS7wJ3Rb30Fs6SkVbLmPBAKdlm7q9+ak9bbIeFf0MwuBsQV6z7+X768/cHsfg+WlysDWJcmthjsjQ==",
+      "license": "MIT",
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/binary-extensions": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
@@ -302,6 +342,25 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/cookie-parser": {
+      "version": "1.4.7",
+      "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.4.7.tgz",
+      "integrity": "sha512-nGUvgXnotP3BsjiLX2ypbQnWoGUPIIfHQNZkkC668ntrzGWEZVW70HDEB1qnNGMicPje6EttlIgzo51YSwNQGw==",
+      "license": "MIT",
+      "dependencies": {
+        "cookie": "0.7.2",
+        "cookie-signature": "1.0.6"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/cookie-parser/node_modules/cookie-signature": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
+      "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==",
+      "license": "MIT"
+    },
     "node_modules/cookie-signature": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.2.2.tgz",
@@ -328,6 +387,15 @@
         "url": "https://opencollective.com/express"
       }
     },
+    "node_modules/data-uri-to-buffer": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz",
+      "integrity": "sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
     "node_modules/debug": {
       "version": "4.4.3",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
@@ -492,6 +560,35 @@
         "url": "https://opencollective.com/express"
       }
     },
+    "node_modules/extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
+      "license": "MIT"
+    },
+    "node_modules/fetch-blob": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/fetch-blob/-/fetch-blob-3.2.0.tgz",
+      "integrity": "sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/jimmywarting"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/jimmywarting"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "node-domexception": "^1.0.0",
+        "web-streams-polyfill": "^3.0.3"
+      },
+      "engines": {
+        "node": "^12.20 || >= 14.13"
+      }
+    },
     "node_modules/fill-range": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
@@ -526,6 +623,18 @@
         "url": "https://opencollective.com/express"
       }
     },
+    "node_modules/formdata-polyfill": {
+      "version": "4.0.10",
+      "resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
+      "integrity": "sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==",
+      "license": "MIT",
+      "dependencies": {
+        "fetch-blob": "^3.1.2"
+      },
+      "engines": {
+        "node": ">=12.20.0"
+      }
+    },
     "node_modules/forwarded": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
@@ -568,6 +677,34 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/gaxios": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-7.2.0.tgz",
+      "integrity": "sha512-CUVb4wcYe+771XevyH6HtGmXFAGGKkIC3kswAP8Z1JCe0j80JMaTPZH930DWFrvo0atjh18Arc0pEyUCWa5bfg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "extend": "^3.0.2",
+        "https-proxy-agent": "^7.0.1",
+        "node-fetch": "^3.3.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/gcp-metadata": {
+      "version": "8.1.2",
+      "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-8.1.2.tgz",
+      "integrity": "sha512-zV/5HKTfCeKWnxG0Dmrw51hEWFGfcF2xiXqcA3+J90WDuP0SvoiSO5ORvcBsifmx/FoIjgQN3oNOGaQ5PhLFkg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "gaxios": "^7.0.0",
+        "google-logging-utils": "^1.0.0",
+        "json-bigint": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/get-intrinsic": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
@@ -618,6 +755,32 @@
         "node": ">= 6"
       }
     },
+    "node_modules/google-auth-library": {
+      "version": "10.9.0",
+      "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-10.9.0.tgz",
+      "integrity": "sha512-xtvUqvINPhTaBm7nXqlYPcrMHJPm1lCNdSovxnKKhTm+4JsvQ+KGVYJViLoH9Yxu8w+T0Qv5HubzYT9BLrppJg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "base64-js": "^1.3.0",
+        "ecdsa-sig-formatter": "^1.0.11",
+        "gaxios": "^7.1.4",
+        "gcp-metadata": "8.1.2",
+        "google-logging-utils": "1.1.3",
+        "jws": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/google-logging-utils": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/google-logging-utils/-/google-logging-utils-1.1.3.tgz",
+      "integrity": "sha512-eAmLkjDjAFCVXg7A1unxHsLf961m6y17QFqXqAXGj/gVkKFrEICfStRfwUlGNfeCEjNRa32JEWOUTlYXPyyKvA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/gopd": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
@@ -684,6 +847,19 @@
         "url": "https://opencollective.com/express"
       }
     },
+    "node_modules/https-proxy-agent": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.2",
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
     "node_modules/iconv-lite": {
       "version": "0.7.2",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.7.2.tgz",
@@ -774,6 +950,15 @@
       "integrity": "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==",
       "license": "MIT"
     },
+    "node_modules/json-bigint": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-bigint/-/json-bigint-1.0.0.tgz",
+      "integrity": "sha512-SiPv/8VpZuWbvLSMtTDU8hEfrZWg/mH/nV/b4o0CYbSxu1UIQPLdwKOCIyLQX+VIPO5vrLX3i8qtqFyhdPSUSQ==",
+      "license": "MIT",
+      "dependencies": {
+        "bignumber.js": "^9.0.0"
+      }
+    },
     "node_modules/jsonwebtoken": {
       "version": "9.0.3",
       "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-9.0.3.tgz",
@@ -954,6 +1139,44 @@
         "node": "^18 || ^20 || >= 21"
       }
     },
+    "node_modules/node-domexception": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
+      "integrity": "sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==",
+      "deprecated": "Use your platform's native DOMException instead",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/jimmywarting"
+        },
+        {
+          "type": "github",
+          "url": "https://paypal.me/jimmywarting"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.5.0"
+      }
+    },
+    "node_modules/node-fetch": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-3.3.2.tgz",
+      "integrity": "sha512-dRB78srN/l6gqWulah9SrxeYnxeddIG30+GOqK/9OlLVyLg3HPnr6SqOWTWOXKRwC2eGYCkZ59NNuSgvSrpgOA==",
+      "license": "MIT",
+      "dependencies": {
+        "data-uri-to-buffer": "^4.0.0",
+        "fetch-blob": "^3.1.4",
+        "formdata-polyfill": "^4.0.10"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/node-fetch"
+      }
+    },
     "node_modules/node-gyp-build": {
       "version": "4.8.4",
       "resolved": "https://registry.npmjs.org/node-gyp-build/-/node-gyp-build-4.8.4.tgz",
@@ -1507,6 +1730,15 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/web-streams-polyfill": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/web-streams-polyfill/-/web-streams-polyfill-3.3.3.tgz",
+      "integrity": "sha512-d2JWLCivmZYTSIoge9MsgFCZrt571BikcWGYkjC1khllbTeDlGqZ2D8vD8E/lJa8WGWbb7Plm8/XJYV7IJHZZw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
     "node_modules/wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
diff --git a/server/package.json b/server/package.json
index 7539087..3a0030f 100644
--- a/server/package.json
+++ b/server/package.json
@@ -15,9 +15,11 @@
   "dependencies": {
     "@prisma/client": "^5.14.0",
     "bcrypt": "^6.0.0",
+    "cookie-parser": "^1.4.7",
     "cors": "^2.8.6",
     "dotenv": "^17.4.2",
     "express": "^5.2.1",
+    "google-auth-library": "^10.9.0",
     "jsonwebtoken": "^9.0.3"
   },
   "devDependencies": {
diff --git a/server/prisma/migrations/20260713130332_add_google_oauth/migration.sql b/server/prisma/migrations/20260713130332_add_google_oauth/migration.sql
new file mode 100644
index 0000000..6ee9472
--- /dev/null
+++ b/server/prisma/migrations/20260713130332_add_google_oauth/migration.sql
@@ -0,0 +1,18 @@
+/*
+  Warnings:
+
+  - A unique constraint covering the columns `[username]` on the table `User` will be added. If there are existing duplicate values, this will fail.
+  - A unique constraint covering the columns `[email]` on the table `User` will be added. If there are existing duplicate values, this will fail.
+
+*/
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN     "avatar" TEXT,
+ADD COLUMN     "provider" TEXT NOT NULL DEFAULT 'local',
+ADD COLUMN     "providerId" TEXT,
+ALTER COLUMN "password" DROP NOT NULL;
+
+-- CreateIndex
+CREATE UNIQUE INDEX "User_username_key" ON "User"("username");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "User_email_key" ON "User"("email");
diff --git a/server/prisma/migrations/20260713132054_google_oauth/migration.sql b/server/prisma/migrations/20260713132054_google_oauth/migration.sql
new file mode 100644
index 0000000..ea949cd
--- /dev/null
+++ b/server/prisma/migrations/20260713132054_google_oauth/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "User" ALTER COLUMN "username" DROP NOT NULL;
diff --git a/server/prisma/migrations/20260716153106_add_profile_completed/migration.sql b/server/prisma/migrations/20260716153106_add_profile_completed/migration.sql
new file mode 100644
index 0000000..b30b745
--- /dev/null
+++ b/server/prisma/migrations/20260716153106_add_profile_completed/migration.sql
@@ -0,0 +1,3 @@
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN     "profileCompleted" BOOLEAN NOT NULL DEFAULT false,
+ALTER COLUMN "role" DROP NOT NULL;
diff --git a/server/prisma/migrations/migration_lock.toml b/server/prisma/migrations/migration_lock.toml
index 044d57c..fbffa92 100644
--- a/server/prisma/migrations/migration_lock.toml
+++ b/server/prisma/migrations/migration_lock.toml
@@ -1,3 +1,3 @@
 # Please do not edit this file manually
-# It should be added in your version-control system (e.g., Git)
-provider = "postgresql"
+# It should be added in your version-control system (i.e. Git)
+provider = "postgresql"
\ No newline at end of file
diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index 7c8f6ee..3fa2a42 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -14,11 +14,15 @@ datasource db {
 }
 
 model User {
-  id Int @id @default(autoincrement())
-  username String  @unique 
-  email String  @unique 
-  password String
-  role String 
-  createdAt DateTime @default(now())
-  updatedAt DateTime @updatedAt
+  id               Int      @id @default(autoincrement())
+  username         String?  @unique
+  email            String   @unique
+  password         String?
+  role             String?
+  provider         String   @default("local")
+  providerId       String?
+  avatar           String?
+  profileCompleted Boolean  @default(false)
+  createdAt        DateTime @default(now())
+  updatedAt        DateTime @updatedAt
 }
\ No newline at end of file
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index f56bb15..a252ef3 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -1,9 +1,13 @@
 import bcrypt from "bcrypt";
 import { PrismaClient } from "@prisma/client";
 import jwt from "jsonwebtoken";
+import { OAuth2Client } from "google-auth-library";
 
 const prisma = new PrismaClient({});
 
+const googleClient = new OAuth2Client(
+    process.env.GOOGLE_CLIENT_ID
+);
 
 export const registerUser = async(req,res) => {
   try {
@@ -217,5 +221,215 @@ export const loginUser = async (req, res) =>{
     );
     
     
+  }
+};
+
+export const googleLogin = async (req, res) => {
+  try {
+
+    const { credential } = req.body;
+
+    if (!credential) {
+      return res.status(400).json({
+        success: false,
+        message: "Google credential is required."
+      });
+    }
+
+    // Verify token with Google
+    const ticket = await googleClient.verifyIdToken({
+      idToken: credential,
+      audience: process.env.GOOGLE_CLIENT_ID
+    });
+
+    const payload = ticket.getPayload();
+
+    const {
+      email,
+      picture,
+      sub
+    } = payload;
+
+    // Find user
+    let user = await prisma.user.findUnique({
+      where: {
+        email
+      }
+    });
+
+    // First Google Login
+    if (!user) {
+
+      user = await prisma.user.create({
+
+        data: {
+
+          email,
+
+          username: null,
+
+          password: null,
+
+          role: null,
+
+          provider: "google",
+
+          providerId: sub,
+
+          avatar: picture
+
+        }
+
+      });
+
+    }
+
+    // JWT
+    const token = jwt.sign(
+
+      {
+        id: user.id,
+        email: user.email,
+        role: user.role
+      },
+
+      process.env.JWT_SECRET,
+
+      {
+        expiresIn: "1d"
+      }
+
+    );
+
+    // Cookie
+    res.cookie("token", token, {
+
+      httpOnly: true,
+
+      secure: process.env.NODE_ENV === "production",
+
+      sameSite: "strict",
+
+      maxAge: 24 * 60 * 60 * 1000
+
+    });
+
+    return res.status(200).json({
+
+      success: true,
+
+      message: "Google Login Successful",
+
+      profileCompleted: user.profileCompleted,
+
+      user: {
+
+        id: user.id,
+
+        username: user.username,
+
+        email: user.email,
+
+        role: user.role,
+
+        avatar: user.avatar,
+
+        provider: user.provider
+
+      }
+
+    });
+
+  }
+
+  catch (error) {
+
+    console.error(error);
+
+    return res.status(500).json({
+
+      success: false,
+
+      message: "Google Login Failed"
+
+    });
+
+  }
+};
+
+export const completeProfile = async (req, res) => {
+  try {
+    const username = req.body.username?.trim();
+    const { role } = req.body;
+
+    if (!username || !role) {
+      return res.status(400).json({
+        success: false,
+        message: "Username and role are required.",
+      });
+    }
+
+    if (username.length < 3 || username.includes(" ")) {
+      return res.status(400).json({
+        success: false,
+        message: "Username must be at least 3 characters and contain no spaces.",
+      });
+    }
+
+    const validRoles = [
+      "project_manager",
+      "developer",
+      "frontend_developer",
+      "backend_developer",
+      "fullstack_developer",
+    ];
+
+    if (!validRoles.includes(role)) {
+      return res.status(400).json({
+        success: false,
+        message: "Invalid role selected.",
+      });
+    }
+
+    const existingUser = await prisma.user.findUnique({
+      where: { username },
+    });
+
+    if (existingUser && existingUser.id !== req.user.id) {
+      return res.status(409).json({
+        success: false,
+        message: "This username is already taken.",
+      });
+    }
+
+    const updatedUser = await prisma.user.update({
+      where: { id: req.user.id },
+      data: {
+        username,
+        role,
+        profileCompleted: true,
+      },
+    });
+
+    return res.status(200).json({
+      success: true,
+      message: "Profile completed successfully.",
+      user: {
+        id: updatedUser.id,
+        username: updatedUser.username,
+        email: updatedUser.email,
+        role: updatedUser.role,
+        avatar: updatedUser.avatar,
+        provider: updatedUser.provider,
+        profileCompleted: updatedUser.profileCompleted,
+      },
+    });
+  } catch (error) {
+    console.error("Profile completion error:", error);
+
+    return res.status(500).json({
+      success: false,
+      message: "Could not complete your profile.",
+    });
   }
 };
\ No newline at end of file
diff --git a/server/src/middleware/auth.middleware.js b/server/src/middleware/auth.middleware.js
new file mode 100644
index 0000000..7339a33
--- /dev/null
+++ b/server/src/middleware/auth.middleware.js
@@ -0,0 +1,32 @@
+// server/src/middleware/auth.middleware.js
+
+import jwt from "jsonwebtoken";
+
+export const requireAuth = (req, res, next) => {
+  const token = req.cookies?.token;
+
+  if (!token) {
+    return res.status(401).json({
+      success: false,
+      message: "Authentication required. Please log in again.",
+    });
+  }
+
+  try {
+    const decoded = jwt.verify(token, process.env.JWT_SECRET);
+
+    // Make the logged-in user's details available to the next controller.
+    req.user = {
+      id: decoded.id,
+      email: decoded.email,
+      role: decoded.role,
+    };
+
+    next();
+  } catch (error) {
+    return res.status(401).json({
+      success: false,
+      message: "Your session has expired. Please log in again.",
+    });
+  }
+};
\ No newline at end of file
diff --git a/server/src/routes/auth.routes.js b/server/src/routes/auth.routes.js
index 8222c15..3421a91 100644
--- a/server/src/routes/auth.routes.js
+++ b/server/src/routes/auth.routes.js
@@ -1,8 +1,18 @@
 import express from "express";
-import {registerUser, loginUser} from "../controllers/auth.controller.js"
+import {
+  registerUser,
+  loginUser,
+  googleLogin,
+  completeProfile,
+} from "../controllers/auth.controller.js";
+import { requireAuth } from "../middleware/auth.middleware.js";
 
 const route = express.Router();
-route.post("/register",registerUser);
+
+route.post("/register", registerUser);
 route.post("/login", loginUser);
+route.post("/google", googleLogin);
+
+route.post("/complete-profile", requireAuth, completeProfile);
 
 export default route;
\ No newline at end of file

From 3a3a9cc95ed482181aa40197b8ffa9d13b0491cd Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Tue, 4 Aug 2026 21:43:40 +0530
Subject: [PATCH 20/24] created loading state

---
 client/package-lock.json                      |  34 ++++-
 client/package.json                           |   2 +-
 client/src/App.jsx                            |  94 ++++++++++--
 client/src/components/common/PageLoader.jsx   |  23 +++
 client/src/components/layout/Navbar.jsx       | 137 +++++++++++++++---
 .../src/context/NavigationLoadingContext.jsx  |  45 ++++++
 client/src/pages/completeProfile.jsx          |   5 +-
 client/src/pages/login.jsx                    |  53 +++++--
 client/src/pages/signup.jsx                   |   8 +-
 client/src/services/googleAuthService.js      |  12 ++
 .../migration.sql                             |   6 -
 server/src/controllers/auth.controller.js     |  20 +++
 server/src/routes/auth.routes.js              |   2 +
 13 files changed, 383 insertions(+), 58 deletions(-)
 create mode 100644 client/src/components/common/PageLoader.jsx
 create mode 100644 client/src/context/NavigationLoadingContext.jsx

diff --git a/client/package-lock.json b/client/package-lock.json
index 4514b31..a0c3206 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -16,7 +16,7 @@
         "react": "^19.2.7",
         "react-dom": "^19.2.7",
         "react-router-dom": "^7.18.1",
-        "recharts": "^3.9.2",
+        "recharts": "^3.10.1",
         "tailwindcss": "^4.3.2"
       },
       "devDependencies": {
@@ -588,6 +588,32 @@
         "react-dom": ">=16.8.0"
       }
     },
+    "node_modules/@reduxjs/toolkit": {
+      "version": "2.12.0",
+      "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.12.0.tgz",
+      "integrity": "sha512-KiT+RzZbp6mQET+Mg+h2c97+9j1sNflUxQkIHI7Yuzf6Peu+OYpmkn6nbHWmLLWj+1ZODUJFwGZ7gx3L9R9EOw==",
+      "license": "MIT",
+      "dependencies": {
+        "@standard-schema/spec": "^1.0.0",
+        "@standard-schema/utils": "^0.3.0",
+        "immer": "^11.0.0",
+        "redux": "^5.0.1",
+        "redux-thunk": "^3.1.0",
+        "reselect": "^5.1.0"
+      },
+      "peerDependencies": {
+        "react": "^16.9.0 || ^17.0.0 || ^18 || ^19",
+        "react-redux": "^7.2.1 || ^8.1.3 || ^9.0.0"
+      },
+      "peerDependenciesMeta": {
+        "react": {
+          "optional": true
+        },
+        "react-redux": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@rolldown/binding-android-arm64": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.1.3.tgz",
@@ -3039,9 +3065,9 @@
       }
     },
     "node_modules/recharts": {
-      "version": "3.9.2",
-      "resolved": "https://registry.npmjs.org/recharts/-/recharts-3.9.2.tgz",
-      "integrity": "sha512-G4fy+Pk46RaXgwWMh+Nzhyo/lbFAVqXo9gtetlyehe6Ehge9CsgDuOTwQDD+i1+llaLktNBiNq4bhnGlDRXFtw==",
+      "version": "3.10.1",
+      "resolved": "https://registry.npmjs.org/recharts/-/recharts-3.10.1.tgz",
+      "integrity": "sha512-QXFrvt6IVcw7eeZCoyXTwkIJAX3Dv1nyVhMicXJ47GsGDDpcN8z6o644DibE9XjpBTThtsomLKnTV6lc+cVFUA==",
       "license": "MIT",
       "workspaces": [
         "www"
diff --git a/client/package.json b/client/package.json
index 78a658a..aec263f 100644
--- a/client/package.json
+++ b/client/package.json
@@ -18,7 +18,7 @@
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
     "react-router-dom": "^7.18.1",
-    "recharts": "^3.9.2",
+    "recharts": "^3.10.1",
     "tailwindcss": "^4.3.2"
   },
   "devDependencies": {
diff --git a/client/src/App.jsx b/client/src/App.jsx
index ccf4a6e..6691024 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -1,31 +1,105 @@
-import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom";
+import {
+  BrowserRouter,
+  Navigate,
+  Route,
+  Routes,
+  useLocation,
+} from "react-router-dom";
 import Login from "./pages/login";
 import Signup from "./pages/signup";
 import Forgotpassword from "./pages/forgotpassword";
 import Dashboard from "./pages/dashboard";
-import ProtectedRoute from "./components/common/ProtectedRoute";
 import CompleteProfile from "./pages/completeProfile";
+import ProtectedRoute from "./components/common/ProtectedRoute";
+import PageLoader from "./components/common/PageLoader";
+import {
+  NavigationLoadingProvider,
+  useNavigationLoading,
+} from "./context/NavigationLoadingContext";
 import "./index.css";
 
-function App() {
+function AppRoutes() {
+  const location = useLocation();
+  const { goTo } = useNavigationLoading();
+
+  const handleLinkClick = (event) => {
+    const link = event.target.closest("a");
+
+    if (
+      !link ||
+      event.defaultPrevented ||
+      event.button !== 0 ||
+      event.metaKey ||
+      event.ctrlKey ||
+      event.shiftKey ||
+      event.altKey ||
+      link.target === "_blank" ||
+      link.hasAttribute("download")
+    ) {
+      return;
+    }
+
+    const url = new URL(link.href, window.location.origin);
+
+    // Do not intercept external links, such as normal GitHub links.
+    if (url.origin !== window.location.origin) {
+      return;
+    }
+
+    const destination = `${url.pathname}${url.search}${url.hash}`;
+    const currentPage = `${location.pathname}${location.search}${location.hash}`;
+
+    // Do not show a loader for a link to the page already open.
+    if (destination === currentPage) {
+      return;
+    }
+
+    event.preventDefault();
+
+    goTo(destination);
+  };
+
   return (
-    <BrowserRouter>
+    <div onClickCapture={handleLinkClick}>
+      <PageLoader />
+
       <Routes>
         <Route path="/login" element={<Login />} />
         <Route path="/signup" element={<Signup />} />
         <Route path="/forgotpassword" element={<Forgotpassword />} />
 
-        <Route path="/complete-profile" element={
-          <ProtectedRoute>
-            <CompleteProfile />
-          </ProtectedRoute>
+        <Route
+          path="/complete-profile"
+          element={
+            <ProtectedRoute>
+              <CompleteProfile />
+            </ProtectedRoute>
+          }
+        />
+
+        <Route
+          path="/dashboard"
+          element={
+            <ProtectedRoute>
+              <Dashboard />
+            </ProtectedRoute>
           }
         />
-        <Route path="/dashboard" element={<ProtectedRoute><Dashboard /></ProtectedRoute>} />
+
         <Route path="/" element={<Navigate to="/login" replace />} />
       </Routes>
+    </div>
+  );
+}
+
+function App() {
+  return (
+    <BrowserRouter>
+      <NavigationLoadingProvider>
+        <AppRoutes />
+      </NavigationLoadingProvider>
     </BrowserRouter>
   );
 }
 
-export default App;
+export default App;
\ No newline at end of file
diff --git a/client/src/components/common/PageLoader.jsx b/client/src/components/common/PageLoader.jsx
new file mode 100644
index 0000000..d6150f1
--- /dev/null
+++ b/client/src/components/common/PageLoader.jsx
@@ -0,0 +1,23 @@
+// client/src/components/common/PageLoader.jsx
+
+import { LoaderCircle } from "lucide-react";
+import { useNavigationLoading } from "../../context/NavigationLoadingContext.jsx";
+
+function PageLoader() {
+  const { isNavigating } = useNavigationLoading();
+
+  if (!isNavigating) {
+    return null;
+  }
+
+  return (
+    <div className="fixed inset-0 z-[100] flex items-center justify-center bg-slate-950/45 backdrop-blur-[2px]">
+      <div className="flex items-center gap-3 rounded-2xl border border-slate-700 bg-slate-900 px-5 py-4 text-sm font-medium text-white shadow-2xl">
+        <LoaderCircle size={22} className="animate-spin text-violet-400" />
+        Loading...
+      </div>
+    </div>
+  );
+}
+
+export default PageLoader;
\ No newline at end of file
diff --git a/client/src/components/layout/Navbar.jsx b/client/src/components/layout/Navbar.jsx
index ee0a5c8..bbcd936 100644
--- a/client/src/components/layout/Navbar.jsx
+++ b/client/src/components/layout/Navbar.jsx
@@ -1,28 +1,79 @@
-import { Search, Bell, Menu, MessageCircle } from 'lucide-react';
-import React from 'react';
+import { Search, Bell, Menu, MessageCircle, LogOut } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+import { useNavigationLoading } from "../../context/NavigationLoadingContext.jsx";
 import githubIcon from "/src/assets/github.svg";
+import { logout } from "../../services/googleAuthService.js";
 
 const Navbar = ({ toggleSidebar }) => {
+  const { goTo } = useNavigationLoading();
+  const dropdownRef = useRef(null);
+
+  const [isProfileMenuOpen, setIsProfileMenuOpen] = useState(false);
+  const [imageFailed, setImageFailed] = useState(false);
+
+  const storedUser = localStorage.getItem("user");
+  const user = storedUser ? JSON.parse(storedUser) : null;
+
+  const username = user?.username || "User";
+  const avatar = user?.avatar;
+
+  const userInitial = username.charAt(0).toUpperCase();
+
+  const handleLogout = async () => {
+    try {
+      await logout();
+    } catch (error) {
+      console.error("Logout request failed:", error);
+    } finally {
+      // Always remove frontend login data.
+      localStorage.removeItem("user");
+
+      // Prevents Back from returning to dashboard.
+      goTo("/login", { replace: true });
+    }
+  };
+
+  useEffect(() => {
+    const closeDropdown = (event) => {
+      if (
+        dropdownRef.current &&
+        !dropdownRef.current.contains(event.target)
+      ) {
+        setIsProfileMenuOpen(false);
+      }
+    };
+
+    document.addEventListener("mousedown", closeDropdown);
+
+    return () => {
+      document.removeEventListener("mousedown", closeDropdown);
+    };
+  }, []);
+
   return (
-    <div className="sticky top-0 z-40 flex items-center justify-between text-white px-4 md:px-8 py-2 border-b border-slate-800 bg-[#111827] rounded-2xl gap-2 md:gap-4">
-      <div className="flex items-center gap-4 flex-shrink-0">
+    <div className="sticky top-0 z-40 flex items-center justify-between gap-2 rounded-2xl border-b border-slate-800 bg-[#111827] px-4 py-2 text-white md:gap-4 md:px-8">
+      <div className="flex flex-shrink-0 items-center gap-4">
         <button
-          className="md:hidden p-2 bg-[#1c1f2e] rounded-lg text-white hover:bg-[#2a2e45] transition-colors"
+          className="rounded-lg bg-[#1c1f2e] p-2 text-white transition-colors hover:bg-[#2a2e45] md:hidden"
           onClick={toggleSidebar}
         >
           <Menu size={20} />
         </button>
+
         <div>
-          <h2 className="text-[18px] font-semibold tracking-tight text-slate-100 hidden sm:block">
+          <h2 className="hidden text-[18px] font-semibold tracking-tight text-slate-100 sm:block">
             Dashboard
           </h2>
-          <p className="mt-1 text-[12px] text-slate-400 hidden lg:block">
-            Welcome back, Ankur! Here's what's happening with your projects.
+
+          <p className="mt-1 hidden text-[12px] text-slate-400 lg:block">
+            Welcome back, {username}! Here&apos;s what&apos;s happening with your
+            projects.
           </p>
         </div>
       </div>
-      <div className="hidden sm:block flex-1 max-w-xl mx-2 md:mx-8">
-        <search className="relative block group">
+
+      <div className="mx-2 hidden max-w-xl flex-1 sm:block md:mx-8">
+        <search className="group relative block">
           <Search
             size={18}
             className="absolute left-3 top-1/2 -translate-y-1/2 text-slate-400 transition-colors group-focus-within:text-violet-400"
@@ -31,37 +82,79 @@ const Navbar = ({ toggleSidebar }) => {
           <input
             type="text"
             placeholder="Search projects, repositories, files..."
-            className="w-full pl-10 pr-4 py-3 bg-slate-800/80 border border-slate-700 rounded-lg text-sm text-white placeholder:text-slate-400 outline-none transition-all duration-200 focus:border-violet-500 focus:ring-2 focus:ring-violet-500/20"
+            className="w-full rounded-lg border border-slate-700 bg-slate-800/80 py-3 pl-10 pr-4 text-sm text-white outline-none transition-all duration-200 placeholder:text-slate-400 focus:border-violet-500 focus:ring-2 focus:ring-violet-500/20"
           />
         </search>
       </div>
-      <div className="flex items-center gap-3 md:gap-4 flex-shrink-0">
+
+      <div className="flex flex-shrink-0 items-center gap-3 md:gap-4">
         <div className="relative">
           <Bell
             size={20}
-            className="hidden md:block text-slate-400 cursor-pointer transition-transform hover:text-slate-200 hover:scale-110"
+            className="hidden cursor-pointer text-slate-400 transition-transform hover:scale-110 hover:text-slate-200 md:block"
           />
-          <span className="hidden md:block absolute -top-0.5 -right-0.5 h-2 w-2 rounded-full bg-red-500 ring-2 ring-[#111827]" />
+
+          <span className="absolute -right-0.5 -top-0.5 hidden h-2 w-2 rounded-full bg-red-500 ring-2 ring-[#111827] md:block" />
         </div>
 
         <MessageCircle
           size={20}
-          className="hidden md:block text-slate-400 cursor-pointer transition-transform hover:text-slate-200 hover:scale-110 duration-300"
+          className="hidden cursor-pointer text-slate-400 transition-transform duration-300 hover:scale-110 hover:text-slate-200 md:block"
         />
 
-        <div className="h-5 w-5 flex items-center justify-center font-medium cursor-pointer transition-transform hover:scale-110 duration-300">
+        <div className="flex h-5 w-5 cursor-pointer items-center justify-center font-medium transition-transform duration-300 hover:scale-110">
           <img
             src={githubIcon}
-            alt="Google"
-            className="invert opacity-70 hover:opacity-100 transition-opacity"
+            alt="GitHub"
+            className="invert opacity-70 transition-opacity hover:opacity-100"
           />
         </div>
-        <div className="h-9 w-9 rounded-full bg-violet-600 flex items-center justify-center font-medium hover:scale-110 cursor-pointer">
-          A
+
+        <div className="relative" ref={dropdownRef}>
+          <button
+            type="button"
+            onClick={() => setIsProfileMenuOpen((isOpen) => !isOpen)}
+            className="flex h-9 w-9 items-center justify-center overflow-hidden rounded-full bg-violet-600 font-semibold text-white transition-transform hover:scale-110 focus:outline-none focus:ring-2 focus:ring-violet-400"
+            aria-label="Open profile menu"
+          >
+            {avatar && !imageFailed ? (
+              <img
+                src={avatar}
+                alt={`${username}'s profile`}
+                className="h-full w-full object-cover"
+                onError={() => setImageFailed(true)}
+              />
+            ) : (
+              userInitial
+            )}
+          </button>
+
+          {isProfileMenuOpen && (
+            <div className="absolute right-0 top-12 w-48 overflow-hidden rounded-xl border border-slate-700 bg-slate-800 py-1 shadow-xl">
+              <div className="border-b border-slate-700 px-4 py-3">
+                <p className="truncate text-sm font-semibold text-white">
+                  {username}
+                </p>
+
+                <p className="truncate text-xs text-slate-400">
+                  {user?.email}
+                </p>
+              </div>
+
+              <button
+                type="button"
+                onClick={handleLogout}
+                className="flex w-full items-center gap-2 px-4 py-3 text-left text-sm text-red-400 transition-colors hover:bg-slate-700 hover:text-red-300"
+              >
+                <LogOut size={16} />
+                Logout
+              </button>
+            </div>
+          )}
         </div>
       </div>
     </div>
   );
-}
+};
 
-export default Navbar
\ No newline at end of file
+export default Navbar;
\ No newline at end of file
diff --git a/client/src/context/NavigationLoadingContext.jsx b/client/src/context/NavigationLoadingContext.jsx
new file mode 100644
index 0000000..565f7b2
--- /dev/null
+++ b/client/src/context/NavigationLoadingContext.jsx
@@ -0,0 +1,45 @@
+// client/src/context/NavigationLoadingContext.jsx
+
+import { createContext, useCallback, useContext, useState } from "react";
+import { useNavigate } from "react-router-dom";
+
+const NavigationLoadingContext = createContext(null);
+
+export function NavigationLoadingProvider({ children }) {
+  const navigate = useNavigate();
+  const [isNavigating, setIsNavigating] = useState(false);
+
+  const goTo = useCallback(
+    (to, options = {}) => {
+      setIsNavigating(true);
+
+      window.setTimeout(() => {
+        navigate(to, options);
+
+        // Keep the loader visible briefly after the next page renders.
+        window.setTimeout(() => {
+          setIsNavigating(false);
+        }, 150);
+      }, 1000);
+    },
+    [navigate]
+  );
+
+  return (
+    <NavigationLoadingContext.Provider value={{ isNavigating, goTo }}>
+      {children}
+    </NavigationLoadingContext.Provider>
+  );
+}
+
+export function useNavigationLoading() {
+  const context = useContext(NavigationLoadingContext);
+
+  if (!context) {
+    throw new Error(
+      "useNavigationLoading must be used inside NavigationLoadingProvider."
+    );
+  }
+
+  return context;
+}
\ No newline at end of file
diff --git a/client/src/pages/completeProfile.jsx b/client/src/pages/completeProfile.jsx
index c5413bb..5e65abf 100644
--- a/client/src/pages/completeProfile.jsx
+++ b/client/src/pages/completeProfile.jsx
@@ -4,6 +4,7 @@ import { useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { User, ArrowRight } from "lucide-react";
 import { completeProfile } from "../services/googleAuthService.js";
+import { useNavigationLoading } from "../context/NavigationLoadingContext";
 
 function CompleteProfile() {
   const [username, setUsername] = useState("");
@@ -11,7 +12,7 @@ function CompleteProfile() {
   const [error, setError] = useState("");
   const [isLoading, setIsLoading] = useState(false);
 
-  const navigate = useNavigate();
+  const { goTo } = useNavigationLoading();
 
   const handleSubmit = async (event) => {
     event.preventDefault();
@@ -43,7 +44,7 @@ function CompleteProfile() {
       // Updates the frontend login state used by ProtectedRoute.
       localStorage.setItem("user", JSON.stringify(result.user));
 
-      navigate("/dashboard", { replace: true });
+      goTo("/dashboard", { replace: true });
     } catch (err) {
       setError(
         err.response?.data?.message ||
diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index 1b07c4f..cdf5c93 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -7,13 +7,16 @@ import googleIcon from "../assets/google.svg";
 import githubIcon from "../assets/github.svg";
 import eyeOn from "../assets/eyeOn.svg"
 import eyeOff from "../assets/eyeOff.svg"
+import { GoogleLogin } from "@react-oauth/google";
+import { googleLogin } from "../services/googleAuthService.js";
+import { useNavigationLoading } from "../context/NavigationLoadingContext";
 
 function Login() {
   const [showPassword, setShowPassword] = useState(false);
   const [formData, setFormData] = useState({username: "", password: ""});
   const [error, setError] = useState("");
   const [isLoading, setIsLoading] = useState(false);
-  const navigate= useNavigate();
+  const { goTo } = useNavigationLoading();
   const [turnstileToken, setTurnstileToken] = useState("");
   const turnstileRef = useRef();
 
@@ -48,7 +51,7 @@ function Login() {
 
         localStorage.setItem("user", JSON.stringify(response.data.data));
 
-        navigate("/dashboard");
+        goTo("/dashboard", { replace: true });;
       }
 
     } catch (err) {
@@ -64,6 +67,37 @@ function Login() {
     }
   }
 
+  const handleGoogleLogin = async (credentialResponse) => {
+  setError("");
+
+  try {
+    const result = await googleLogin(credentialResponse.credential);
+
+    // Lets ProtectedRoute know that the user has logged in.
+    localStorage.setItem(
+      "user",
+      JSON.stringify({
+        ...result.user,
+        profileCompleted: result.profileCompleted,
+      })
+    );
+
+    // A completed Google user logs in directly to the dashboard.
+    if (result.profileCompleted) {
+      goTo("/dashboard", { replace: true });;
+      return;
+    }
+
+    // Safety for a first-time Google user who logs in from this page.
+    navigate("/complete-profile", { replace: true });
+    } catch (err) {
+    setError(
+      err.response?.data?.message ||
+        "Google login failed. Please try again."
+      );
+    }
+  };
+
   return (
     <div className="min-h-screen bg-linear-to-br from-[#D3D3FF] via-[#9400D3] via-[#D8BFD8] to-[#ED80E9] flex justify-center items-start lg:items-center px-4 py-6 sm:px-8  lg:px-20">
       <form
@@ -215,13 +249,14 @@ function Login() {
 
             {/* Social Buttons */}
             <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
-              <button
-                type="button"
-                className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
-              >
-                <img src={googleIcon} alt="Google" className="w-5 h-5" />
-                Google
-              </button>
+              <div className="flex justify-center">
+                <GoogleLogin
+                  onSuccess={handleGoogleLogin}
+                  onError={() => {
+                    setError("Google login was cancelled or failed.");
+                  }}
+                />
+              </div>
               <button
                 type="button"
                 className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index 5d03625..a1e67c2 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -10,7 +10,7 @@ import { useState } from "react";
 import { GoogleLogin } from "@react-oauth/google";
 import { googleLogin } from "../services/googleAuthService.js";
 import { useNavigate } from "react-router-dom";
-
+import { useNavigationLoading } from "../context/NavigationLoadingContext";
 
 function Signup() {
   const [showPassword,setShowPassword] = useState(false);
@@ -24,7 +24,7 @@ function Signup() {
   });
   const [error, setError] = useState("");
   const [isLoading, setIsLoading] = useState(false);
-  const navigate = useNavigate();
+  const { goTo } = useNavigationLoading();
 
   const handleChange = (e)=>{
     setFormData({ ...formData, [e.target.id]: e.target.value});
@@ -329,9 +329,9 @@ function Signup() {
                     );
 
                     if (result.profileCompleted) {
-                      navigate("/dashboard");
+                      goTo("/dashboard", { replace: true });
                     } else {
-                      navigate("/complete-profile");
+                      goTo("/complete-profile", { replace: true });
                     }
 
                   } catch (error) {
diff --git a/client/src/services/googleAuthService.js b/client/src/services/googleAuthService.js
index f6f92d6..fae2cdf 100644
--- a/client/src/services/googleAuthService.js
+++ b/client/src/services/googleAuthService.js
@@ -28,5 +28,17 @@ export const completeProfile = async ({ username, role }) => {
     }
   );
 
+  return response.data;
+};
+
+export const logout = async () => {
+  const response = await axios.post(
+    `${API_URL}/logout`,
+    {},
+    {
+      withCredentials: true,
+    }
+  );
+
   return response.data;
 };
\ No newline at end of file
diff --git a/server/prisma/migrations/20260803110049_add_token_fields/migration.sql b/server/prisma/migrations/20260803110049_add_token_fields/migration.sql
index 5bf9aa5..9240a13 100644
--- a/server/prisma/migrations/20260803110049_add_token_fields/migration.sql
+++ b/server/prisma/migrations/20260803110049_add_token_fields/migration.sql
@@ -9,9 +9,3 @@
 ALTER TABLE "User" ADD COLUMN     "forgotPasswordExpiry" TIMESTAMP(3),
 ADD COLUMN     "forgotPasswordToken" TEXT,
 ADD COLUMN     "refreshToken" TEXT;
-
--- CreateIndex
-CREATE UNIQUE INDEX "User_username_key" ON "User"("username");
-
--- CreateIndex
-CREATE UNIQUE INDEX "User_email_key" ON "User"("email");
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index 2e0eddb..a176ec2 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -420,6 +420,26 @@ export const completeProfile = async (req, res) => {
     });
   }
 };
+
+export const logoutUser = async (req, res) => {
+  const cookieOptions = {
+    httpOnly: true,
+    secure: process.env.NODE_ENV === "production",
+    sameSite: "strict",
+  };
+
+  // Google login uses "token".
+  res.clearCookie("token", cookieOptions);
+
+  // Normal username/password login currently uses these two.
+  res.clearCookie("accessToken", cookieOptions);
+  res.clearCookie("refreshToken", cookieOptions);
+
+  return res.status(200).json({
+    success: true,
+    message: "Logged out successfully.",
+  });
+};
 /*
 export const forgotPassword = async (req, res) => {
   try {
diff --git a/server/src/routes/auth.routes.js b/server/src/routes/auth.routes.js
index 3421a91..025a769 100644
--- a/server/src/routes/auth.routes.js
+++ b/server/src/routes/auth.routes.js
@@ -4,6 +4,7 @@ import {
   loginUser,
   googleLogin,
   completeProfile,
+  logoutUser,
 } from "../controllers/auth.controller.js";
 import { requireAuth } from "../middleware/auth.middleware.js";
 
@@ -12,6 +13,7 @@ const route = express.Router();
 route.post("/register", registerUser);
 route.post("/login", loginUser);
 route.post("/google", googleLogin);
+route.post("/logout", logoutUser);
 
 route.post("/complete-profile", requireAuth, completeProfile);
 

From 256ad269c2bd256f5fdffa33b56d463b80a61085 Mon Sep 17 00:00:00 2001
From: sumitsakhari <sumitsakhari2004@gmail.com>
Date: Fri, 7 Aug 2026 17:15:30 +0530
Subject: [PATCH 21/24] Added github login feature

---
 client/src/App.jsx                            |   2 +
 .../layout/LowerMiddleSection/OpenIssues.jsx  | 227 ++++++------
 .../LowerMiddleSection/PullRequests.jsx       | 217 ++++++------
 .../layout/MiddleSection/CurrentSprint.jsx    | 149 ++++----
 client/src/components/layout/Navbar.jsx       |  24 +-
 client/src/pages/dashboard.jsx                |  49 ++-
 client/src/pages/githubCallback.jsx           |  58 +++
 client/src/pages/login.jsx                    |   8 +-
 client/src/pages/signup.jsx                   |   6 +-
 client/src/services/githubService.js          |  44 +++
 client/src/services/googleAuthService.js      |  12 +
 server/prisma/schema.prisma                   |   2 +
 server/src/app.js                             |   2 +
 server/src/controllers/auth.controller.js     | 331 +++++++++++++-----
 server/src/controllers/github.controller.js   | 248 +++++++++++++
 server/src/routes/auth.routes.js              |   9 +
 server/src/routes/github.routes.js            |  31 ++
 server/src/validators/auth.validator.js       |   2 +
 18 files changed, 1028 insertions(+), 393 deletions(-)
 create mode 100644 client/src/pages/githubCallback.jsx
 create mode 100644 client/src/services/githubService.js
 create mode 100644 server/src/controllers/github.controller.js
 create mode 100644 server/src/routes/github.routes.js

diff --git a/client/src/App.jsx b/client/src/App.jsx
index 6691024..05cbcd1 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -17,6 +17,7 @@ import {
   useNavigationLoading,
 } from "./context/NavigationLoadingContext";
 import "./index.css";
+import GithubCallback from "./pages/githubCallback";
 
 function AppRoutes() {
   const location = useLocation();
@@ -67,6 +68,7 @@ function AppRoutes() {
         <Route path="/login" element={<Login />} />
         <Route path="/signup" element={<Signup />} />
         <Route path="/forgotpassword" element={<Forgotpassword />} />
+        <Route path="/auth/github/callback" element={<GithubCallback />} />
 
         <Route
           path="/complete-profile"
diff --git a/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx b/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
index db16a95..76f4c8b 100644
--- a/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
+++ b/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
@@ -1,131 +1,142 @@
-import React from "react";
+import { useEffect, useState } from "react";
+import { CircleAlert, LoaderCircle } from "lucide-react";
 import Card from "../../common/Card";
-import { CircleAlert, AlertTriangle, Info } from "lucide-react";
-
-const openIssuesData = [
-  {
-    id: 218,
-    title: "Login redirect issue",
-    assignee: "Anas S.",
-    priority: "Critical",
-  },
-  {
-    id: 217,
-    title: "Data sync failure",
-    assignee: "Ankur Y.",
-    priority: "High",
-  },
-  {
-    id: 216,
-    title: "UI alignment bug",
-    assignee: "Sarah J.",
-    priority: "High",
-  },
-  {
-    id: 215,
-    title: "API validation error",
-    assignee: "Sumit S.",
-    priority: "Medium",
-  },
-  {
-    id: 214,
-    title: "Improve loading speed",
-    assignee: "Soham K.",
-    priority: "Low",
-  },
-];
+import { getOpenIssues } from "../../../services/githubService.js";
 
-export const OpenIssues = () => {
-  const getPriorityStyles = (priority) => {
-    switch (priority) {
-      case "Critical":
-        return "bg-red-500/20 text-red-400";
+const getPriorityStyles = (priority) => {
+  switch (priority) {
+    case "Critical":
+      return "bg-red-500/20 text-red-400";
 
-      case "High":
-        return "bg-orange-500/20 text-orange-400";
+    case "High":
+      return "bg-orange-500/20 text-orange-400";
 
-      case "Medium":
-        return "bg-yellow-500/20 text-yellow-400";
+    case "Medium":
+      return "bg-yellow-500/20 text-yellow-400";
 
-      case "Low":
-        return "bg-blue-500/20 text-blue-400";
+    case "Low":
+      return "bg-blue-500/20 text-blue-400";
 
-      default:
-        return "bg-slate-500/20 text-slate-400";
-    }
-  };
+    default:
+      return "bg-slate-500/20 text-slate-400";
+  }
+};
 
-  const getIconStyles = (priority) => {
-    switch (priority) {
-      case "Critical":
-        return "text-red-400";
+const getIconStyles = (priority) => {
+  switch (priority) {
+    case "Critical":
+      return "text-red-400";
 
-      case "High":
-        return "text-orange-400";
+    case "High":
+      return "text-orange-400";
 
-      case "Medium":
-        return "text-yellow-400";
+    case "Medium":
+      return "text-yellow-400";
 
-      case "Low":
-        return "text-blue-400";
+    case "Low":
+      return "text-blue-400";
 
-      default:
-        return "text-slate-400";
-    }
-  };
+    default:
+      return "text-slate-400";
+  }
+};
+
+export const OpenIssues = () => {
+  const [issues, setIssues] = useState([]);
+  const [error, setError] = useState("");
+  const [isLoading, setIsLoading] = useState(true);
+
+  useEffect(() => {
+    const loadIssues = async () => {
+      try {
+        const result = await getOpenIssues();
+        setIssues(result.data);
+      } catch (err) {
+        setError(
+          err.response?.data?.message || "Could not load open issues."
+        );
+      } finally {
+        setIsLoading(false);
+      }
+    };
+
+    loadIssues();
+  }, []);
 
   return (
-    <Card className="h-full min-h-[320px] flex flex-col">
-      {/* Header */}
-      <div className="flex items-center justify-between mb-4">
+    <Card className="flex min-h-[320px] h-full flex-col">
+      <div className="mb-4 flex items-center justify-between">
         <h3 className="text-lg font-semibold text-slate-100">Open Issues</h3>
 
-        <button className="text-sm text-indigo-400 hover:text-indigo-300 transition-colors cursor-pointer">
+        <a
+          href="https://github.com/ankuryadavgithub/Developer-Collaboration-Platform/issues"
+          target="_blank"
+          rel="noreferrer"
+          className="cursor-pointer text-sm text-indigo-400 transition-colors hover:text-indigo-300"
+        >
           View All
-        </button>
+        </a>
       </div>
 
-      {/* Issues List */}
-      <div>
-        {openIssuesData.map((issue) => (
-          <div
-            key={issue.id}
-            className="flex items-start justify-between py-1 border-b border-slate-800 last:border-none hover:bg-slate-800/20 px-2 rounded-lg transition-colors"
-          >
-            {/* Left */}
-            <div className="flex gap-3 flex-1 min-w-0">
-              <CircleAlert
-                size={16}
-                strokeWidth={1.75}
-                className={`mt-1 flex-shrink-0 ${getIconStyles(
-                  issue.priority,
-                )}`}
-              />
-
-              <div className="min-w-0">
-                <p className="text-xs text-slate-400">#{issue.id}</p>
-
-                <h4 className="text-sm text-slate-100 truncate">
-                  {issue.title}
-                </h4>
-
-                <p className="text-[10px] text-slate-400 mt-1">
-                  {issue.assignee}
-                </p>
+      {isLoading && (
+        <div className="flex flex-1 items-center justify-center">
+          <LoaderCircle size={24} className="animate-spin text-violet-400" />
+        </div>
+      )}
+
+      {!isLoading && error && (
+        <p className="mt-6 text-center text-sm text-red-400">{error}</p>
+      )}
+
+      {!isLoading && !error && issues.length === 0 && (
+        <p className="mt-6 text-center text-sm text-slate-400">
+          No open GitHub issues.
+        </p>
+      )}
+
+      {!isLoading && !error && issues.length > 0 && (
+        <div>
+          {issues.map((issue) => (
+            <a
+              key={issue.id}
+              href={issue.url}
+              target="_blank"
+              rel="noreferrer"
+              className="flex items-start justify-between rounded-lg border-b border-slate-800 px-2 py-1 transition-colors last:border-none hover:bg-slate-800/20"
+            >
+              <div className="flex min-w-0 flex-1 gap-3">
+                <CircleAlert
+                  size={16}
+                  strokeWidth={1.75}
+                  className={`mt-1 shrink-0 ${getIconStyles(
+                    issue.priority
+                  )}`}
+                />
+
+                <div className="min-w-0">
+                  <p className="text-xs text-slate-400">#{issue.id}</p>
+
+                  <h4 className="truncate text-sm text-slate-100">
+                    {issue.title}
+                  </h4>
+
+                  <p className="mt-1 text-[10px] text-slate-400">
+                    {issue.assignee}
+                  </p>
+                </div>
               </div>
-            </div>
 
-            {/* Right */}
-            <span
-              className={`px-2 py-1 rounded-md text-xs font-medium whitespace-nowrap ${getPriorityStyles(
-                issue.priority,
-              )}`}
-            >
-              {issue.priority}
-            </span>
-          </div>
-        ))}
-      </div>
+              <span
+                className={`whitespace-nowrap rounded-md px-2 py-1 text-xs font-medium ${getPriorityStyles(
+                  issue.priority
+                )}`}
+              >
+                {issue.priority}
+              </span>
+            </a>
+          ))}
+        </div>
+      )}
     </Card>
   );
 };
diff --git a/client/src/components/layout/LowerMiddleSection/PullRequests.jsx b/client/src/components/layout/LowerMiddleSection/PullRequests.jsx
index c3f795a..31b536b 100644
--- a/client/src/components/layout/LowerMiddleSection/PullRequests.jsx
+++ b/client/src/components/layout/LowerMiddleSection/PullRequests.jsx
@@ -1,55 +1,22 @@
-import React from "react";
+import { useEffect, useState } from "react";
+import {
+  GitPullRequest,
+  LoaderCircle,
+  MessageSquare,
+} from "lucide-react";
 import Card from "../../common/Card";
-import { MessageSquare, GitPullRequest } from "lucide-react";
-
-const pullRequestsData = [
-  {
-    id: 144,
-    title: "Add OAuth authentication",
-    author: "Anas S.",
-    status: "Review",
-    comments: 3,
-  },
-  {
-    id: 142,
-    title: "Improve dashboard UI",
-    author: "Sarah J.",
-    status: "Approved",
-    comments: 2,
-  },
-  {
-    id: 141,
-    title: "Fix API rate limit issue",
-    author: "Ankur Y.",
-    status: "Changes Requested",
-    comments: 4,
-  },
-  {
-    id: 140,
-    title: "Update dependencies",
-    author: "Sumit S.",
-    status: "Review",
-    comments: 1,
-  },
-  {
-    id: 139,
-    title: "Add unit tests for utils",
-    author: "Soham K.",
-    status: "Approved",
-    comments: 2,
-  },
-];
+import { getPullRequests } from "../../../services/githubService.js";
 
 const getStatusStyles = (status) => {
   switch (status) {
-    case "Approved":
-      return "bg-green-500/20 text-green-400";
+    case "Draft":
+      return "bg-slate-500/20 text-slate-300";
 
     case "Review":
       return "bg-purple-500/20 text-purple-400";
 
-    case "Changes Requested":
-      return "bg-blue-500/20 text-blue-400";
+    case "Open":
+      return "bg-cyan-500/20 text-cyan-400";
 
     default:
       return "bg-slate-500/20 text-slate-400";
@@ -57,78 +24,110 @@ const getStatusStyles = (status) => {
 };
 
 export const PullRequests = () => {
-  const getStatusStyles = (status) => {
-    switch (status) {
-      case "Approved":
-        return "bg-green-500/20 text-green-400";
-
-      case "Review":
-        return "bg-purple-500/20 text-purple-400";
-
-      case "Changes Requested":
-        return "bg-blue-500/20 text-blue-400";
-
-      default:
-        return "bg-slate-500/20 text-slate-400";
-    }
-  };
+  const [pullRequests, setPullRequests] = useState([]);
+  const [error, setError] = useState("");
+  const [isLoading, setIsLoading] = useState(true);
+
+  useEffect(() => {
+    const loadPullRequests = async () => {
+      try {
+        const result = await getPullRequests();
+        setPullRequests(result.data);
+      } catch (err) {
+        setError(
+          err.response?.data?.message ||
+            "Could not load pull requests."
+        );
+      } finally {
+        setIsLoading(false);
+      }
+    };
+
+    loadPullRequests();
+  }, []);
 
   return (
-    <Card className="h-full min-h-[320px] flex flex-col">
-      {/* Header */}
-      <div className="flex items-center justify-between mb-2">
-        <h3 className="text-lg font-semibold text-slate-100">Pull Requests</h3>
-
-        <button className="text-sm text-indigo-400 hover:text-indigo-300 transition-colors cursor-pointer">
+    <Card className="flex min-h-[320px] h-full flex-col">
+      <div className="mb-2 flex items-center justify-between">
+        <h3 className="text-lg font-semibold text-slate-100">
+          Pull Requests
+        </h3>
+
+        <a
+          href="https://github.com/ankuryadavgithub/Developer-Collaboration-Platform/pulls"
+          target="_blank"
+          rel="noreferrer"
+          className="cursor-pointer text-sm text-indigo-400 transition-colors hover:text-indigo-300"
+        >
           View All
-        </button>
+        </a>
       </div>
 
-      {/* PR List */}
-      <div>
-        {pullRequestsData.map((pr) => (
-          <div
-            key={pr.id}
-            className="flex items-start justify-between py-1 border-b border-slate-800 last:border-none hover:bg-slate-800/20 px-2 rounded-lg transition-colors cursor-pointer"
-          >
-            {/* Left */}
-            <div className="flex gap-3 flex-1 min-w-0">
-              <GitPullRequest
-                size={18}
-                className="text-slate-400 mt-1 flex-shrink-0"
-              />
-
-              <div className="min-w-0">
-                <p className="text-xs text-indigo-400 font-medium">
-                  #{pr.id}
-                </p>
-
-                <h4 className="text-sm text-slate-100 truncate">
-                  {pr.title}
-                </h4>
-
-                <p className="text-[10px] text-slate-400 mt-1">by {pr.author}</p>
+      {isLoading && (
+        <div className="flex flex-1 items-center justify-center">
+          <LoaderCircle size={24} className="animate-spin text-violet-400" />
+        </div>
+      )}
+
+      {!isLoading && error && (
+        <p className="mt-6 text-center text-sm text-red-400">{error}</p>
+      )}
+
+      {!isLoading && !error && pullRequests.length === 0 && (
+        <p className="mt-6 text-center text-sm text-slate-400">
+          No open GitHub pull requests.
+        </p>
+      )}
+
+      {!isLoading && !error && pullRequests.length > 0 && (
+        <div>
+          {pullRequests.map((pullRequest) => (
+            <a
+              key={pullRequest.id}
+              href={pullRequest.url}
+              target="_blank"
+              rel="noreferrer"
+              className="flex cursor-pointer items-start justify-between rounded-lg border-b border-slate-800 px-2 py-1 transition-colors last:border-none hover:bg-slate-800/20"
+            >
+              <div className="flex min-w-0 flex-1 gap-3">
+                <GitPullRequest
+                  size={18}
+                  className="mt-1 shrink-0 text-slate-400"
+                />
+
+                <div className="min-w-0">
+                  <p className="text-xs font-medium text-indigo-400">
+                    #{pullRequest.id}
+                  </p>
+
+                  <h4 className="truncate text-sm text-slate-100">
+                    {pullRequest.title}
+                  </h4>
+
+                  <p className="mt-1 text-[10px] text-slate-400">
+                    by {pullRequest.author}
+                  </p>
+                </div>
               </div>
-            </div>
-
-            {/* Right */}
-            <div className="flex items-center gap-3 ml-3">
-              <span
-                className={`px-2 py-1 rounded-md text-xs font-medium whitespace-nowrap ${getStatusStyles(
-                  pr.status,
-                )}`}
-              >
-                {pr.status}
-              </span>
-
-              <div className="flex items-center gap-1 text-slate-400">
-                <MessageSquare size={14} />
-                <span className="text-xs">{pr.comments}</span>
+
+              <div className="ml-3 flex items-center gap-3">
+                <span
+                  className={`whitespace-nowrap rounded-md px-2 py-1 text-xs font-medium ${getStatusStyles(
+                    pullRequest.status
+                  )}`}
+                >
+                  {pullRequest.status}
+                </span>
+
+                <div className="flex items-center gap-1 text-slate-400">
+                  <MessageSquare size={14} />
+                  <span className="text-xs">{pullRequest.comments}</span>
+                </div>
               </div>
-            </div>
-          </div>
-        ))}
-      </div>
+            </a>
+          ))}
+        </div>
+      )}
     </Card>
   );
 };
diff --git a/client/src/components/layout/MiddleSection/CurrentSprint.jsx b/client/src/components/layout/MiddleSection/CurrentSprint.jsx
index 41281a0..20d214e 100644
--- a/client/src/components/layout/MiddleSection/CurrentSprint.jsx
+++ b/client/src/components/layout/MiddleSection/CurrentSprint.jsx
@@ -1,111 +1,124 @@
-import React from "react";
+import { useEffect, useState } from "react";
+import { LoaderCircle } from "lucide-react";
 import Card from "../../common/Card";
+import { getCurrentSprint } from "../../../services/githubService.js";
 
-const sprintData = {
-  sprintNumber: 12,
-  title: "Build Collaboration Core",
-  dateRange: "May 1 - May 15, 2025",
-  daysLeft: 14,
-  progress: 82,
-
-  storyPoints: {
-    completed: 92,
-    total: 112,
-  },
-
-  completedTasks: 23,
-  inProgressTasks: 6,
-  todoTasks: 11,
-};
-
-const StatItem = ({ label, value, className = "" }) => {
+const StatItem = ({ label, value }) => {
   return (
-    <div className={className}>
+    <div>
       <p className="text-xs text-slate-400">{label}</p>
 
-      <p className="mt-1 text-xl font-semibold text-slate-100 whitespace-nowrap">
+      <p className="mt-1 whitespace-nowrap text-xl font-semibold text-slate-100">
         {value}
       </p>
     </div>
   );
 };
 
+const formatDate = (date) => {
+  if (!date) {
+    return "No due date";
+  }
+
+  return new Intl.DateTimeFormat("en-IN", {
+    day: "numeric",
+    month: "short",
+    year: "numeric",
+  }).format(new Date(date));
+};
+
 export const CurrentSprint = () => {
-  const {
-    sprintNumber,
-    title,
-    dateRange,
-    daysLeft,
-    progress,
-    storyPoints,
-    completedTasks,
-    inProgressTasks,
-    todoTasks,
-  } = sprintData;
+  const [sprint, setSprint] = useState(null);
+  const [error, setError] = useState("");
+  const [isLoading, setIsLoading] = useState(true);
+
+  useEffect(() => {
+    const loadSprint = async () => {
+      try {
+        const result = await getCurrentSprint();
+        setSprint(result.data);
+      } catch (err) {
+        setError(
+          err.response?.data?.message ||
+            "Could not load the current sprint."
+        );
+      } finally {
+        setIsLoading(false);
+      }
+    };
+
+    loadSprint();
+  }, []);
+
+  if (isLoading) {
+    return (
+      <Card className="flex min-h-[320px] items-center justify-center">
+        <LoaderCircle size={28} className="animate-spin text-violet-400" />
+      </Card>
+    );
+  }
+
+  if (error) {
+    return (
+      <Card className="flex min-h-[320px] flex-col items-center justify-center px-6 text-center">
+        <h3 className="text-lg font-semibold text-slate-100">
+          Current Sprint
+        </h3>
+
+        <p className="mt-3 text-sm text-slate-400">{error}</p>
+      </Card>
+    );
+  }
 
   return (
-    <Card className="h-full min-h-[320px] flex flex-col justify-between">
-      {/* Header */}
+    <Card className="flex min-h-[320px] h-full flex-col justify-between">
       <div className="flex items-center justify-between">
-        <h3 className="text-lg font-semibold text-slate-100">Current Sprint</h3>
+        <h3 className="text-lg font-semibold text-slate-100">
+          Current Sprint
+        </h3>
 
-        <div className="px-3 py-1 text-xs rounded-lg border border-slate-700 bg-slate-800 text-slate-300">
-          Sprint {sprintNumber}
+        <div className="rounded-lg border border-slate-700 bg-slate-800 px-3 py-1 text-xs text-slate-300">
+          Sprint {sprint.sprintNumber}
         </div>
       </div>
 
-      {/* Sprint Details */}
       <div className="mt-5">
         <h4 className="text-xl font-semibold text-white">
-          Sprint {sprintNumber} - {title}
+          Sprint {sprint.sprintNumber} — {sprint.title}
         </h4>
 
         <p className="mt-2 text-sm text-slate-400">
-          {dateRange} ({daysLeft} days left)
+          Due {formatDate(sprint.dueDate)}
+          {sprint.daysLeft !== null && ` (${sprint.daysLeft} days left)`}
         </p>
       </div>
 
-      {/* Progress */}
       <div className="mt-5 flex items-center gap-3">
-        <div className="flex-1 h-2.5 bg-slate-800 rounded-full overflow-hidden">
+        <div className="h-2.5 flex-1 overflow-hidden rounded-full bg-slate-800">
           <div
-            className="h-full rounded-full bg-cyan-500"
-            style={{ width: `${progress}%` }}
+            className="h-full rounded-full bg-cyan-500 transition-all duration-500"
+            style={{ width: `${sprint.progress}%` }}
           />
         </div>
 
-        <span className="text-xl font-semibold text-white">{progress}%</span>
+        <span className="text-xl font-semibold text-white">
+          {sprint.progress}%
+        </span>
       </div>
 
-      {/* Stats */}
       <div className="mt-5 border-t border-slate-800 pt-5">
-        <div className="grid grid-cols-2 sm:grid-cols-4 gap-4 sm:gap-3">
+        <div className="grid grid-cols-2 gap-4 sm:grid-cols-4 sm:gap-3">
+          <StatItem label="Total Items" value={sprint.totalItems} />
+          <StatItem label="Completed" value={sprint.completedTasks} />
+          <StatItem label="Open" value={sprint.todoTasks} />
           <StatItem
-            label="Story Points"
-            value={
-              <>
-                {storyPoints.completed}
-                <span className="text-slate-500">
-                  {" / "}
-                  {storyPoints.total}
-                </span>
-              </>
-            }
+            label="Days Left"
+            value={sprint.daysLeft ?? "—"}
           />
-
-          <StatItem label="Completed" value={completedTasks}/>
-
-          <StatItem
-            label="In Progress"
-            value={inProgressTasks}
-
-          />
-
-          <StatItem label="To Do" value={todoTasks} />
         </div>
       </div>
     </Card>
   );
 };
 
-export default CurrentSprint;
+export default CurrentSprint;
\ No newline at end of file
diff --git a/client/src/components/layout/Navbar.jsx b/client/src/components/layout/Navbar.jsx
index bbcd936..4e083d9 100644
--- a/client/src/components/layout/Navbar.jsx
+++ b/client/src/components/layout/Navbar.jsx
@@ -4,7 +4,8 @@ import { useNavigationLoading } from "../../context/NavigationLoadingContext.jsx
 import githubIcon from "/src/assets/github.svg";
 import { logout } from "../../services/googleAuthService.js";
 
-const Navbar = ({ toggleSidebar }) => {
+// ADDED githubData PROP
+const Navbar = ({ toggleSidebar, githubData }) => {
   const { goTo } = useNavigationLoading();
   const dropdownRef = useRef(null);
 
@@ -102,13 +103,20 @@ const Navbar = ({ toggleSidebar }) => {
           className="hidden cursor-pointer text-slate-400 transition-transform duration-300 hover:scale-110 hover:text-slate-200 md:block"
         />
 
-        <div className="flex h-5 w-5 cursor-pointer items-center justify-center font-medium transition-transform duration-300 hover:scale-110">
-          <img
-            src={githubIcon}
-            alt="GitHub"
-            className="invert opacity-70 transition-opacity hover:opacity-100"
-          />
-        </div>
+        {/* MODIFIED: GitHub Icon now has an onClick handler and only shows if data is missing */}
+        {!githubData && (
+          <div 
+            onClick={() => window.location.href = "http://localhost:5000/api/auth/github?action=connect"}
+            className="flex h-5 w-5 cursor-pointer items-center justify-center font-medium transition-transform duration-300 hover:scale-110"
+            title="Connect your GitHub account"
+          >
+            <img
+              src={githubIcon}
+              alt="GitHub"
+              className="invert opacity-70 transition-opacity hover:opacity-100"
+            />
+          </div>
+        )}
 
         <div className="relative" ref={dropdownRef}>
           <button
diff --git a/client/src/pages/dashboard.jsx b/client/src/pages/dashboard.jsx
index ebedc99..fb02cf7 100644
--- a/client/src/pages/dashboard.jsx
+++ b/client/src/pages/dashboard.jsx
@@ -1,4 +1,5 @@
-import React, { useState } from 'react'
+import React, { useState, useEffect } from 'react';
+import axios from 'axios';
 import Sidebar from "../components/layout/Sidebar.jsx";
 import Navbar from "../components/layout/Navbar.jsx";
 import StatsGrid from '../components/layout/KPIs/StatsGrid.jsx';
@@ -9,22 +10,62 @@ import RightSideBar from '../components/layout/RightSideSection/RightSideBar.jsx
 
 const Dashboard = () => {
   const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+  const [githubData, setGithubData] = useState(null);
+
+  // Fetch GitHub data on component mount
+  useEffect(() => {
+    const fetchGithubData = async () => {
+      try {
+        const response = await axios.get('http://localhost:5000/api/auth/github/profile', {
+          withCredentials: true // IMPORTANT: This ensures the cookies are sent to the backend
+        });
+        
+        if (response.data.success) {
+          setGithubData(response.data.data);
+        }
+      } catch (error) {
+        console.log("No GitHub account linked or token expired.");
+      }
+    };
+
+    fetchGithubData();
+  }, []);
 
   return (
     <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
       <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
 
       <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
-        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        {/* Pass githubData to Navbar to conditionally show/hide the connect icon */}
+        <Navbar 
+          toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} 
+          githubData={githubData} 
+        />
 
+        {/* GitHub Data Display Section */}
+        {githubData && (
+          <div className="mt-4 bg-[#1e293b]/80 p-6 rounded-xl border border-slate-700 text-white shadow-sm">
+            <h2 className="text-[18px] font-semibold tracking-tight text-slate-100 mb-4">GitHub Profile Connected</h2>
+            <div className="flex items-center gap-6">
+              <img src={githubData.avatar_url} alt="GitHub Avatar" className="w-16 h-16 rounded-full border-2 border-slate-600" />
+              <div>
+                <p className="font-semibold text-lg">{githubData.name || githubData.login}</p>
+                <p className="text-slate-400 text-sm mb-2">{githubData.bio}</p>
+                <div className="flex gap-6 mt-1 text-sm text-slate-400">
+                  <span>Public Repos: <span className="font-medium text-slate-200">{githubData.public_repos}</span></span>
+                  <span>Followers: <span className="font-medium text-slate-200">{githubData.followers}</span></span>
+                  <span>Following: <span className="font-medium text-slate-200">{githubData.following}</span></span>
+                </div>
+              </div>
+            </div>
+          </div>
+        )}
 
         <div className="mt-4">
           <StatsGrid />
         </div>
 
-
         <div className="mt-4 flex flex-col xl:flex-row gap-4 items-start">
-
           <div className="flex-1 flex flex-col gap-4 min-w-0 w-full">
             <MiddleSection />
             <LowerMiddleSection />
diff --git a/client/src/pages/githubCallback.jsx b/client/src/pages/githubCallback.jsx
new file mode 100644
index 0000000..63cb700
--- /dev/null
+++ b/client/src/pages/githubCallback.jsx
@@ -0,0 +1,58 @@
+// client/src/pages/githubCallback.jsx
+
+import { useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { LoaderCircle } from "lucide-react";
+import { getCurrentUser } from "../services/googleAuthService.js";
+
+function GithubCallback() {
+  const navigate = useNavigate();
+  const [error, setError] = useState("");
+
+  useEffect(() => {
+    const finishGithubLogin = async () => {
+      try {
+        const result = await getCurrentUser();
+
+        localStorage.setItem("user", JSON.stringify(result.user));
+
+        if (result.user.profileCompleted) {
+          navigate("/dashboard", { replace: true });
+        } else {
+          navigate("/complete-profile", { replace: true });
+        }
+      } catch (error) {
+        setError("GitHub login failed. Please try again.");
+
+        window.setTimeout(() => {
+          navigate("/login", { replace: true });
+        }, 2000);
+      }
+    };
+
+    finishGithubLogin();
+  }, [navigate]);
+
+  return (
+    <div className="flex min-h-screen items-center justify-center bg-slate-950 px-4">
+      <div className="rounded-2xl border border-slate-700 bg-slate-900 px-8 py-7 text-center shadow-2xl">
+        {error ? (
+          <p className="text-sm text-red-400">{error}</p>
+        ) : (
+          <>
+            <LoaderCircle
+              size={30}
+              className="mx-auto animate-spin text-violet-400"
+            />
+
+            <p className="mt-4 text-sm font-medium text-white">
+              Completing GitHub login...
+            </p>
+          </>
+        )}
+      </div>
+    </div>
+  );
+}
+
+export default GithubCallback;
\ No newline at end of file
diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index cdf5c93..b05c3e4 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -10,6 +10,7 @@ import eyeOff from "../assets/eyeOff.svg"
 import { GoogleLogin } from "@react-oauth/google";
 import { googleLogin } from "../services/googleAuthService.js";
 import { useNavigationLoading } from "../context/NavigationLoadingContext";
+import { startGithubLogin } from "../services/googleAuthService.js";
 
 function Login() {
   const [showPassword, setShowPassword] = useState(false);
@@ -89,7 +90,7 @@ function Login() {
     }
 
     // Safety for a first-time Google user who logs in from this page.
-    navigate("/complete-profile", { replace: true });
+    goTo("/complete-profile", { replace: true });
     } catch (err) {
     setError(
       err.response?.data?.message ||
@@ -259,10 +260,11 @@ function Login() {
               </div>
               <button
                 type="button"
+                onClick={startGithubLogin}
                 className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
               >
-                <img src={githubIcon} alt="Google" className="w-5 h-5" />
-                GitHub
+                <img src={githubIcon} alt="GitHub" className="w-5 h-5" />
+                Continue with GitHub
               </button>
             </div>
 
diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index a1e67c2..be8f986 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -11,6 +11,7 @@ import { GoogleLogin } from "@react-oauth/google";
 import { googleLogin } from "../services/googleAuthService.js";
 import { useNavigate } from "react-router-dom";
 import { useNavigationLoading } from "../context/NavigationLoadingContext";
+import { startGithubLogin } from "../services/googleAuthService.js";
 
 function Signup() {
   const [showPassword,setShowPassword] = useState(false);
@@ -344,10 +345,11 @@ function Signup() {
               />
               <button
                 type="button"
+                onClick={startGithubLogin}
                 className="w-full rounded-xl border border-slate-300 bg-white py-2.5 flex items-center justify-center gap-2 hover:border-violet-300 hover:shadow-sm hover:bg-slate-50 transition-all duration-200 cursor-pointer text-sm font-medium text-slate-700"
               >
-                <img src={githubIcon} alt="Google" className="w-5 h-5" />
-                GitHub
+                <img src={githubIcon} alt="GitHub" className="w-5 h-5" />
+                Continue with GitHub
               </button>
             </div>
 
diff --git a/client/src/services/githubService.js b/client/src/services/githubService.js
new file mode 100644
index 0000000..577c988
--- /dev/null
+++ b/client/src/services/githubService.js
@@ -0,0 +1,44 @@
+// client/src/services/githubService.js
+
+import axios from "axios";
+
+const API_URL = "http://localhost:5000/api/github";
+
+const OWNER = "ankuryadavgithub";
+const REPOSITORY = "Developer-Collaboration-Platform";
+
+const repositoryUrl = `${API_URL}/repos/${OWNER}/${REPOSITORY}`;
+
+export const getCurrentSprint = async () => {
+  const response = await axios.get(
+    `${repositoryUrl}/current-sprint`,
+    {
+      withCredentials: true,
+    }
+  );
+
+  return response.data;
+};
+
+export const getOpenIssues = async () => {
+  const response = await axios.get(
+    `${repositoryUrl}/issues`,
+    {
+      withCredentials: true,
+    }
+  );
+
+  return response.data;
+};
+
+export const getPullRequests = async () => {
+  const response = await axios.get(
+    `${repositoryUrl}/pull-requests`,
+    {
+      withCredentials: true,
+    }
+  );
+
+  return response.data;
+};
+
diff --git a/client/src/services/googleAuthService.js b/client/src/services/googleAuthService.js
index fae2cdf..0a31c60 100644
--- a/client/src/services/googleAuthService.js
+++ b/client/src/services/googleAuthService.js
@@ -40,5 +40,17 @@ export const logout = async () => {
     }
   );
 
+  return response.data;
+};
+
+export const startGithubLogin = () => {
+  window.location.assign("http://localhost:5000/api/auth/github");
+};
+
+export const getCurrentUser = async () => {
+  const response = await axios.get(`${API_URL}/me`, {
+    withCredentials: true,
+  });
+
   return response.data;
 };
\ No newline at end of file
diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index d7d332f..eeb03b1 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -21,6 +21,8 @@ model User {
   role             String?
   provider         String   @default("local")
   providerId       String?
+  githubId              String?   @unique 
+  githubAccessToken     String?   
   refreshToken     String? 
   forgotPasswordToken   String?
   forgotPasswordExpiry  DateTime?
diff --git a/server/src/app.js b/server/src/app.js
index 36cc4f5..62706b0 100644
--- a/server/src/app.js
+++ b/server/src/app.js
@@ -3,6 +3,7 @@ import cors from "cors";
 import cookieParser from "cookie-parser";
 
 import route from "./routes/auth.routes.js";
+import githubRoutes from "./routes/github.routes.js";
 
 const app = express();
 
@@ -17,6 +18,7 @@ app.use(cookieParser());
 
 // Routes
 app.use("/api/auth",route);
+app.use("/api/github", githubRoutes);
 
 // default route
 app.get("/",(req,res) => {
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index a176ec2..ed17979 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -7,6 +7,7 @@ import {
 } from "../utils/token.utils.js";
 import jwt from "jsonwebtoken";
 import { OAuth2Client } from "google-auth-library";
+import crypto from "crypto";
 
 const prisma = new PrismaClient({});
 
@@ -177,7 +178,7 @@ export const loginUser = async (req, res) => {
     const cookieOptions = {
       httpOnly: true,
       secure: process.env.NODE_ENV === "production",
-      sameSite: "strict",
+      sameSite: "lax",
     };
 
     res.cookie("accessToken", accessToken, {
@@ -189,6 +190,8 @@ export const loginUser = async (req, res) => {
       maxAge: 10 * 24 * 60 * 60 * 1000,
     }); // 10 Days
 
+    res.clearCookie("github_access_token", cookieOptions);
+
     return res.status(200).json({
       success: true,
       message: "Login Successful!",
@@ -213,134 +216,68 @@ export const loginUser = async (req, res) => {
 
 export const googleLogin = async (req, res) => {
   try {
-
     const { credential } = req.body;
+    if (!credential) return res.status(400).json({ success: false, message: "Google credential is required." });
 
-    if (!credential) {
-      return res.status(400).json({
-        success: false,
-        message: "Google credential is required."
-      });
-    }
-
-    // Verify token with Google
-    const ticket = await googleClient.verifyIdToken({
-      idToken: credential,
-      audience: process.env.GOOGLE_CLIENT_ID
-    });
-
-    const payload = ticket.getPayload();
-
-    const {
-      email,
-      picture,
-      sub
-    } = payload;
+    const ticket = await googleClient.verifyIdToken({ idToken: credential, audience: process.env.GOOGLE_CLIENT_ID });
+    const { email, picture, sub } = ticket.getPayload();
 
-    // Find user
-    let user = await prisma.user.findUnique({
-      where: {
-        email
-      }
-    });
+    let user = await prisma.user.findUnique({ where: { email } });
 
-    // First Google Login
     if (!user) {
-
+      // Brand new account via Google
       user = await prisma.user.create({
-
         data: {
-
           email,
-
-          username: null,
-
-          password: null,
-
-          role: null,
-
           provider: "google",
-
           providerId: sub,
-
-          avatar: picture
-
+          avatar: picture,
+          profileCompleted: false
         }
-
       });
-
+    } else {
+      // Account exists! Update the avatar to Google's so they look like a Google user this session.
+      user = await prisma.user.update({
+        where: { id: user.id },
+        data: { avatar: picture }
+      });
     }
 
-    // JWT
     const token = jwt.sign(
-
-      {
-        id: user.id,
-        email: user.email,
-        role: user.role
-      },
-
+      { id: user.id, email: user.email, role: user.role },
       process.env.JWT_SECRET,
-
-      {
-        expiresIn: "1d"
-      }
-
+      { expiresIn: "1d" }
     );
 
-    // Cookie
     res.cookie("token", token, {
-
       httpOnly: true,
-
       secure: process.env.NODE_ENV === "production",
-
-      sameSite: "strict",
-
+      sameSite: "lax",
       maxAge: 24 * 60 * 60 * 1000
+    });
 
+    // Explicitly CLEAR GitHub access so it acts strictly like a Google account
+    res.clearCookie("github_access_token", {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === "production",
+      sameSite: "lax" 
     });
 
     return res.status(200).json({
-
       success: true,
-
       message: "Google Login Successful",
-
       profileCompleted: user.profileCompleted,
-
       user: {
-
         id: user.id,
-
         username: user.username,
-
         email: user.email,
-
         role: user.role,
-
         avatar: user.avatar,
-
         provider: user.provider
-
       }
-
-    });
-
-  }
-
-  catch (error) {
-
-    console.error(error);
-
-    return res.status(500).json({
-
-      success: false,
-
-      message: "Google Login Failed"
-
     });
-
+  } catch (error) {
+    return res.status(500).json({ success: false, message: "Google Login Failed" });
   }
 };
 
@@ -421,6 +358,217 @@ export const completeProfile = async (req, res) => {
   }
 };
 
+export const githubLogin = (req, res) => {
+  const { action } = req.query; 
+  const state = crypto.randomBytes(32).toString("hex");
+
+  res.cookie("github_oauth_state", JSON.stringify({ state, action }), {
+    httpOnly: true,
+    secure: process.env.NODE_ENV === "production",
+    sameSite: "lax",
+    maxAge: 10 * 60 * 1000,
+  });
+
+  const params = new URLSearchParams({
+    client_id: process.env.GITHUB_CLIENT_ID,
+    redirect_uri: `http://localhost:5000/api/auth/github/callback`,
+    scope: "read:user user:email public_repo",
+    state,
+    prompt: "select_account" // <--- THIS IS THE MAGIC FIX
+  });
+
+  return res.redirect(`https://github.com/login/oauth/authorize?${params.toString()}`);
+};
+
+
+export const githubCallback = async (req, res) => {
+  try {
+    const { code, state } = req.query;
+    const savedCookie = req.cookies.github_oauth_state;
+    const { state: savedState, action } = savedCookie ? JSON.parse(savedCookie) : {};
+    res.clearCookie("github_oauth_state");
+
+    if (!code || !state || state !== savedState) {
+      return res.redirect(`${process.env.CLIENT_URL}/login?error=github_auth_failed`);
+    }
+
+    const tokenResponse = await fetch("https://github.com/login/oauth/access_token", {
+      method: "POST",
+      headers: { Accept: "application/json", "Content-Type": "application/x-www-form-urlencoded" },
+      body: new URLSearchParams({
+        client_id: process.env.GITHUB_CLIENT_ID,
+        client_secret: process.env.GITHUB_CLIENT_SECRET,
+        code,
+        redirect_uri: "http://localhost:5000/api/auth/github/callback",
+      }),
+    });
+
+    const tokenData = await tokenResponse.json();
+    if (!tokenData.access_token) return res.redirect(`${process.env.CLIENT_URL}/login?error=github_auth_failed`);
+
+    const githubToken = tokenData.access_token;
+    const githubUserResponse = await fetch("https://api.github.com/user", {
+      headers: { Authorization: `Bearer ${githubToken}`, Accept: "application/vnd.github+json", "X-GitHub-Api-Version": "2022-11-28" },
+    });
+    const githubUser = await githubUserResponse.json();
+
+    // ==========================================
+    // ACTION: CONNECTING FROM DASHBOARD
+    // ==========================================
+    if (action === "connect") {
+       const currentToken = req.cookies.token || req.cookies.accessToken;
+       if (currentToken) {
+         try {
+           const decoded = jwt.verify(currentToken, process.env.JWT_SECRET);
+           // Link the GitHub account in DB, but DO NOT change the Google avatar!
+           await prisma.user.update({
+             where: { id: decoded.id },
+             data: {
+               githubId: String(githubUser.id),
+               githubAccessToken: githubToken
+             }
+           });
+         } catch (err) {}
+       }
+       return res.redirect(`${process.env.CLIENT_URL}/dashboard`); 
+    }
+
+    // ==========================================
+    // ACTION: GITHUB LOGIN/SIGNUP
+    // ==========================================
+    const emailsResponse = await fetch("https://api.github.com/user/emails", {
+      headers: { Authorization: `Bearer ${githubToken}`, Accept: "application/vnd.github+json", "X-GitHub-Api-Version": "2022-11-28" },
+    });
+
+    const emails = await emailsResponse.json();
+    const verifiedEmail = Array.isArray(emails) ? emails.find((item) => item.primary && item.verified)?.email : null;
+
+    if (!verifiedEmail) return res.redirect(`${process.env.CLIENT_URL}/login?error=github_email_required`);
+
+    // Look for existing user by Github ID OR Email (so they share the same account)
+    let user = await prisma.user.findFirst({
+      where: {
+        OR: [
+          { githubId: String(githubUser.id) },
+          { email: verifiedEmail }, 
+        ],
+      },
+    });
+
+    if (!user) {
+      // Brand new GitHub account
+      user = await prisma.user.create({
+        data: {
+          email: verifiedEmail,
+          provider: "github",
+          providerId: String(githubUser.id),
+          githubId: String(githubUser.id),
+          githubAccessToken: githubToken,
+          avatar: githubUser.avatar_url,
+          profileCompleted: false, 
+        },
+      });
+    } else {
+      // Auto-link: Update their avatar to GitHub since they chose to log in via GitHub today!
+      await prisma.user.update({
+        where: { id: user.id },
+        data: { 
+          avatar: githubUser.avatar_url,
+          githubId: String(githubUser.id),
+          githubAccessToken: githubToken 
+        }
+      });
+    }
+
+    const token = jwt.sign({ id: user.id, email: user.email, role: user.role }, process.env.JWT_SECRET, { expiresIn: "1d" });
+    res.cookie("token", token, { httpOnly: true, secure: process.env.NODE_ENV === "production", sameSite: "lax", maxAge: 24 * 60 * 60 * 1000 });
+
+    return res.redirect(`${process.env.CLIENT_URL}/auth/github/callback`);
+  } catch (error) {
+    return res.redirect(`${process.env.CLIENT_URL}/login?error=github_auth_failed`);
+  }
+};
+
+export const getGithubProfile = async (req, res) => {
+  try {
+    // 1. Get the current user ID using the token from cookies
+    const currentToken = req.cookies.token || req.cookies.accessToken;
+    
+    if (!currentToken) {
+      return res.status(401).json({ success: false, message: "Not logged in" });
+    }
+
+    const decoded = jwt.verify(currentToken, process.env.JWT_SECRET);
+    
+    // 2. Find the user in the database
+    const user = await prisma.user.findUnique({
+      where: { id: decoded.id }
+    });
+
+    // 3. Check if they have a github account linked
+    const githubToken = user?.githubAccessToken;
+
+    if (!githubToken) {
+      return res.status(401).json({ success: false, message: "No GitHub account connected" });
+    }
+
+    // 4. Fetch the data from GitHub
+    const githubResponse = await fetch("https://api.github.com/user", {
+      headers: {
+        Authorization: `Bearer ${githubToken}`,
+        Accept: "application/vnd.github+json",
+        "X-GitHub-Api-Version": "2022-11-28",
+        "User-Agent": "Developer-Collaboration-Platform", // <--- THIS WAS MISSING!
+      },
+    });
+
+    if (!githubResponse.ok) {
+      console.log("GitHub API rejected the request:", githubResponse.status);
+      return res.status(401).json({ success: false, message: "GitHub token invalid or expired" });
+    }
+
+    const githubData = await githubResponse.json();
+    return res.status(200).json({ success: true, data: githubData });
+  } catch (error) {
+    console.error("Error fetching GitHub profile:", error);
+    return res.status(500).json({ success: false, message: "Internal Server Error" });
+  }
+};
+export const getCurrentUser = async (req, res) => {
+  try {
+    const user = await prisma.user.findUnique({
+      where: {
+        id: req.user.id,
+      },
+    });
+
+    if (!user) {
+      return res.status(404).json({
+        success: false,
+        message: "User not found.",
+      });
+    }
+
+    return res.status(200).json({
+      success: true,
+      user: {
+        id: user.id,
+        username: user.username,
+        email: user.email,
+        role: user.role,
+        avatar: user.avatar,
+        provider: user.provider,
+        profileCompleted: user.profileCompleted,
+      },
+    });
+  } catch (error) {
+    return res.status(500).json({
+      success: false,
+      message: "Could not fetch the current user.",
+    });
+  }
+};
+
 export const logoutUser = async (req, res) => {
   const cookieOptions = {
     httpOnly: true,
@@ -430,6 +578,7 @@ export const logoutUser = async (req, res) => {
 
   // Google login uses "token".
   res.clearCookie("token", cookieOptions);
+  res.clearCookie("github_access_token", cookieOptions);
 
   // Normal username/password login currently uses these two.
   res.clearCookie("accessToken", cookieOptions);
diff --git a/server/src/controllers/github.controller.js b/server/src/controllers/github.controller.js
new file mode 100644
index 0000000..81aa96c
--- /dev/null
+++ b/server/src/controllers/github.controller.js
@@ -0,0 +1,248 @@
+// server/src/controllers/github.controller.js
+import { PrismaClient } from "@prisma/client";
+
+const prisma = new PrismaClient();
+
+// Now async, and pulls securely from the DB using the user ID
+const getGithubToken = async (req, res) => {
+  const user = await prisma.user.findUnique({
+    where: { id: req.user.id },
+  });
+
+  const githubToken = user?.githubAccessToken;
+
+  if (!githubToken) {
+    res.status(403).json({
+      success: false,
+      message: "GitHub is not connected. Please log in with GitHub.",
+    });
+
+    return null;
+  }
+
+  return githubToken;
+};
+
+const githubHeaders = (token) => ({
+  Authorization: `Bearer ${token}`,
+  Accept: "application/vnd.github+json",
+  "X-GitHub-Api-Version": "2022-11-28",
+  "User-Agent": "Developer-Collaboration-Platform",
+});
+
+const getPriority = (labels) => {
+  const labelNames = labels.map((label) => label.name.toLowerCase());
+
+  if (labelNames.some((name) => name.includes("critical"))) {
+    return "Critical";
+  }
+
+  if (labelNames.some((name) => name.includes("high"))) {
+    return "High";
+  }
+
+  if (labelNames.some((name) => name.includes("low"))) {
+    return "Low";
+  }
+
+  return "Medium";
+};
+
+export const getCurrentSprint = async (req, res) => {
+  try {
+    const githubToken = await getGithubToken(req, res); // Added await
+
+    if (!githubToken) {
+      return;
+    }
+
+    const { owner, repo } = req.params;
+
+    const response = await fetch(
+      `https://api.github.com/repos/${owner}/${repo}/milestones?state=open&sort=due_on&direction=asc&per_page=100`,
+      {
+        headers: githubHeaders(githubToken),
+      }
+    );
+
+    const milestones = await response.json();
+
+    if (!response.ok) {
+      return res.status(response.status).json({
+        success: false,
+        message: milestones.message || "Could not fetch GitHub milestones.",
+      });
+    }
+
+    if (!milestones.length) {
+      return res.status(404).json({
+        success: false,
+        message: "No open milestone found. Create a GitHub milestone first.",
+      });
+    }
+
+    const now = new Date();
+
+    // Uses the nearest milestone that has not passed its due date.
+    const currentSprint =
+      milestones.find(
+        (milestone) =>
+          milestone.due_on && new Date(milestone.due_on) >= now
+      ) || milestones[0];
+
+    const totalItems =
+      currentSprint.open_issues + currentSprint.closed_issues;
+
+    const progress =
+      totalItems === 0
+        ? 0
+        : Math.round((currentSprint.closed_issues / totalItems) * 100);
+
+    const daysLeft = currentSprint.due_on
+      ? Math.max(
+          0,
+          Math.ceil(
+            (new Date(currentSprint.due_on) - now) /
+              (1000 * 60 * 60 * 24)
+          )
+        )
+      : null;
+
+    return res.status(200).json({
+      success: true,
+      data: {
+        sprintNumber: currentSprint.number,
+        title: currentSprint.title,
+        description: currentSprint.description,
+        dueDate: currentSprint.due_on,
+        daysLeft,
+        progress,
+        totalItems,
+        completedTasks: currentSprint.closed_issues,
+        todoTasks: currentSprint.open_issues,
+
+        // GitHub milestones do not natively store story points.
+        storyPoints: null,
+        inProgressTasks: null,
+      },
+    });
+  } catch (error) {
+    console.error("Current sprint API error:", error);
+
+    return res.status(500).json({
+      success: false,
+      message: "Could not fetch current sprint.",
+    });
+  }
+};
+
+export const getOpenIssues = async (req, res) => {
+  try {
+    const githubToken = await getGithubToken(req, res); // Added await
+
+    if (!githubToken) {
+      return;
+    }
+
+    const { owner, repo } = req.params;
+
+    const response = await fetch(
+      `https://api.github.com/repos/${owner}/${repo}/issues?state=open&sort=updated&direction=desc&per_page=30`,
+      {
+        headers: githubHeaders(githubToken),
+      }
+    );
+
+    const githubItems = await response.json();
+
+    if (!response.ok) {
+      return res.status(response.status).json({
+        success: false,
+        message: githubItems.message || "Could not fetch GitHub issues.",
+      });
+    }
+
+    // GitHub's Issues API can include pull requests.
+    // A real issue has no pull_request property.
+    const issues = githubItems
+      .filter((item) => !item.pull_request)
+      .slice(0, 5)
+      .map((issue) => ({
+        id: issue.number,
+        title: issue.title,
+        assignee: issue.assignee?.login || "Unassigned",
+        priority: getPriority(issue.labels),
+        url: issue.html_url,
+        createdAt: issue.created_at,
+        updatedAt: issue.updated_at,
+      }));
+
+    return res.status(200).json({
+      success: true,
+      data: issues,
+    });
+  } catch (error) {
+    console.error("Open issues API error:", error);
+
+    return res.status(500).json({
+      success: false,
+      message: "Could not fetch open issues.",
+    });
+  }
+};
+
+export const getPullRequests = async (req, res) => {
+  try {
+    const githubToken = await getGithubToken(req, res); // Added await
+
+    if (!githubToken) {
+      return;
+    }
+
+    const { owner, repo } = req.params;
+
+    const response = await fetch(
+      `https://api.github.com/repos/${owner}/${repo}/pulls?state=open&sort=updated&direction=desc&per_page=5`,
+      {
+        headers: githubHeaders(githubToken),
+      }
+    );
+
+    const pullRequests = await response.json();
+
+    if (!response.ok) {
+      return res.status(response.status).json({
+        success: false,
+        message:
+          pullRequests.message || "Could not fetch GitHub pull requests.",
+      });
+    }
+
+    const data = pullRequests.map((pullRequest) => ({
+      id: pullRequest.number,
+      title: pullRequest.title,
+      author: pullRequest.user.login,
+      comments: pullRequest.comments,
+      status: pullRequest.draft
+        ? "Draft"
+        : pullRequest.requested_reviewers.length > 0
+          ? "Review"
+          : "Open",
+      url: pullRequest.html_url,
+      createdAt: pullRequest.created_at,
+      updatedAt: pullRequest.updated_at,
+    }));
+
+    return res.status(200).json({
+      success: true,
+      data,
+    });
+  } catch (error) {
+    console.error("Pull requests API error:", error);
+
+    return res.status(500).json({
+      success: false,
+      message: "Could not fetch pull requests.",
+    });
+  }
+};
\ No newline at end of file
diff --git a/server/src/routes/auth.routes.js b/server/src/routes/auth.routes.js
index 025a769..aae3958 100644
--- a/server/src/routes/auth.routes.js
+++ b/server/src/routes/auth.routes.js
@@ -5,6 +5,10 @@ import {
   googleLogin,
   completeProfile,
   logoutUser,
+  githubLogin,
+  githubCallback,
+  getCurrentUser,
+  getGithubProfile
 } from "../controllers/auth.controller.js";
 import { requireAuth } from "../middleware/auth.middleware.js";
 
@@ -14,6 +18,11 @@ route.post("/register", registerUser);
 route.post("/login", loginUser);
 route.post("/google", googleLogin);
 route.post("/logout", logoutUser);
+route.get("/github", githubLogin);
+route.get("/github/callback", githubCallback);
+route.get("/github/profile", getGithubProfile);
+
+route.get("/me", requireAuth, getCurrentUser);
 
 route.post("/complete-profile", requireAuth, completeProfile);
 
diff --git a/server/src/routes/github.routes.js b/server/src/routes/github.routes.js
new file mode 100644
index 0000000..f13b214
--- /dev/null
+++ b/server/src/routes/github.routes.js
@@ -0,0 +1,31 @@
+// server/src/routes/github.routes.js
+
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import {
+  getCurrentSprint,
+  getOpenIssues,
+  getPullRequests,
+} from "../controllers/github.controller.js";
+
+const router = express.Router();
+
+router.get(
+  "/repos/:owner/:repo/current-sprint",
+  requireAuth,
+  getCurrentSprint
+);
+
+router.get(
+  "/repos/:owner/:repo/issues",
+  requireAuth,
+  getOpenIssues
+);
+
+router.get(
+  "/repos/:owner/:repo/pull-requests",
+  requireAuth,
+  getPullRequests
+);
+
+export default router;
\ No newline at end of file
diff --git a/server/src/validators/auth.validator.js b/server/src/validators/auth.validator.js
index e69de29..71d143b 100644
--- a/server/src/validators/auth.validator.js
+++ b/server/src/validators/auth.validator.js
@@ -0,0 +1,2 @@
+// server/src/validators/auth.validator.js
+

From 4225ca0d7f84d713c2bd9db71c9d61b726d7e80c Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Fri, 7 Aug 2026 21:56:10 +0530
Subject: [PATCH 22/24] Access token fix for login flow

---
 server/prisma/schema.prisma               |  5 +-
 server/src/controllers/auth.controller.js | 99 +++++++++++++----------
 server/src/middleware/auth.middleware.js  |  5 +-
 server/src/routes/auth.routes.js          |  2 +-
 server/src/utils/token.utils.js           |  6 +-
 5 files changed, 67 insertions(+), 50 deletions(-)

diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index eeb03b1..be84ea7 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -19,9 +19,8 @@ model User {
   email            String   @unique
   password         String?
   role             String?
-  provider         String   @default("local")
-  providerId       String?
-  githubId              String?   @unique 
+  googleId         String?  @unique
+  githubId         String?  @unique 
   githubAccessToken     String?   
   refreshToken     String? 
   forgotPasswordToken   String?
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index ed17979..50edce0 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -86,6 +86,7 @@ export const registerUser = async(req,res) => {
         email,
         role,
         password: hashedPassword,
+        profileCompleted: true,
       },
     });
 
@@ -229,8 +230,7 @@ export const googleLogin = async (req, res) => {
       user = await prisma.user.create({
         data: {
           email,
-          provider: "google",
-          providerId: sub,
+          googleId: sub,
           avatar: picture,
           profileCompleted: false
         }
@@ -239,29 +239,27 @@ export const googleLogin = async (req, res) => {
       // Account exists! Update the avatar to Google's so they look like a Google user this session.
       user = await prisma.user.update({
         where: { id: user.id },
-        data: { avatar: picture }
+        data: { avatar: picture, googleId: sub }
       });
     }
 
-    const token = jwt.sign(
-      { id: user.id, email: user.email, role: user.role },
-      process.env.JWT_SECRET,
-      { expiresIn: "1d" }
-    );
+    const accessToken = generateAccessToken(user);
+    const refreshToken = generateRefreshToken(user);
 
-    res.cookie("token", token, {
-      httpOnly: true,
-      secure: process.env.NODE_ENV === "production",
-      sameSite: "lax",
-      maxAge: 24 * 60 * 60 * 1000
+    await prisma.user.update({
+      where: { id: user.id },
+      data: { refreshToken },
     });
 
-    // Explicitly CLEAR GitHub access so it acts strictly like a Google account
-    res.clearCookie("github_access_token", {
+    const cookieOptions = {
       httpOnly: true,
       secure: process.env.NODE_ENV === "production",
-      sameSite: "lax" 
-    });
+      sameSite: "lax",
+    };
+
+    res.cookie("accessToken", accessToken, { ...cookieOptions, maxAge: 24 * 60 * 60 * 1000 });
+    res.cookie("refreshToken", refreshToken, { ...cookieOptions, maxAge: 10 * 24 * 60 * 60 * 1000 });
+    res.clearCookie("github_access_token", cookieOptions);
 
     return res.status(200).json({
       success: true,
@@ -272,8 +270,7 @@ export const googleLogin = async (req, res) => {
         username: user.username,
         email: user.email,
         role: user.role,
-        avatar: user.avatar,
-        provider: user.provider
+        avatar: user.avatar
       }
     });
   } catch (error) {
@@ -344,7 +341,6 @@ export const completeProfile = async (req, res) => {
         email: updatedUser.email,
         role: updatedUser.role,
         avatar: updatedUser.avatar,
-        provider: updatedUser.provider,
         profileCompleted: updatedUser.profileCompleted,
       },
     });
@@ -460,8 +456,6 @@ export const githubCallback = async (req, res) => {
       user = await prisma.user.create({
         data: {
           email: verifiedEmail,
-          provider: "github",
-          providerId: String(githubUser.id),
           githubId: String(githubUser.id),
           githubAccessToken: githubToken,
           avatar: githubUser.avatar_url,
@@ -480,8 +474,22 @@ export const githubCallback = async (req, res) => {
       });
     }
 
-    const token = jwt.sign({ id: user.id, email: user.email, role: user.role }, process.env.JWT_SECRET, { expiresIn: "1d" });
-    res.cookie("token", token, { httpOnly: true, secure: process.env.NODE_ENV === "production", sameSite: "lax", maxAge: 24 * 60 * 60 * 1000 });
+    const accessToken = generateAccessToken(user);
+    const refreshToken = generateRefreshToken(user);
+
+    await prisma.user.update({
+      where: { id: user.id },
+      data: { refreshToken },
+    });
+
+    const cookieOptions = {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === "production",
+      sameSite: "lax",
+    };
+
+    res.cookie("accessToken", accessToken, { ...cookieOptions, maxAge: 24 * 60 * 60 * 1000 });
+    res.cookie("refreshToken", refreshToken, { ...cookieOptions, maxAge: 10 * 24 * 60 * 60 * 1000 });
 
     return res.redirect(`${process.env.CLIENT_URL}/auth/github/callback`);
   } catch (error) {
@@ -492,13 +500,13 @@ export const githubCallback = async (req, res) => {
 export const getGithubProfile = async (req, res) => {
   try {
     // 1. Get the current user ID using the token from cookies
-    const currentToken = req.cookies.token || req.cookies.accessToken;
+    const currentToken = req.cookies.accessToken;
     
     if (!currentToken) {
       return res.status(401).json({ success: false, message: "Not logged in" });
     }
 
-    const decoded = jwt.verify(currentToken, process.env.JWT_SECRET);
+    const decoded = jwt.verify(currentToken, process.env.ACCESS_TOKEN_SECRET);
     
     // 2. Find the user in the database
     const user = await prisma.user.findUnique({
@@ -557,7 +565,6 @@ export const getCurrentUser = async (req, res) => {
         email: user.email,
         role: user.role,
         avatar: user.avatar,
-        provider: user.provider,
         profileCompleted: user.profileCompleted,
       },
     });
@@ -570,24 +577,32 @@ export const getCurrentUser = async (req, res) => {
 };
 
 export const logoutUser = async (req, res) => {
-  const cookieOptions = {
-    httpOnly: true,
-    secure: process.env.NODE_ENV === "production",
-    sameSite: "strict",
-  };
+  try {
+    const cookieOptions = {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === "production",
+      sameSite: "lax",
+    };
 
-  // Google login uses "token".
-  res.clearCookie("token", cookieOptions);
-  res.clearCookie("github_access_token", cookieOptions);
+    if (req.user && req.user.id) {
+      await prisma.user.update({
+        where: { id: req.user.id },
+        data: { refreshToken: null },
+      });
+    }
 
-  // Normal username/password login currently uses these two.
-  res.clearCookie("accessToken", cookieOptions);
-  res.clearCookie("refreshToken", cookieOptions);
+    res.clearCookie("accessToken", cookieOptions);
+    res.clearCookie("refreshToken", cookieOptions);
+    res.clearCookie("github_access_token", cookieOptions);
+    res.clearCookie("token", cookieOptions); // Clear legacy token just in case
 
-  return res.status(200).json({
-    success: true,
-    message: "Logged out successfully.",
-  });
+    return res.status(200).json({
+      success: true,
+      message: "Logged out successfully.",
+    });
+  } catch (error) {
+    return res.status(500).json({ success: false, message: "Error logging out." });
+  }
 };
 /*
 export const forgotPassword = async (req, res) => {
diff --git a/server/src/middleware/auth.middleware.js b/server/src/middleware/auth.middleware.js
index 7339a33..d81c527 100644
--- a/server/src/middleware/auth.middleware.js
+++ b/server/src/middleware/auth.middleware.js
@@ -3,7 +3,7 @@
 import jwt from "jsonwebtoken";
 
 export const requireAuth = (req, res, next) => {
-  const token = req.cookies?.token;
+  const token = req.cookies?.accessToken;
 
   if (!token) {
     return res.status(401).json({
@@ -13,13 +13,14 @@ export const requireAuth = (req, res, next) => {
   }
 
   try {
-    const decoded = jwt.verify(token, process.env.JWT_SECRET);
+    const decoded = jwt.verify(token, process.env.ACCESS_TOKEN_SECRET);
 
     // Make the logged-in user's details available to the next controller.
     req.user = {
       id: decoded.id,
       email: decoded.email,
       role: decoded.role,
+      username: decoded.username,
     };
 
     next();
diff --git a/server/src/routes/auth.routes.js b/server/src/routes/auth.routes.js
index aae3958..ae352ea 100644
--- a/server/src/routes/auth.routes.js
+++ b/server/src/routes/auth.routes.js
@@ -17,7 +17,7 @@ const route = express.Router();
 route.post("/register", registerUser);
 route.post("/login", loginUser);
 route.post("/google", googleLogin);
-route.post("/logout", logoutUser);
+route.post("/logout", requireAuth, logoutUser);
 route.get("/github", githubLogin);
 route.get("/github/callback", githubCallback);
 route.get("/github/profile", getGithubProfile);
diff --git a/server/src/utils/token.utils.js b/server/src/utils/token.utils.js
index 5311cd3..585bbbd 100644
--- a/server/src/utils/token.utils.js
+++ b/server/src/utils/token.utils.js
@@ -6,7 +6,8 @@ export const generateAccessToken = (user) =>{
         {
             id: user.id,
             email: user.email,
-            username: user.username
+            username: user.username,
+            role: user.role
         },
         process.env.ACCESS_TOKEN_SECRET,
         {expiresIn: process.env.ACCESS_TOKEN_EXPIRY}
@@ -18,7 +19,8 @@ export const generateRefreshToken = (user) =>{
         {
             id: user.id,
             email: user.email,
-            username: user.username
+            username: user.username,
+            role: user.role
         },
         process.env.REFRESH_TOKEN_SECRET,
         {expiresIn: process.env.REFRESH_TOKEN_EXPIRY}

From aa41fe7f113bf245efa5794ed98d9e56d04b0311 Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sat, 8 Aug 2026 21:28:20 +0530
Subject: [PATCH 23/24] Added architecture for userRoles

---
 client/src/App.jsx                            |  95 ++++-
 client/src/components/ProtectedAdminRoute.jsx |  20 ++
 .../src/components/layout/KPIs/StatsGrid.jsx  |  77 +++-
 .../LowerMiddleSection/LowerMiddleSection.jsx |   8 +-
 .../layout/LowerMiddleSection/OpenIssues.jsx  |  17 +-
 .../LowerMiddleSection/PullRequests.jsx       |  17 +-
 .../LowerMiddleSection/RecentActivity.jsx     | 153 ++++----
 .../layout/MiddleSection/CurrentSprint.jsx    |  72 +---
 .../layout/MiddleSection/MiddleSection.jsx    |   6 +-
 .../layout/MiddleSection/ProjectOverview.jsx  | 109 ++----
 .../RepositoryHealth.jsx                      |   2 +-
 .../layout/RightSideSection/TeamMember.jsx    |   2 +-
 client/src/components/layout/Sidebar.jsx      | 256 ++++++++------
 client/src/context/OrganizationContext.jsx    |  73 ++++
 client/src/main.jsx                           |  12 +-
 client/src/pages/AdminDashboard.jsx           | 165 +++++++++
 client/src/pages/CreateWorkspaceWizard.jsx    | 332 ++++++++++++++++++
 client/src/pages/OrganizationDashboard.jsx    | 194 ++++++++++
 client/src/pages/OrganizationMembers.jsx      | 272 ++++++++++++++
 client/src/pages/Projects.jsx                 | 187 ++++++++++
 client/src/pages/Sprints.jsx                  | 251 +++++++++++++
 client/src/pages/TasksKanban.jsx              | 270 ++++++++++++++
 client/src/pages/WorkspaceDashboard.jsx       |  77 ++++
 client/src/pages/WorkspaceDetails.jsx         | 164 +++++++++
 client/src/pages/Workspaces.jsx               | 144 ++++++++
 client/src/pages/completeProfile.jsx          |  82 +++--
 client/src/pages/dashboard.jsx                |  84 -----
 client/src/pages/githubCallback.jsx           |   2 +-
 client/src/pages/login.jsx                    |   4 +-
 client/src/pages/signup.jsx                   |  67 ++--
 client/src/services/googleAuthService.js      |   4 +-
 server/package.json                           |   6 +-
 .../migration.sql                             |  28 ++
 .../migration.sql                             |  52 +++
 .../migration.sql                             |  26 ++
 .../migration.sql                             |  75 ++++
 .../migration.sql                             | 133 +++++++
 server/prisma/schema.prisma                   | 260 +++++++++++++-
 server/prisma/seed.js                         |  47 +++
 server/src/app.js                             |  28 ++
 server/src/controllers/admin.controller.js    | 107 ++++++
 server/src/controllers/auth.controller.js     |  45 +--
 .../src/controllers/dashboard.controller.js   | 146 ++++++++
 server/src/controllers/github.controller.js   | 200 +++++------
 .../src/controllers/invitation.controller.js  | 207 +++++++++++
 server/src/controllers/org.controller.js      | 232 ++++++++++++
 server/src/controllers/project.controller.js  | 127 +++++++
 server/src/controllers/sprint.controller.js   | 161 +++++++++
 server/src/controllers/task.controller.js     | 235 +++++++++++++
 .../src/controllers/workspace.controller.js   | 242 +++++++++++++
 .../controllers/workspaceMember.controller.js | 166 +++++++++
 server/src/middleware/auth.middleware.js      |  15 +-
 server/src/middleware/org.middleware.js       |  77 ++++
 server/src/middleware/workspace.middleware.js | 107 ++++++
 server/src/routes/admin.routes.js             |  22 ++
 server/src/routes/dashboard.routes.js         |  10 +
 server/src/routes/github.routes.js            |  28 +-
 server/src/routes/invitation.routes.js        |  26 ++
 server/src/routes/org.routes.js               |  38 ++
 server/src/routes/project.routes.js           |  24 ++
 server/src/routes/sprint.routes.js            |  31 ++
 server/src/routes/task.routes.js              |  17 +
 server/src/routes/workspace.routes.js         |  39 ++
 server/src/routes/workspaceMember.routes.js   |  31 ++
 server/src/utils/activityLogger.js            |  27 ++
 server/src/utils/token.utils.js               |  34 +-
 66 files changed, 5565 insertions(+), 702 deletions(-)
 create mode 100644 client/src/components/ProtectedAdminRoute.jsx
 create mode 100644 client/src/context/OrganizationContext.jsx
 create mode 100644 client/src/pages/AdminDashboard.jsx
 create mode 100644 client/src/pages/CreateWorkspaceWizard.jsx
 create mode 100644 client/src/pages/OrganizationDashboard.jsx
 create mode 100644 client/src/pages/OrganizationMembers.jsx
 create mode 100644 client/src/pages/Projects.jsx
 create mode 100644 client/src/pages/Sprints.jsx
 create mode 100644 client/src/pages/TasksKanban.jsx
 create mode 100644 client/src/pages/WorkspaceDashboard.jsx
 create mode 100644 client/src/pages/WorkspaceDetails.jsx
 create mode 100644 client/src/pages/Workspaces.jsx
 delete mode 100644 client/src/pages/dashboard.jsx
 create mode 100644 server/prisma/migrations/20260807170909_add_platform_role/migration.sql
 create mode 100644 server/prisma/migrations/20260808082931_platform_roles_refactor/migration.sql
 create mode 100644 server/prisma/migrations/20260808092622_add_invitation_model/migration.sql
 create mode 100644 server/prisma/migrations/20260808101317_add_workspace_models/migration.sql
 create mode 100644 server/prisma/migrations/20260808105513_phase4_agile_models/migration.sql
 create mode 100644 server/prisma/seed.js
 create mode 100644 server/src/controllers/admin.controller.js
 create mode 100644 server/src/controllers/dashboard.controller.js
 create mode 100644 server/src/controllers/invitation.controller.js
 create mode 100644 server/src/controllers/org.controller.js
 create mode 100644 server/src/controllers/project.controller.js
 create mode 100644 server/src/controllers/sprint.controller.js
 create mode 100644 server/src/controllers/task.controller.js
 create mode 100644 server/src/controllers/workspace.controller.js
 create mode 100644 server/src/controllers/workspaceMember.controller.js
 create mode 100644 server/src/middleware/org.middleware.js
 create mode 100644 server/src/middleware/workspace.middleware.js
 create mode 100644 server/src/routes/admin.routes.js
 create mode 100644 server/src/routes/dashboard.routes.js
 create mode 100644 server/src/routes/invitation.routes.js
 create mode 100644 server/src/routes/org.routes.js
 create mode 100644 server/src/routes/project.routes.js
 create mode 100644 server/src/routes/sprint.routes.js
 create mode 100644 server/src/routes/task.routes.js
 create mode 100644 server/src/routes/workspace.routes.js
 create mode 100644 server/src/routes/workspaceMember.routes.js
 create mode 100644 server/src/utils/activityLogger.js

diff --git a/client/src/App.jsx b/client/src/App.jsx
index 05cbcd1..49bea84 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -8,9 +8,16 @@ import {
 import Login from "./pages/login";
 import Signup from "./pages/signup";
 import Forgotpassword from "./pages/forgotpassword";
-import Dashboard from "./pages/dashboard";
+import WorkspaceDashboard from "./pages/WorkspaceDashboard";
 import CompleteProfile from "./pages/completeProfile";
 import ProtectedRoute from "./components/common/ProtectedRoute";
+import ProtectedAdminRoute from "./components/ProtectedAdminRoute";
+import AdminDashboard from "./pages/AdminDashboard";
+import OrganizationDashboard from "./pages/OrganizationDashboard";
+import OrganizationMembers from "./pages/OrganizationMembers";
+import Workspaces from "./pages/Workspaces";
+import CreateWorkspaceWizard from "./pages/CreateWorkspaceWizard";
+import WorkspaceDetails from "./pages/WorkspaceDetails";
 import PageLoader from "./components/common/PageLoader";
 import {
   NavigationLoadingProvider,
@@ -18,6 +25,9 @@ import {
 } from "./context/NavigationLoadingContext";
 import "./index.css";
 import GithubCallback from "./pages/githubCallback";
+import Projects from "./pages/Projects";
+import Sprints from "./pages/Sprints";
+import TasksKanban from "./pages/TasksKanban";
 
 function AppRoutes() {
   const location = useLocation();
@@ -80,15 +90,92 @@ function AppRoutes() {
         />
 
         <Route
-          path="/dashboard"
+          path="/organizations/:orgId/workspaces/:workspaceId/dashboard"
           element={
             <ProtectedRoute>
-              <Dashboard />
+              <WorkspaceDashboard />
             </ProtectedRoute>
           }
         />
 
-        <Route path="/" element={<Navigate to="/login" replace />} />
+        <Route
+          path="/organizations/:orgId/workspaces/:workspaceId/projects"
+          element={
+            <ProtectedRoute>
+              <Projects />
+            </ProtectedRoute>
+          }
+        />
+
+        <Route
+          path="/organizations/:orgId/workspaces/:workspaceId/sprints"
+          element={
+            <ProtectedRoute>
+              <Sprints />
+            </ProtectedRoute>
+          }
+        />
+
+        <Route
+          path="/organizations/:orgId/workspaces/:workspaceId/tasks"
+          element={
+            <ProtectedRoute>
+              <TasksKanban />
+            </ProtectedRoute>
+          }
+        />
+
+        {/* Organization Routes Protected by Auth */}
+        <Route
+          path="/organization"
+          element={
+            <ProtectedRoute>
+              <OrganizationDashboard />
+            </ProtectedRoute>
+          }
+        />
+
+        <Route
+          path="/workspaces"
+          element={
+            <ProtectedRoute>
+              <Workspaces />
+            </ProtectedRoute>
+          }
+        />
+
+        <Route
+          path="/organizations/:orgId/workspaces/:workspaceId"
+          element={
+            <ProtectedRoute>
+              <WorkspaceDetails />
+            </ProtectedRoute>
+          }
+        />
+
+        <Route
+          path="/organizations/:orgId/workspaces/create"
+          element={
+            <ProtectedRoute>
+              <CreateWorkspaceWizard />
+            </ProtectedRoute>
+          }
+        />
+
+        <Route
+          path="/organizations/:orgId/members"
+          element={
+            <ProtectedRoute>
+              <OrganizationMembers />
+            </ProtectedRoute>
+          }
+        />
+
+        <Route element={<ProtectedAdminRoute />}>
+          <Route path="/admin" element={<AdminDashboard />} />
+        </Route>
+
+        <Route path="*" element={<Navigate to="/organization" replace />} />
       </Routes>
     </div>
   );
diff --git a/client/src/components/ProtectedAdminRoute.jsx b/client/src/components/ProtectedAdminRoute.jsx
new file mode 100644
index 0000000..22bd8ea
--- /dev/null
+++ b/client/src/components/ProtectedAdminRoute.jsx
@@ -0,0 +1,20 @@
+import React from 'react';
+import { Navigate, Outlet } from 'react-router-dom';
+
+const ProtectedAdminRoute = () => {
+  const userStr = localStorage.getItem("user");
+  
+  if (!userStr) {
+    return <Navigate to="/login" replace />;
+  }
+
+  const user = JSON.parse(userStr);
+
+  if (user.platformRole !== 'PLATFORM_ADMIN') {
+    return <Navigate to="/organization" replace />;
+  }
+
+  return <Outlet />;
+};
+
+export default ProtectedAdminRoute;
diff --git a/client/src/components/layout/KPIs/StatsGrid.jsx b/client/src/components/layout/KPIs/StatsGrid.jsx
index a8e48e7..e8f5a68 100644
--- a/client/src/components/layout/KPIs/StatsGrid.jsx
+++ b/client/src/components/layout/KPIs/StatsGrid.jsx
@@ -1,15 +1,86 @@
 import React from "react";
 import StatsCard from "./StatsCard.jsx";
-import StatsData from "./StatsData.js";
+import { Folder, Play, CheckCircle2Icon, CircleAlert, CheckCircle, Code } from "lucide-react";
 
+const getStatsData = (kpis) => {
+  return [
+    {
+      title: "Active Projects",
+      value: kpis?.totalProjects || 0,
+      subtitle: "In this workspace",
+      icon: Folder,
+      borderColor: "border-violet-500/30",
+      bgColor: "bg-gradient-to-br from-violet-950/60 to-slate-900",
+      iconColor: "text-violet-400",
+      bgIcon: "bg-violet-500/20",
+      hoverBorderColor: "hover:border-violet-400",
+    },
+    {
+      title: "Active Sprints",
+      value: kpis?.activeSprints || 0,
+      subtitle: "Currently running",
+      icon: Play,
+      borderColor: "border-sky-500/30",
+      bgColor: "bg-gradient-to-br from-cyan-950/60 to-slate-900",
+      iconColor: "text-sky-400",
+      bgIcon: "bg-sky-500/20",
+      hoverBorderColor: "hover:border-sky-400",
+    },
+    {
+      title: "Tasks Completed",
+      value: kpis?.tasksCompleted || 0,
+      subtitle: "Across all projects",
+      icon: CheckCircle2Icon,
+      borderColor: "border-blue-500/30",
+      bgColor: "bg-gradient-to-br from-blue-950/60 to-slate-900",
+      iconColor: "text-blue-400",
+      bgIcon: "bg-blue-500/20",
+      hoverBorderColor: "hover:border-blue-400",
+    },
+    {
+      title: "Open Bugs",
+      value: kpis?.openBugs || 0,
+      subtitle: "Requires attention",
+      icon: CircleAlert,
+      borderColor: "border-red-500/30",
+      bgColor: "bg-gradient-to-br from-red-950/60 to-slate-900",
+      iconColor: "text-red-400",
+      bgIcon: "bg-red-500/20",
+      hoverBorderColor: "hover:border-red-400",
+    },
+    {
+      title: "Total Sprints",
+      value: kpis?.totalSprints || 0,
+      subtitle: "Historical data",
+      icon: Code,
+      borderColor: "border-orange-500/30",
+      bgColor: "bg-gradient-to-br from-orange-950/60 to-slate-900",
+      iconColor: "text-orange-400",
+      bgIcon: "bg-orange-500/20",
+      hoverBorderColor: "hover:border-orange-400",
+    },
+    {
+      title: "Total Tasks",
+      value: kpis?.totalTasks || 0,
+      subtitle: "Total recorded",
+      icon: CheckCircle,
+      borderColor: "border-purple-500/30",
+      bgColor: "bg-gradient-to-br from-purple-950/60 to-slate-900",
+      iconColor: "text-purple-400",
+      bgIcon: "bg-purple-500/20",
+      hoverBorderColor: "hover:border-purple-400",
+    },
+  ];
+};
 
+const StatsGrid = ({ kpis }) => {
+  const stats = getStatsData(kpis);
 
-const StatsGrid = () => {
   return (
     <div className="w-full bg-[#111827] rounded-2xl">
       <div
         className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6 gap-4 p-2">
-        {StatsData.map((stat) => (
+        {stats.map((stat) => (
           <StatsCard
             key={stat.title}
             title={stat.title}
diff --git a/client/src/components/layout/LowerMiddleSection/LowerMiddleSection.jsx b/client/src/components/layout/LowerMiddleSection/LowerMiddleSection.jsx
index 27afc09..9a4cd98 100644
--- a/client/src/components/layout/LowerMiddleSection/LowerMiddleSection.jsx
+++ b/client/src/components/layout/LowerMiddleSection/LowerMiddleSection.jsx
@@ -3,14 +3,14 @@ import { RecentActivity } from './RecentActivity';
 import { PullRequests } from './PullRequests';
 import { OpenIssues } from './OpenIssues';
 
-const LowerMiddleSection = () => {
+const LowerMiddleSection = ({ recentActivity, orgId, workspaceId }) => {
   return (
     <div className="w-full bg-[#111827] rounded-2xl p-2">
       <div className="grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3 gap-4 items-stretch">
-        <RecentActivity />
-        <PullRequests />
+        <RecentActivity activities={recentActivity} />
+        <PullRequests orgId={orgId} workspaceId={workspaceId} />
         <div className="lg:col-span-2 2xl:col-span-1 h-full">
-        <OpenIssues />
+        <OpenIssues orgId={orgId} workspaceId={workspaceId} />
         </div>
       </div>
     </div>
diff --git a/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx b/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
index 76f4c8b..374e0d3 100644
--- a/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
+++ b/client/src/components/layout/LowerMiddleSection/OpenIssues.jsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
 import { CircleAlert, LoaderCircle } from "lucide-react";
 import Card from "../../common/Card";
-import { getOpenIssues } from "../../../services/githubService.js";
+import axios from "axios";
 
 const getPriorityStyles = (priority) => {
   switch (priority) {
@@ -41,7 +41,7 @@ const getIconStyles = (priority) => {
   }
 };
 
-export const OpenIssues = () => {
+export const OpenIssues = ({ orgId, workspaceId }) => {
   const [issues, setIssues] = useState([]);
   const [error, setError] = useState("");
   const [isLoading, setIsLoading] = useState(true);
@@ -49,8 +49,8 @@ export const OpenIssues = () => {
   useEffect(() => {
     const loadIssues = async () => {
       try {
-        const result = await getOpenIssues();
-        setIssues(result.data);
+        const result = await axios.get(`http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/github/issues`, { withCredentials: true });
+        setIssues(result.data.data);
       } catch (err) {
         setError(
           err.response?.data?.message || "Could not load open issues."
@@ -67,15 +67,6 @@ export const OpenIssues = () => {
     <Card className="flex min-h-[320px] h-full flex-col">
       <div className="mb-4 flex items-center justify-between">
         <h3 className="text-lg font-semibold text-slate-100">Open Issues</h3>
-
-        <a
-          href="https://github.com/ankuryadavgithub/Developer-Collaboration-Platform/issues"
-          target="_blank"
-          rel="noreferrer"
-          className="cursor-pointer text-sm text-indigo-400 transition-colors hover:text-indigo-300"
-        >
-          View All
-        </a>
       </div>
 
       {isLoading && (
diff --git a/client/src/components/layout/LowerMiddleSection/PullRequests.jsx b/client/src/components/layout/LowerMiddleSection/PullRequests.jsx
index 31b536b..9acd024 100644
--- a/client/src/components/layout/LowerMiddleSection/PullRequests.jsx
+++ b/client/src/components/layout/LowerMiddleSection/PullRequests.jsx
@@ -5,7 +5,7 @@ import {
   MessageSquare,
 } from "lucide-react";
 import Card from "../../common/Card";
-import { getPullRequests } from "../../../services/githubService.js";
+import axios from "axios";
 
 const getStatusStyles = (status) => {
   switch (status) {
@@ -23,7 +23,7 @@ const getStatusStyles = (status) => {
   }
 };
 
-export const PullRequests = () => {
+export const PullRequests = ({ orgId, workspaceId }) => {
   const [pullRequests, setPullRequests] = useState([]);
   const [error, setError] = useState("");
   const [isLoading, setIsLoading] = useState(true);
@@ -31,8 +31,8 @@ export const PullRequests = () => {
   useEffect(() => {
     const loadPullRequests = async () => {
       try {
-        const result = await getPullRequests();
-        setPullRequests(result.data);
+        const result = await axios.get(`http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/github/pull-requests`, { withCredentials: true });
+        setPullRequests(result.data.data);
       } catch (err) {
         setError(
           err.response?.data?.message ||
@@ -52,15 +52,6 @@ export const PullRequests = () => {
         <h3 className="text-lg font-semibold text-slate-100">
           Pull Requests
         </h3>
-
-        <a
-          href="https://github.com/ankuryadavgithub/Developer-Collaboration-Platform/pulls"
-          target="_blank"
-          rel="noreferrer"
-          className="cursor-pointer text-sm text-indigo-400 transition-colors hover:text-indigo-300"
-        >
-          View All
-        </a>
       </div>
 
       {isLoading && (
diff --git a/client/src/components/layout/LowerMiddleSection/RecentActivity.jsx b/client/src/components/layout/LowerMiddleSection/RecentActivity.jsx
index ccc4ac2..c27eaaa 100644
--- a/client/src/components/layout/LowerMiddleSection/RecentActivity.jsx
+++ b/client/src/components/layout/LowerMiddleSection/RecentActivity.jsx
@@ -1,110 +1,79 @@
 import React from "react";
 import Card from "../../common/Card";
-import {MessageSquare, GitMerge, CircleDot, GitCommit, CheckCircle } from "lucide-react";
+import { MessageSquare, GitMerge, CircleDot, GitCommit, CheckCircle, PlusCircle, Play, CheckSquare } from "lucide-react";
 
-const recentActivityStats = [
-  {
-    id: 1,
-    user: "Sarah J.",
-    action: "commented on PR #142",
-    time: "3 minutes ago",
-    icon: MessageSquare,
-    iconBg: "bg-emerald-500/20",
-    iconColor: "text-emerald-400",
-    avatar: "https://i.pravatar.cc/100?img=5",
-  },
-  {
-    id: 2,
-    user: "Ankur Y.",
-    action: "merged commit a3f5d2e into main",
-    time: "25 minutes ago",
-    icon: GitMerge,
-    iconBg: "bg-violet-500/20",
-    iconColor: "text-violet-400",
-    avatar: "https://i.pravatar.cc/100?img=12",
-  },
-  {
-    id: 3,
-    user: "Anas S.",
-    action: "created issue #218",
-    time: "1 hour ago",
-    icon: CircleDot,
-    iconBg: "bg-red-500/20",
-    iconColor: "text-red-400",
-    avatar: "https://i.pravatar.cc/100?img=15",
-  },
-  {
-    id: 4,
-    user: "Soham A.",
-    action: "pushed 3 commits to feature/auth",
-    time: "2 hours ago",
-    icon: GitCommit,
-    iconBg: "bg-cyan-500/20",
-    iconColor: "text-cyan-400",
-    avatar: "https://i.pravatar.cc/100?img=20",
-  },
-  {
-    id: 5,
-    user: "Sumit S.",
-    action: "closed issue #215",
-    time: "3 hours ago",
-    icon: CheckCircle,
-    iconBg: "bg-rose-500/20",
-    iconColor: "text-rose-400",
-    avatar: "https://i.pravatar.cc/100?img=25",
-  },
-];
+const timeAgo = (dateStr) => {
+  const diff = (new Date() - new Date(dateStr)) / 1000;
+  if (diff < 60) return "just now";
+  if (diff < 3600) return Math.floor(diff / 60) + "m ago";
+  if (diff < 86400) return Math.floor(diff / 3600) + "h ago";
+  return Math.floor(diff / 86400) + "d ago";
+};
+
+const getActivityConfig = (type) => {
+  switch(type) {
+    case 'PROJECT_CREATED':
+      return { icon: PlusCircle, bg: 'bg-emerald-500/20', color: 'text-emerald-400' };
+    case 'TASK_CREATED':
+      return { icon: CircleDot, bg: 'bg-blue-500/20', color: 'text-blue-400' };
+    case 'TASK_UPDATED':
+      return { icon: MessageSquare, bg: 'bg-orange-500/20', color: 'text-orange-400' };
+    case 'TASK_COMPLETED':
+      return { icon: CheckSquare, bg: 'bg-emerald-500/20', color: 'text-emerald-400' };
+    case 'SPRINT_CREATED':
+      return { icon: PlusCircle, bg: 'bg-purple-500/20', color: 'text-purple-400' };
+    case 'SPRINT_STARTED':
+      return { icon: Play, bg: 'bg-cyan-500/20', color: 'text-cyan-400' };
+    case 'SPRINT_COMPLETED':
+      return { icon: CheckCircle, bg: 'bg-green-500/20', color: 'text-green-400' };
+    default:
+      return { icon: CircleDot, bg: 'bg-slate-500/20', color: 'text-slate-400' };
+  }
+};
 
-export const RecentActivity = () => {
+export const RecentActivity = ({ activities }) => {
   return (
     <Card className="h-full min-h-[320px] flex flex-col bg-slate-900/60 border border-slate-800 backdrop-blur-xl">
-      {/* Header */}
       <div className="flex items-center justify-between mb-4">
         <h3 className="text-lg font-semibold text-slate-100">
           Recent Activity
         </h3>
-
-        <button className="text-sm text-indigo-400 hover:text-indigo-300 transition-colors cursor-pointer">
-          View All
-        </button>
       </div>
 
-      {/* Activity List */}
-      <div className="space-y-1">
-        {recentActivityStats.map((activity) => {
-          const Icon = activity.icon;
-
-          return (
-            <div
-              key={activity.id}
-              className="flex items-center gap-3 py-1 border-b border-slate-800 last:border-none hover:bg-slate-800/30 rounded-lg px-1 transition-colors cursor-pointer"
-            >
-              {/* Activity Icon */}
+      <div className="space-y-1 overflow-y-auto max-h-[260px] pr-2">
+        {!activities || activities.length === 0 ? (
+          <p className="text-sm text-slate-400 text-center mt-8">No recent activity.</p>
+        ) : (
+          activities.map((activity) => {
+            const config = getActivityConfig(activity.type);
+            const Icon = config.icon;
+            
+            return (
               <div
-                className={`w-7 h-7 shrink-0 rounded-lg flex items-center justify-center ${activity.iconBg}`}
+                key={activity.id}
+                className="flex items-center gap-3 py-2 border-b border-slate-800 last:border-none hover:bg-slate-800/30 rounded-lg px-2 transition-colors cursor-pointer"
               >
-                <Icon size={16} className={activity.iconColor} />
-              </div>
-
-              {/* Avatar */}
-              <img
-                src={activity.avatar}
-                alt={activity.user}
-                className="w-7 h-7 shrink-0 rounded-full object-cover"
-              />
-
-              {/* Content */}
-              <div className="flex-1 min-w-0">
-                <p className="text-sm text-slate-200 truncate">
-                  <span className="font-medium">{activity.user}</span>{" "}
-                  {activity.action}
-                </p>
-
-                <p className="text-xs text-slate-400 mt-1">{activity.time}</p>
+                <div className={`w-8 h-8 shrink-0 rounded-lg flex items-center justify-center ${config.bg}`}>
+                  <Icon size={16} className={config.color} />
+                </div>
+                {activity.user?.avatar ? (
+                  <img src={activity.user.avatar} alt="Avatar" className="w-7 h-7 shrink-0 rounded-full object-cover" />
+                ) : (
+                  <div className="w-7 h-7 shrink-0 rounded-full bg-blue-600 flex items-center justify-center text-white text-xs font-bold uppercase">
+                    {activity.user?.username?.charAt(0) || '?'}
+                  </div>
+                )}
+                <div className="flex-1 min-w-0">
+                  <p className="text-sm text-slate-200">
+                    <span className="font-medium text-white">{activity.user?.username}</span>{" "}
+                    {activity.message.replace(`User ${activity.user?.username} `, "")}
+                  </p>
+                  <p className="text-xs text-slate-400 mt-1">{timeAgo(activity.createdAt)}</p>
+                </div>
               </div>
-            </div>
-          );
-        })}
+            );
+          })
+        )}
       </div>
     </Card>
   );
diff --git a/client/src/components/layout/MiddleSection/CurrentSprint.jsx b/client/src/components/layout/MiddleSection/CurrentSprint.jsx
index 20d214e..d188850 100644
--- a/client/src/components/layout/MiddleSection/CurrentSprint.jsx
+++ b/client/src/components/layout/MiddleSection/CurrentSprint.jsx
@@ -1,13 +1,10 @@
-import { useEffect, useState } from "react";
 import { LoaderCircle } from "lucide-react";
 import Card from "../../common/Card";
-import { getCurrentSprint } from "../../../services/githubService.js";
 
 const StatItem = ({ label, value }) => {
   return (
     <div>
       <p className="text-xs text-slate-400">{label}</p>
-
       <p className="mt-1 whitespace-nowrap text-xl font-semibold text-slate-100">
         {value}
       </p>
@@ -16,10 +13,7 @@ const StatItem = ({ label, value }) => {
 };
 
 const formatDate = (date) => {
-  if (!date) {
-    return "No due date";
-  }
-
+  if (!date) return "No due date";
   return new Intl.DateTimeFormat("en-IN", {
     day: "numeric",
     month: "short",
@@ -27,69 +21,41 @@ const formatDate = (date) => {
   }).format(new Date(date));
 };
 
-export const CurrentSprint = () => {
-  const [sprint, setSprint] = useState(null);
-  const [error, setError] = useState("");
-  const [isLoading, setIsLoading] = useState(true);
-
-  useEffect(() => {
-    const loadSprint = async () => {
-      try {
-        const result = await getCurrentSprint();
-        setSprint(result.data);
-      } catch (err) {
-        setError(
-          err.response?.data?.message ||
-            "Could not load the current sprint."
-        );
-      } finally {
-        setIsLoading(false);
-      }
-    };
-
-    loadSprint();
-  }, []);
-
-  if (isLoading) {
-    return (
-      <Card className="flex min-h-[320px] items-center justify-center">
-        <LoaderCircle size={28} className="animate-spin text-violet-400" />
-      </Card>
-    );
-  }
-
-  if (error) {
+export const CurrentSprint = ({ sprint }) => {
+  if (!sprint) {
     return (
       <Card className="flex min-h-[320px] flex-col items-center justify-center px-6 text-center">
         <h3 className="text-lg font-semibold text-slate-100">
           Current Sprint
         </h3>
-
-        <p className="mt-3 text-sm text-slate-400">{error}</p>
+        <p className="mt-3 text-sm text-slate-400">No active sprint. Start a sprint from the Sprints page.</p>
       </Card>
     );
   }
 
+  // Calculate days left
+  const daysLeft = sprint.endDate
+    ? Math.max(0, Math.ceil((new Date(sprint.endDate) - new Date()) / (1000 * 60 * 60 * 24)))
+    : null;
+
   return (
     <Card className="flex min-h-[320px] h-full flex-col justify-between">
       <div className="flex items-center justify-between">
         <h3 className="text-lg font-semibold text-slate-100">
           Current Sprint
         </h3>
-
         <div className="rounded-lg border border-slate-700 bg-slate-800 px-3 py-1 text-xs text-slate-300">
-          Sprint {sprint.sprintNumber}
+          {sprint.name}
         </div>
       </div>
 
       <div className="mt-5">
         <h4 className="text-xl font-semibold text-white">
-          Sprint {sprint.sprintNumber} — {sprint.title}
+          {sprint.goal || "No goal specified"}
         </h4>
-
         <p className="mt-2 text-sm text-slate-400">
-          Due {formatDate(sprint.dueDate)}
-          {sprint.daysLeft !== null && ` (${sprint.daysLeft} days left)`}
+          Due {formatDate(sprint.endDate)}
+          {daysLeft !== null && ` (${daysLeft} days left)`}
         </p>
       </div>
 
@@ -100,7 +66,6 @@ export const CurrentSprint = () => {
             style={{ width: `${sprint.progress}%` }}
           />
         </div>
-
         <span className="text-xl font-semibold text-white">
           {sprint.progress}%
         </span>
@@ -108,13 +73,10 @@ export const CurrentSprint = () => {
 
       <div className="mt-5 border-t border-slate-800 pt-5">
         <div className="grid grid-cols-2 gap-4 sm:grid-cols-4 sm:gap-3">
-          <StatItem label="Total Items" value={sprint.totalItems} />
-          <StatItem label="Completed" value={sprint.completedTasks} />
-          <StatItem label="Open" value={sprint.todoTasks} />
-          <StatItem
-            label="Days Left"
-            value={sprint.daysLeft ?? "—"}
-          />
+          <StatItem label="Total Points" value={sprint.totalStoryPoints} />
+          <StatItem label="Completed" value={sprint.stats.completed} />
+          <StatItem label="In Progress" value={sprint.stats.inProgress} />
+          <StatItem label="Todo" value={sprint.stats.todo} />
         </div>
       </div>
     </Card>
diff --git a/client/src/components/layout/MiddleSection/MiddleSection.jsx b/client/src/components/layout/MiddleSection/MiddleSection.jsx
index 3d09ec6..79c05b2 100644
--- a/client/src/components/layout/MiddleSection/MiddleSection.jsx
+++ b/client/src/components/layout/MiddleSection/MiddleSection.jsx
@@ -3,12 +3,12 @@ import { CurrentSprint } from './CurrentSprint';
 import { ProjectOverview } from './ProjectOverview';
 import { CICDStatus } from './CICDStatus';
 
-const MiddleSection = () => {
+const MiddleSection = ({ currentSprint, projectOverview }) => {
   return (
     <div className="w-full bg-[#111827] rounded-2xl p-2">
       <div className="grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3 gap-4 items-stretch">
-        <CurrentSprint />
-        <ProjectOverview />
+        <CurrentSprint sprint={currentSprint} />
+        <ProjectOverview projects={projectOverview} />
         <div className="lg:col-span-2 2xl:col-span-1 h-full">
         <CICDStatus />
         </div>
diff --git a/client/src/components/layout/MiddleSection/ProjectOverview.jsx b/client/src/components/layout/MiddleSection/ProjectOverview.jsx
index 8b204c0..efac7b6 100644
--- a/client/src/components/layout/MiddleSection/ProjectOverview.jsx
+++ b/client/src/components/layout/MiddleSection/ProjectOverview.jsx
@@ -1,26 +1,25 @@
 import React from "react";
 import Card from "../../common/Card";
-
-const ProjectData = {
-  projectName: "Developer Collaboration Platform",
-  projectDescription: "A unified platform to streamline teamwork for developers.",
-  progress: 72,
-  projectMembers: [
-    "A", "B" , "C" , "D",
-  ],
-  extraProjectMembers:3,
-  repositoryBranch: "main",
-
-}
-export const ProjectOverview = () => {
-  const {
-    projectName,
-    projectDescription,
-    progress,
-    projectMembers,
-    extraProjectMembers,
-    repositoryBranch
-  } = ProjectData;
+import { Link, useParams } from "react-router-dom";
+
+export const ProjectOverview = ({ projects }) => {
+  const { orgId, workspaceId } = useParams();
+  const activeProject = projects && projects.length > 0 ? projects[0] : null;
+
+  if (!activeProject) {
+    return (
+      <Card className="h-full min-h-[320px] flex flex-col items-center justify-center text-center">
+        <h3 className="text-lg font-semibold text-slate-100 mb-2">Project Overview</h3>
+        <p className="text-sm text-slate-400">No active projects yet.</p>
+        <Link 
+          to={`/organizations/${orgId}/workspaces/${workspaceId}/projects`}
+          className="mt-4 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg text-sm transition-colors"
+        >
+          Create Project
+        </Link>
+      </Card>
+    );
+  }
 
   return (
     <Card className="h-full min-h-[320px] flex flex-col justify-between">
@@ -28,70 +27,30 @@ export const ProjectOverview = () => {
         <h3 className="text-lg font-semibold text-slate-100">
           Project Overview
         </h3>
+        <Link to={`/organizations/${orgId}/workspaces/${workspaceId}/projects`} className="text-sm text-blue-400 hover:text-blue-300">View All</Link>
       </div>
       <div className="mt-5 flex gap-3">
-        <div className="w-10 h-10 rounded-xl bg-purple-600 flex items-center justify-center text-white font-bold">
-          D
+        <div className="w-10 h-10 rounded-xl bg-purple-600 flex items-center justify-center text-white font-bold text-lg uppercase shadow-lg shadow-purple-500/20">
+          {activeProject.name.charAt(0)}
         </div>
-        <div>
-          <h4 className="text-base font-semibold text-white">{projectName}</h4>
-          <p className="mt-1 text-sm text-slate-400">{projectDescription}</p>
+        <div className="flex-1 min-w-0">
+          <h4 className="text-base font-semibold text-white truncate">{activeProject.name}</h4>
+          <p className="mt-1 text-sm text-slate-400 line-clamp-2">{activeProject.description || "No description provided."}</p>
         </div>
       </div>
-      <div className="mt-4">
-        <p className="text-sm text-slate-400">Overall Progress</p>
+      <div className="mt-6">
+        <p className="text-sm text-slate-400 flex justify-between">
+          <span>Overall Progress</span>
+          <span className="text-white font-medium">{activeProject.progress}%</span>
+        </p>
 
-        <div className="mt-3 flex items-center gap-3">
+        <div className="mt-2 flex items-center gap-3">
           <div className="flex-1 h-2.5 bg-slate-800 rounded-full overflow-hidden">
             <div
-              className="h-full bg-cyan-500 rounded-full"
-              style={{ width: `${progress}%` }}
+              className="h-full bg-cyan-500 rounded-full transition-all duration-500"
+              style={{ width: `${activeProject.progress}%` }}
             />
           </div>
-
-          <span className="text-xl font-semibold text-white">{progress}%</span>
-        </div>
-        <div className="mt-4 grid grid-cols-2">
-          <div>
-            <p className="text-sm text-slate-400">Members</p>
-
-            <div className="flex items-center mt-3">
-              <div className="w-7 h-7 rounded-full bg-red-500 border-2 border-slate-900"></div>
-
-              <div className="-ml-2 w-7 h-7 rounded-full bg-blue-500 border-2 border-slate-900"></div>
-
-              <div className="-ml-2 w-7 h-7 rounded-full bg-green-500 border-2 border-slate-900"></div>
-
-              <div className="-ml-2 w-7 h-7 rounded-full bg-yellow-500 border-2 border-slate-900"></div>
-
-              <div className="-ml-2 w-7 h-7 rounded-full bg-slate-700 border-2 border-slate-900 flex items-center justify-center text-xs text-white">
-                +{extraProjectMembers}
-              </div>
-            </div>
-          </div>
-          <div>
-            <p className="text-sm text-slate-400">Repository</p>
-
-            <div className="flex items-center gap-2 mt-3">
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                width="16"
-                height="16"
-                fill="none"
-                stroke="currentColor"
-                strokeWidth="2"
-                viewBox="0 0 24 24"
-                className="text-slate-400"
-              >
-                <path d="M6 3v12" />
-                <circle cx="18" cy="6" r="3" />
-                <circle cx="6" cy="18" r="3" />
-                <path d="M18 9a9 9 0 0 1-9 9" />
-              </svg>
-
-              <span className="text-white font-medium">{repositoryBranch}</span>
-            </div>
-          </div>
         </div>
       </div>
     </Card>
diff --git a/client/src/components/layout/RepositoryHealthSection/RepositoryHealth.jsx b/client/src/components/layout/RepositoryHealthSection/RepositoryHealth.jsx
index ef2c03d..5fa38ee 100644
--- a/client/src/components/layout/RepositoryHealthSection/RepositoryHealth.jsx
+++ b/client/src/components/layout/RepositoryHealthSection/RepositoryHealth.jsx
@@ -88,7 +88,7 @@ const HealthMetric = ({ title, value, type, progress, color, chartColor }) => {
   );
 };
 
-const RepositoryHealth = () => {
+const RepositoryHealth = ({ orgId, workspaceId }) => {
   return (
     <div className="w-full bg-[#111827] border border-slate-800 rounded-2xl overflow-hidden">
       {/* Header */}
diff --git a/client/src/components/layout/RightSideSection/TeamMember.jsx b/client/src/components/layout/RightSideSection/TeamMember.jsx
index d6cc6bd..a9ffb7b 100644
--- a/client/src/components/layout/RightSideSection/TeamMember.jsx
+++ b/client/src/components/layout/RightSideSection/TeamMember.jsx
@@ -80,7 +80,7 @@ export default function TeamMember() {
                 <p className="text-sm font-medium text-white group-hover:text-indigo-400 transition-colors">
                   {member.name}
                 </p>
-                <p className="text-xs text-[#8b92a5]">{member.role}</p>
+                <p className="text-xs text-[#8b92a5]">{member.jobTitle}</p>
               </div>
             </div>
 
diff --git a/client/src/components/layout/Sidebar.jsx b/client/src/components/layout/Sidebar.jsx
index 9b90c22..205f237 100644
--- a/client/src/components/layout/Sidebar.jsx
+++ b/client/src/components/layout/Sidebar.jsx
@@ -1,9 +1,14 @@
-import { Book, BookAIcon, BookCheck, BookCopy, BookIcon, BookOpenText, BubblesIcon, Calendar, Calendar1Icon, ChartBar, CircleArrowDown, CircleCheck, Folder, GitBranchMinusIcon, GitCommit, GitCommitHorizontalIcon, GitCompare, GitMergeConflict, GitPullRequest, GitPullRequestArrow, HomeIcon, LucideGitCommit, LucideMirrorRectangular, MessageCircle, Settings, Ticket, User2, User2Icon, UserCircleIcon, UserIcon, UserRound, PanelLeftOpen, PanelLeftClose, LayoutDashboard, CircleUserRound} from "lucide-react";
+import { Book, BookAIcon, BookCheck, BookCopy, BookIcon, BookOpenText, BubblesIcon, Calendar, Calendar1Icon, ChartBar, CircleArrowDown, CircleCheck, Folder, GitBranchMinusIcon, GitCommit, GitCommitHorizontalIcon, GitCompare, GitMergeConflict, GitPullRequest, GitPullRequestArrow, HomeIcon, LucideGitCommit, LucideMirrorRectangular, MessageCircle, Settings, Ticket, User2, User2Icon, UserCircleIcon, UserIcon, UserRound, PanelLeftOpen, PanelLeftClose, LayoutDashboard, CircleUserRound, ShieldCheck} from "lucide-react";
 
+import { useOrganization } from "../../context/OrganizationContext";
 import {useState} from 'react'
+import { useParams, useNavigate } from 'react-router-dom';
 
-function Sidebar({ isOpen, setIsOpen }) {
+function Sidebar({ isOpen, setIsOpen, user }) {
   const [isCollapsed, setIsCollapsed] = useState(false);
+  const { orgId, workspaceId } = useParams();
+  const navigate = useNavigate();
+  const { organizations, currentOrg, switchOrganization, loading } = useOrganization();
     return (
       <>
         {isOpen && (
@@ -28,115 +33,149 @@ function Sidebar({ isOpen, setIsOpen }) {
               )}
             </button>
           </div>
-          <div className="flex flex-col flex-1 overflow-y-auto px-4 gap-1 mt-2">
-            <div className="flex items-center h-10 px-3 gap-2 hover:bg-[#1c1f2e] hover:text-white rounded-lg font-medium cursor-pointer transition-colors">
-              <HomeIcon size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
-              >
-                Dashboard
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 hover:bg-[#1c1f2e] hover:text-white rounded-lg cursor-pointer transition-colors">
-              <Folder size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
-              >
-                Projects
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <CircleCheck size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
-              >
-                Issues
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <GitPullRequestArrow
-                size={18}
-                className="text-slate-300 shrink-0"
-              />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
-              >
-                Pull Requests
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <GitCommitHorizontalIcon
-                size={18}
-                className="text-slate-300 shrink-0"
-              />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
-              >
-                Commits
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3  gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <CircleArrowDown size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
-              >
-                Sprint
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <GitBranchMinusIcon
-                size={18}
-                className="text-slate-300 shrink-0"
-              />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
-              >
-                CI/CD
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <BookOpenText size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+          {/* Organization Switcher */}
+          {!loading && organizations.length > 0 && (
+            <div
+              className={`px-4 pb-2 border-b border-[#ffffff]/10 mb-2 ${isCollapsed ? "hidden" : "block"}`}
+            >
+              <select
+                className="w-full bg-[#1c1f2e] text-white text-sm font-semibold rounded-lg p-2 outline-none border border-slate-700 hover:border-slate-500 transition-colors cursor-pointer"
+                value={currentOrg?.id || ""}
+                onChange={(e) => switchOrganization(e.target.value)}
               >
-                Wiki
-              </span>
+                {organizations.map((org) => (
+                  <option key={org.id} value={org.id}>
+                    {org.name}
+                  </option>
+                ))}
+              </select>
             </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <MessageCircle size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+          )}
+          {workspaceId && (
+            <div className="flex flex-col flex-1 overflow-y-auto px-4 gap-1 mt-2">
+              <div 
+                onClick={() => navigate(`/organizations/${orgId}/workspaces/${workspaceId}/dashboard`)}
+                className="flex items-center h-10 px-3 gap-2 hover:bg-[#1c1f2e] hover:text-white rounded-lg font-medium cursor-pointer transition-colors"
               >
-                Chat
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <Calendar size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                <HomeIcon size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Dashboard
+                </span>
+              </div>
+              <div
+                onClick={() => navigate(`/organizations/${orgId}/workspaces/${workspaceId}/projects`)}
+                className="flex items-center h-10 px-3 gap-2 hover:bg-[#1c1f2e] hover:text-white rounded-lg cursor-pointer transition-colors"
               >
-                Calender
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <UserRound size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                <Folder size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Projects
+                </span>
+              </div>
+              <div 
+                onClick={() => navigate(`/organizations/${orgId}/workspaces/${workspaceId}/tasks`)}
+                className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors"
               >
-                Team
-              </span>
-            </div>
-            <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
-              <Settings size={18} className="text-slate-300 shrink-0" />
-              <span
-                className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                <CircleCheck size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Issues / Tasks
+                </span>
+              </div>
+              <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+                <GitPullRequestArrow
+                  size={18}
+                  className="text-slate-300 shrink-0"
+                />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Pull Requests
+                </span>
+              </div>
+              <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+                <GitCommitHorizontalIcon
+                  size={18}
+                  className="text-slate-300 shrink-0"
+                />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Commits
+                </span>
+              </div>
+              <div 
+                onClick={() => navigate(`/organizations/${orgId}/workspaces/${workspaceId}/sprints`)}
+                className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors"
               >
-                Settings
-              </span>
+                <CircleArrowDown size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Sprints
+                </span>
+              </div>
+              <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+                <GitBranchMinusIcon
+                  size={18}
+                  className="text-slate-300 shrink-0"
+                />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  CI/CD
+                </span>
+              </div>
+              <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+                <BookOpenText size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Wiki
+                </span>
+              </div>
+              <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+                <MessageCircle size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Chat
+                </span>
+              </div>
+              <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+                <Calendar size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Calender
+                </span>
+              </div>
+              <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+                <UserRound size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Team
+                </span>
+              </div>
+              <div className="flex items-center h-10 px-3 gap-2 rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer transition-colors">
+                <Settings size={18} className="text-slate-300 shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0" : "w-32 opacity-100"}`}
+                >
+                  Settings
+                </span>
+              </div>
             </div>
-          </div>
+          )}
+          {!workspaceId && <div className="flex-1" />}
           <div className="mt-auto border-t border-[#ffffff]/10 p-4 flex flex-col gap-2">
             <div
+              onClick={() => (window.location.href = "/organization")}
               className={`p-2 flex items-center rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer ${isCollapsed ? "justify-center" : "gap-2"}`}
             >
               <LayoutDashboard size={20} className="shrink-0" />
@@ -156,6 +195,19 @@ function Sidebar({ isOpen, setIsOpen }) {
                 Profile
               </span>
             </div>
+            {user?.platformRole === "PLATFORM_ADMIN" && (
+              <div
+                className={`p-2 flex items-center rounded-lg hover:bg-[#1c1f2e] hover:text-white cursor-pointer text-purple-400 ${isCollapsed ? "justify-center" : "gap-2"}`}
+                onClick={() => (window.location.href = "/admin")}
+              >
+                <ShieldCheck size={20} className="shrink-0" />
+                <span
+                  className={`truncate transition-all duration-300 overflow-hidden ${isCollapsed ? "w-0 opacity-0 hidden" : "w-auto opacity-100 block"}`}
+                >
+                  Admin Panel
+                </span>
+              </div>
+            )}
           </div>
         </div>
       </>
diff --git a/client/src/context/OrganizationContext.jsx b/client/src/context/OrganizationContext.jsx
new file mode 100644
index 0000000..92303da
--- /dev/null
+++ b/client/src/context/OrganizationContext.jsx
@@ -0,0 +1,73 @@
+import React, { createContext, useState, useEffect, useContext } from "react";
+import axios from "axios";
+
+const OrganizationContext = createContext();
+
+export const OrganizationProvider = ({ children }) => {
+  const [organizations, setOrganizations] = useState([]);
+  const [currentOrg, setCurrentOrg] = useState(null);
+  const [loading, setLoading] = useState(true);
+
+  // Fetch all organizations the logged-in user belongs to
+  const fetchOrganizations = async () => {
+    try {
+      const res = await axios.get(
+        "http://localhost:5000/api/organizations/mine",
+        { withCredentials: true },
+      );
+      if (res.data.success) {
+        setOrganizations(res.data.data);
+
+        // Remember the last organization they were looking at
+        const storedOrgId = localStorage.getItem("currentOrgId");
+        if (res.data.data.length > 0) {
+          const orgToSelect =
+            res.data.data.find((o) => o.id === parseInt(storedOrgId)) ||
+            res.data.data[0];
+          setCurrentOrg(orgToSelect);
+          localStorage.setItem("currentOrgId", orgToSelect.id);
+        } else {
+          setCurrentOrg(null);
+          localStorage.removeItem("currentOrgId");
+        }
+      }
+    } catch (error) {
+      console.error("Failed to fetch organizations", error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    // Only fetch if a user is currently logged in
+    if (localStorage.getItem("user")) {
+      fetchOrganizations();
+    } else {
+      setLoading(false);
+    }
+  }, []);
+
+  const switchOrganization = (orgId) => {
+    const org = organizations.find((o) => o.id === parseInt(orgId));
+    if (org) {
+      setCurrentOrg(org);
+      localStorage.setItem("currentOrgId", org.id);
+    }
+  };
+
+  return (
+    <OrganizationContext.Provider
+      value={{
+        organizations,
+        currentOrg,
+        switchOrganization,
+        loading,
+        fetchOrganizations,
+      }}
+    >
+      {children}
+    </OrganizationContext.Provider>
+  );
+};
+
+export const useOrganization = () => useContext(OrganizationContext);
diff --git a/client/src/main.jsx b/client/src/main.jsx
index 34ba2fd..103ac7c 100644
--- a/client/src/main.jsx
+++ b/client/src/main.jsx
@@ -2,7 +2,7 @@ import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import { GoogleOAuthProvider } from "@react-oauth/google";
 import axios from "axios";
-
+import { OrganizationProvider } from "./context/OrganizationContext.jsx";
 import "./index.css";
 import App from "./App.jsx";
 
@@ -10,10 +10,10 @@ axios.defaults.withCredentials = true;
 
 createRoot(document.getElementById("root")).render(
   <StrictMode>
-    <GoogleOAuthProvider
-      clientId={import.meta.env.VITE_GOOGLE_CLIENT_ID}
-    >
-      <App />
+    <GoogleOAuthProvider clientId={import.meta.env.VITE_GOOGLE_CLIENT_ID}>
+      <OrganizationProvider>
+        <App />
+      </OrganizationProvider>
     </GoogleOAuthProvider>
-  </StrictMode>
+  </StrictMode>,
 );
\ No newline at end of file
diff --git a/client/src/pages/AdminDashboard.jsx b/client/src/pages/AdminDashboard.jsx
new file mode 100644
index 0000000..0e1794b
--- /dev/null
+++ b/client/src/pages/AdminDashboard.jsx
@@ -0,0 +1,165 @@
+import React, { useState, useEffect } from "react";
+import axios from "axios";
+
+const AdminDashboard = () => {
+  const [users, setUsers] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+
+  // Pagination & Search State
+  const [page, setPage] = useState(1);
+  const [totalPages, setTotalPages] = useState(1);
+  const [search, setSearch] = useState("");
+
+  const API_URL = "http://localhost:5000/api/admin/users";
+
+  const fetchUsers = async () => {
+    setLoading(true);
+    setError(null);
+    try {
+      const response = await axios.get(
+        `${API_URL}?page=${page}&limit=10&search=${search}`,
+        { withCredentials: true },
+      );
+      setUsers(response.data.data.users);
+      setTotalPages(response.data.data.pagination.totalPages);
+    } catch (err) {
+      setError(err.response?.data?.message || "Failed to fetch users");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    const delayDebounceFn = setTimeout(() => {
+      fetchUsers();
+    }, 500);
+    return () => clearTimeout(delayDebounceFn);
+  }, [page, search]);
+
+  return (
+    <div className="flex h-screen bg-gray-100">
+      <aside className="w-64 bg-white border-r shadow-sm hidden md:block">
+        <div className="p-6">
+          <h2 className="text-2xl font-bold text-gray-800">Admin Panel</h2>
+        </div>
+        <nav className="mt-6 flex flex-col gap-2 px-4">
+          <a
+            href="#"
+            className="p-3 bg-blue-50 text-blue-700 rounded-lg font-medium"
+          >
+            Users
+          </a>
+          <a href="#" className="p-3 text-gray-600 hover:bg-gray-50 rounded-lg">
+            Organizations
+          </a>
+          <a href="#" className="p-3 text-gray-600 hover:bg-gray-50 rounded-lg">
+            Settings
+          </a>
+        </nav>
+      </aside>
+
+      <main className="flex-1 p-8 overflow-y-auto">
+        <div className="flex justify-between items-center mb-6">
+          <h1 className="text-3xl font-bold text-gray-800">Manage Users</h1>
+          <input
+            type="text"
+            placeholder="Search by username or email..."
+            className="p-2 border rounded-lg w-64 shadow-sm focus:ring focus:ring-blue-200"
+            value={search}
+            onChange={(e) => setSearch(e.target.value)}
+          />
+        </div>
+
+        {loading ? (
+          <div className="text-center p-10 text-gray-500">Loading users...</div>
+        ) : error ? (
+          <div className="text-center p-10 text-red-500 bg-red-50 rounded-lg">
+            {error}
+          </div>
+        ) : users.length === 0 ? (
+          <div className="text-center p-10 text-gray-500 bg-white rounded-lg shadow">
+            No users found.
+          </div>
+        ) : (
+          <div className="bg-white rounded-lg shadow overflow-hidden">
+            <table className="min-w-full divide-y divide-gray-200">
+              <thead className="bg-gray-50">
+                <tr>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">
+                    User
+                  </th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">
+                    Platform Role
+                  </th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">
+                    Joined
+                  </th>
+                </tr>
+              </thead>
+              <tbody className="bg-white divide-y divide-gray-200">
+                {users.map((user) => (
+                  <tr key={user.id} className="hover:bg-gray-50">
+                    <td className="px-6 py-4 flex items-center">
+                      <div className="h-10 w-10 rounded-full bg-blue-100 flex items-center justify-center text-blue-600 font-bold uppercase overflow-hidden">
+                        {user.avatar ? (
+                          <img
+                            src={user.avatar}
+                            alt="avatar"
+                            className="object-cover h-full w-full"
+                          />
+                        ) : (
+                          user.username[0]
+                        )}
+                      </div>
+                      <div className="ml-4">
+                        <div className="text-sm font-medium text-gray-900">
+                          {user.username}
+                        </div>
+                        <div className="text-sm text-gray-500">
+                          {user.email}
+                        </div>
+                      </div>
+                    </td>
+                    <td className="px-6 py-4">
+                      <span
+                        className={`px-2 py-1 inline-flex text-xs leading-5 font-semibold rounded-full ${user.platformRole === "PLATFORM_ADMIN" ? "bg-purple-100 text-purple-800" : "bg-gray-100 text-gray-800"}`}
+                      >
+                        {user.platformRole}
+                      </span>
+                    </td>
+                    <td className="px-6 py-4 text-sm text-gray-500">
+                      {new Date(user.createdAt).toLocaleDateString()}
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+
+            <div className="flex justify-between items-center p-4 border-t">
+              <button
+                disabled={page === 1}
+                onClick={() => setPage(page - 1)}
+                className={`px-4 py-2 border rounded ${page === 1 ? "opacity-50 cursor-not-allowed" : "hover:bg-gray-50"}`}
+              >
+                Previous
+              </button>
+              <span className="text-sm text-gray-600">
+                Page {page} of {totalPages || 1}
+              </span>
+              <button
+                disabled={page === totalPages || totalPages === 0}
+                onClick={() => setPage(page + 1)}
+                className={`px-4 py-2 border rounded ${page === totalPages || totalPages === 0 ? "opacity-50 cursor-not-allowed" : "hover:bg-gray-50"}`}
+              >
+                Next
+              </button>
+            </div>
+          </div>
+        )}
+      </main>
+    </div>
+  );
+};
+
+export default AdminDashboard;
diff --git a/client/src/pages/CreateWorkspaceWizard.jsx b/client/src/pages/CreateWorkspaceWizard.jsx
new file mode 100644
index 0000000..6b4cf8d
--- /dev/null
+++ b/client/src/pages/CreateWorkspaceWizard.jsx
@@ -0,0 +1,332 @@
+import React, { useState, useEffect } from "react";
+import { useNavigate } from "react-router-dom";
+import axios from "axios";
+import { useOrganization } from "../context/OrganizationContext";
+import { Check, ChevronRight } from "lucide-react";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
+
+const CreateWorkspaceWizard = () => {
+  const { currentOrg } = useOrganization();
+  const navigate = useNavigate();
+
+  const [step, setStep] = useState(1);
+  const [loading, setLoading] = useState(false);
+
+  // Step 1 Data
+  const [name, setName] = useState("");
+  const [description, setDescription] = useState("");
+  const [repositoryOption, setRepositoryOption] = useState("CREATE_NEW");
+
+  // Step 2 Data: CREATE_NEW
+  const [repoName, setRepoName] = useState("");
+  const [repoDesc, setRepoDesc] = useState("");
+  const [isPrivate, setIsPrivate] = useState(true);
+
+  // Step 2 Data: CONNECT_EXISTING
+  const [githubRepos, setGithubRepos] = useState([]);
+  const [selectedRepoId, setSelectedRepoId] = useState("");
+
+  // Fetch GitHub repos automatically when they reach Step 2
+  useEffect(() => {
+    if (
+      step === 2 &&
+      repositoryOption === "CONNECT_EXISTING" &&
+      githubRepos.length === 0
+    ) {
+      fetchGithubRepos();
+    }
+  }, [step, repositoryOption]);
+
+  const fetchGithubRepos = async () => {
+    try {
+      const res = await axios.get(
+        "http://localhost:5000/api/github/repositories",
+        { withCredentials: true },
+      );
+      if (res.data.success) setGithubRepos(res.data.data);
+    } catch (error) {
+      console.error("Failed to fetch github repos", error);
+    }
+  };
+
+  const handleNext = () => {
+    if (step === 1 && !name) return alert("Workspace Name is required!");
+    if (step === 2 && repositoryOption === "CREATE_NEW" && !repoName)
+      return alert("Repository name is required!");
+    if (
+      step === 2 &&
+      repositoryOption === "CONNECT_EXISTING" &&
+      !selectedRepoId
+    )
+      return alert("Please select a repository!");
+    setStep(step + 1);
+  };
+
+  const handleSubmit = async () => {
+    setLoading(true);
+    try {
+      let payload = { name, description, repositoryOption };
+
+      if (repositoryOption === "CREATE_NEW") {
+        payload.repositoryName = repoName;
+        payload.repositoryDescription = repoDesc;
+        payload.isPrivate = isPrivate;
+      } else {
+        payload.existingRepo = githubRepos.find(
+          (r) => r.id.toString() === selectedRepoId.toString(),
+        );
+      }
+
+      // Hit our shiny new transaction API!
+      const res = await axios.post(
+        `http://localhost:5000/api/organizations/${currentOrg.id}/workspaces`,
+        payload,
+        { withCredentials: true },
+      );
+
+      if (res.data.success) {
+        // Redirect them to the new Workspace Details page (we will build this next)
+        navigate(
+          `/organizations/${currentOrg.id}/workspaces/${res.data.data.id}`,
+        );
+      }
+    } catch (error) {
+      alert(error.response?.data?.message || "Failed to create workspace");
+      setLoading(false);
+    }
+  };
+
+  const renderStep1 = () => (
+    <div className="space-y-4 animate-in fade-in">
+      <h2 className="text-2xl font-bold mb-4">Workspace Details</h2>
+      <div>
+        <label className="block text-sm text-slate-400 mb-2">
+          Workspace Name
+        </label>
+        <input
+          type="text"
+          className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-blue-500"
+          value={name}
+          onChange={(e) => setName(e.target.value)}
+          placeholder="e.g. Developer Collaboration Platform"
+        />
+      </div>
+      <div>
+        <label className="block text-sm text-slate-400 mb-2">
+          Description (Optional)
+        </label>
+        <textarea
+          className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-blue-500 h-24"
+          value={description}
+          onChange={(e) => setDescription(e.target.value)}
+        />
+      </div>
+    </div>
+  );
+
+  const renderStep2 = () => (
+    <div className="space-y-6 animate-in fade-in">
+      <h2 className="text-2xl font-bold mb-4">GitHub Repository</h2>
+
+      <div className="flex gap-4 mb-6">
+        <label
+          className={`flex-1 p-4 rounded-xl border cursor-pointer transition-colors ${repositoryOption === "CREATE_NEW" ? "border-blue-500 bg-blue-500/10" : "border-slate-700 bg-[#0f111a] hover:border-slate-500"}`}
+        >
+          <input
+            type="radio"
+            className="hidden"
+            checked={repositoryOption === "CREATE_NEW"}
+            onChange={() => setRepositoryOption("CREATE_NEW")}
+          />
+          <div className="font-bold mb-1">Create New Repository</div>
+          <div className="text-sm text-slate-400">
+            Initialize a brand new repository directly on GitHub
+          </div>
+        </label>
+        <label
+          className={`flex-1 p-4 rounded-xl border cursor-pointer transition-colors ${repositoryOption === "CONNECT_EXISTING" ? "border-blue-500 bg-blue-500/10" : "border-slate-700 bg-[#0f111a] hover:border-slate-500"}`}
+        >
+          <input
+            type="radio"
+            className="hidden"
+            checked={repositoryOption === "CONNECT_EXISTING"}
+            onChange={() => setRepositoryOption("CONNECT_EXISTING")}
+          />
+          <div className="font-bold mb-1">Connect Existing</div>
+          <div className="text-sm text-slate-400">
+            Link an existing GitHub repository to this workspace
+          </div>
+        </label>
+      </div>
+
+      {repositoryOption === "CREATE_NEW" ? (
+        <div className="space-y-4 animate-in slide-in-from-right-4">
+          <div>
+            <label className="block text-sm text-slate-400 mb-2">
+              Repository Name
+            </label>
+            <input
+              type="text"
+              className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-blue-500"
+              value={repoName}
+              onChange={(e) => setRepoName(e.target.value.replace(/\s+/g, "-"))}
+              placeholder="e.g. devhub-backend"
+            />
+          </div>
+          <div>
+            <label className="block text-sm text-slate-400 mb-2">
+              Description
+            </label>
+            <input
+              type="text"
+              className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-blue-500"
+              value={repoDesc}
+              onChange={(e) => setRepoDesc(e.target.value)}
+            />
+          </div>
+          <div>
+            <label className="block text-sm text-slate-400 mb-2">
+              Visibility
+            </label>
+            <select
+              className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none"
+              value={isPrivate}
+              onChange={(e) => setIsPrivate(e.target.value === "true")}
+            >
+              <option value={true}>
+                Private (Only you and members can see it)
+              </option>
+              <option value={false}>
+                Public (Anyone on the internet can see it)
+              </option>
+            </select>
+          </div>
+        </div>
+      ) : (
+        <div className="space-y-4 animate-in slide-in-from-right-4">
+          <label className="block text-sm text-slate-400 mb-2">
+            Select Repository
+          </label>
+          {githubRepos.length === 0 ? (
+            <div className="text-sm text-slate-400 p-4 bg-[#0f111a] rounded-lg border border-slate-700">
+              Fetching your repositories from GitHub...
+            </div>
+          ) : (
+            <select
+              className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-blue-500"
+              value={selectedRepoId}
+              onChange={(e) => setSelectedRepoId(e.target.value)}
+            >
+              <option value="">-- Choose a repository --</option>
+              {githubRepos.map((repo) => (
+                <option key={repo.id} value={repo.id}>
+                  {repo.fullName}
+                </option>
+              ))}
+            </select>
+          )}
+        </div>
+      )}
+    </div>
+  );
+
+  const renderStep3 = () => (
+    <div className="space-y-6 animate-in fade-in">
+      <h2 className="text-2xl font-bold mb-4">Review & Create</h2>
+      <div className="bg-[#0f111a] border border-slate-700 rounded-xl p-6 space-y-6">
+        <div>
+          <h3 className="text-sm text-slate-400 uppercase font-semibold mb-1">
+            Workspace
+          </h3>
+          <p className="text-xl font-bold">{name}</p>
+        </div>
+        <div className="pt-4 border-t border-slate-700">
+          <h3 className="text-sm text-slate-400 uppercase font-semibold mb-1">
+            Repository
+          </h3>
+          <p className="text-lg font-bold flex items-center gap-2">
+            {repositoryOption === "CREATE_NEW"
+              ? `Create New: ${repoName}`
+              : `Connect Existing: ${githubRepos.find((r) => r.id.toString() === selectedRepoId.toString())?.name}`}
+          </p>
+        </div>
+        <div className="pt-4 border-t border-slate-700">
+          <h3 className="text-sm text-slate-400 uppercase font-semibold mb-1">
+            Parent Organization
+          </h3>
+          <p className="font-medium text-slate-300">{currentOrg?.name}</p>
+        </div>
+      </div>
+    </div>
+  );
+
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 md:p-8 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        <div className="text-white max-w-3xl mx-auto mt-6">
+          <div className="mb-8 flex items-center gap-4">
+            <button
+              onClick={() => navigate("/workspaces")}
+              className="text-slate-500 hover:text-white transition-colors text-xl"
+            >
+              ←
+            </button>
+            <h1 className="text-3xl font-bold">Create Workspace</h1>
+          </div>
+
+          <div className="flex items-center justify-between mb-8 relative px-4">
+            <div className="absolute top-1/2 left-4 right-4 h-1 bg-slate-700 -z-10 -translate-y-1/2 rounded-full"></div>
+            {[1, 2, 3].map((num) => (
+              <div
+                key={num}
+                className={`w-10 h-10 rounded-full flex items-center justify-center font-bold border-4 border-[#0f111a] transition-colors ${step >= num ? "bg-blue-600 text-white" : "bg-slate-800 text-slate-500"}`}
+              >
+                {step > num ? <Check size={16} /> : num}
+              </div>
+            ))}
+          </div>
+
+          <div className="bg-[#1c1f2e] p-8 rounded-xl border border-[#ffffff]/10 mb-6 min-h-[400px] shadow-lg">
+            {step === 1 && renderStep1()}
+            {step === 2 && renderStep2()}
+            {step === 3 && renderStep3()}
+          </div>
+
+          <div className="flex justify-between">
+            <button
+              onClick={() => setStep(step - 1)}
+              disabled={step === 1 || loading}
+              className={`px-6 py-2 rounded-lg font-bold transition-colors ${step === 1 ? "opacity-0 cursor-default" : "bg-slate-800 hover:bg-slate-700 text-white cursor-pointer shadow-md"}`}
+            >
+              Back
+            </button>
+
+            {step < 3 ? (
+              <button
+                onClick={handleNext}
+                className="bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-6 rounded-lg transition-colors flex items-center gap-2 cursor-pointer shadow-md"
+              >
+                Next <ChevronRight size={18} />
+              </button>
+            ) : (
+              <button
+                onClick={handleSubmit}
+                disabled={loading}
+                className="bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-8 rounded-lg transition-colors flex items-center gap-2 cursor-pointer shadow-md"
+              >
+                {loading ? "Creating..." : "Create Workspace"}
+              </button>
+            )}
+          </div>
+        </div>
+      </main>
+    </div>
+  );
+};
+
+export default CreateWorkspaceWizard;
diff --git a/client/src/pages/OrganizationDashboard.jsx b/client/src/pages/OrganizationDashboard.jsx
new file mode 100644
index 0000000..48749a8
--- /dev/null
+++ b/client/src/pages/OrganizationDashboard.jsx
@@ -0,0 +1,194 @@
+import React, { useState, useEffect } from "react";
+import { useOrganization } from "../context/OrganizationContext";
+import axios from "axios";
+import { Users, Settings, Building, Plus, FolderGit2 } from "lucide-react";
+import { useNavigate } from "react-router-dom";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
+
+const OrganizationDashboard = () => {
+  const { organizations, currentOrg, fetchOrganizations, loading, switchOrganization } = useOrganization();
+  const [newOrgName, setNewOrgName] = useState("");
+  const [newOrgDesc, setNewOrgDesc] = useState("");
+  const [creating, setCreating] = useState(false);
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    fetchOrganizations();
+  }, []);
+
+
+
+  const handleCreateOrg = async (e) => {
+    e.preventDefault();
+    try {
+      setCreating(true);
+      await axios.post(
+        "http://localhost:5000/api/organizations",
+        {
+          name: newOrgName,
+          description: newOrgDesc,
+        },
+        { withCredentials: true },
+      );
+      await fetchOrganizations(); // Refresh the Context so the Sidebar dropdown updates immediately!
+      setNewOrgName("");
+      setNewOrgDesc("");
+    } catch (err) {
+      alert("Failed to create organization");
+    } finally {
+      setCreating(false);
+    }
+  };
+
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+
+  if (loading)
+    return <div className="min-h-screen bg-[#0f111a] p-8 text-white flex items-center justify-center">Loading Organization...</div>;
+
+  // View 1: User has no organization yet. Show them the creation form.
+  if (!currentOrg) {
+    return (
+      <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+        <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+        <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
+          <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+          <div className="text-white max-w-xl mx-auto mt-16">
+            <div className="flex justify-between items-center mb-4">
+              <h2 className="text-3xl font-bold">Welcome to DevHub!</h2>
+            </div>
+            <p className="text-slate-400 mb-8">
+              You aren't part of any organizations yet. Create one to get started.
+            </p>
+
+            <form
+              onSubmit={handleCreateOrg}
+              className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 shadow-lg"
+            >
+              <div className="mb-4">
+                <label className="block text-sm text-slate-400 mb-2">
+                  Organization Name
+                </label>
+                <input
+                  required
+                  type="text"
+                  className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-blue-500"
+                  value={newOrgName}
+                  onChange={(e) => setNewOrgName(e.target.value)}
+                  placeholder="e.g. ABC Technologies"
+                />
+              </div>
+              <div className="mb-6">
+                <label className="block text-sm text-slate-400 mb-2">
+                  Description
+                </label>
+                <textarea
+                  className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-blue-500 h-24"
+                  value={newOrgDesc}
+                  onChange={(e) => setNewOrgDesc(e.target.value)}
+                  placeholder="What does your organization do?"
+                />
+              </div>
+              <button
+                type="submit"
+                disabled={creating}
+                className="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-4 rounded-lg flex items-center justify-center gap-2 transition-colors cursor-pointer"
+              >
+                <Plus size={20} />
+                {creating ? "Creating..." : "Create Organization"}
+              </button>
+            </form>
+          </div>
+        </main>
+      </div>
+    );
+  }
+
+  // View 2: User has an organization selected!
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 md:p-8 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        <div className="text-white max-w-5xl mx-auto mt-10">
+          <div className="flex items-center gap-4 mb-8 pb-6 border-b border-[#ffffff]/10 relative">
+            <div className="flex w-full items-start justify-between">
+              <div className="flex items-center gap-4">
+                <div className="h-16 w-16 bg-blue-600/20 text-blue-500 rounded-2xl flex items-center justify-center">
+                  <Building size={32} />
+                </div>
+                <div>
+                  <h1 className="text-3xl font-bold">{currentOrg.name}</h1>
+                  <p className="text-slate-400 mt-1">
+                    {currentOrg.description || "No description provided."}
+                  </p>
+                </div>
+              </div>
+              
+              <div className="flex flex-col items-end gap-3 mt-1">
+                <span className="px-4 py-2 bg-slate-800 text-slate-300 rounded-full text-sm font-semibold border border-slate-700 uppercase">
+                  Role: {currentOrg.myRole}
+                </span>
+                
+                {organizations.length > 1 && (
+                  <select
+                    className="bg-[#1c1f2e] text-white text-sm font-semibold rounded-lg p-2 outline-none border border-slate-700 hover:border-slate-500 transition-colors cursor-pointer w-48 shadow-md"
+                    value={currentOrg?.id || ""}
+                    onChange={(e) => switchOrganization(e.target.value)}
+                  >
+                    {organizations.map((org) => (
+                      <option key={org.id} value={org.id}>
+                        Switch to: {org.name}
+                      </option>
+                    ))}
+                  </select>
+                )}
+              </div>
+            </div>
+          </div>
+
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+            <div
+              onClick={() => navigate(`/workspaces`)}
+              className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 hover:border-blue-500/50 transition-colors cursor-pointer group shadow-lg"
+            >
+              <div className="h-12 w-12 bg-blue-500/20 text-blue-400 rounded-xl flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
+                <FolderGit2 size={24} />
+              </div>
+              <h3 className="text-xl font-bold mb-2">Workspaces</h3>
+              <p className="text-slate-400">
+                View, create, and manage development workspaces for this organization.
+              </p>
+            </div>
+            <div
+              onClick={() => navigate(`/organizations/${currentOrg.id}/members`)}
+              className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 hover:border-blue-500/50 transition-colors cursor-pointer group shadow-lg"
+            >
+              <div className="h-12 w-12 bg-purple-500/20 text-purple-400 rounded-xl flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
+                <Users size={24} />
+              </div>
+              <h3 className="text-xl font-bold mb-2">Members & Invitations</h3>
+              <p className="text-slate-400">
+                Manage organization members, invite new users, and update roles.
+              </p>
+            </div>
+
+            {["OWNER", "ADMIN"].includes(currentOrg.myRole) && (
+              <div className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 hover:border-blue-500/50 transition-colors cursor-pointer group shadow-lg">
+                <div className="h-12 w-12 bg-orange-500/20 text-orange-400 rounded-xl flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
+                  <Settings size={24} />
+                </div>
+                <h3 className="text-xl font-bold mb-2">Settings</h3>
+                <p className="text-slate-400">
+                  Update organization details and transfer ownership safely.
+                </p>
+              </div>
+            )}
+          </div>
+        </div>
+      </main>
+    </div>
+  );
+};
+
+export default OrganizationDashboard;
diff --git a/client/src/pages/OrganizationMembers.jsx b/client/src/pages/OrganizationMembers.jsx
new file mode 100644
index 0000000..6932e10
--- /dev/null
+++ b/client/src/pages/OrganizationMembers.jsx
@@ -0,0 +1,272 @@
+import React, { useState, useEffect } from "react";
+import { useParams, useNavigate } from "react-router-dom";
+import axios from "axios";
+import { useOrganization } from "../context/OrganizationContext";
+import { Search, UserPlus, Trash2 } from "lucide-react";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
+
+const OrganizationMembers = () => {
+  const { orgId } = useParams();
+  const { currentOrg } = useOrganization();
+  const navigate = useNavigate();
+
+  const [members, setMembers] = useState([]);
+  const [loading, setLoading] = useState(true);
+
+  // Invitation State
+  const [searchQuery, setSearchQuery] = useState("");
+  const [searchResults, setSearchResults] = useState([]);
+  const [inviting, setInviting] = useState(false);
+
+  useEffect(() => {
+    fetchMembers();
+  }, [orgId]);
+
+  const fetchMembers = async () => {
+    try {
+      const res = await axios.get(
+        `http://localhost:5000/api/organizations/${orgId}/members`,
+        { withCredentials: true },
+      );
+      if (res.data.success) {
+        setMembers(res.data.data);
+      }
+    } catch (error) {
+      console.error("Failed to fetch members");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleSearchUsers = async (e) => {
+    e.preventDefault();
+    try {
+      const res = await axios.get(
+        `http://localhost:5000/api/invitations/org/${orgId}/search?search=${searchQuery}`,
+        { withCredentials: true },
+      );
+      setSearchResults(res.data.data);
+    } catch (error) {
+      alert("Failed to search users. Type at least 3 letters.");
+    }
+  };
+
+  const handleInviteUser = async (userId) => {
+    try {
+      setInviting(true);
+      await axios.post(
+        `http://localhost:5000/api/invitations/org/${orgId}`,
+        { userId },
+        { withCredentials: true },
+      );
+      alert("Invitation sent successfully!");
+      setSearchResults(searchResults.filter((u) => u.id !== userId)); // Remove them from search results
+    } catch (error) {
+      alert(error.response?.data?.message || "Failed to invite user");
+    } finally {
+      setInviting(false);
+    }
+  };
+
+  const handleRoleChange = async (memberId, newRole) => {
+    try {
+      await axios.patch(
+        `http://localhost:5000/api/organizations/${orgId}/members/${memberId}/role`,
+        { newRole },
+        { withCredentials: true },
+      );
+      fetchMembers(); // Refresh the table
+    } catch (error) {
+      alert(error.response?.data?.message || "Failed to change role");
+    }
+  };
+
+  const handleRemoveMember = async (memberId) => {
+    if (!window.confirm("Are you sure you want to remove this member?")) return;
+    try {
+      await axios.delete(
+        `http://localhost:5000/api/organizations/${orgId}/members/${memberId}`,
+        { withCredentials: true },
+      );
+      fetchMembers(); // Refresh the table
+    } catch (error) {
+      alert(error.response?.data?.message || "Failed to remove member");
+    }
+  };
+
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+
+  if (loading) return <div className="p-8 text-white flex h-screen items-center justify-center">Loading members...</div>;
+
+  // The UI automatically hides privileged actions if they aren't an OWNER or ADMIN
+  const isAdminOrOwner = ["OWNER", "ADMIN"].includes(currentOrg?.myRole);
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 md:p-8 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        <div className="text-white max-w-6xl mx-auto mt-6">
+          <div className="flex items-center justify-between mb-8">
+            <div>
+              <h1 className="text-3xl font-bold flex items-center gap-3">
+                <button
+                  onClick={() => navigate("/organization")}
+                  className="text-slate-500 hover:text-white transition-colors"
+                >
+                  ←
+                </button>
+                Organization Members
+              </h1>
+              <p className="text-slate-400 mt-1">
+                Manage the people in {currentOrg?.name}
+              </p>
+            </div>
+          </div>
+
+          {isAdminOrOwner && (
+            <div className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 mb-8 shadow-lg">
+              <h2 className="text-xl font-bold mb-4 flex items-center gap-2">
+                <UserPlus size={20} /> Invite New Members
+              </h2>
+              <form onSubmit={handleSearchUsers} className="flex gap-4 mb-4">
+                <input
+                  type="text"
+                  placeholder="Search DevHub users by username or email..."
+                  className="flex-1 bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-blue-500"
+                  value={searchQuery}
+                  onChange={(e) => setSearchQuery(e.target.value)}
+                />
+                <button
+                  type="submit"
+                  className="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-6 rounded-lg transition-colors flex items-center gap-2 cursor-pointer shadow-md"
+                >
+                  <Search size={18} /> Search
+                </button>
+              </form>
+
+              {searchResults.length > 0 && (
+                <div className="bg-[#0f111a] border border-slate-700 rounded-lg overflow-hidden">
+                  {searchResults.map((user) => (
+                    <div
+                      key={user.id}
+                      className="flex items-center justify-between p-4 border-b border-slate-700 last:border-0 hover:bg-[#1c1f2e]"
+                    >
+                      <div className="flex items-center gap-3">
+                        <img
+                          src={
+                            user.avatar ||
+                            `https://ui-avatars.com/api/?name=${user.username}`
+                          }
+                          alt="Avatar"
+                          className="w-10 h-10 rounded-full"
+                        />
+                        <div>
+                          <p className="font-bold">{user.username}</p>
+                          <p className="text-sm text-slate-400">{user.email}</p>
+                        </div>
+                      </div>
+                      <button
+                        onClick={() => handleInviteUser(user.id)}
+                        disabled={inviting}
+                        className="bg-slate-800 hover:bg-blue-600 text-white py-1 px-4 rounded-full text-sm font-semibold transition-colors cursor-pointer"
+                      >
+                        Invite
+                      </button>
+                    </div>
+                  ))}
+                </div>
+              )}
+            </div>
+          )}
+
+          <div className="bg-[#1c1f2e] rounded-xl border border-[#ffffff]/10 overflow-hidden shadow-lg">
+            <table className="w-full text-left border-collapse">
+              <thead>
+                <tr className="bg-[#0f111a] text-slate-400 text-sm border-b border-[#ffffff]/10">
+                  <th className="p-4 font-semibold">Member</th>
+                  <th className="p-4 font-semibold">Role</th>
+                  <th className="p-4 font-semibold">Joined Date</th>
+                  {isAdminOrOwner && (
+                    <th className="p-4 font-semibold text-right">Actions</th>
+                  )}
+                </tr>
+              </thead>
+              <tbody>
+                {members.map((member) => (
+                  <tr
+                    key={member.id}
+                    className="border-b border-[#ffffff]/10 last:border-0 hover:bg-[#252a3e] transition-colors"
+                  >
+                    <td className="p-4 flex items-center gap-3">
+                      <img
+                        src={
+                          member.user.avatar ||
+                          `https://ui-avatars.com/api/?name=${member.user.username}`
+                        }
+                        alt="Avatar"
+                        className="w-10 h-10 rounded-full"
+                      />
+                      <div>
+                        <p className="font-bold">{member.user.username}</p>
+                        <p className="text-sm text-slate-400">
+                          {member.user.email}
+                        </p>
+                      </div>
+                    </td>
+                    <td className="p-4">
+                      {isAdminOrOwner && member.role !== "OWNER" ? (
+                        <select
+                          className="bg-[#0f111a] text-sm text-white font-semibold rounded p-1 border border-slate-700 outline-none cursor-pointer"
+                          value={member.role}
+                          onChange={(e) =>
+                            handleRoleChange(member.id, e.target.value)
+                          }
+                        >
+                          <option value="ADMIN">Admin</option>
+                          <option value="MANAGER">Manager</option>
+                          <option value="MEMBER">Member</option>
+                        </select>
+                      ) : (
+                        <span
+                          className={`px-3 py-1 rounded-full text-xs font-bold ${
+                            member.role === "OWNER"
+                              ? "bg-orange-500/20 text-orange-400"
+                              : member.role === "ADMIN"
+                                ? "bg-purple-500/20 text-purple-400"
+                                : "bg-slate-700 text-slate-300"
+                          }`}
+                        >
+                          {member.role}
+                        </span>
+                      )}
+                    </td>
+                    <td className="p-4 text-slate-400 text-sm">
+                      {new Date(member.joinedAt).toLocaleDateString()}
+                    </td>
+                    {isAdminOrOwner && (
+                      <td className="p-4 text-right">
+                        {member.role !== "OWNER" && (
+                          <button
+                            onClick={() => handleRemoveMember(member.id)}
+                            className="p-2 text-slate-400 hover:text-red-500 hover:bg-red-500/10 rounded-lg transition-colors cursor-pointer"
+                            title="Remove Member"
+                          >
+                            <Trash2 size={18} />
+                          </button>
+                        )}
+                      </td>
+                    )}
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </main>
+    </div>
+  );
+};
+
+export default OrganizationMembers;
diff --git a/client/src/pages/Projects.jsx b/client/src/pages/Projects.jsx
new file mode 100644
index 0000000..8683746
--- /dev/null
+++ b/client/src/pages/Projects.jsx
@@ -0,0 +1,187 @@
+import React, { useState, useEffect } from "react";
+import { useParams, useNavigate } from "react-router-dom";
+import axios from "axios";
+import { Folder, Plus, Calendar, Settings } from "lucide-react";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
+
+const Projects = () => {
+  const { orgId, workspaceId } = useParams();
+  const navigate = useNavigate();
+  const [projects, setProjects] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+  const [showCreateModal, setShowCreateModal] = useState(false);
+  
+  // Create form state
+  const [newProject, setNewProject] = useState({ name: "", description: "", status: "ACTIVE" });
+
+  useEffect(() => {
+    fetchProjects();
+  }, [workspaceId]);
+
+  const fetchProjects = async () => {
+    try {
+      const res = await axios.get(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/projects`,
+        { withCredentials: true }
+      );
+      if (res.data.success) {
+        setProjects(res.data.data);
+      }
+    } catch (error) {
+      console.error("Failed to fetch projects");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleCreateProject = async (e) => {
+    e.preventDefault();
+    try {
+      await axios.post(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/projects`,
+        newProject,
+        { withCredentials: true }
+      );
+      setShowCreateModal(false);
+      setNewProject({ name: "", description: "", status: "ACTIVE" });
+      fetchProjects();
+    } catch (err) {
+      console.error("Failed to create project");
+    }
+  };
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        
+        <div className="max-w-7xl mx-auto mt-6">
+          <div className="flex items-center justify-between mb-8 pb-6 border-b border-[#ffffff]/10">
+            <div>
+              <h1 className="text-3xl font-bold flex items-center gap-3 text-white">
+                <Folder size={32} className="text-violet-500" /> Projects
+              </h1>
+              <p className="text-slate-400 mt-1">
+                Manage all projects within this workspace
+              </p>
+            </div>
+            <button
+              onClick={() => setShowCreateModal(true)}
+              className="bg-violet-600 hover:bg-violet-700 text-white font-bold py-2 px-4 rounded-lg flex items-center gap-2 transition-colors cursor-pointer"
+            >
+              <Plus size={20} /> New Project
+            </button>
+          </div>
+
+          {loading ? (
+            <div className="text-white text-center py-10">Loading projects...</div>
+          ) : projects.length === 0 ? (
+            <div className="text-center py-20 bg-[#1c1f2e] rounded-xl border border-[#ffffff]/10">
+              <Folder size={48} className="mx-auto text-slate-500 mb-4" />
+              <h2 className="text-xl font-bold mb-2 text-white">No Projects Found</h2>
+              <p className="text-slate-400 mb-6">Create a project to start tracking your work.</p>
+              <button
+                onClick={() => setShowCreateModal(true)}
+                className="bg-violet-600 hover:bg-violet-700 text-white font-bold py-2 px-6 rounded-lg transition-colors inline-flex items-center gap-2 cursor-pointer"
+              >
+                <Plus size={20} /> Create Your First Project
+              </button>
+            </div>
+          ) : (
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+              {projects.map((project) => (
+                <div
+                  key={project.id}
+                  className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 hover:border-violet-500/50 transition-colors group flex flex-col h-full"
+                >
+                  <div className="flex items-start justify-between mb-4">
+                    <div className="h-12 w-12 bg-violet-500/20 text-violet-400 rounded-xl flex items-center justify-center group-hover:scale-110 transition-transform shrink-0">
+                      <Folder size={24} />
+                    </div>
+                    <span
+                      className={`text-xs font-bold px-2 py-1 rounded-full ${
+                        project.status === "ACTIVE" 
+                          ? "bg-green-500/20 text-green-400" 
+                          : project.status === "COMPLETED" 
+                          ? "bg-blue-500/20 text-blue-400"
+                          : "bg-slate-700 text-slate-300"
+                      }`}
+                    >
+                      {project.status}
+                    </span>
+                  </div>
+                  <h3 className="text-xl font-bold mb-2 line-clamp-1 text-white">
+                    {project.name}
+                  </h3>
+                  <p className="text-slate-400 text-sm line-clamp-2 mb-4 flex-grow">
+                    {project.description || "No description provided."}
+                  </p>
+
+                  <div className="pt-4 border-t border-[#ffffff]/10 flex items-center justify-between text-sm text-slate-400 mt-auto">
+                    <div className="flex items-center gap-2">
+                      <Calendar size={16} />
+                      <span>
+                        {new Date(project.createdAt).toLocaleDateString()}
+                      </span>
+                    </div>
+                  </div>
+                </div>
+              ))}
+            </div>
+          )}
+        </div>
+
+        {/* Create Modal */}
+        {showCreateModal && (
+          <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4">
+            <div className="w-full max-w-md bg-[#1c1f2e] rounded-2xl shadow-xl border border-slate-700 p-6 relative">
+              <h2 className="text-2xl font-bold text-white mb-6">Create New Project</h2>
+              <form onSubmit={handleCreateProject}>
+                <div className="mb-4">
+                  <label className="block text-sm font-medium text-slate-300 mb-2">Project Name</label>
+                  <input
+                    required
+                    type="text"
+                    value={newProject.name}
+                    onChange={(e) => setNewProject({...newProject, name: e.target.value})}
+                    className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500 focus:ring-1 focus:ring-violet-500"
+                    placeholder="e.g. Website Redesign"
+                  />
+                </div>
+                <div className="mb-6">
+                  <label className="block text-sm font-medium text-slate-300 mb-2">Description</label>
+                  <textarea
+                    value={newProject.description}
+                    onChange={(e) => setNewProject({...newProject, description: e.target.value})}
+                    className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500 focus:ring-1 focus:ring-violet-500 min-h-[100px]"
+                    placeholder="What is this project about?"
+                  />
+                </div>
+                <div className="flex justify-end gap-3">
+                  <button
+                    type="button"
+                    onClick={() => setShowCreateModal(false)}
+                    className="px-4 py-2 rounded-lg text-slate-300 hover:bg-slate-800 transition-colors cursor-pointer"
+                  >
+                    Cancel
+                  </button>
+                  <button
+                    type="submit"
+                    className="bg-violet-600 hover:bg-violet-700 text-white font-semibold py-2 px-6 rounded-lg transition-colors cursor-pointer"
+                  >
+                    Create Project
+                  </button>
+                </div>
+              </form>
+            </div>
+          </div>
+        )}
+      </main>
+    </div>
+  );
+};
+
+export default Projects;
diff --git a/client/src/pages/Sprints.jsx b/client/src/pages/Sprints.jsx
new file mode 100644
index 0000000..d97d1be
--- /dev/null
+++ b/client/src/pages/Sprints.jsx
@@ -0,0 +1,251 @@
+import React, { useState, useEffect } from "react";
+import { useParams, useNavigate } from "react-router-dom";
+import axios from "axios";
+import { Play, Plus, CheckCircle, Clock } from "lucide-react";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
+
+const Sprints = () => {
+  const { orgId, workspaceId } = useParams();
+  const navigate = useNavigate();
+  const [sprints, setSprints] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+  const [showCreateModal, setShowCreateModal] = useState(false);
+  
+  // Create form state
+  const [newSprint, setNewSprint] = useState({ name: "", goal: "", startDate: "", endDate: "" });
+
+  useEffect(() => {
+    fetchSprints();
+  }, [workspaceId]);
+
+  const fetchSprints = async () => {
+    try {
+      const res = await axios.get(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/sprints`,
+        { withCredentials: true }
+      );
+      if (res.data.success) {
+        setSprints(res.data.data);
+      }
+    } catch (error) {
+      console.error("Failed to fetch sprints");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleCreateSprint = async (e) => {
+    e.preventDefault();
+    try {
+      await axios.post(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/sprints`,
+        newSprint,
+        { withCredentials: true }
+      );
+      setShowCreateModal(false);
+      setNewSprint({ name: "", goal: "", startDate: "", endDate: "" });
+      fetchSprints();
+    } catch (err) {
+      console.error("Failed to create sprint");
+    }
+  };
+
+  const handleStartSprint = async (sprintId) => {
+    try {
+      await axios.post(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/sprints/${sprintId}/start`,
+        {},
+        { withCredentials: true }
+      );
+      fetchSprints();
+    } catch (err) {
+      alert("Cannot start this sprint. Make sure no other sprint is currently active.");
+    }
+  };
+
+  const handleCompleteSprint = async (sprintId) => {
+    try {
+      await axios.post(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/sprints/${sprintId}/complete`,
+        {},
+        { withCredentials: true }
+      );
+      fetchSprints();
+    } catch (err) {
+      alert("Failed to complete sprint.");
+    }
+  };
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        
+        <div className="max-w-7xl mx-auto mt-6">
+          <div className="flex items-center justify-between mb-8 pb-6 border-b border-[#ffffff]/10">
+            <div>
+              <h1 className="text-3xl font-bold flex items-center gap-3 text-white">
+                <Play size={32} className="text-violet-500" /> Sprints
+              </h1>
+              <p className="text-slate-400 mt-1">
+                Plan and manage agile sprints
+              </p>
+            </div>
+            <button
+              onClick={() => setShowCreateModal(true)}
+              className="bg-violet-600 hover:bg-violet-700 text-white font-bold py-2 px-4 rounded-lg flex items-center gap-2 transition-colors cursor-pointer"
+            >
+              <Plus size={20} /> New Sprint
+            </button>
+          </div>
+
+          {loading ? (
+            <div className="text-white text-center py-10">Loading sprints...</div>
+          ) : sprints.length === 0 ? (
+            <div className="text-center py-20 bg-[#1c1f2e] rounded-xl border border-[#ffffff]/10">
+              <Play size={48} className="mx-auto text-slate-500 mb-4" />
+              <h2 className="text-xl font-bold mb-2 text-white">No Sprints Found</h2>
+              <p className="text-slate-400 mb-6">Create a sprint to group your tasks into timeboxes.</p>
+              <button
+                onClick={() => setShowCreateModal(true)}
+                className="bg-violet-600 hover:bg-violet-700 text-white font-bold py-2 px-6 rounded-lg transition-colors inline-flex items-center gap-2 cursor-pointer"
+              >
+                <Plus size={20} /> Create Your First Sprint
+              </button>
+            </div>
+          ) : (
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+              {sprints.map((sprint) => (
+                <div
+                  key={sprint.id}
+                  className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 hover:border-violet-500/50 transition-colors group flex flex-col h-full"
+                >
+                  <div className="flex items-start justify-between mb-4">
+                    <div className="h-12 w-12 bg-violet-500/20 text-violet-400 rounded-xl flex items-center justify-center group-hover:scale-110 transition-transform shrink-0">
+                      <Clock size={24} />
+                    </div>
+                    <span
+                      className={`text-xs font-bold px-2 py-1 rounded-full ${
+                        sprint.status === "ACTIVE" 
+                          ? "bg-green-500/20 text-green-400" 
+                          : sprint.status === "COMPLETED" 
+                          ? "bg-blue-500/20 text-blue-400"
+                          : "bg-slate-700 text-slate-300"
+                      }`}
+                    >
+                      {sprint.status}
+                    </span>
+                  </div>
+                  <h3 className="text-xl font-bold mb-2 line-clamp-1 text-white">
+                    {sprint.name}
+                  </h3>
+                  <p className="text-slate-400 text-sm line-clamp-2 mb-4 flex-grow">
+                    {sprint.goal || "No goal specified."}
+                  </p>
+
+                  <div className="pt-4 border-t border-[#ffffff]/10 flex flex-col text-sm text-slate-400 mt-auto gap-3">
+                    <div className="flex items-center justify-between">
+                      <span>Start: {new Date(sprint.startDate).toLocaleDateString()}</span>
+                      <span>End: {new Date(sprint.endDate).toLocaleDateString()}</span>
+                    </div>
+
+                    {sprint.status === "PLANNED" && (
+                      <button
+                        onClick={() => handleStartSprint(sprint.id)}
+                        className="w-full bg-green-600/20 text-green-400 hover:bg-green-600 hover:text-white font-semibold py-2 px-4 rounded-lg flex items-center justify-center gap-2 transition-colors cursor-pointer"
+                      >
+                        <Play size={16} /> Start Sprint
+                      </button>
+                    )}
+
+                    {sprint.status === "ACTIVE" && (
+                      <button
+                        onClick={() => handleCompleteSprint(sprint.id)}
+                        className="w-full bg-blue-600/20 text-blue-400 hover:bg-blue-600 hover:text-white font-semibold py-2 px-4 rounded-lg flex items-center justify-center gap-2 transition-colors cursor-pointer"
+                      >
+                        <CheckCircle size={16} /> Complete Sprint
+                      </button>
+                    )}
+                  </div>
+                </div>
+              ))}
+            </div>
+          )}
+        </div>
+
+        {/* Create Modal */}
+        {showCreateModal && (
+          <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4">
+            <div className="w-full max-w-md bg-[#1c1f2e] rounded-2xl shadow-xl border border-slate-700 p-6 relative">
+              <h2 className="text-2xl font-bold text-white mb-6">Create New Sprint</h2>
+              <form onSubmit={handleCreateSprint}>
+                <div className="mb-4">
+                  <label className="block text-sm font-medium text-slate-300 mb-2">Sprint Name</label>
+                  <input
+                    required
+                    type="text"
+                    value={newSprint.name}
+                    onChange={(e) => setNewSprint({...newSprint, name: e.target.value})}
+                    className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500 focus:ring-1 focus:ring-violet-500"
+                    placeholder="e.g. Sprint 1"
+                  />
+                </div>
+                <div className="mb-4">
+                  <label className="block text-sm font-medium text-slate-300 mb-2">Sprint Goal</label>
+                  <textarea
+                    value={newSprint.goal}
+                    onChange={(e) => setNewSprint({...newSprint, goal: e.target.value})}
+                    className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500 focus:ring-1 focus:ring-violet-500 min-h-[80px]"
+                    placeholder="What is the main objective?"
+                  />
+                </div>
+                <div className="grid grid-cols-2 gap-4 mb-6">
+                  <div>
+                    <label className="block text-sm font-medium text-slate-300 mb-2">Start Date</label>
+                    <input
+                      required
+                      type="date"
+                      value={newSprint.startDate}
+                      onChange={(e) => setNewSprint({...newSprint, startDate: e.target.value})}
+                      className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500 focus:ring-1 focus:ring-violet-500"
+                    />
+                  </div>
+                  <div>
+                    <label className="block text-sm font-medium text-slate-300 mb-2">End Date</label>
+                    <input
+                      required
+                      type="date"
+                      value={newSprint.endDate}
+                      onChange={(e) => setNewSprint({...newSprint, endDate: e.target.value})}
+                      className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500 focus:ring-1 focus:ring-violet-500"
+                    />
+                  </div>
+                </div>
+                <div className="flex justify-end gap-3">
+                  <button
+                    type="button"
+                    onClick={() => setShowCreateModal(false)}
+                    className="px-4 py-2 rounded-lg text-slate-300 hover:bg-slate-800 transition-colors cursor-pointer"
+                  >
+                    Cancel
+                  </button>
+                  <button
+                    type="submit"
+                    className="bg-violet-600 hover:bg-violet-700 text-white font-semibold py-2 px-6 rounded-lg transition-colors cursor-pointer"
+                  >
+                    Create Sprint
+                  </button>
+                </div>
+              </form>
+            </div>
+          </div>
+        )}
+      </main>
+    </div>
+  );
+};
+
+export default Sprints;
diff --git a/client/src/pages/TasksKanban.jsx b/client/src/pages/TasksKanban.jsx
new file mode 100644
index 0000000..6a776ca
--- /dev/null
+++ b/client/src/pages/TasksKanban.jsx
@@ -0,0 +1,270 @@
+import React, { useState, useEffect } from "react";
+import { useParams, useNavigate } from "react-router-dom";
+import axios from "axios";
+import { ListTodo, Plus, GripVertical, AlertCircle, CheckCircle2 } from "lucide-react";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
+
+const COLUMNS = [
+  { id: "TODO", title: "To Do", color: "border-slate-500" },
+  { id: "IN_PROGRESS", title: "In Progress", color: "border-blue-500" },
+  { id: "REVIEW", title: "In Review", color: "border-purple-500" },
+  { id: "DONE", title: "Done", color: "border-green-500" },
+];
+
+const TasksKanban = () => {
+  const { orgId, workspaceId } = useParams();
+  const navigate = useNavigate();
+  const [tasks, setTasks] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+  
+  // Create task modal
+  const [showCreateModal, setShowCreateModal] = useState(false);
+  const [newTask, setNewTask] = useState({ title: "", description: "", type: "FEATURE", priority: "MEDIUM" });
+
+  useEffect(() => {
+    fetchTasks();
+  }, [workspaceId]);
+
+  const fetchTasks = async () => {
+    try {
+      const res = await axios.get(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/tasks`,
+        { withCredentials: true }
+      );
+      if (res.data.success) {
+        setTasks(res.data.data);
+      }
+    } catch (error) {
+      console.error("Failed to fetch tasks");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleCreateTask = async (e) => {
+    e.preventDefault();
+    try {
+      await axios.post(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/tasks`,
+        newTask,
+        { withCredentials: true }
+      );
+      setShowCreateModal(false);
+      setNewTask({ title: "", description: "", type: "FEATURE", priority: "MEDIUM" });
+      fetchTasks();
+    } catch (err) {
+      console.error("Failed to create task");
+    }
+  };
+
+  const handleDragStart = (e, taskId) => {
+    e.dataTransfer.setData("taskId", taskId);
+  };
+
+  const handleDrop = async (e, newStatus) => {
+    e.preventDefault();
+    const taskId = parseInt(e.dataTransfer.getData("taskId"));
+    
+    // Optimistic UI update
+    setTasks(tasks.map(t => t.id === taskId ? { ...t, status: newStatus } : t));
+    
+    try {
+      await axios.patch(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/tasks/${taskId}`,
+        { status: newStatus },
+        { withCredentials: true }
+      );
+    } catch (err) {
+      console.error("Failed to update task status");
+      fetchTasks(); // Revert on failure
+    }
+  };
+
+  const handleDragOver = (e) => {
+    e.preventDefault();
+  };
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        
+        <div className="max-w-[1600px] mx-auto mt-6 h-[calc(100vh-140px)] flex flex-col">
+          <div className="flex items-center justify-between mb-6 shrink-0">
+            <div>
+              <h1 className="text-3xl font-bold flex items-center gap-3 text-white">
+                <ListTodo size={32} className="text-violet-500" /> Kanban Board
+              </h1>
+              <p className="text-slate-400 mt-1">
+                Drag and drop tasks to update their status
+              </p>
+            </div>
+            <button
+              onClick={() => setShowCreateModal(true)}
+              className="bg-violet-600 hover:bg-violet-700 text-white font-bold py-2 px-4 rounded-lg flex items-center gap-2 transition-colors cursor-pointer"
+            >
+              <Plus size={20} /> Add Task
+            </button>
+          </div>
+
+          {loading ? (
+            <div className="text-white text-center py-10">Loading board...</div>
+          ) : (
+            <div className="flex gap-6 overflow-x-auto pb-4 flex-1">
+              {COLUMNS.map(column => {
+                const columnTasks = tasks.filter(t => t.status === column.id);
+                return (
+                  <div 
+                    key={column.id}
+                    className="flex-shrink-0 w-80 bg-[#1c1f2e]/80 rounded-xl border border-slate-800 flex flex-col overflow-hidden"
+                    onDrop={(e) => handleDrop(e, column.id)}
+                    onDragOver={handleDragOver}
+                  >
+                    <div className={`p-4 border-t-4 ${column.color} bg-[#111827] border-b border-slate-800 flex justify-between items-center shrink-0`}>
+                      <h3 className="font-bold text-slate-200">{column.title}</h3>
+                      <span className="bg-slate-800 text-slate-400 text-xs px-2 py-1 rounded-full font-medium">
+                        {columnTasks.length}
+                      </span>
+                    </div>
+                    
+                    <div className="p-3 flex-1 overflow-y-auto space-y-3 min-h-[150px]">
+                      {columnTasks.map(task => (
+                        <div
+                          key={task.id}
+                          draggable
+                          onDragStart={(e) => handleDragStart(e, task.id)}
+                          className="bg-[#242938] p-4 rounded-lg border border-slate-700 hover:border-violet-500/50 cursor-grab active:cursor-grabbing shadow-sm"
+                        >
+                          <div className="flex justify-between items-start mb-2">
+                            <span className="text-xs font-semibold text-slate-400">
+                              {task.key || `TASK-${task.id}`}
+                            </span>
+                            <span className={`text-[10px] font-bold px-2 py-0.5 rounded-sm uppercase tracking-wider ${
+                              task.priority === "HIGH" ? "bg-red-500/20 text-red-400" :
+                              task.priority === "LOW" ? "bg-blue-500/20 text-blue-400" :
+                              "bg-yellow-500/20 text-yellow-400"
+                            }`}>
+                              {task.priority}
+                            </span>
+                          </div>
+                          
+                          <h4 className="text-sm font-semibold text-white mb-2 leading-tight">
+                            {task.title}
+                          </h4>
+                          
+                          {task.description && (
+                            <p className="text-xs text-slate-400 line-clamp-2 mb-3">
+                              {task.description}
+                            </p>
+                          )}
+                          
+                          <div className="flex justify-between items-center mt-3 pt-3 border-t border-slate-700/50">
+                            <div className="flex items-center gap-1.5 text-xs font-medium text-slate-400">
+                              {task.type === "BUG" ? <AlertCircle size={14} className="text-red-400" /> : <CheckCircle2 size={14} className="text-blue-400" />}
+                              {task.type}
+                            </div>
+                            
+                            {task.assignee && (
+                              <div className="w-6 h-6 rounded-full bg-violet-600 flex items-center justify-center text-[10px] font-bold text-white border border-slate-800" title={task.assignee.username}>
+                                {task.assignee.username.charAt(0).toUpperCase()}
+                              </div>
+                            )}
+                          </div>
+                        </div>
+                      ))}
+                      
+                      {columnTasks.length === 0 && (
+                        <div className="h-full w-full flex items-center justify-center border-2 border-dashed border-slate-800 rounded-lg text-sm text-slate-500 font-medium p-4 text-center">
+                          Drop tasks here
+                        </div>
+                      )}
+                    </div>
+                  </div>
+                )
+              })}
+            </div>
+          )}
+        </div>
+
+        {/* Create Task Modal */}
+        {showCreateModal && (
+          <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4">
+            <div className="w-full max-w-md bg-[#1c1f2e] rounded-2xl shadow-xl border border-slate-700 p-6 relative">
+              <h2 className="text-2xl font-bold text-white mb-6">Create New Task</h2>
+              <form onSubmit={handleCreateTask}>
+                <div className="mb-4">
+                  <label className="block text-sm font-medium text-slate-300 mb-2">Title</label>
+                  <input
+                    required
+                    type="text"
+                    value={newTask.title}
+                    onChange={(e) => setNewTask({...newTask, title: e.target.value})}
+                    className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500 focus:ring-1 focus:ring-violet-500"
+                    placeholder="e.g. Update login page UI"
+                  />
+                </div>
+                <div className="mb-4">
+                  <label className="block text-sm font-medium text-slate-300 mb-2">Description</label>
+                  <textarea
+                    value={newTask.description}
+                    onChange={(e) => setNewTask({...newTask, description: e.target.value})}
+                    className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500 focus:ring-1 focus:ring-violet-500 min-h-[80px]"
+                    placeholder="Provide context..."
+                  />
+                </div>
+                
+                <div className="grid grid-cols-2 gap-4 mb-6">
+                  <div>
+                    <label className="block text-sm font-medium text-slate-300 mb-2">Type</label>
+                    <select
+                      value={newTask.type}
+                      onChange={(e) => setNewTask({...newTask, type: e.target.value})}
+                      className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500"
+                    >
+                      <option value="FEATURE">Feature</option>
+                      <option value="BUG">Bug</option>
+                      <option value="CHORE">Chore</option>
+                    </select>
+                  </div>
+                  <div>
+                    <label className="block text-sm font-medium text-slate-300 mb-2">Priority</label>
+                    <select
+                      value={newTask.priority}
+                      onChange={(e) => setNewTask({...newTask, priority: e.target.value})}
+                      className="w-full bg-[#0f111a] border border-slate-700 rounded-lg p-3 text-white outline-none focus:border-violet-500"
+                    >
+                      <option value="LOW">Low</option>
+                      <option value="MEDIUM">Medium</option>
+                      <option value="HIGH">High</option>
+                    </select>
+                  </div>
+                </div>
+                
+                <div className="flex justify-end gap-3">
+                  <button
+                    type="button"
+                    onClick={() => setShowCreateModal(false)}
+                    className="px-4 py-2 rounded-lg text-slate-300 hover:bg-slate-800 transition-colors cursor-pointer"
+                  >
+                    Cancel
+                  </button>
+                  <button
+                    type="submit"
+                    className="bg-violet-600 hover:bg-violet-700 text-white font-semibold py-2 px-6 rounded-lg transition-colors cursor-pointer"
+                  >
+                    Create Task
+                  </button>
+                </div>
+              </form>
+            </div>
+          </div>
+        )}
+      </main>
+    </div>
+  );
+};
+
+export default TasksKanban;
diff --git a/client/src/pages/WorkspaceDashboard.jsx b/client/src/pages/WorkspaceDashboard.jsx
new file mode 100644
index 0000000..0c61d69
--- /dev/null
+++ b/client/src/pages/WorkspaceDashboard.jsx
@@ -0,0 +1,77 @@
+import React, { useState, useEffect } from 'react';
+import axios from 'axios';
+import { useParams } from 'react-router-dom';
+import Sidebar from "../components/layout/Sidebar.jsx";
+import Navbar from "../components/layout/Navbar.jsx";
+import StatsGrid from '../components/layout/KPIs/StatsGrid.jsx';
+import MiddleSection from '../components/layout/MiddleSection/MiddleSection.jsx';
+import LowerMiddleSection from '../components/layout/LowerMiddleSection/LowerMiddleSection.jsx';
+import RepositoryHealth from '../components/layout/RepositoryHealthSection/RepositoryHealth.jsx';
+import RightSideBar from '../components/layout/RightSideSection/RightSideBar.jsx';
+
+const WorkspaceDashboard = () => {
+  const { orgId, workspaceId } = useParams();
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+  const [dashboardData, setDashboardData] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState("");
+
+  useEffect(() => {
+    const fetchDashboard = async () => {
+      try {
+        setLoading(true);
+        const res = await axios.get(
+          `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}/dashboard`,
+          { withCredentials: true }
+        );
+        setDashboardData(res.data.data);
+      } catch (err) {
+        setError("Failed to load workspace dashboard");
+      } finally {
+        setLoading(false);
+      }
+    };
+    if (orgId && workspaceId) fetchDashboard();
+  }, [orgId, workspaceId]);
+
+  const userStr = localStorage.getItem("user");
+  const user = userStr ? JSON.parse(userStr) : null;
+
+  if (loading) return <div className="text-white p-8 flex justify-center mt-20">Loading workspace dashboard...</div>;
+  if (error) return <div className="text-red-400 p-8 flex justify-center mt-20">{error}</div>;
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} user={user} />
+
+      <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+
+        <div className="mt-4">
+          <StatsGrid kpis={dashboardData?.kpis} />
+        </div>
+
+        <div className="mt-4 flex flex-col xl:flex-row gap-4 items-start">
+          <div className="flex-1 flex flex-col gap-4 min-w-0 w-full">
+            <MiddleSection 
+               currentSprint={dashboardData?.currentSprint} 
+               projectOverview={dashboardData?.projectOverview} 
+            />
+            <LowerMiddleSection 
+               recentActivity={dashboardData?.recentActivity} 
+               orgId={orgId} 
+               workspaceId={workspaceId} 
+            />
+            <RepositoryHealth orgId={orgId} workspaceId={workspaceId} />
+          </div>
+
+          <aside className="w-full xl:w-[320px] flex-shrink-0 sticky top-4">
+            <RightSideBar />
+          </aside>
+        </div>
+      </main>
+    </div>
+  );
+};
+
+export default WorkspaceDashboard;
\ No newline at end of file
diff --git a/client/src/pages/WorkspaceDetails.jsx b/client/src/pages/WorkspaceDetails.jsx
new file mode 100644
index 0000000..2850347
--- /dev/null
+++ b/client/src/pages/WorkspaceDetails.jsx
@@ -0,0 +1,164 @@
+import React, { useState, useEffect } from "react";
+import { useParams, useNavigate } from "react-router-dom";
+import axios from "axios";
+import { useOrganization } from "../context/OrganizationContext";
+import {
+  FolderGit2,
+  Users,
+  Settings,
+  GitBranch,
+  ExternalLink,
+} from "lucide-react";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
+
+const WorkspaceDetails = () => {
+  const { orgId, workspaceId } = useParams();
+  const { currentOrg } = useOrganization();
+  const navigate = useNavigate();
+
+  const [workspace, setWorkspace] = useState(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    fetchWorkspace();
+  }, [workspaceId]);
+
+  const fetchWorkspace = async () => {
+    try {
+      const res = await axios.get(
+        `http://localhost:5000/api/organizations/${orgId}/workspaces/${workspaceId}`,
+        { withCredentials: true },
+      );
+      if (res.data.success) {
+        setWorkspace(res.data.data);
+      }
+    } catch (error) {
+      console.error("Failed to fetch workspace");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+
+  if (loading)
+    return <div className="p-8 text-white flex h-screen items-center justify-center">Loading Workspace...</div>;
+  if (!workspace)
+    return <div className="p-8 text-white">Workspace not found.</div>;
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 md:p-8 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        <div className="text-white max-w-5xl mx-auto mt-6">
+          <div className="mb-8">
+            <button
+              onClick={() => navigate("/workspaces")}
+              className="text-slate-500 hover:text-white transition-colors text-xl mb-4"
+            >
+              ← Back to Workspaces
+            </button>
+            <div className="flex items-center gap-4 pb-6 border-b border-[#ffffff]/10">
+              <div className="h-16 w-16 bg-blue-600/20 text-blue-500 rounded-2xl flex items-center justify-center shrink-0">
+                <FolderGit2 size={32} />
+              </div>
+              <div>
+                <div className="flex items-center gap-3">
+                  <h1 className="text-3xl font-bold">{workspace.name}</h1>
+                  <span
+                    className={`px-3 py-1 rounded-full text-xs font-bold ${workspace.status === "ACTIVE" ? "bg-green-500/20 text-green-400" : "bg-slate-700 text-slate-300"}`}
+                  >
+                    {workspace.status}
+                  </span>
+                </div>
+                <p className="text-slate-400 mt-1">
+                  {workspace.description || "No description provided."}
+                </p>
+              </div>
+            </div>
+          </div>
+
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
+            <div
+              onClick={() =>
+                navigate(
+                  `/organizations/${orgId}/workspaces/${workspaceId}/members`,
+                )
+              }
+              className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 hover:border-blue-500/50 transition-colors cursor-pointer group shadow-lg"
+            >
+              <div className="h-12 w-12 bg-purple-500/20 text-purple-400 rounded-xl flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
+                <Users size={24} />
+              </div>
+              <h3 className="text-xl font-bold mb-2">Workspace Members</h3>
+              <p className="text-slate-400">
+                Add organization members to this workspace and manage their access
+                roles.
+              </p>
+            </div>
+
+            <div className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 opacity-75 cursor-not-allowed group relative overflow-hidden shadow-lg">
+              <div className="absolute top-0 right-0 bg-orange-500/20 text-orange-400 text-xs font-bold px-3 py-1 rounded-bl-lg">
+                Coming Soon
+              </div>
+              <div className="h-12 w-12 bg-orange-500/20 text-orange-400 rounded-xl flex items-center justify-center mb-4">
+                <Settings size={24} />
+              </div>
+              <h3 className="text-xl font-bold mb-2">Workspace Settings</h3>
+              <p className="text-slate-400">
+                Archive this workspace or update its configuration.
+              </p>
+            </div>
+          </div>
+
+          <div className="bg-[#1c1f2e] rounded-xl border border-[#ffffff]/10 overflow-hidden shadow-lg">
+            <div className="p-6 border-b border-[#ffffff]/10 flex items-center gap-3">
+              <GitBranch size={24} className="text-slate-400" />
+              <h2 className="text-xl font-bold">Connected Repository</h2>
+            </div>
+
+            {workspace.repository ? (
+              <div className="p-6 grid grid-cols-2 gap-6">
+                <div>
+                  <p className="text-sm text-slate-400 mb-1">Repository Name</p>
+                  <p className="font-bold text-lg">
+                    {workspace.repository.fullName}
+                  </p>
+                </div>
+                <div>
+                  <p className="text-sm text-slate-400 mb-1">Visibility</p>
+                  <p className="font-medium capitalize">
+                    {workspace.repository.visibility}
+                  </p>
+                </div>
+                <div>
+                  <p className="text-sm text-slate-400 mb-1">Default Branch</p>
+                  <p className="font-medium inline-block bg-slate-800 px-2 rounded text-blue-300">
+                    {workspace.repository.defaultBranch}
+                  </p>
+                </div>
+                <div>
+                  <p className="text-sm text-slate-400 mb-1">GitHub Link</p>
+                  <a
+                    href={workspace.repository.htmlUrl}
+                    target="_blank"
+                    rel="noreferrer"
+                    className="text-blue-500 hover:text-blue-400 flex items-center gap-1 transition-colors w-fit"
+                  >
+                    Open in GitHub <ExternalLink size={14} />
+                  </a>
+                </div>
+              </div>
+            ) : (
+              <div className="p-6 text-slate-400">No repository connected.</div>
+            )}
+          </div>
+        </div>
+      </main>
+    </div>
+  );
+};
+
+export default WorkspaceDetails;
diff --git a/client/src/pages/Workspaces.jsx b/client/src/pages/Workspaces.jsx
new file mode 100644
index 0000000..b597cc9
--- /dev/null
+++ b/client/src/pages/Workspaces.jsx
@@ -0,0 +1,144 @@
+import React, { useState, useEffect } from "react";
+import { useNavigate } from "react-router-dom";
+import axios from "axios";
+import { useOrganization } from "../context/OrganizationContext";
+import { FolderGit2, Plus, GitBranch } from "lucide-react";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
+
+const Workspaces = () => {
+  const { currentOrg } = useOrganization();
+  const navigate = useNavigate();
+  const [workspaces, setWorkspaces] = useState([]);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    if (currentOrg) fetchWorkspaces();
+  }, [currentOrg]);
+
+  const fetchWorkspaces = async () => {
+    try {
+      const res = await axios.get(
+        `http://localhost:5000/api/organizations/${currentOrg.id}/workspaces`,
+        { withCredentials: true },
+      );
+      if (res.data.success) {
+        setWorkspaces(res.data.data);
+      }
+    } catch (error) {
+      console.error("Failed to fetch workspaces");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+
+  if (!currentOrg)
+    return (
+      <div className="p-8 text-white">Please select an organization first.</div>
+    );
+  if (loading)
+    return <div className="min-h-screen bg-[#0f111a] p-8 text-white flex items-center justify-center">Loading workspaces...</div>;
+
+  // Organization members cannot create workspaces. Managers, Admins, and Owners can.
+  const canCreate = ["OWNER", "ADMIN", "MANAGER"].includes(currentOrg.myRole);
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 md:p-8 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        <div className="text-white max-w-6xl mx-auto mt-6">
+          <div className="flex items-center justify-between mb-8 pb-6 border-b border-[#ffffff]/10">
+            <div>
+              <h1 className="text-3xl font-bold flex items-center gap-3">
+                <FolderGit2 size={32} className="text-blue-500" /> Workspaces
+              </h1>
+              <p className="text-slate-400 mt-1">
+                Manage development environments for {currentOrg.name}
+              </p>
+            </div>
+            {canCreate && (
+              <button
+                onClick={() =>
+                  navigate(`/organizations/${currentOrg.id}/workspaces/create`)
+                }
+                className="bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-lg flex items-center gap-2 transition-colors cursor-pointer shadow-lg"
+              >
+                <Plus size={20} /> Create Workspace
+              </button>
+            )}
+          </div>
+
+          {workspaces.length === 0 ? (
+            <div className="text-center py-20 bg-[#1c1f2e] rounded-xl border border-[#ffffff]/10 shadow-lg">
+              <FolderGit2 size={48} className="mx-auto text-slate-500 mb-4" />
+              <h2 className="text-xl font-bold mb-2">No Workspaces Found</h2>
+              <p className="text-slate-400 mb-6">
+                Create a workspace to connect a GitHub repository and start
+                collaborating.
+              </p>
+              {canCreate && (
+                <button
+                  onClick={() =>
+                    navigate(`/organizations/${currentOrg.id}/workspaces/create`)
+                  }
+                  className="bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-6 rounded-lg transition-colors inline-flex items-center gap-2 cursor-pointer shadow-md"
+                >
+                  <Plus size={20} /> Create Your First Workspace
+                </button>
+              )}
+            </div>
+          ) : (
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+              {workspaces.map((workspace) => (
+                <div
+                  key={workspace.id}
+                  onClick={() =>
+                    navigate(
+                      `/organizations/${currentOrg.id}/workspaces/${workspace.id}/dashboard`,
+                    )
+                  }
+                  className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 hover:border-blue-500/50 transition-colors cursor-pointer group flex flex-col h-full shadow-lg"
+                >
+                  <div className="flex items-start justify-between mb-4">
+                    <div className="h-12 w-12 bg-blue-500/20 text-blue-400 rounded-xl flex items-center justify-center group-hover:scale-110 transition-transform shrink-0">
+                      <FolderGit2 size={24} />
+                    </div>
+                    <span
+                      className={`text-xs font-bold px-2 py-1 rounded-full ${workspace.status === "ACTIVE" ? "bg-green-500/20 text-green-400" : "bg-slate-700 text-slate-300"}`}
+                    >
+                      {workspace.status}
+                    </span>
+                  </div>
+                  <h3 className="text-xl font-bold mb-2 line-clamp-1">
+                    {workspace.name}
+                  </h3>
+                  <p className="text-slate-400 text-sm line-clamp-2 mb-4 flex-grow">
+                    {workspace.description || "No description provided."}
+                  </p>
+
+                  <div className="pt-4 border-t border-[#ffffff]/10 flex items-center justify-between text-sm text-slate-400 mt-auto">
+                    <div className="flex items-center gap-2">
+                      <GitBranch size={16} />
+                      <span
+                        className="truncate w-32"
+                        title={workspace.repository?.name}
+                      >
+                        {workspace.repository?.name || "No Repo"}
+                      </span>
+                    </div>
+                    <div>{workspace._count.members} Members</div>
+                  </div>
+                </div>
+              ))}
+            </div>
+          )}
+        </div>
+      </main>
+    </div>
+  );
+};
+
+export default Workspaces;
diff --git a/client/src/pages/completeProfile.jsx b/client/src/pages/completeProfile.jsx
index 5e65abf..a2af2d1 100644
--- a/client/src/pages/completeProfile.jsx
+++ b/client/src/pages/completeProfile.jsx
@@ -2,34 +2,41 @@
 
 import { useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { User, ArrowRight } from "lucide-react";
+import { User, ArrowRight, Briefcase } from "lucide-react";
 import { completeProfile } from "../services/googleAuthService.js";
 import { useNavigationLoading } from "../context/NavigationLoadingContext";
 
 function CompleteProfile() {
-  const [username, setUsername] = useState("");
-  const [role, setRole] = useState("");
+  const [formData, setFormData] = useState({
+    username: "",
+    jobTitle: "",
+  });
   const [error, setError] = useState("");
   const [isLoading, setIsLoading] = useState(false);
 
   const { goTo } = useNavigationLoading();
 
+  const handleChange = (e) => {
+    const { id, value } = e.target;
+    setFormData((prev) => ({ ...prev, [id]: value }));
+  };
+
   const handleSubmit = async (event) => {
     event.preventDefault();
     setError("");
 
-    if (username.trim().length < 3) {
+    if (formData.username.trim().length < 3) {
       setError("Username must be at least 3 characters.");
       return;
     }
 
-    if (username.includes(" ")) {
+    if (formData.username.includes(" ")) {
       setError("Username cannot contain spaces.");
       return;
     }
 
-    if (!role) {
-      setError("Please select a role.");
+    if (!formData.jobTitle) {
+      setError("Please select a job title.");
       return;
     }
 
@@ -37,14 +44,14 @@ function CompleteProfile() {
       setIsLoading(true);
 
       const result = await completeProfile({
-        username,
-        role,
+        username: formData.username,
+        jobTitle: formData.jobTitle,
       });
 
       // Updates the frontend login state used by ProtectedRoute.
       localStorage.setItem("user", JSON.stringify(result.user));
 
-      goTo("/dashboard", { replace: true });
+      goTo("/organization", { replace: true });
     } catch (err) {
       setError(
         err.response?.data?.message ||
@@ -90,8 +97,8 @@ function CompleteProfile() {
               <input
                 id="username"
                 type="text"
-                value={username}
-                onChange={(event) => setUsername(event.target.value)}
+                value={formData.username}
+                onChange={handleChange}
                 placeholder="Choose a username"
                 minLength={3}
                 required
@@ -100,28 +107,35 @@ function CompleteProfile() {
             </div>
           </div>
 
-          <div className="mb-7">
-            <label
-              htmlFor="role"
-              className="mb-1.5 block text-sm font-semibold text-slate-700"
-            >
-              Role
-            </label>
-
-            <select
-              id="role"
-              value={role}
-              onChange={(event) => setRole(event.target.value)}
-              required
-              className="w-full cursor-pointer rounded-xl border border-slate-300 bg-white px-3.5 py-3 text-sm text-slate-700 outline-none focus:border-violet-500 focus:ring-2 focus:ring-violet-300 sm:text-base"
-            >
-              <option value="">Select your role</option>
-              <option value="project_manager">Project Manager</option>
-              <option value="developer">Developer</option>
-              <option value="frontend_developer">Frontend Developer</option>
-              <option value="backend_developer">Backend Developer</option>
-              <option value="fullstack_developer">Full Stack Developer</option>
-            </select>
+          {/* Job Title Select */}
+          <div className="grid grid-cols-1 sm:grid-cols-1 gap-4 mb-4">
+            <div>
+              <label
+                htmlFor="jobTitle"
+                className="block text-sm font-semibold text-slate-700 mb-1.5"
+              >
+                Job Title
+              </label>
+              <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-3 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                <Briefcase size={18} className="text-violet-500 shrink-0" />
+                <select
+                  id="jobTitle"
+                  value={formData.jobTitle}
+                  onChange={handleChange}
+                  className="ml-3 w-full bg-transparent outline-none placeholder:text-slate-400 text-sm sm:text-base cursor-pointer"
+                  required
+                >
+                  <option value="" disabled>
+                    Select your job title
+                  </option>
+                  <option value="project_manager">Project Manager</option>
+                  <option value="developer">Developer</option>
+                  <option value="frontend_developer">Frontend Developer</option>
+                  <option value="backend_developer">Backend Developer</option>
+                  <option value="fullstack_developer">Fullstack Developer</option>
+                </select>
+              </div>
+            </div>
           </div>
 
           <button
diff --git a/client/src/pages/dashboard.jsx b/client/src/pages/dashboard.jsx
deleted file mode 100644
index fb02cf7..0000000
--- a/client/src/pages/dashboard.jsx
+++ /dev/null
@@ -1,84 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import axios from 'axios';
-import Sidebar from "../components/layout/Sidebar.jsx";
-import Navbar from "../components/layout/Navbar.jsx";
-import StatsGrid from '../components/layout/KPIs/StatsGrid.jsx';
-import MiddleSection from '../components/layout/MiddleSection/MiddleSection.jsx';
-import LowerMiddleSection from '../components/layout/LowerMiddleSection/LowerMiddleSection.jsx';
-import RepositoryHealth from '../components/layout/RepositoryHealthSection/RepositoryHealth.jsx';
-import RightSideBar from '../components/layout/RightSideSection/RightSideBar.jsx';
-
-const Dashboard = () => {
-  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
-  const [githubData, setGithubData] = useState(null);
-
-  // Fetch GitHub data on component mount
-  useEffect(() => {
-    const fetchGithubData = async () => {
-      try {
-        const response = await axios.get('http://localhost:5000/api/auth/github/profile', {
-          withCredentials: true // IMPORTANT: This ensures the cookies are sent to the backend
-        });
-        
-        if (response.data.success) {
-          setGithubData(response.data.data);
-        }
-      } catch (error) {
-        console.log("No GitHub account linked or token expired.");
-      }
-    };
-
-    fetchGithubData();
-  }, []);
-
-  return (
-    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
-      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
-
-      <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
-        {/* Pass githubData to Navbar to conditionally show/hide the connect icon */}
-        <Navbar 
-          toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} 
-          githubData={githubData} 
-        />
-
-        {/* GitHub Data Display Section */}
-        {githubData && (
-          <div className="mt-4 bg-[#1e293b]/80 p-6 rounded-xl border border-slate-700 text-white shadow-sm">
-            <h2 className="text-[18px] font-semibold tracking-tight text-slate-100 mb-4">GitHub Profile Connected</h2>
-            <div className="flex items-center gap-6">
-              <img src={githubData.avatar_url} alt="GitHub Avatar" className="w-16 h-16 rounded-full border-2 border-slate-600" />
-              <div>
-                <p className="font-semibold text-lg">{githubData.name || githubData.login}</p>
-                <p className="text-slate-400 text-sm mb-2">{githubData.bio}</p>
-                <div className="flex gap-6 mt-1 text-sm text-slate-400">
-                  <span>Public Repos: <span className="font-medium text-slate-200">{githubData.public_repos}</span></span>
-                  <span>Followers: <span className="font-medium text-slate-200">{githubData.followers}</span></span>
-                  <span>Following: <span className="font-medium text-slate-200">{githubData.following}</span></span>
-                </div>
-              </div>
-            </div>
-          </div>
-        )}
-
-        <div className="mt-4">
-          <StatsGrid />
-        </div>
-
-        <div className="mt-4 flex flex-col xl:flex-row gap-4 items-start">
-          <div className="flex-1 flex flex-col gap-4 min-w-0 w-full">
-            <MiddleSection />
-            <LowerMiddleSection />
-            <RepositoryHealth />
-          </div>
-
-          <aside className="w-full xl:w-[320px] flex-shrink-0 sticky top-4">
-            <RightSideBar />
-          </aside>
-        </div>
-      </main>
-    </div>
-  );
-}
-
-export default Dashboard;
\ No newline at end of file
diff --git a/client/src/pages/githubCallback.jsx b/client/src/pages/githubCallback.jsx
index 63cb700..6970d78 100644
--- a/client/src/pages/githubCallback.jsx
+++ b/client/src/pages/githubCallback.jsx
@@ -17,7 +17,7 @@ function GithubCallback() {
         localStorage.setItem("user", JSON.stringify(result.user));
 
         if (result.user.profileCompleted) {
-          navigate("/dashboard", { replace: true });
+          navigate("/organization", { replace: true });
         } else {
           navigate("/complete-profile", { replace: true });
         }
diff --git a/client/src/pages/login.jsx b/client/src/pages/login.jsx
index b05c3e4..12e295d 100644
--- a/client/src/pages/login.jsx
+++ b/client/src/pages/login.jsx
@@ -52,7 +52,7 @@ function Login() {
 
         localStorage.setItem("user", JSON.stringify(response.data.data));
 
-        goTo("/dashboard", { replace: true });;
+        goTo("/organization", { replace: true });;
       }
 
     } catch (err) {
@@ -85,7 +85,7 @@ function Login() {
 
     // A completed Google user logs in directly to the dashboard.
     if (result.profileCompleted) {
-      goTo("/dashboard", { replace: true });;
+      goTo("/organization", { replace: true });;
       return;
     }
 
diff --git a/client/src/pages/signup.jsx b/client/src/pages/signup.jsx
index be8f986..72ff6e8 100644
--- a/client/src/pages/signup.jsx
+++ b/client/src/pages/signup.jsx
@@ -1,7 +1,7 @@
 // signup.jsx
 
 import { Link } from "react-router-dom";
-import { Mail, Lock, User, ArrowRight } from "lucide-react";
+import { Mail, Lock, User, ArrowRight, UserRoundCheck } from "lucide-react";
 import googleIcon from "../assets/google.svg";
 import githubIcon from "../assets/github.svg";
 import eyeOn from "../assets/eyeOn.svg";
@@ -18,7 +18,7 @@ function Signup() {
   const [ConfirmPassword,setConfirmPassword] = useState(false);
   const [formData, setFormData] = useState({
     username: "",
-    roleSelect: "",
+    jobTitleSelect: "",
     email: "",
     password: "",
     confirmPassword: "",
@@ -44,24 +44,23 @@ function Signup() {
        return setError("Password must be at least 8 chars, with 1 number and 1 special char.");
      if (formData.password !== formData.confirmPassword)
        return setError("Passwords do not match!");
-     if (!formData.roleSelect) 
-      return setError("Please select a role.");
+     if (!formData.jobTitleSelect) {
+      return setError("Please select a job title.");
+     }
 
 
     try{
       setIsLoading(true);
-      const response = await fetch("http://localhost:5000/api/auth/register",
-        {
-          method: "POST",
-          headers: {"Content-Type": "application/json"},
-          body: JSON.stringify({
-            username: formData.username,
-            role: formData.roleSelect,
-            email: formData.email,
-            password: formData.password,
-          }),
-        }
-      );
+      const response = await fetch("http://localhost:5000/api/auth/register", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          username: formData.username,
+          jobTitle: formData.jobTitleSelect,
+          email: formData.email,
+          password: formData.password,
+        }),
+      });
 
       const data = await response.json();
 
@@ -116,7 +115,7 @@ function Signup() {
               Join the developer community today.
             </p>
             {error && <p className="text-red-500 text-sm mb-4">{error}</p>}
-            {/* Username & Role */}
+            {/* Username & Job Title */}
             <div className="grid grid-cols-1 sm:grid-cols-2 gap-4 mb-4">
               <div>
                 <label
@@ -142,29 +141,28 @@ function Signup() {
 
               <div>
                 <label
-                  htmlFor="roleSelect"
+                  htmlFor="jobTitleSelect"
                   className="block text-sm font-semibold text-slate-700 mb-1.5"
                 >
-                  Role
+                  Job Title
                 </label>
-                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-2.5 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                <div className="flex items-center bg-white border border-slate-300 rounded-xl px-3.5 py-3 hover:border-violet-300 focus-within:border-violet-500 focus-within:ring-2 focus-within:ring-violet-300 transition-all duration-200">
+                  <UserRoundCheck size={18} className="text-violet-500 shrink-0" />
                   <select
-                    id="roleSelect"
-                    required
-                    value={formData.roleSelect}
+                    id="jobTitleSelect"
+                    value={formData.jobTitleSelect || ""}
                     onChange={handleChange}
-                    className="w-full appearance-none bg-transparent outline-none text-slate-700 cursor-pointer text-sm sm:text-base"
+                    className="ml-3 w-full bg-transparent outline-none text-slate-700 text-sm sm:text-base cursor-pointer appearance-none"
+                    required
                   >
-                    <option value="">Select your role</option>
+                    <option value="" disabled className="text-slate-400">
+                      Select your role
+                    </option>
                     <option value="project_manager">Project Manager</option>
                     <option value="developer">Developer</option>
-                    <option value="frontend_developer">
-                      Frontend Developer
-                    </option>
+                    <option value="frontend_developer">Frontend Developer</option>
                     <option value="backend_developer">Backend Developer</option>
-                    <option value="fullstack_developer">
-                      Full Stack Developer
-                    </option>
+                    <option value="fullstack_developer">Full Stack Developer</option>
                   </select>
                 </div>
               </div>
@@ -318,7 +316,7 @@ function Signup() {
                 onSuccess={async (credentialResponse) => {
                   try {
                     const result = await googleLogin(
-                      credentialResponse.credential
+                      credentialResponse.credential,
                     );
 
                     localStorage.setItem(
@@ -326,15 +324,14 @@ function Signup() {
                       JSON.stringify({
                         ...result.user,
                         profileCompleted: result.profileCompleted,
-                      })
+                      }),
                     );
 
                     if (result.profileCompleted) {
-                      goTo("/dashboard", { replace: true });
+                      goTo("/organization", { replace: true });
                     } else {
                       goTo("/complete-profile", { replace: true });
                     }
-
                   } catch (error) {
                     console.error(error);
                   }
diff --git a/client/src/services/googleAuthService.js b/client/src/services/googleAuthService.js
index 0a31c60..c8f119b 100644
--- a/client/src/services/googleAuthService.js
+++ b/client/src/services/googleAuthService.js
@@ -16,12 +16,12 @@ export const googleLogin = async (credential) => {
   return response.data;
 };
 
-export const completeProfile = async ({ username, role }) => {
+export const completeProfile = async ({ username, jobTitle }) => {
   const response = await axios.post(
     `${API_URL}/complete-profile`,
     {
       username,
-      role,
+      jobTitle,
     },
     {
       withCredentials: true,
diff --git a/server/package.json b/server/package.json
index 3a0030f..7d5fd9f 100644
--- a/server/package.json
+++ b/server/package.json
@@ -26,5 +26,9 @@
     "@types/node": "^26.1.1",
     "nodemon": "^3.1.14",
     "prisma": "^5.14.0"
+  },
+  "prisma": {
+    "seed": "node prisma/seed.js"
   }
-}
+
+}
\ No newline at end of file
diff --git a/server/prisma/migrations/20260807170909_add_platform_role/migration.sql b/server/prisma/migrations/20260807170909_add_platform_role/migration.sql
new file mode 100644
index 0000000..e344537
--- /dev/null
+++ b/server/prisma/migrations/20260807170909_add_platform_role/migration.sql
@@ -0,0 +1,28 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `provider` on the `User` table. All the data in the column will be lost.
+  - You are about to drop the column `providerId` on the `User` table. All the data in the column will be lost.
+  - The `role` column on the `User` table would be dropped and recreated. This will lead to data loss if there is data in the column.
+  - A unique constraint covering the columns `[googleId]` on the table `User` will be added. If there are existing duplicate values, this will fail.
+  - A unique constraint covering the columns `[githubId]` on the table `User` will be added. If there are existing duplicate values, this will fail.
+
+*/
+-- CreateEnum
+CREATE TYPE "PlatformRole" AS ENUM ('ADMIN', 'MANAGER', 'USER');
+
+-- AlterTable
+ALTER TABLE "User" DROP COLUMN "provider",
+DROP COLUMN "providerId",
+ADD COLUMN     "githubAccessToken" TEXT,
+ADD COLUMN     "githubId" TEXT,
+ADD COLUMN     "googleId" TEXT,
+ADD COLUMN     "jobTitle" TEXT,
+DROP COLUMN "role",
+ADD COLUMN     "role" "PlatformRole" NOT NULL DEFAULT 'USER';
+
+-- CreateIndex
+CREATE UNIQUE INDEX "User_googleId_key" ON "User"("googleId");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "User_githubId_key" ON "User"("githubId");
diff --git a/server/prisma/migrations/20260808082931_platform_roles_refactor/migration.sql b/server/prisma/migrations/20260808082931_platform_roles_refactor/migration.sql
new file mode 100644
index 0000000..cd42a20
--- /dev/null
+++ b/server/prisma/migrations/20260808082931_platform_roles_refactor/migration.sql
@@ -0,0 +1,52 @@
+-- 1. Create the Organization Table
+CREATE TABLE "Organization" (
+    "id" SERIAL NOT NULL,
+    "name" TEXT NOT NULL,
+    "description" TEXT,
+    "ownerId" INTEGER NOT NULL,
+    "status" TEXT NOT NULL DEFAULT 'ACTIVE',
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "Organization_pkey" PRIMARY KEY ("id")
+);
+
+-- 2. Create the OrganizationRole Enum
+CREATE TYPE "OrganizationRole" AS ENUM ('OWNER', 'ADMIN', 'MANAGER', 'MEMBER');
+
+-- 3. Create the OrganizationMember Table
+CREATE TABLE "OrganizationMember" (
+    "id" SERIAL NOT NULL,
+    "organizationId" INTEGER NOT NULL,
+    "userId" INTEGER NOT NULL,
+    "role" "OrganizationRole" NOT NULL DEFAULT 'MEMBER',
+    "joinedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "OrganizationMember_pkey" PRIMARY KEY ("id")
+);
+
+-- 4. Create new PlatformRole Enum
+CREATE TYPE "PlatformRole_new" AS ENUM ('PLATFORM_ADMIN', 'USER');
+
+-- 5. Rename column first, then apply the new Enum
+ALTER TABLE "User" RENAME COLUMN "role" TO "platformRole";
+ALTER TABLE "User" ALTER COLUMN "platformRole" DROP DEFAULT;
+ALTER TABLE "User" ALTER COLUMN "platformRole" TYPE "PlatformRole_new" USING (
+  CASE 
+    WHEN "platformRole"::text = 'ADMIN' THEN 'PLATFORM_ADMIN'::text
+    ELSE 'USER'::text
+  END
+)::"PlatformRole_new";
+
+-- 6. Clean up old enum
+ALTER TYPE "PlatformRole" RENAME TO "PlatformRole_old";
+ALTER TYPE "PlatformRole_new" RENAME TO "PlatformRole";
+DROP TYPE "PlatformRole_old";
+
+-- 7. Add default back
+ALTER TABLE "User" ALTER COLUMN "platformRole" SET DEFAULT 'USER';
+
+-- 8. Add Constraints
+CREATE UNIQUE INDEX "OrganizationMember_organizationId_userId_key" ON "OrganizationMember"("organizationId", "userId");
+ALTER TABLE "OrganizationMember" ADD CONSTRAINT "OrganizationMember_organizationId_fkey" FOREIGN KEY ("organizationId") REFERENCES "Organization"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+ALTER TABLE "OrganizationMember" ADD CONSTRAINT "OrganizationMember_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE CASCADE ON UPDATE CASCADE;
\ No newline at end of file
diff --git a/server/prisma/migrations/20260808092622_add_invitation_model/migration.sql b/server/prisma/migrations/20260808092622_add_invitation_model/migration.sql
new file mode 100644
index 0000000..72c0ff8
--- /dev/null
+++ b/server/prisma/migrations/20260808092622_add_invitation_model/migration.sql
@@ -0,0 +1,26 @@
+-- CreateEnum
+CREATE TYPE "InvitationStatus" AS ENUM ('PENDING', 'ACCEPTED', 'REJECTED', 'EXPIRED', 'CANCELLED');
+
+-- CreateTable
+CREATE TABLE "Invitation" (
+    "id" SERIAL NOT NULL,
+    "organizationId" INTEGER NOT NULL,
+    "invitedUserId" INTEGER NOT NULL,
+    "invitedById" INTEGER NOT NULL,
+    "role" "OrganizationRole" NOT NULL DEFAULT 'MEMBER',
+    "status" "InvitationStatus" NOT NULL DEFAULT 'PENDING',
+    "expiresAt" TIMESTAMP(3) NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "Invitation_pkey" PRIMARY KEY ("id")
+);
+
+-- AddForeignKey
+ALTER TABLE "Invitation" ADD CONSTRAINT "Invitation_organizationId_fkey" FOREIGN KEY ("organizationId") REFERENCES "Organization"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Invitation" ADD CONSTRAINT "Invitation_invitedUserId_fkey" FOREIGN KEY ("invitedUserId") REFERENCES "User"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Invitation" ADD CONSTRAINT "Invitation_invitedById_fkey" FOREIGN KEY ("invitedById") REFERENCES "User"("id") ON DELETE CASCADE ON UPDATE CASCADE;
diff --git a/server/prisma/migrations/20260808101317_add_workspace_models/migration.sql b/server/prisma/migrations/20260808101317_add_workspace_models/migration.sql
new file mode 100644
index 0000000..10388b1
--- /dev/null
+++ b/server/prisma/migrations/20260808101317_add_workspace_models/migration.sql
@@ -0,0 +1,75 @@
+-- CreateEnum
+CREATE TYPE "WorkspaceRole" AS ENUM ('WORKSPACE_ADMIN', 'CONTRIBUTOR', 'VIEWER');
+
+-- CreateEnum
+CREATE TYPE "WorkspaceStatus" AS ENUM ('ACTIVE', 'ARCHIVED');
+
+-- CreateTable
+CREATE TABLE "Workspace" (
+    "id" SERIAL NOT NULL,
+    "organizationId" INTEGER NOT NULL,
+    "name" TEXT NOT NULL,
+    "description" TEXT,
+    "status" "WorkspaceStatus" NOT NULL DEFAULT 'ACTIVE',
+    "createdById" INTEGER NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "Workspace_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "Repository" (
+    "id" SERIAL NOT NULL,
+    "workspaceId" INTEGER NOT NULL,
+    "githubRepositoryId" TEXT,
+    "name" TEXT NOT NULL,
+    "fullName" TEXT NOT NULL,
+    "owner" TEXT NOT NULL,
+    "description" TEXT,
+    "url" TEXT,
+    "htmlUrl" TEXT NOT NULL,
+    "cloneUrl" TEXT,
+    "sshUrl" TEXT,
+    "defaultBranch" TEXT NOT NULL DEFAULT 'main',
+    "visibility" TEXT NOT NULL DEFAULT 'private',
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "Repository_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "WorkspaceMember" (
+    "id" SERIAL NOT NULL,
+    "workspaceId" INTEGER NOT NULL,
+    "userId" INTEGER NOT NULL,
+    "role" "WorkspaceRole" NOT NULL DEFAULT 'VIEWER',
+    "joinedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "WorkspaceMember_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "Repository_workspaceId_key" ON "Repository"("workspaceId");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "Repository_githubRepositoryId_key" ON "Repository"("githubRepositoryId");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "WorkspaceMember_workspaceId_userId_key" ON "WorkspaceMember"("workspaceId", "userId");
+
+-- AddForeignKey
+ALTER TABLE "Workspace" ADD CONSTRAINT "Workspace_organizationId_fkey" FOREIGN KEY ("organizationId") REFERENCES "Organization"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Workspace" ADD CONSTRAINT "Workspace_createdById_fkey" FOREIGN KEY ("createdById") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Repository" ADD CONSTRAINT "Repository_workspaceId_fkey" FOREIGN KEY ("workspaceId") REFERENCES "Workspace"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "WorkspaceMember" ADD CONSTRAINT "WorkspaceMember_workspaceId_fkey" FOREIGN KEY ("workspaceId") REFERENCES "Workspace"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "WorkspaceMember" ADD CONSTRAINT "WorkspaceMember_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE CASCADE ON UPDATE CASCADE;
diff --git a/server/prisma/migrations/20260808105513_phase4_agile_models/migration.sql b/server/prisma/migrations/20260808105513_phase4_agile_models/migration.sql
new file mode 100644
index 0000000..03d43fa
--- /dev/null
+++ b/server/prisma/migrations/20260808105513_phase4_agile_models/migration.sql
@@ -0,0 +1,133 @@
+-- CreateEnum
+CREATE TYPE "ProjectStatus" AS ENUM ('PLANNED', 'ACTIVE', 'COMPLETED', 'ARCHIVED');
+
+-- CreateEnum
+CREATE TYPE "TaskStatus" AS ENUM ('TODO', 'IN_PROGRESS', 'IN_REVIEW', 'DONE');
+
+-- CreateEnum
+CREATE TYPE "TaskPriority" AS ENUM ('LOW', 'MEDIUM', 'HIGH', 'CRITICAL');
+
+-- CreateEnum
+CREATE TYPE "SprintStatus" AS ENUM ('PLANNED', 'ACTIVE', 'COMPLETED', 'CANCELLED');
+
+-- CreateEnum
+CREATE TYPE "ActivityType" AS ENUM ('PROJECT_CREATED', 'TASK_CREATED', 'TASK_UPDATED', 'TASK_COMPLETED', 'SPRINT_CREATED', 'SPRINT_STARTED', 'SPRINT_COMPLETED', 'MEMBER_ADDED');
+
+-- CreateTable
+CREATE TABLE "Project" (
+    "id" SERIAL NOT NULL,
+    "workspaceId" INTEGER NOT NULL,
+    "name" TEXT NOT NULL,
+    "description" TEXT,
+    "status" "ProjectStatus" NOT NULL DEFAULT 'PLANNED',
+    "progress" INTEGER NOT NULL DEFAULT 0,
+    "createdById" INTEGER NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "Project_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "Sprint" (
+    "id" SERIAL NOT NULL,
+    "workspaceId" INTEGER NOT NULL,
+    "name" TEXT NOT NULL,
+    "goal" TEXT,
+    "startDate" TIMESTAMP(3),
+    "endDate" TIMESTAMP(3),
+    "status" "SprintStatus" NOT NULL DEFAULT 'PLANNED',
+    "createdById" INTEGER NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "Sprint_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "Task" (
+    "id" SERIAL NOT NULL,
+    "projectId" INTEGER NOT NULL,
+    "workspaceId" INTEGER NOT NULL,
+    "sprintId" INTEGER,
+    "title" TEXT NOT NULL,
+    "description" TEXT,
+    "status" "TaskStatus" NOT NULL DEFAULT 'TODO',
+    "priority" "TaskPriority" NOT NULL DEFAULT 'MEDIUM',
+    "assigneeId" INTEGER,
+    "createdById" INTEGER NOT NULL,
+    "dueDate" TIMESTAMP(3),
+    "storyPoints" INTEGER DEFAULT 0,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL,
+
+    CONSTRAINT "Task_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "Activity" (
+    "id" SERIAL NOT NULL,
+    "workspaceId" INTEGER NOT NULL,
+    "userId" INTEGER NOT NULL,
+    "type" "ActivityType" NOT NULL,
+    "entityType" TEXT NOT NULL,
+    "entityId" INTEGER NOT NULL,
+    "message" TEXT NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "Activity_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "Project_workspaceId_name_key" ON "Project"("workspaceId", "name");
+
+-- CreateIndex
+CREATE INDEX "Sprint_workspaceId_status_idx" ON "Sprint"("workspaceId", "status");
+
+-- CreateIndex
+CREATE INDEX "Task_workspaceId_idx" ON "Task"("workspaceId");
+
+-- CreateIndex
+CREATE INDEX "Task_projectId_idx" ON "Task"("projectId");
+
+-- CreateIndex
+CREATE INDEX "Task_sprintId_idx" ON "Task"("sprintId");
+
+-- CreateIndex
+CREATE INDEX "Task_assigneeId_idx" ON "Task"("assigneeId");
+
+-- CreateIndex
+CREATE INDEX "Activity_workspaceId_createdAt_idx" ON "Activity"("workspaceId", "createdAt");
+
+-- AddForeignKey
+ALTER TABLE "Project" ADD CONSTRAINT "Project_workspaceId_fkey" FOREIGN KEY ("workspaceId") REFERENCES "Workspace"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Project" ADD CONSTRAINT "Project_createdById_fkey" FOREIGN KEY ("createdById") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Sprint" ADD CONSTRAINT "Sprint_workspaceId_fkey" FOREIGN KEY ("workspaceId") REFERENCES "Workspace"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Sprint" ADD CONSTRAINT "Sprint_createdById_fkey" FOREIGN KEY ("createdById") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Task" ADD CONSTRAINT "Task_projectId_fkey" FOREIGN KEY ("projectId") REFERENCES "Project"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Task" ADD CONSTRAINT "Task_workspaceId_fkey" FOREIGN KEY ("workspaceId") REFERENCES "Workspace"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Task" ADD CONSTRAINT "Task_sprintId_fkey" FOREIGN KEY ("sprintId") REFERENCES "Sprint"("id") ON DELETE SET NULL ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Task" ADD CONSTRAINT "Task_assigneeId_fkey" FOREIGN KEY ("assigneeId") REFERENCES "User"("id") ON DELETE SET NULL ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Task" ADD CONSTRAINT "Task_createdById_fkey" FOREIGN KEY ("createdById") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Activity" ADD CONSTRAINT "Activity_workspaceId_fkey" FOREIGN KEY ("workspaceId") REFERENCES "Workspace"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "Activity" ADD CONSTRAINT "Activity_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE CASCADE ON UPDATE CASCADE;
diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index be84ea7..661ec0c 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -13,12 +13,82 @@ datasource db {
   url      = env("DATABASE_URL")
 }
 
+enum PlatformRole {
+  PLATFORM_ADMIN
+  USER
+}
+
+enum OrganizationRole {
+  OWNER
+  ADMIN
+  MANAGER
+  MEMBER
+}
+
+enum InvitationStatus {
+  PENDING
+  ACCEPTED
+  REJECTED
+  EXPIRED
+  CANCELLED
+}
+
+enum WorkspaceRole {
+  WORKSPACE_ADMIN
+  CONTRIBUTOR
+  VIEWER
+}
+
+enum WorkspaceStatus {
+  ACTIVE
+  ARCHIVED
+}
+
+enum ProjectStatus {
+  PLANNED
+  ACTIVE
+  COMPLETED
+  ARCHIVED
+}
+
+enum TaskStatus {
+  TODO
+  IN_PROGRESS
+  IN_REVIEW
+  DONE
+}
+
+enum TaskPriority {
+  LOW
+  MEDIUM
+  HIGH
+  CRITICAL
+}
+
+enum SprintStatus {
+  PLANNED
+  ACTIVE
+  COMPLETED
+  CANCELLED
+}
+
+enum ActivityType {
+  PROJECT_CREATED
+  TASK_CREATED
+  TASK_UPDATED
+  TASK_COMPLETED
+  SPRINT_CREATED
+  SPRINT_STARTED
+  SPRINT_COMPLETED
+  MEMBER_ADDED
+}
+
 model User {
   id               Int      @id @default(autoincrement())
   username         String?  @unique
   email            String   @unique
   password         String?
-  role             String?
+  jobTitle         String?
   googleId         String?  @unique
   githubId         String?  @unique 
   githubAccessToken     String?   
@@ -29,4 +99,192 @@ model User {
   profileCompleted Boolean  @default(false)
   createdAt        DateTime @default(now())
   updatedAt        DateTime @updatedAt
+  platformRole          PlatformRole @default(USER)
+  organizationMembers   OrganizationMember[]
+  invitationsReceived   Invitation[] @relation("ReceivedInvitations")
+  invitationsSent       Invitation[] @relation("SentInvitations")
+  workspaceMembers      WorkspaceMember[]
+  workspacesCreated     Workspace[]
+  assignedTasks         Task[]       @relation("AssignedTasks")
+  createdProjects       Project[]    @relation("CreatedProjects")
+  createdSprints        Sprint[]     @relation("CreatedSprints")
+  createdTasks          Task[]       @relation("CreatedTasks")
+  activities            Activity[]
+}
+
+model Organization {
+  id          Int      @id @default(autoincrement())
+  name        String
+  description String?
+  ownerId     Int
+  status      String   @default("ACTIVE") // e.g. ACTIVE, SUSPENDED
+  createdAt   DateTime @default(now())
+  updatedAt   DateTime @updatedAt
+
+  members     OrganizationMember[]
+  invitations           Invitation[]
+  workspaces            Workspace[]
+}
+
+model OrganizationMember {
+  id             Int              @id @default(autoincrement())
+  organizationId Int
+  userId         Int
+  role           OrganizationRole @default(MEMBER)
+  joinedAt       DateTime         @default(now())
+
+  organization   Organization     @relation(fields: [organizationId], references: [id], onDelete: Cascade)
+  user           User             @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+  @@unique([organizationId, userId])
+}
+
+model Invitation {
+  id             Int              @id @default(autoincrement())
+  organizationId Int
+  invitedUserId  Int
+  invitedById    Int
+  role           OrganizationRole @default(MEMBER)
+  status         InvitationStatus @default(PENDING)
+  expiresAt      DateTime         // We will set this in the backend (e.g. 7 days from now)
+  createdAt      DateTime         @default(now())
+  updatedAt      DateTime         @updatedAt
+
+  organization   Organization     @relation(fields: [organizationId], references: [id], onDelete: Cascade)
+  invitedUser    User             @relation("ReceivedInvitations", fields: [invitedUserId], references: [id], onDelete: Cascade)
+  invitedBy      User             @relation("SentInvitations", fields: [invitedById], references: [id], onDelete: Cascade)
+}
+
+model Workspace {
+  id             Int              @id @default(autoincrement())
+  organizationId Int
+  name           String
+  description    String?
+  status         WorkspaceStatus  @default(ACTIVE)
+  createdById    Int
+  createdAt      DateTime         @default(now())
+  updatedAt      DateTime         @updatedAt
+
+  organization   Organization     @relation(fields: [organizationId], references: [id], onDelete: Cascade)
+  createdBy      User             @relation(fields: [createdById], references: [id])
+  repository     Repository?
+  members        WorkspaceMember[]
+  projects              Project[]
+  sprints               Sprint[]
+  tasks                 Task[]
+  activities            Activity[]
+}
+
+model Repository {
+  id                 Int       @id @default(autoincrement())
+  workspaceId        Int       @unique
+  githubRepositoryId String?   @unique  // Stored as String to prevent integer overflow
+  name               String
+  fullName           String
+  owner              String
+  description        String?
+  url                String?
+  htmlUrl            String
+  cloneUrl           String?
+  sshUrl             String?
+  defaultBranch      String    @default("main")
+  visibility         String    @default("private")
+  createdAt          DateTime  @default(now())
+  updatedAt          DateTime  @updatedAt
+
+  workspace          Workspace @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
+}
+
+model WorkspaceMember {
+  id             Int           @id @default(autoincrement())
+  workspaceId    Int
+  userId         Int
+  role           WorkspaceRole @default(VIEWER)
+  joinedAt       DateTime      @default(now())
+
+  workspace      Workspace     @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
+  user           User          @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+  @@unique([workspaceId, userId])
+}
+
+model Project {
+  id             Int             @id @default(autoincrement())
+  workspaceId    Int
+  name           String
+  description    String?
+  status         ProjectStatus   @default(PLANNED)
+  progress       Int             @default(0) // Calculated dynamically in backend
+  createdById    Int
+  createdAt      DateTime        @default(now())
+  updatedAt      DateTime        @updatedAt
+
+  workspace      Workspace       @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
+  createdBy      User            @relation("CreatedProjects", fields: [createdById], references: [id])
+  tasks          Task[]
+
+  @@unique([workspaceId, name])
+}
+
+model Sprint {
+  id             Int             @id @default(autoincrement())
+  workspaceId    Int
+  name           String
+  goal           String?
+  startDate      DateTime?
+  endDate        DateTime?
+  status         SprintStatus    @default(PLANNED)
+  createdById    Int
+  createdAt      DateTime        @default(now())
+  updatedAt      DateTime        @updatedAt
+
+  workspace      Workspace       @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
+  createdBy      User            @relation("CreatedSprints", fields: [createdById], references: [id])
+  tasks          Task[]
+
+  @@index([workspaceId, status])
+}
+
+model Task {
+  id             Int             @id @default(autoincrement())
+  projectId      Int
+  workspaceId    Int
+  sprintId       Int?
+  title          String
+  description    String?
+  status         TaskStatus      @default(TODO)
+  priority       TaskPriority    @default(MEDIUM)
+  assigneeId     Int?
+  createdById    Int
+  dueDate        DateTime?
+  storyPoints    Int?            @default(0)
+  createdAt      DateTime        @default(now())
+  updatedAt      DateTime        @updatedAt
+
+  project        Project         @relation(fields: [projectId], references: [id], onDelete: Cascade)
+  workspace      Workspace       @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
+  sprint         Sprint?         @relation(fields: [sprintId], references: [id])
+  assignee       User?           @relation("AssignedTasks", fields: [assigneeId], references: [id])
+  createdBy      User            @relation("CreatedTasks", fields: [createdById], references: [id])
+
+  @@index([workspaceId])
+  @@index([projectId])
+  @@index([sprintId])
+  @@index([assigneeId])
+}
+
+model Activity {
+  id             Int             @id @default(autoincrement())
+  workspaceId    Int
+  userId         Int
+  type           ActivityType
+  entityType     String          // "PROJECT", "TASK", "SPRINT"
+  entityId       Int             
+  message        String
+  createdAt      DateTime        @default(now())
+
+  workspace      Workspace       @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
+  user           User            @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+  @@index([workspaceId, createdAt])
 }
\ No newline at end of file
diff --git a/server/prisma/seed.js b/server/prisma/seed.js
new file mode 100644
index 0000000..e0a37c7
--- /dev/null
+++ b/server/prisma/seed.js
@@ -0,0 +1,47 @@
+import { PrismaClient } from "@prisma/client";
+import bcrypt from "bcrypt";
+
+const prisma = new PrismaClient();
+
+async function main() {
+  // You can set these in your .env file, or it will fall back to these safe defaults for development
+  const adminEmail = process.env.ADMIN_EMAIL || "admin@devhub.local";
+  const adminPassword = process.env.ADMIN_PASSWORD || "Admin@123!";
+  const adminUsername = process.env.ADMIN_USERNAME || "SuperAdmin";
+
+  // Look for any existing Platform Admin
+  const existingAdmin = await prisma.user.findFirst({
+    where: { platformRole: "PLATFORM_ADMIN" },
+  });
+
+  if (!existingAdmin) {
+    console.log("No PLATFORM_ADMIN found. Creating default admin...");
+
+    // Hash the password securely
+    const hashedPassword = await bcrypt.hash(adminPassword, 10);
+
+    const admin = await prisma.user.create({
+      data: {
+        email: adminEmail,
+        username: adminUsername,
+        password: hashedPassword,
+        platformRole: "PLATFORM_ADMIN",
+        profileCompleted: true,
+      },
+    });
+
+    console.log(`✅ Platform Admin created successfully!`);
+    console.log(`Username: ${admin.username} | Email: ${admin.email}`);
+  } else {
+    console.log("✅ Platform Admin already exists.");
+  }
+}
+
+main()
+  .catch((e) => {
+    console.error("Error during seeding:", e);
+    process.exit(1);
+  })
+  .finally(async () => {
+    await prisma.$disconnect();
+  });
diff --git a/server/src/app.js b/server/src/app.js
index 62706b0..d13bc7c 100644
--- a/server/src/app.js
+++ b/server/src/app.js
@@ -4,6 +4,15 @@ import cookieParser from "cookie-parser";
 
 import route from "./routes/auth.routes.js";
 import githubRoutes from "./routes/github.routes.js";
+import adminRoutes from "./routes/admin.routes.js";
+import orgRoutes from "./routes/org.routes.js";
+import invitationRoutes from "./routes/invitation.routes.js";
+import workspaceRoutes from "./routes/workspace.routes.js";
+import workspaceMemberRoutes from "./routes/workspaceMember.routes.js";
+import projectRoutes from "./routes/project.routes.js";
+import sprintRoutes from "./routes/sprint.routes.js";
+import taskRoutes from "./routes/task.routes.js";
+import dashboardRoutes from "./routes/dashboard.routes.js";
 
 const app = express();
 
@@ -19,7 +28,26 @@ app.use(cookieParser());
 // Routes
 app.use("/api/auth",route);
 app.use("/api/github", githubRoutes);
+app.use("/api/admin", adminRoutes);
+app.use("/api/organizations", orgRoutes);
+app.use("/api/invitations", invitationRoutes);
+app.use("/api/organizations/:orgId/workspaces", workspaceRoutes);
+app.use("/api/organizations/:orgId/workspaces/:workspaceId/members",workspaceMemberRoutes);
 
+
+// Base workspace route
+app.use("/api/organizations/:orgId/workspaces", workspaceRoutes);
+
+// Sub-routes for the workspace context!
+app.use("/api/organizations/:orgId/workspaces/:workspaceId/members", workspaceMemberRoutes);
+app.use("/api/organizations/:orgId/workspaces/:workspaceId/projects", projectRoutes);
+app.use("/api/organizations/:orgId/workspaces/:workspaceId/sprints", sprintRoutes);
+app.use("/api/organizations/:orgId/workspaces/:workspaceId/tasks", taskRoutes);
+app.use("/api/organizations/:orgId/workspaces/:workspaceId/dashboard", dashboardRoutes);
+
+// We also mount the github routes here so they have access to the workspace context!
+app.use("/api/organizations/:orgId/workspaces/:workspaceId/github", githubRoutes);
+app.use("/api/github", githubRoutes); // Keep global for /repositories
 // default route
 app.get("/",(req,res) => {
   res.json({
diff --git a/server/src/controllers/admin.controller.js b/server/src/controllers/admin.controller.js
new file mode 100644
index 0000000..6df3ff7
--- /dev/null
+++ b/server/src/controllers/admin.controller.js
@@ -0,0 +1,107 @@
+import { PrismaClient } from "@prisma/client";
+
+const prisma = new PrismaClient();
+
+// @desc    Get all users (with pagination & search)
+// @route   GET /api/admin/users
+// @access  Private/PlatformAdmin
+export const getUsers = async (req, res) => {
+  try {
+    const page = parseInt(req.query.page) || 1;
+    const limit = parseInt(req.query.limit) || 10;
+    const skip = (page - 1) * limit;
+    const searchQuery = req.query.search || "";
+
+    const whereClause = {
+      OR: [
+        { username: { contains: searchQuery, mode: "insensitive" } },
+        { email: { contains: searchQuery, mode: "insensitive" } },
+      ],
+    };
+
+    const [users, totalUsers] = await Promise.all([
+      prisma.user.findMany({
+        where: whereClause,
+        select: {
+          id: true,
+          username: true,
+          email: true,
+          platformRole: true, // Returning the new role
+          avatar: true,
+          createdAt: true,
+        },
+        skip,
+        take: limit,
+        orderBy: { createdAt: "desc" },
+      }),
+      prisma.user.count({ where: whereClause }),
+    ]);
+
+    return res.status(200).json({
+      success: true,
+      message: "Users fetched successfully",
+      data: {
+        users,
+        pagination: {
+          totalUsers,
+          currentPage: page,
+          totalPages: Math.ceil(totalUsers / limit),
+        },
+      },
+    });
+  } catch (error) {
+    console.error("Error in getUsers:", error);
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Get all organizations (with pagination & search)
+// @route   GET /api/admin/organizations
+// @access  Private/PlatformAdmin
+export const getOrganizations = async (req, res) => {
+  try {
+    const page = parseInt(req.query.page) || 1;
+    const limit = parseInt(req.query.limit) || 10;
+    const skip = (page - 1) * limit;
+    const searchQuery = req.query.search || "";
+
+    const whereClause = {
+      name: { contains: searchQuery, mode: "insensitive" },
+    };
+
+    const [organizations, totalOrgs] = await Promise.all([
+      prisma.organization.findMany({
+        where: whereClause,
+        include: {
+          _count: {
+            select: { members: true },
+          },
+        },
+        skip,
+        take: limit,
+        orderBy: { createdAt: "desc" },
+      }),
+      prisma.organization.count({ where: whereClause }),
+    ]);
+
+    return res.status(200).json({
+      success: true,
+      message: "Organizations fetched successfully",
+      data: {
+        organizations,
+        pagination: {
+          totalOrganizations: totalOrgs,
+          currentPage: page,
+          totalPages: Math.ceil(totalOrgs / limit),
+        },
+      },
+    });
+  } catch (error) {
+    console.error("Error in getOrganizations:", error);
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
diff --git a/server/src/controllers/auth.controller.js b/server/src/controllers/auth.controller.js
index 50edce0..01c9f91 100644
--- a/server/src/controllers/auth.controller.js
+++ b/server/src/controllers/auth.controller.js
@@ -17,9 +17,9 @@ const googleClient = new OAuth2Client(
 
 export const registerUser = async(req,res) => {
   try {
-    const { username, email, role, password } = req.body;
+    const { username, email, jobTitle, password } = req.body;
 
-    if (!username || !email || !role || !password) {
+    if (!username || !email || !jobTitle || !password) {
       return res.status(400).json({
         success: false,
         message: "All fields are required.",
@@ -51,17 +51,17 @@ export const registerUser = async(req,res) => {
       });
     }
 
-    const validRoles = [
+    const validJobTitles = [
       "project_manager",
       "developer",
       "frontend_developer",
       "backend_developer",
       "fullstack_developer",
     ];
-    if (!validRoles.includes(role)) {
+    if (!validJobTitles.includes(jobTitle)) {
       return res
         .status(400)
-        .json({ success: false, message: "Invalid role selected." });
+        .json({ success: false, message: "Invalid job title selected." });
     }
 
     const existingUser = await prisma.user.findFirst({
@@ -84,7 +84,7 @@ export const registerUser = async(req,res) => {
       data: {
         username,
         email,
-        role,
+        jobTitle,
         password: hashedPassword,
         profileCompleted: true,
       },
@@ -97,7 +97,8 @@ export const registerUser = async(req,res) => {
         id: newUser.id,
         username: newUser.username,
         email: newUser.email,
-        role: newUser.role,
+        jobTitle: newUser.jobTitle,
+        platformRole: newUser.platformRole,
       },
     });
   } catch (error) {
@@ -202,7 +203,8 @@ export const loginUser = async (req, res) => {
         id: user.id,
         username: user.username,
         email: user.email,
-        role: user.role,
+        jobTitle: user.jobTitle,
+        platformRole: user.platformRole,
       },
     });
   } catch (error) {
@@ -269,9 +271,10 @@ export const googleLogin = async (req, res) => {
         id: user.id,
         username: user.username,
         email: user.email,
-        role: user.role,
-        avatar: user.avatar
-      }
+        jobTitle: user.jobTitle,
+        avatar: user.avatar,
+        platformRole: user.platformRole,
+      },
     });
   } catch (error) {
     return res.status(500).json({ success: false, message: "Google Login Failed" });
@@ -281,12 +284,12 @@ export const googleLogin = async (req, res) => {
 export const completeProfile = async (req, res) => {
   try {
     const username = req.body.username?.trim();
-    const { role } = req.body;
+    const { jobTitle } = req.body;
 
-    if (!username || !role) {
+    if (!username || !jobTitle) {
       return res.status(400).json({
         success: false,
-        message: "Username and role are required.",
+        message: "Username and job title are required.",
       });
     }
 
@@ -297,7 +300,7 @@ export const completeProfile = async (req, res) => {
       });
     }
 
-    const validRoles = [
+    const validJobTitles = [
       "project_manager",
       "developer",
       "frontend_developer",
@@ -305,10 +308,10 @@ export const completeProfile = async (req, res) => {
       "fullstack_developer",
     ];
 
-    if (!validRoles.includes(role)) {
+    if (!validJobTitles.includes(jobTitle)) {
       return res.status(400).json({
         success: false,
-        message: "Invalid role selected.",
+        message: "Invalid job title selected.",
       });
     }
 
@@ -327,7 +330,7 @@ export const completeProfile = async (req, res) => {
       where: { id: req.user.id },
       data: {
         username,
-        role,
+        jobTitle,
         profileCompleted: true,
       },
     });
@@ -339,9 +342,10 @@ export const completeProfile = async (req, res) => {
         id: updatedUser.id,
         username: updatedUser.username,
         email: updatedUser.email,
-        role: updatedUser.role,
+        jobTitle: updatedUser.jobTitle,
         avatar: updatedUser.avatar,
         profileCompleted: updatedUser.profileCompleted,
+        platformRole: updatedUser.platformRole,
       },
     });
   } catch (error) {
@@ -563,9 +567,10 @@ export const getCurrentUser = async (req, res) => {
         id: user.id,
         username: user.username,
         email: user.email,
-        role: user.role,
+        jobTitle: user.jobTitle,
         avatar: user.avatar,
         profileCompleted: user.profileCompleted,
+        platformRole: user.platformRole,
       },
     });
   } catch (error) {
diff --git a/server/src/controllers/dashboard.controller.js b/server/src/controllers/dashboard.controller.js
new file mode 100644
index 0000000..c0d370d
--- /dev/null
+++ b/server/src/controllers/dashboard.controller.js
@@ -0,0 +1,146 @@
+import { PrismaClient } from "@prisma/client";
+
+const prisma = new PrismaClient();
+
+const calculateSprintProgress = (tasks) => {
+  if (!tasks || tasks.length === 0) return 0;
+  const totalPoints = tasks.reduce((sum, t) => sum + (t.storyPoints || 0), 0);
+  const completedPoints = tasks
+    .filter((t) => t.status === "DONE")
+    .reduce((sum, t) => sum + (t.storyPoints || 0), 0);
+  if (totalPoints > 0) return Math.round((completedPoints / totalPoints) * 100);
+  const completed = tasks.filter((t) => t.status === "DONE").length;
+  return Math.round((completed / tasks.length) * 100);
+};
+
+const calculateProjectProgress = (tasks) => {
+  if (!tasks || tasks.length === 0) return 0;
+  const completed = tasks.filter((t) => t.status === "DONE").length;
+  return Math.round((completed / tasks.length) * 100);
+};
+
+// @desc    Get aggregated dashboard data for a workspace
+// @route   GET /api/organizations/:orgId/workspaces/:workspaceId/dashboard
+export const getWorkspaceDashboardData = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+
+    // 1. Get Workspace info (Members count, Repo)
+    const workspace = await prisma.workspace.findUnique({
+      where: { id: workspaceId },
+      include: {
+        repository: true,
+        _count: { select: { members: true } },
+      },
+    });
+
+    // 2. Get Active Sprint details
+    const activeSprintData = await prisma.sprint.findFirst({
+      where: { workspaceId, status: "ACTIVE" },
+      include: { tasks: true },
+    });
+
+    let currentSprint = null;
+    if (activeSprintData) {
+      const completedTasksCount = activeSprintData.tasks.filter(
+        (t) => t.status === "DONE",
+      ).length;
+      const inProgressTasksCount = activeSprintData.tasks.filter(
+        (t) => t.status === "IN_PROGRESS" || t.status === "IN_REVIEW",
+      ).length;
+      const todoTasksCount = activeSprintData.tasks.filter(
+        (t) => t.status === "TODO",
+      ).length;
+
+      currentSprint = {
+        id: activeSprintData.id,
+        name: activeSprintData.name,
+        goal: activeSprintData.goal,
+        startDate: activeSprintData.startDate,
+        endDate: activeSprintData.endDate,
+        progress: calculateSprintProgress(activeSprintData.tasks),
+        totalStoryPoints: activeSprintData.tasks.reduce(
+          (sum, t) => sum + (t.storyPoints || 0),
+          0,
+        ),
+        completedStoryPoints: activeSprintData.tasks
+          .filter((t) => t.status === "DONE")
+          .reduce((sum, t) => sum + (t.storyPoints || 0), 0),
+        stats: {
+          completed: completedTasksCount,
+          inProgress: inProgressTasksCount,
+          todo: todoTasksCount,
+        },
+      };
+    }
+
+    // 3. Get Project Overviews (Limit to recent/active)
+    const projectsData = await prisma.project.findMany({
+      where: { workspaceId, status: { not: "ARCHIVED" } },
+      include: { tasks: { select: { status: true } } },
+      take: 4,
+      orderBy: { updatedAt: "desc" },
+    });
+
+    const projectOverview = projectsData.map((p) => ({
+      id: p.id,
+      name: p.name,
+      description: p.description,
+      progress: calculateProjectProgress(p.tasks),
+    }));
+
+    // 4. Get Recent Activities
+    const recentActivity = await prisma.activity.findMany({
+      where: { workspaceId },
+      include: { user: { select: { username: true, avatar: true } } },
+      orderBy: { createdAt: "desc" },
+      take: 10,
+    });
+
+    // 5. Aggregate KPIs
+    const totalProjectsCount = await prisma.project.count({
+      where: { workspaceId },
+    });
+    const activeSprintsCount = await prisma.sprint.count({
+      where: { workspaceId, status: "ACTIVE" },
+    });
+    const tasksCompletedCount = await prisma.task.count({
+      where: { workspaceId, status: "DONE" },
+    });
+    const totalSprintsCount = await prisma.sprint.count({
+      where: { workspaceId },
+    });
+    const totalTasksCount = await prisma.task.count({
+      where: { workspaceId },
+    });
+
+    const kpis = {
+      totalProjects: totalProjectsCount,
+      activeSprints: activeSprintsCount,
+      tasksCompleted: tasksCompletedCount,
+      openBugs: 0, // Not supported in current schema
+      totalSprints: totalSprintsCount,
+      totalTasks: totalTasksCount,
+    };
+
+    return res.status(200).json({
+      success: true,
+      data: {
+        workspace: {
+          id: workspace.id,
+          name: workspace.name,
+          repository: workspace.repository,
+        },
+        kpis,
+        currentSprint,
+        projectOverview,
+        recentActivity,
+      },
+    });
+  } catch (error) {
+    console.error(error);
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to load dashboard data." });
+  }
+};
diff --git a/server/src/controllers/github.controller.js b/server/src/controllers/github.controller.js
index 81aa96c..d87ba0f 100644
--- a/server/src/controllers/github.controller.js
+++ b/server/src/controllers/github.controller.js
@@ -4,7 +4,7 @@ import { PrismaClient } from "@prisma/client";
 const prisma = new PrismaClient();
 
 // Now async, and pulls securely from the DB using the user ID
-const getGithubToken = async (req, res) => {
+export const getGithubToken = async (req, res) => {
   const user = await prisma.user.findUnique({
     where: { id: req.user.id },
   });
@@ -23,7 +23,7 @@ const getGithubToken = async (req, res) => {
   return githubToken;
 };
 
-const githubHeaders = (token) => ({
+export const githubHeaders = (token) => ({
   Authorization: `Bearer ${token}`,
   Accept: "application/vnd.github+json",
   "X-GitHub-Api-Version": "2022-11-28",
@@ -50,63 +50,32 @@ const getPriority = (labels) => {
 
 export const getCurrentSprint = async (req, res) => {
   try {
-    const githubToken = await getGithubToken(req, res); // Added await
+    const githubToken = await getGithubToken(req, res);
+    if (!githubToken) return;
 
-    if (!githubToken) {
-      return;
-    }
+    // SECURE: Fetch repo from the isolated Workspace context
+    const repository = await prisma.repository.findUnique({ where: { workspaceId: req.workspace.id } });
+    if (!repository) return res.status(404).json({ success: false, message: "No GitHub repository linked to this workspace." });
 
-    const { owner, repo } = req.params;
+    const owner = repository.owner;
+    const repo = repository.name;
 
-    const response = await fetch(
-      `https://api.github.com/repos/${owner}/${repo}/milestones?state=open&sort=due_on&direction=asc&per_page=100`,
-      {
-        headers: githubHeaders(githubToken),
-      }
-    );
+    const response = await fetch(`https://api.github.com/repos/${owner}/${repo}/milestones?state=open&sort=due_on&direction=asc&per_page=100`, {
+      headers: githubHeaders(githubToken),
+    });
 
     const milestones = await response.json();
-
-    if (!response.ok) {
-      return res.status(response.status).json({
-        success: false,
-        message: milestones.message || "Could not fetch GitHub milestones.",
-      });
-    }
+    if (!response.ok) return res.status(response.status).json({ success: false, message: milestones.message });
 
     if (!milestones.length) {
-      return res.status(404).json({
-        success: false,
-        message: "No open milestone found. Create a GitHub milestone first.",
-      });
+      return res.status(404).json({ success: false, message: "No open milestone found." });
     }
 
     const now = new Date();
-
-    // Uses the nearest milestone that has not passed its due date.
-    const currentSprint =
-      milestones.find(
-        (milestone) =>
-          milestone.due_on && new Date(milestone.due_on) >= now
-      ) || milestones[0];
-
-    const totalItems =
-      currentSprint.open_issues + currentSprint.closed_issues;
-
-    const progress =
-      totalItems === 0
-        ? 0
-        : Math.round((currentSprint.closed_issues / totalItems) * 100);
-
-    const daysLeft = currentSprint.due_on
-      ? Math.max(
-          0,
-          Math.ceil(
-            (new Date(currentSprint.due_on) - now) /
-              (1000 * 60 * 60 * 24)
-          )
-        )
-      : null;
+    const currentSprint = milestones.find((m) => m.due_on && new Date(m.due_on) >= now) || milestones[0];
+    const totalItems = currentSprint.open_issues + currentSprint.closed_issues;
+    const progress = totalItems === 0 ? 0 : Math.round((currentSprint.closed_issues / totalItems) * 100);
+    const daysLeft = currentSprint.due_on ? Math.max(0, Math.ceil((new Date(currentSprint.due_on) - now) / (1000 * 60 * 60 * 24))) : null;
 
     return res.status(200).json({
       success: true,
@@ -120,50 +89,34 @@ export const getCurrentSprint = async (req, res) => {
         totalItems,
         completedTasks: currentSprint.closed_issues,
         todoTasks: currentSprint.open_issues,
-
-        // GitHub milestones do not natively store story points.
         storyPoints: null,
         inProgressTasks: null,
       },
     });
   } catch (error) {
-    console.error("Current sprint API error:", error);
-
-    return res.status(500).json({
-      success: false,
-      message: "Could not fetch current sprint.",
-    });
+    return res.status(500).json({ success: false, message: "Could not fetch current sprint." });
   }
 };
 
 export const getOpenIssues = async (req, res) => {
   try {
-    const githubToken = await getGithubToken(req, res); // Added await
+    const githubToken = await getGithubToken(req, res);
+    if (!githubToken) return;
 
-    if (!githubToken) {
-      return;
-    }
+    // SECURE: Fetch repo from the isolated Workspace context
+    const repository = await prisma.repository.findUnique({ where: { workspaceId: req.workspace.id } });
+    if (!repository) return res.status(404).json({ success: false, message: "No GitHub repository linked to this workspace." });
 
-    const { owner, repo } = req.params;
+    const owner = repository.owner;
+    const repo = repository.name;
 
-    const response = await fetch(
-      `https://api.github.com/repos/${owner}/${repo}/issues?state=open&sort=updated&direction=desc&per_page=30`,
-      {
-        headers: githubHeaders(githubToken),
-      }
-    );
+    const response = await fetch(`https://api.github.com/repos/${owner}/${repo}/issues?state=open&sort=updated&direction=desc&per_page=30`, {
+      headers: githubHeaders(githubToken),
+    });
 
     const githubItems = await response.json();
+    if (!response.ok) return res.status(response.status).json({ success: false, message: githubItems.message });
 
-    if (!response.ok) {
-      return res.status(response.status).json({
-        success: false,
-        message: githubItems.message || "Could not fetch GitHub issues.",
-      });
-    }
-
-    // GitHub's Issues API can include pull requests.
-    // A real issue has no pull_request property.
     const issues = githubItems
       .filter((item) => !item.pull_request)
       .slice(0, 5)
@@ -177,72 +130,81 @@ export const getOpenIssues = async (req, res) => {
         updatedAt: issue.updated_at,
       }));
 
-    return res.status(200).json({
-      success: true,
-      data: issues,
-    });
+    return res.status(200).json({ success: true, data: issues });
   } catch (error) {
-    console.error("Open issues API error:", error);
-
-    return res.status(500).json({
-      success: false,
-      message: "Could not fetch open issues.",
-    });
+    return res.status(500).json({ success: false, message: "Could not fetch open issues." });
   }
 };
 
 export const getPullRequests = async (req, res) => {
   try {
-    const githubToken = await getGithubToken(req, res); // Added await
+    const githubToken = await getGithubToken(req, res);
+    if (!githubToken) return;
 
-    if (!githubToken) {
-      return;
-    }
+    // SECURE: Fetch repo from the isolated Workspace context
+    const repository = await prisma.repository.findUnique({ where: { workspaceId: req.workspace.id } });
+    if (!repository) return res.status(404).json({ success: false, message: "No GitHub repository linked to this workspace." });
 
-    const { owner, repo } = req.params;
+    const owner = repository.owner;
+    const repo = repository.name;
 
-    const response = await fetch(
-      `https://api.github.com/repos/${owner}/${repo}/pulls?state=open&sort=updated&direction=desc&per_page=5`,
-      {
-        headers: githubHeaders(githubToken),
-      }
-    );
+    const response = await fetch(`https://api.github.com/repos/${owner}/${repo}/pulls?state=open&sort=updated&direction=desc&per_page=5`, {
+      headers: githubHeaders(githubToken),
+    });
 
     const pullRequests = await response.json();
-
-    if (!response.ok) {
-      return res.status(response.status).json({
-        success: false,
-        message:
-          pullRequests.message || "Could not fetch GitHub pull requests.",
-      });
-    }
+    if (!response.ok) return res.status(response.status).json({ success: false, message: pullRequests.message });
 
     const data = pullRequests.map((pullRequest) => ({
       id: pullRequest.number,
       title: pullRequest.title,
       author: pullRequest.user.login,
       comments: pullRequest.comments,
-      status: pullRequest.draft
-        ? "Draft"
-        : pullRequest.requested_reviewers.length > 0
-          ? "Review"
-          : "Open",
+      status: pullRequest.draft ? "Draft" : pullRequest.requested_reviewers.length > 0 ? "Review" : "Open",
       url: pullRequest.html_url,
       createdAt: pullRequest.created_at,
       updatedAt: pullRequest.updated_at,
     }));
 
-    return res.status(200).json({
-      success: true,
-      data,
-    });
+    return res.status(200).json({ success: true, data });
   } catch (error) {
-    console.error("Pull requests API error:", error);
+    return res.status(500).json({ success: false, message: "Could not fetch pull requests." });
+  }
+};
 
-    return res.status(500).json({
-      success: false,
-      message: "Could not fetch pull requests.",
+// @desc    Get all accessible repositories for the logged-in user
+// @route   GET /api/github/repositories
+export const getAccessibleRepositories = async (req, res) => {
+  try {
+    const githubToken = await getGithubToken(req, res);
+    if (!githubToken) return; // Error response is already handled by getGithubToken
+
+    // Fetch up to 100 recent repos
+    const response = await fetch("https://api.github.com/user/repos?sort=updated&per_page=100", {
+      headers: githubHeaders(githubToken),
     });
+
+    const repos = await response.json();
+
+    if (!response.ok) {
+      return res.status(response.status).json({ success: false, message: repos.message || "Failed to fetch repositories from GitHub." });
+    }
+
+    // Strip out the massive amount of unnecessary GitHub data and return only what the frontend needs
+    const data = repos.map(repo => ({
+      id: repo.id,
+      name: repo.name,
+      fullName: repo.full_name,
+      owner: repo.owner.login,
+      description: repo.description,
+      visibility: repo.visibility,
+      defaultBranch: repo.default_branch,
+      htmlUrl: repo.html_url
+    }));
+
+    return res.status(200).json({ success: true, data });
+  } catch (error) {
+    console.error("Fetch repos error:", error);
+    return res.status(500).json({ success: false, message: "Could not fetch GitHub repositories." });
   }
 };
\ No newline at end of file
diff --git a/server/src/controllers/invitation.controller.js b/server/src/controllers/invitation.controller.js
new file mode 100644
index 0000000..56e766f
--- /dev/null
+++ b/server/src/controllers/invitation.controller.js
@@ -0,0 +1,207 @@
+import { PrismaClient } from "@prisma/client";
+const prisma = new PrismaClient();
+
+// @desc    Search for DevHub users to invite (excludes existing members & pending invites)
+// @route   GET /api/invitations/org/:orgId/search
+export const searchUsersToInvite = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const searchQuery = req.query.search || "";
+
+    if (searchQuery.length < 3) {
+      return res
+        .status(400)
+        .json({
+          success: false,
+          message: "Search query must be at least 3 characters.",
+        });
+    }
+
+    // Find users matching search, who are NOT already members, and do NOT have a PENDING invite
+    const users = await prisma.user.findMany({
+      where: {
+        OR: [
+          { username: { contains: searchQuery, mode: "insensitive" } },
+          { email: { contains: searchQuery, mode: "insensitive" } },
+        ],
+        NOT: {
+          OR: [
+            { organizationMembers: { some: { organizationId: orgId } } },
+            {
+              invitationsReceived: {
+                some: { organizationId: orgId, status: "PENDING" },
+              },
+            },
+          ],
+        },
+      },
+      select: { id: true, username: true, email: true, avatar: true },
+      take: 10,
+    });
+
+    return res.status(200).json({ success: true, data: users });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Invite a user to the organization
+// @route   POST /api/invitations/org/:orgId
+export const createInvitation = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const { userId } = req.body;
+
+    if (!userId)
+      return res
+        .status(400)
+        .json({ success: false, message: "User ID is required." });
+
+    const existingMember = await prisma.organizationMember.findUnique({
+      where: { organizationId_userId: { organizationId: orgId, userId } },
+    });
+    if (existingMember)
+      return res
+        .status(409)
+        .json({ success: false, message: "User is already a member." });
+
+    const pendingInvite = await prisma.invitation.findFirst({
+      where: {
+        organizationId: orgId,
+        invitedUserId: userId,
+        status: "PENDING",
+      },
+    });
+    if (pendingInvite)
+      return res
+        .status(409)
+        .json({
+          success: false,
+          message: "User already has a pending invitation.",
+        });
+
+    // Expires in 7 days
+    const expiresAt = new Date();
+    expiresAt.setDate(expiresAt.getDate() + 7);
+
+    const invitation = await prisma.invitation.create({
+      data: {
+        organizationId: orgId,
+        invitedUserId: userId,
+        invitedById: req.user.id,
+        role: "MEMBER", // Default to MEMBER as per your spec
+        expiresAt,
+      },
+    });
+
+    return res
+      .status(201)
+      .json({ success: true, message: "Invitation sent successfully" });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Get all pending invitations for the logged-in user
+// @route   GET /api/invitations/mine
+export const getMyInvitations = async (req, res) => {
+  try {
+    const invitations = await prisma.invitation.findMany({
+      where: { invitedUserId: req.user.id, status: "PENDING" },
+      include: {
+        organization: { select: { id: true, name: true, description: true } },
+        invitedBy: { select: { username: true, email: true, avatar: true } },
+      },
+    });
+    return res.status(200).json({ success: true, data: invitations });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Accept an invitation
+// @route   PATCH /api/invitations/:invitationId/accept
+export const acceptInvitation = async (req, res) => {
+  try {
+    const invitationId = parseInt(req.params.invitationId);
+
+    // Use a transaction! If adding the member fails, the invite won't be marked accepted.
+    await prisma.$transaction(async (tx) => {
+      const invite = await tx.invitation.findUnique({
+        where: { id: invitationId },
+      });
+
+      if (
+        !invite ||
+        invite.invitedUserId !== req.user.id ||
+        invite.status !== "PENDING"
+      ) {
+        throw new Error("Invalid or expired invitation");
+      }
+
+      await tx.invitation.update({
+        where: { id: invitationId },
+        data: { status: "ACCEPTED" },
+      });
+
+      await tx.organizationMember.create({
+        data: {
+          organizationId: invite.organizationId,
+          userId: req.user.id,
+          role: invite.role,
+        },
+      });
+    });
+
+    return res
+      .status(200)
+      .json({ success: true, message: "Invitation accepted!" });
+  } catch (error) {
+    return res
+      .status(400)
+      .json({
+        success: false,
+        message: error.message || "Failed to accept invitation",
+      });
+  }
+};
+
+// @desc    Reject an invitation
+// @route   PATCH /api/invitations/:invitationId/reject
+export const rejectInvitation = async (req, res) => {
+  try {
+    const invitationId = parseInt(req.params.invitationId);
+
+    const invite = await prisma.invitation.findUnique({
+      where: { id: invitationId },
+    });
+    if (
+      !invite ||
+      invite.invitedUserId !== req.user.id ||
+      invite.status !== "PENDING"
+    ) {
+      return res
+        .status(400)
+        .json({ success: false, message: "Invalid invitation" });
+    }
+
+    await prisma.invitation.update({
+      where: { id: invitationId },
+      data: { status: "REJECTED" },
+    });
+
+    return res
+      .status(200)
+      .json({ success: true, message: "Invitation rejected" });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
diff --git a/server/src/controllers/org.controller.js b/server/src/controllers/org.controller.js
new file mode 100644
index 0000000..5094d8a
--- /dev/null
+++ b/server/src/controllers/org.controller.js
@@ -0,0 +1,232 @@
+import { PrismaClient } from "@prisma/client";
+const prisma = new PrismaClient();
+
+// @desc    Create a new organization
+// @route   POST /api/organizations
+export const createOrganization = async (req, res) => {
+  const { name, description } = req.body;
+  if (!name)
+    return res
+      .status(400)
+      .json({ success: false, message: "Organization name is required." });
+
+  try {
+    // We use a transaction because the Org and the Member record must be created together safely
+    const newOrg = await prisma.$transaction(async (tx) => {
+      const org = await tx.organization.create({
+        data: {
+          name,
+          description,
+          ownerId: req.user.id,
+        },
+      });
+
+      await tx.organizationMember.create({
+        data: {
+          organizationId: org.id,
+          userId: req.user.id,
+          role: "OWNER",
+        },
+      });
+
+      return org;
+    });
+
+    return res
+      .status(201)
+      .json({ success: true, message: "Organization created", data: newOrg });
+  } catch (error) {
+    console.error("Create Org Error:", error);
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Get all organizations the user belongs to
+// @route   GET /api/organizations/mine
+export const getMyOrganizations = async (req, res) => {
+  try {
+    const memberships = await prisma.organizationMember.findMany({
+      where: { userId: req.user.id },
+      include: { organization: true },
+    });
+
+    // Extract the org details and append the user's specific role for that org
+    const orgs = memberships.map((m) => ({
+      ...m.organization,
+      myRole: m.role,
+    }));
+
+    return res.status(200).json({ success: true, data: orgs });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Get specific organization details
+// @route   GET /api/organizations/:orgId
+export const getOrganizationById = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const org = await prisma.organization.findUnique({
+      where: { id: orgId },
+      include: { _count: { select: { members: true } } },
+    });
+
+    if (!org)
+      return res
+        .status(404)
+        .json({ success: false, message: "Organization not found" });
+
+    return res.status(200).json({
+      success: true,
+      data: {
+        ...org,
+        myRole: req.orgRole, // Injected securely by our org.middleware.js!
+      },
+    });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Update organization basic details
+// @route   PATCH /api/organizations/:orgId
+export const updateOrganization = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const { name, description } = req.body;
+
+    const updatedOrg = await prisma.organization.update({
+      where: { id: orgId },
+      data: { name, description },
+    });
+
+    return res
+      .status(200)
+      .json({
+        success: true,
+        message: "Organization updated",
+        data: updatedOrg,
+      });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Get organization members
+// @route   GET /api/organizations/:orgId/members
+export const getOrganizationMembers = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const members = await prisma.organizationMember.findMany({
+      where: { organizationId: orgId },
+      include: {
+        user: { select: { id: true, username: true, email: true, avatar: true, jobTitle: true } }
+      }
+    });
+    return res.status(200).json({ success: true, data: members });
+  } catch (error) {
+    return res.status(500).json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Update a member's role
+// @route   PATCH /api/organizations/:orgId/members/:memberId/role
+export const updateMemberRole = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const memberId = parseInt(req.params.memberId); // This is the OrganizationMember.id
+    const { newRole } = req.body;
+    
+    // Only OWNER or ADMIN can hit this endpoint (enforced by our middleware)
+    const myRole = req.orgRole;
+
+    if (newRole === "OWNER") return res.status(403).json({ success: false, message: "Cannot assign OWNER role directly. Use transfer ownership." });
+
+    const targetMember = await prisma.organizationMember.findUnique({ where: { id: memberId } });
+    if (!targetMember || targetMember.organizationId !== orgId) return res.status(404).json({ success: false, message: "Member not found." });
+    if (targetMember.role === "OWNER") return res.status(403).json({ success: false, message: "Cannot change the role of the organization owner." });
+    
+    // Admin matrix checks
+    if (myRole === "ADMIN" && newRole === "ADMIN") return res.status(403).json({ success: false, message: "Admins cannot promote others to Admin." });
+    if (myRole === "ADMIN" && targetMember.role === "ADMIN") return res.status(403).json({ success: false, message: "Admins cannot change the role of other Admins." });
+
+    const updatedMember = await prisma.organizationMember.update({
+      where: { id: memberId },
+      data: { role: newRole }
+    });
+    return res.status(200).json({ success: true, message: "Role updated", data: updatedMember });
+  } catch (error) {
+    return res.status(500).json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Remove a member
+// @route   DELETE /api/organizations/:orgId/members/:memberId
+export const removeMember = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const memberId = parseInt(req.params.memberId); 
+    const myRole = req.orgRole;
+
+    const targetMember = await prisma.organizationMember.findUnique({ where: { id: memberId } });
+    if (!targetMember || targetMember.organizationId !== orgId) return res.status(404).json({ success: false, message: "Member not found." });
+    if (targetMember.role === "OWNER") return res.status(403).json({ success: false, message: "Cannot remove the organization owner. Transfer ownership first." });
+    if (myRole === "ADMIN" && targetMember.role === "ADMIN") return res.status(403).json({ success: false, message: "Admins cannot remove other Admins." });
+
+    await prisma.organizationMember.delete({ where: { id: memberId } });
+    return res.status(200).json({ success: true, message: "Member removed" });
+  } catch (error) {
+    return res.status(500).json({ success: false, message: "Internal server error" });
+  }
+};
+
+// @desc    Transfer ownership (Database Transaction)
+// @route   POST /api/organizations/:orgId/transfer-ownership
+export const transferOwnership = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const { newOwnerUserId } = req.body;
+    
+    // myRole is strictly OWNER (enforced by middleware)
+    if (newOwnerUserId === req.user.id) return res.status(400).json({ success: false, message: "You are already the owner." });
+
+    await prisma.$transaction(async (tx) => {
+      // 1. Verify target is a member
+      const newOwnerMember = await tx.organizationMember.findUnique({
+        where: { organizationId_userId: { organizationId: orgId, userId: newOwnerUserId } }
+      });
+      if (!newOwnerMember) throw new Error("Target user is not a member of the organization.");
+
+      // 2. Demote current owner to ADMIN
+      await tx.organizationMember.update({
+        where: { organizationId_userId: { organizationId: orgId, userId: req.user.id } },
+        data: { role: "ADMIN" }
+      });
+
+      // 3. Promote new owner
+      await tx.organizationMember.update({
+        where: { id: newOwnerMember.id },
+        data: { role: "OWNER" }
+      });
+
+      // 4. Update the actual Organization ownerId field
+      await tx.organization.update({
+        where: { id: orgId },
+        data: { ownerId: newOwnerUserId }
+      });
+    });
+
+    return res.status(200).json({ success: true, message: "Ownership transferred successfully." });
+  } catch (error) {
+    return res.status(400).json({ success: false, message: error.message || "Failed to transfer ownership" });
+  }
+};
\ No newline at end of file
diff --git a/server/src/controllers/project.controller.js b/server/src/controllers/project.controller.js
new file mode 100644
index 0000000..72506eb
--- /dev/null
+++ b/server/src/controllers/project.controller.js
@@ -0,0 +1,127 @@
+import { PrismaClient } from "@prisma/client";
+import { logActivity } from "../utils/activityLogger.js";
+
+const prisma = new PrismaClient();
+
+// Helper to calculate progress based on tasks
+const calculateProgress = (tasks) => {
+  if (!tasks || tasks.length === 0) return 0;
+  const completed = tasks.filter((t) => t.status === "DONE").length;
+  return Math.round((completed / tasks.length) * 100);
+};
+
+// @desc    Create a new project
+// @route   POST /api/organizations/:orgId/workspaces/:workspaceId/projects
+export const createProject = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id; // From workspace.middleware
+    const { name, description } = req.body;
+
+    if (!name)
+      return res
+        .status(400)
+        .json({ success: false, message: "Project name is required" });
+
+    const existing = await prisma.project.findUnique({
+      where: { workspaceId_name: { workspaceId, name } },
+    });
+
+    if (existing)
+      return res
+        .status(400)
+        .json({
+          success: false,
+          message: "A project with this name already exists in this workspace.",
+        });
+
+    const project = await prisma.project.create({
+      data: {
+        workspaceId,
+        name,
+        description,
+        createdById: req.user.id,
+      },
+    });
+
+    // Automatically generate the Activity!
+    await logActivity(
+      workspaceId,
+      req.user.id,
+      "PROJECT_CREATED",
+      "PROJECT",
+      project.id,
+      `Created project "${project.name}"`,
+    );
+
+    return res.status(201).json({ success: true, data: project });
+  } catch (error) {
+    console.error(error);
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to create project." });
+  }
+};
+
+// @desc    Get all projects in workspace
+// @route   GET /api/organizations/:orgId/workspaces/:workspaceId/projects
+export const getProjects = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const projects = await prisma.project.findMany({
+      where: { workspaceId },
+      include: {
+        tasks: { select: { status: true } },
+        createdBy: { select: { username: true, avatar: true } },
+      },
+      orderBy: { createdAt: "desc" },
+    });
+
+    // Calculate real-time progress on the fly for the UI
+    const data = projects.map((p) => ({
+      ...p,
+      progress: calculateProgress(p.tasks),
+      taskCount: p.tasks.length,
+    }));
+
+    return res.status(200).json({ success: true, data });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to fetch projects." });
+  }
+};
+
+// @desc    Get specific project details
+// @route   GET /api/organizations/:orgId/workspaces/:workspaceId/projects/:projectId
+export const getProjectDetails = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const projectId = parseInt(req.params.projectId);
+
+    const project = await prisma.project.findFirst({
+      where: { id: projectId, workspaceId }, // Ensures data isolation!
+      include: {
+        tasks: {
+          include: {
+            assignee: { select: { username: true, avatar: true } },
+          },
+          orderBy: { createdAt: "desc" },
+        },
+        createdBy: { select: { username: true, avatar: true } },
+      },
+    });
+
+    if (!project)
+      return res
+        .status(404)
+        .json({ success: false, message: "Project not found" });
+
+    project.progress = calculateProgress(project.tasks);
+
+    return res.status(200).json({ success: true, data: project });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to fetch project details." });
+  }
+};
diff --git a/server/src/controllers/sprint.controller.js b/server/src/controllers/sprint.controller.js
new file mode 100644
index 0000000..6bf3c88
--- /dev/null
+++ b/server/src/controllers/sprint.controller.js
@@ -0,0 +1,161 @@
+import { PrismaClient } from "@prisma/client";
+import { logActivity } from "../utils/activityLogger.js";
+
+const prisma = new PrismaClient();
+
+// Helper to calculate progress based on Story Points (fallback to task count)
+const calculateSprintProgress = (tasks) => {
+  if (!tasks || tasks.length === 0) return 0;
+
+  const totalPoints = tasks.reduce((sum, t) => sum + (t.storyPoints || 0), 0);
+  const completedPoints = tasks
+    .filter((t) => t.status === "DONE")
+    .reduce((sum, t) => sum + (t.storyPoints || 0), 0);
+
+  if (totalPoints > 0) {
+    return Math.round((completedPoints / totalPoints) * 100);
+  }
+
+  // Fallback to task count if no story points exist
+  const completed = tasks.filter((t) => t.status === "DONE").length;
+  return Math.round((completed / tasks.length) * 100);
+};
+
+// @desc    Create a new sprint
+// @route   POST /api/organizations/:orgId/workspaces/:workspaceId/sprints
+export const createSprint = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const { name, goal, startDate, endDate } = req.body;
+
+    if (!name)
+      return res
+        .status(400)
+        .json({ success: false, message: "Sprint name is required" });
+
+    const sprint = await prisma.sprint.create({
+      data: {
+        workspaceId,
+        name,
+        goal,
+        startDate: startDate ? new Date(startDate) : null,
+        endDate: endDate ? new Date(endDate) : null,
+        createdById: req.user.id,
+      },
+    });
+
+    await logActivity(
+      workspaceId,
+      req.user.id,
+      "SPRINT_CREATED",
+      "SPRINT",
+      sprint.id,
+      `Created sprint "${sprint.name}"`,
+    );
+
+    return res.status(201).json({ success: true, data: sprint });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to create sprint." });
+  }
+};
+
+// @desc    Get all sprints in workspace
+// @route   GET /api/organizations/:orgId/workspaces/:workspaceId/sprints
+export const getSprints = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const sprints = await prisma.sprint.findMany({
+      where: { workspaceId },
+      include: {
+        tasks: { select: { status: true, storyPoints: true } },
+      },
+      orderBy: { createdAt: "desc" },
+    });
+
+    const data = sprints.map((s) => ({
+      ...s,
+      progress: calculateSprintProgress(s.tasks),
+      taskCount: s.tasks.length,
+    }));
+
+    return res.status(200).json({ success: true, data });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to fetch sprints." });
+  }
+};
+
+// @desc    Start a sprint (Enforces 1 Active Sprint Rule)
+// @route   POST /api/organizations/:orgId/workspaces/:workspaceId/sprints/:sprintId/start
+export const startSprint = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const sprintId = parseInt(req.params.sprintId);
+
+    // CRITICAL REQUIREMENT: Only one active sprint per workspace
+    const activeSprint = await prisma.sprint.findFirst({
+      where: { workspaceId, status: "ACTIVE" },
+    });
+
+    if (activeSprint) {
+      return res
+        .status(409)
+        .json({
+          success: false,
+          message: `Conflict: Cannot start sprint. "${activeSprint.name}" is currently active.`,
+        });
+    }
+
+    const sprint = await prisma.sprint.update({
+      where: { id: sprintId, workspaceId },
+      data: { status: "ACTIVE" },
+    });
+
+    await logActivity(
+      workspaceId,
+      req.user.id,
+      "SPRINT_STARTED",
+      "SPRINT",
+      sprint.id,
+      `Started sprint "${sprint.name}"`,
+    );
+
+    return res.status(200).json({ success: true, data: sprint });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to start sprint." });
+  }
+};
+
+// @desc    Complete a sprint
+// @route   POST /api/organizations/:orgId/workspaces/:workspaceId/sprints/:sprintId/complete
+export const completeSprint = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const sprintId = parseInt(req.params.sprintId);
+
+    const sprint = await prisma.sprint.update({
+      where: { id: sprintId, workspaceId },
+      data: { status: "COMPLETED" },
+    });
+
+    await logActivity(
+      workspaceId,
+      req.user.id,
+      "SPRINT_COMPLETED",
+      "SPRINT",
+      sprint.id,
+      `Completed sprint "${sprint.name}"`,
+    );
+
+    return res.status(200).json({ success: true, data: sprint });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to complete sprint." });
+  }
+};
diff --git a/server/src/controllers/task.controller.js b/server/src/controllers/task.controller.js
new file mode 100644
index 0000000..d1ea0f1
--- /dev/null
+++ b/server/src/controllers/task.controller.js
@@ -0,0 +1,235 @@
+import { PrismaClient } from "@prisma/client";
+import { logActivity } from "../utils/activityLogger.js";
+
+const prisma = new PrismaClient();
+
+// @desc    Create a new task
+// @route   POST /api/organizations/:orgId/workspaces/:workspaceId/tasks
+export const createTask = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const {
+      projectId,
+      sprintId,
+      title,
+      description,
+      priority,
+      assigneeId,
+      dueDate,
+      storyPoints,
+    } = req.body;
+
+    if (!projectId || !title)
+      return res
+        .status(400)
+        .json({
+          success: false,
+          message: "Project ID and Title are required.",
+        });
+
+    // Enforce data isolation: Project MUST belong to this Workspace
+    const project = await prisma.project.findUnique({
+      where: { id: parseInt(projectId) },
+    });
+    if (!project || project.workspaceId !== workspaceId) {
+      return res
+        .status(403)
+        .json({ success: false, message: "Invalid project specified." });
+    }
+
+    // Enforce assignment rule: Assignee MUST belong to this Workspace
+    if (assigneeId) {
+      const member = await prisma.workspaceMember.findUnique({
+        where: {
+          workspaceId_userId: { workspaceId, userId: parseInt(assigneeId) },
+        },
+      });
+      if (!member)
+        return res
+          .status(403)
+          .json({
+            success: false,
+            message: "Assignee must be a member of this workspace.",
+          });
+    }
+
+    // Enforce Sprint isolation
+    if (sprintId) {
+      const sprint = await prisma.sprint.findUnique({
+        where: { id: parseInt(sprintId) },
+      });
+      if (!sprint || sprint.workspaceId !== workspaceId)
+        return res
+          .status(403)
+          .json({ success: false, message: "Invalid sprint specified." });
+    }
+
+    const task = await prisma.task.create({
+      data: {
+        workspaceId,
+        projectId: parseInt(projectId),
+        sprintId: sprintId ? parseInt(sprintId) : null,
+        title,
+        description,
+        priority: priority || "MEDIUM",
+        assigneeId: assigneeId ? parseInt(assigneeId) : null,
+        dueDate: dueDate ? new Date(dueDate) : null,
+        storyPoints: storyPoints ? parseInt(storyPoints) : 0,
+        createdById: req.user.id,
+      },
+    });
+
+    await logActivity(
+      workspaceId,
+      req.user.id,
+      "TASK_CREATED",
+      "TASK",
+      task.id,
+      `Created task "${task.title}"`,
+    );
+    if (assigneeId) {
+      await logActivity(
+        workspaceId,
+        req.user.id,
+        "TASK_UPDATED",
+        "TASK",
+        task.id,
+        `Assigned task "${task.title}" to a workspace member`,
+      );
+    }
+
+    return res.status(201).json({ success: true, data: task });
+  } catch (error) {
+    console.error(error);
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to create task." });
+  }
+};
+
+// @desc    Get all tasks (with optional filtering)
+// @route   GET /api/organizations/:orgId/workspaces/:workspaceId/tasks
+export const getTasks = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const { projectId, sprintId, status, assigneeId } = req.query;
+
+    const where = { workspaceId };
+    if (projectId) where.projectId = parseInt(projectId);
+    if (sprintId) where.sprintId = parseInt(sprintId);
+    if (status) where.status = status;
+    if (assigneeId) where.assigneeId = parseInt(assigneeId);
+
+    const tasks = await prisma.task.findMany({
+      where,
+      include: {
+        assignee: { select: { id: true, username: true, avatar: true } },
+        project: { select: { name: true } },
+        sprint: { select: { name: true } },
+      },
+      orderBy: { createdAt: "desc" },
+    });
+
+    return res.status(200).json({ success: true, data: tasks });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to fetch tasks." });
+  }
+};
+
+// @desc    Update a task (status, sprint, assignee)
+// @route   PATCH /api/organizations/:orgId/workspaces/:workspaceId/tasks/:taskId
+export const updateTask = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const taskId = parseInt(req.params.taskId);
+    const { status, priority, assigneeId, sprintId, storyPoints } = req.body;
+
+    const existing = await prisma.task.findFirst({
+      where: { id: taskId, workspaceId },
+    });
+    if (!existing)
+      return res
+        .status(404)
+        .json({ success: false, message: "Task not found." });
+
+    if (assigneeId && assigneeId !== existing.assigneeId) {
+      const member = await prisma.workspaceMember.findUnique({
+        where: {
+          workspaceId_userId: { workspaceId, userId: parseInt(assigneeId) },
+        },
+      });
+      if (!member)
+        return res
+          .status(403)
+          .json({
+            success: false,
+            message: "Assignee must be a member of this workspace.",
+          });
+    }
+
+    if (sprintId && sprintId !== existing.sprintId) {
+      const sprint = await prisma.sprint.findUnique({
+        where: { id: parseInt(sprintId) },
+      });
+      if (!sprint || sprint.workspaceId !== workspaceId)
+        return res
+          .status(403)
+          .json({ success: false, message: "Invalid sprint specified." });
+    }
+
+    const task = await prisma.task.update({
+      where: { id: taskId },
+      data: {
+        status: status || existing.status,
+        priority: priority || existing.priority,
+        // Allow removing assignee by explicitly passing null
+        assigneeId:
+          assigneeId !== undefined
+            ? assigneeId
+              ? parseInt(assigneeId)
+              : null
+            : existing.assigneeId,
+        sprintId:
+          sprintId !== undefined
+            ? sprintId
+              ? parseInt(sprintId)
+              : null
+            : existing.sprintId,
+        storyPoints:
+          storyPoints !== undefined
+            ? parseInt(storyPoints)
+            : existing.storyPoints,
+      },
+    });
+
+    if (status && status !== existing.status) {
+      if (status === "DONE") {
+        await logActivity(
+          workspaceId,
+          req.user.id,
+          "TASK_COMPLETED",
+          "TASK",
+          task.id,
+          `Completed task "${task.title}"`,
+        );
+      } else {
+        await logActivity(
+          workspaceId,
+          req.user.id,
+          "TASK_UPDATED",
+          "TASK",
+          task.id,
+          `Moved task "${task.title}" to ${status}`,
+        );
+      }
+    }
+
+    return res.status(200).json({ success: true, data: task });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to update task." });
+  }
+};
diff --git a/server/src/controllers/workspace.controller.js b/server/src/controllers/workspace.controller.js
new file mode 100644
index 0000000..be8ced3
--- /dev/null
+++ b/server/src/controllers/workspace.controller.js
@@ -0,0 +1,242 @@
+import { PrismaClient } from "@prisma/client";
+import { getGithubToken, githubHeaders } from "./github.controller.js";
+
+const prisma = new PrismaClient();
+
+// @desc    Create a new workspace inside an organization
+// @route   POST /api/organizations/:orgId/workspaces
+export const createWorkspace = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const {
+      name,
+      description,
+      repositoryOption,
+      repositoryName,
+      repositoryDescription,
+      isPrivate,
+      existingRepo,
+    } = req.body;
+
+    if (!name || !repositoryOption) {
+      return res
+        .status(400)
+        .json({
+          success: false,
+          message: "Workspace name and repository option are required.",
+        });
+    }
+
+    let repoData = null;
+
+    // --- STEP 1: External GitHub API Operations ---
+    if (repositoryOption === "CREATE_NEW") {
+      const githubToken = await getGithubToken(req, res);
+      if (!githubToken) return; // getGithubToken handles the error response
+
+      if (!repositoryName)
+        return res
+          .status(400)
+          .json({ success: false, message: "Repository name is required." });
+
+      const response = await fetch("https://api.github.com/user/repos", {
+        method: "POST",
+        headers: githubHeaders(githubToken),
+        body: JSON.stringify({
+          name: repositoryName,
+          description: repositoryDescription,
+          private: isPrivate,
+          auto_init: true, // Always init with a README
+        }),
+      });
+
+      const newRepo = await response.json();
+      if (!response.ok)
+        return res
+          .status(response.status)
+          .json({
+            success: false,
+            message: newRepo.message || "Failed to create GitHub repository.",
+          });
+
+      repoData = {
+        githubRepositoryId: newRepo.id.toString(), // Enforce String to prevent ID overflow
+        name: newRepo.name,
+        fullName: newRepo.full_name,
+        owner: newRepo.owner.login,
+        description: newRepo.description,
+        visibility: newRepo.visibility,
+        defaultBranch: newRepo.default_branch,
+        htmlUrl: newRepo.html_url,
+      };
+    } else if (repositoryOption === "CONNECT_EXISTING") {
+      if (!existingRepo || !existingRepo.id)
+        return res
+          .status(400)
+          .json({
+            success: false,
+            message: "Existing repository selection is invalid.",
+          });
+
+      // Ensure it's not already connected to a different workspace (1-to-1 enforcement)
+      const existingDbRepo = await prisma.repository.findUnique({
+        where: { githubRepositoryId: existingRepo.id.toString() },
+      });
+
+      if (existingDbRepo)
+        return res
+          .status(400)
+          .json({
+            success: false,
+            message:
+              "This GitHub repository is already connected to another workspace.",
+          });
+
+      repoData = {
+        githubRepositoryId: existingRepo.id.toString(),
+        name: existingRepo.name,
+        fullName: existingRepo.fullName,
+        owner: existingRepo.owner,
+        description: existingRepo.description,
+        visibility: existingRepo.visibility,
+        defaultBranch: existingRepo.defaultBranch,
+        htmlUrl: existingRepo.htmlUrl,
+      };
+    } else {
+      return res
+        .status(400)
+        .json({ success: false, message: "Invalid repository option." });
+    }
+
+    // --- STEP 2: Database Transaction ---
+    const newWorkspace = await prisma.$transaction(async (tx) => {
+      // 1. Create Workspace
+      const workspace = await tx.workspace.create({
+        data: {
+          organizationId: orgId,
+          name,
+          description,
+          createdById: req.user.id,
+        },
+      });
+
+      // 2. Attach Repository
+      await tx.repository.create({
+        data: {
+          workspaceId: workspace.id,
+          ...repoData,
+        },
+      });
+
+      // 3. Make Creator an Admin of the Workspace
+      await tx.workspaceMember.create({
+        data: {
+          workspaceId: workspace.id,
+          userId: req.user.id,
+          role: "WORKSPACE_ADMIN",
+        },
+      });
+
+      return workspace;
+    });
+
+    return res
+      .status(201)
+      .json({
+        success: true,
+        message: "Workspace created successfully",
+        data: newWorkspace,
+      });
+  } catch (error) {
+    console.error("Create workspace error:", error);
+    return res
+      .status(500)
+      .json({
+        success: false,
+        message: "Internal server error during workspace creation.",
+      });
+  }
+};
+
+// @desc    Get all workspaces for the organization that the user can see
+// @route   GET /api/organizations/:orgId/workspaces
+export const getWorkspaces = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const orgRole = req.orgRole; // Attached by requireOrgMember middleware
+
+    let whereClause = { organizationId: orgId };
+
+    // Organization Admins and Owners can see ALL workspaces.
+    // Managers and Members can only see workspaces they are explicitly added to.
+    if (orgRole !== "OWNER" && orgRole !== "ADMIN") {
+      whereClause.members = {
+        some: { userId: req.user.id },
+      };
+    }
+
+    const workspaces = await prisma.workspace.findMany({
+      where: whereClause,
+      include: {
+        repository: true,
+        createdBy: { select: { username: true, avatar: true } },
+        _count: { select: { members: true } },
+      },
+      orderBy: { createdAt: "desc" },
+    });
+
+    return res.status(200).json({ success: true, data: workspaces });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to fetch workspaces" });
+  }
+};
+
+// @desc    Get specific workspace details
+// @route   GET /api/organizations/:orgId/workspaces/:workspaceId
+export const getWorkspaceDetails = async (req, res) => {
+  try {
+    // req.workspace is safely populated by the requireWorkspaceMember middleware!
+    const workspaceId = req.workspace.id;
+
+    const workspace = await prisma.workspace.findUnique({
+      where: { id: workspaceId },
+      include: {
+        repository: true,
+        createdBy: { select: { username: true, avatar: true } },
+      },
+    });
+
+    return res.status(200).json({ success: true, data: workspace });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to fetch workspace details" });
+  }
+};
+
+// @desc    Archive Workspace
+// @route   PATCH /api/organizations/:orgId/workspaces/:workspaceId/archive
+export const archiveWorkspace = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+
+    const archived = await prisma.workspace.update({
+      where: { id: workspaceId },
+      data: { status: "ARCHIVED" },
+    });
+
+    return res
+      .status(200)
+      .json({
+        success: true,
+        message: "Workspace archived successfully",
+        data: archived,
+      });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to archive workspace" });
+  }
+};
diff --git a/server/src/controllers/workspaceMember.controller.js b/server/src/controllers/workspaceMember.controller.js
new file mode 100644
index 0000000..f1ae419
--- /dev/null
+++ b/server/src/controllers/workspaceMember.controller.js
@@ -0,0 +1,166 @@
+import { PrismaClient } from "@prisma/client";
+
+const prisma = new PrismaClient();
+
+// @desc    Get all members of a workspace
+// @route   GET /api/organizations/:orgId/workspaces/:workspaceId/members
+export const getWorkspaceMembers = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id; // safely pulled from requireWorkspaceMember middleware
+
+    const members = await prisma.workspaceMember.findMany({
+      where: { workspaceId },
+      include: {
+        user: {
+          select: {
+            id: true,
+            username: true,
+            email: true,
+            avatar: true,
+            jobTitle: true,
+          },
+        },
+      },
+    });
+
+    return res.status(200).json({ success: true, data: members });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to fetch workspace members." });
+  }
+};
+
+// @desc    Get organization members who are NOT in the workspace yet
+// @route   GET /api/organizations/:orgId/workspaces/:workspaceId/members/available
+export const getAvailableOrgMembers = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const workspaceId = req.workspace.id;
+
+    // Strict Rule Enforcement: Only find users who belong to the Org,
+    // BUT whose userId does NOT exist in this specific Workspace's member list
+    const availableMembers = await prisma.organizationMember.findMany({
+      where: {
+        organizationId: orgId,
+        user: {
+          workspaceMembers: {
+            none: { workspaceId: workspaceId },
+          },
+        },
+      },
+      include: {
+        user: {
+          select: { id: true, username: true, email: true, avatar: true },
+        },
+      },
+    });
+
+    return res.status(200).json({ success: true, data: availableMembers });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({
+        success: false,
+        message: "Failed to fetch available organization members.",
+      });
+  }
+};
+
+// @desc    Add an organization member to the workspace
+// @route   POST /api/organizations/:orgId/workspaces/:workspaceId/members
+export const addWorkspaceMember = async (req, res) => {
+  try {
+    const orgId = parseInt(req.params.orgId);
+    const workspaceId = req.workspace.id;
+    const { userId, role } = req.body;
+
+    if (!userId)
+      return res
+        .status(400)
+        .json({ success: false, message: "User ID is required." });
+
+    // Double-check they are actually in the Organization
+    const orgMember = await prisma.organizationMember.findUnique({
+      where: {
+        organizationId_userId: {
+          organizationId: orgId,
+          userId: parseInt(userId),
+        },
+      },
+    });
+
+    if (!orgMember)
+      return res
+        .status(403)
+        .json({
+          success: false,
+          message:
+            "User must be a member of the organization before joining a workspace.",
+        });
+
+    // Ensure they aren't already in the Workspace
+    const existing = await prisma.workspaceMember.findUnique({
+      where: { workspaceId_userId: { workspaceId, userId: parseInt(userId) } },
+    });
+
+    if (existing)
+      return res
+        .status(400)
+        .json({
+          success: false,
+          message: "User is already in this workspace.",
+        });
+
+    const newMember = await prisma.workspaceMember.create({
+      data: {
+        workspaceId,
+        userId: parseInt(userId),
+        role: role || "VIEWER",
+      },
+    });
+
+    return res
+      .status(201)
+      .json({
+        success: true,
+        message: "Member added to workspace successfully.",
+        data: newMember,
+      });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to add member to workspace." });
+  }
+};
+
+// @desc    Remove a workspace member
+// @route   DELETE /api/organizations/:orgId/workspaces/:workspaceId/members/:userId
+export const removeWorkspaceMember = async (req, res) => {
+  try {
+    const workspaceId = req.workspace.id;
+    const targetUserId = parseInt(req.params.userId);
+
+    // Prevent deleting the workspace creator/yourself if needed, or just let Org Admins handle it
+    if (targetUserId === req.workspace.createdById) {
+      return res
+        .status(400)
+        .json({
+          success: false,
+          message: "Cannot remove the workspace creator.",
+        });
+    }
+
+    await prisma.workspaceMember.delete({
+      where: { workspaceId_userId: { workspaceId, userId: targetUserId } },
+    });
+
+    return res
+      .status(200)
+      .json({ success: true, message: "Workspace member removed." });
+  } catch (error) {
+    return res
+      .status(500)
+      .json({ success: false, message: "Failed to remove member." });
+  }
+};
diff --git a/server/src/middleware/auth.middleware.js b/server/src/middleware/auth.middleware.js
index d81c527..a3ac160 100644
--- a/server/src/middleware/auth.middleware.js
+++ b/server/src/middleware/auth.middleware.js
@@ -19,7 +19,7 @@ export const requireAuth = (req, res, next) => {
     req.user = {
       id: decoded.id,
       email: decoded.email,
-      role: decoded.role,
+      platformRole: decoded.platformRole,
       username: decoded.username,
     };
 
@@ -30,4 +30,17 @@ export const requireAuth = (req, res, next) => {
       message: "Your session has expired. Please log in again.",
     });
   }
+};
+
+// Require PLATFORM_ADMIN Role
+export const requirePlatformAdmin = (req, res, next) => {
+  if (!req.user) {
+    return res.status(401).json({ success: false, message: "Unauthorized: Please log in." });
+  }
+  
+  if (req.user.platformRole !== "PLATFORM_ADMIN") {
+    return res.status(403).json({ success: false, message: "Forbidden: Platform Admin access required." });
+  }
+  
+  next();
 };
\ No newline at end of file
diff --git a/server/src/middleware/org.middleware.js b/server/src/middleware/org.middleware.js
new file mode 100644
index 0000000..4b426c6
--- /dev/null
+++ b/server/src/middleware/org.middleware.js
@@ -0,0 +1,77 @@
+import { PrismaClient } from "@prisma/client";
+
+const prisma = new PrismaClient();
+
+/**
+ * Validates that the logged-in user belongs to the requested organization,
+ * and optionally checks if they have a sufficient role.
+ */
+const checkOrganizationRole = (allowedRoles = []) => {
+  return async (req, res, next) => {
+    try {
+      // The org ID usually comes from the URL (e.g. /api/organizations/:orgId/...)
+      // But we also check the body just in case (e.g. creating an invite)
+      const organizationId = parseInt(
+        req.params.orgId || req.body.organizationId,
+      );
+
+      if (!organizationId) {
+        return res
+          .status(400)
+          .json({
+            success: false,
+            message: "Organization ID is required in the request.",
+          });
+      }
+
+      // Query the database to guarantee this user is a member of this specific organization
+      const membership = await prisma.organizationMember.findUnique({
+        where: {
+          organizationId_userId: {
+            organizationId,
+            userId: req.user.id, // req.user comes from your existing requireAuth middleware
+          },
+        },
+      });
+
+      if (!membership) {
+        return res
+          .status(403)
+          .json({
+            success: false,
+            message: "Forbidden: You are not a member of this organization.",
+          });
+      }
+
+      // If specific roles are required, check them
+      if (allowedRoles.length > 0 && !allowedRoles.includes(membership.role)) {
+        return res.status(403).json({
+          success: false,
+          message: `Forbidden: Your organization role (${membership.role}) does not have permission to perform this action.`,
+        });
+      }
+
+      // Attach the verified orgRole to the request for controllers to use
+      req.orgRole = membership.role;
+      next();
+    } catch (error) {
+      console.error("Organization Middleware Error:", error);
+      res
+        .status(500)
+        .json({
+          success: false,
+          message: "Internal server error during authorization.",
+        });
+    }
+  };
+};
+
+// Export the ready-to-use middlewares
+export const requireOrgMember = checkOrganizationRole(); // Any member
+export const requireOrgManager = checkOrganizationRole([
+  "OWNER",
+  "ADMIN",
+  "MANAGER",
+]);
+export const requireOrgAdmin = checkOrganizationRole(["OWNER", "ADMIN"]);
+export const requireOrgOwner = checkOrganizationRole(["OWNER"]);
diff --git a/server/src/middleware/workspace.middleware.js b/server/src/middleware/workspace.middleware.js
new file mode 100644
index 0000000..237c142
--- /dev/null
+++ b/server/src/middleware/workspace.middleware.js
@@ -0,0 +1,107 @@
+import { PrismaClient } from "@prisma/client";
+
+const prisma = new PrismaClient();
+
+/**
+ * Validates that the requested workspace belongs to the requested organization.
+ * Then validates that the logged-in user is a member of that workspace
+ * (or is an Organization Admin/Owner).
+ */
+export const checkWorkspaceRole = (allowedRoles = []) => {
+  return async (req, res, next) => {
+    try {
+      const orgId = parseInt(req.params.orgId);
+      const workspaceId = parseInt(req.params.workspaceId);
+
+      if (!orgId || !workspaceId) {
+        return res
+          .status(400)
+          .json({
+            success: false,
+            message: "Organization ID and Workspace ID are required.",
+          });
+      }
+
+      // 1. Enforce Strict Data Isolation: Does this workspace actually belong to this Org?
+      const workspace = await prisma.workspace.findUnique({
+        where: { id: workspaceId },
+      });
+
+      if (!workspace || workspace.organizationId !== orgId) {
+        return res
+          .status(404)
+          .json({
+            success: false,
+            message: "Workspace not found in this organization.",
+          });
+      }
+
+      // 2. Check if the user is an Organization OWNER or ADMIN.
+      // (Org Owners/Admins get implicit "Super Admin" access to all workspaces inside their org)
+      const orgMembership = await prisma.organizationMember.findUnique({
+        where: {
+          organizationId_userId: { organizationId: orgId, userId: req.user.id },
+        },
+      });
+
+      if (!orgMembership) {
+        return res
+          .status(403)
+          .json({
+            success: false,
+            message: "You are not a member of this organization.",
+          });
+      }
+
+      const isOrgAdmin = ["OWNER", "ADMIN"].includes(orgMembership.role);
+
+      // 3. Check Workspace Membership
+      const workspaceMembership = await prisma.workspaceMember.findUnique({
+        where: { workspaceId_userId: { workspaceId, userId: req.user.id } },
+      });
+
+      // If they aren't a workspace member AND they aren't an Org Admin, deny access entirely.
+      if (!workspaceMembership && !isOrgAdmin) {
+        return res
+          .status(403)
+          .json({
+            success: false,
+            message: "Forbidden: You do not have access to this workspace.",
+          });
+      }
+
+      // If they are an Org Admin, they implicitly act as a WORKSPACE_ADMIN.
+      const userWorkspaceRole = workspaceMembership
+        ? workspaceMembership.role
+        : "WORKSPACE_ADMIN";
+
+      // 4. Role check for specific actions
+      if (
+        allowedRoles.length > 0 &&
+        !isOrgAdmin &&
+        !allowedRoles.includes(userWorkspaceRole)
+      ) {
+        return res.status(403).json({
+          success: false,
+          message: `Forbidden: Your workspace role (${userWorkspaceRole}) does not have permission for this action.`,
+        });
+      }
+
+      // Attach context to the request for the controllers to use!
+      req.workspaceRole = userWorkspaceRole;
+      req.workspace = workspace;
+      next();
+    } catch (error) {
+      console.error("Workspace Middleware Error:", error);
+      return res
+        .status(500)
+        .json({
+          success: false,
+          message: "Internal server error during workspace authorization.",
+        });
+    }
+  };
+};
+
+export const requireWorkspaceMember = checkWorkspaceRole();
+export const requireWorkspaceAdmin = checkWorkspaceRole(["WORKSPACE_ADMIN"]);
diff --git a/server/src/routes/admin.routes.js b/server/src/routes/admin.routes.js
new file mode 100644
index 0000000..51f44ea
--- /dev/null
+++ b/server/src/routes/admin.routes.js
@@ -0,0 +1,22 @@
+import express from "express";
+import { getUsers, getOrganizations } from "../controllers/admin.controller.js";
+import {
+  requireAuth,
+  requirePlatformAdmin,
+} from "../middleware/auth.middleware.js";
+
+const router = express.Router();
+
+// Apply middlewares to ALL routes in this file
+// 1. Must be logged in (requireAuth)
+// 2. Must be a PLATFORM_ADMIN (requirePlatformAdmin)
+router.use(requireAuth);
+router.use(requirePlatformAdmin);
+
+// GET /api/admin/users
+router.get("/users", getUsers);
+
+// GET /api/admin/organizations
+router.get("/organizations", getOrganizations);
+
+export default router;
diff --git a/server/src/routes/dashboard.routes.js b/server/src/routes/dashboard.routes.js
new file mode 100644
index 0000000..8caea49
--- /dev/null
+++ b/server/src/routes/dashboard.routes.js
@@ -0,0 +1,10 @@
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import { requireWorkspaceMember } from "../middleware/workspace.middleware.js";
+import { getWorkspaceDashboardData } from "../controllers/dashboard.controller.js";
+
+const router = express.Router({ mergeParams: true });
+
+router.get("/", requireAuth, requireWorkspaceMember, getWorkspaceDashboardData);
+
+export default router;
diff --git a/server/src/routes/github.routes.js b/server/src/routes/github.routes.js
index f13b214..c07459f 100644
--- a/server/src/routes/github.routes.js
+++ b/server/src/routes/github.routes.js
@@ -1,31 +1,31 @@
-// server/src/routes/github.routes.js
-
 import express from "express";
 import { requireAuth } from "../middleware/auth.middleware.js";
+import { requireWorkspaceMember } from "../middleware/workspace.middleware.js";
 import {
   getCurrentSprint,
   getOpenIssues,
   getPullRequests,
+  getAccessibleRepositories,
 } from "../controllers/github.controller.js";
 
-const router = express.Router();
+const router = express.Router({ mergeParams: true });
 
+// Workspace-scoped GitHub routes
 router.get(
-  "/repos/:owner/:repo/current-sprint",
+  "/current-sprint",
   requireAuth,
-  getCurrentSprint
+  requireWorkspaceMember,
+  getCurrentSprint,
 );
-
+router.get("/issues", requireAuth, requireWorkspaceMember, getOpenIssues);
 router.get(
-  "/repos/:owner/:repo/issues",
+  "/pull-requests",
   requireAuth,
-  getOpenIssues
+  requireWorkspaceMember,
+  getPullRequests,
 );
 
-router.get(
-  "/repos/:owner/:repo/pull-requests",
-  requireAuth,
-  getPullRequests
-);
+// Global user routes
+router.get("/repositories", requireAuth, getAccessibleRepositories);
 
-export default router;
\ No newline at end of file
+export default router;
diff --git a/server/src/routes/invitation.routes.js b/server/src/routes/invitation.routes.js
new file mode 100644
index 0000000..34912ca
--- /dev/null
+++ b/server/src/routes/invitation.routes.js
@@ -0,0 +1,26 @@
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import { requireOrgAdmin } from "../middleware/org.middleware.js";
+import {
+  searchUsersToInvite,
+  createInvitation,
+  getMyInvitations,
+  acceptInvitation,
+  rejectInvitation,
+} from "../controllers/invitation.controller.js";
+
+const router = express.Router();
+
+router.use(requireAuth);
+
+// Routes for the organization ADMIN/OWNER to invite people
+// Notice requireOrgAdmin ensures they can't invite people to an org they don't own!
+router.get("/org/:orgId/search", requireOrgAdmin, searchUsersToInvite);
+router.post("/org/:orgId", requireOrgAdmin, createInvitation);
+
+// Routes for the individual user to manage their own inbox
+router.get("/mine", getMyInvitations);
+router.patch("/:invitationId/accept", acceptInvitation);
+router.patch("/:invitationId/reject", rejectInvitation);
+
+export default router;
diff --git a/server/src/routes/org.routes.js b/server/src/routes/org.routes.js
new file mode 100644
index 0000000..5038d90
--- /dev/null
+++ b/server/src/routes/org.routes.js
@@ -0,0 +1,38 @@
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import {
+  requireOrgMember,
+  requireOrgAdmin,
+  requireOrgOwner,
+} from "../middleware/org.middleware.js";
+import {
+  createOrganization,
+  getMyOrganizations,
+  getOrganizationById,
+  updateOrganization,
+  getOrganizationMembers,
+  updateMemberRole,
+  removeMember,
+  transferOwnership,
+} from "../controllers/org.controller.js";
+
+const router = express.Router();
+
+// User must be globally authenticated
+router.use(requireAuth);
+
+router.post("/", createOrganization);
+router.get("/mine", getMyOrganizations);
+
+// User MUST be a verified member of the specific :orgId
+router.get("/:orgId", requireOrgMember, getOrganizationById);
+// User MUST be an ADMIN or OWNER of the specific :orgId
+router.patch("/:orgId", requireOrgAdmin, updateOrganization);
+
+// Member management
+router.get("/:orgId/members", requireOrgMember, getOrganizationMembers);
+router.patch("/:orgId/members/:memberId/role", requireOrgAdmin, updateMemberRole);
+router.delete("/:orgId/members/:memberId", requireOrgAdmin, removeMember);
+router.post("/:orgId/transfer-ownership", requireOrgOwner, transferOwnership);
+
+export default router;
diff --git a/server/src/routes/project.routes.js b/server/src/routes/project.routes.js
new file mode 100644
index 0000000..86f6cec
--- /dev/null
+++ b/server/src/routes/project.routes.js
@@ -0,0 +1,24 @@
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import {
+  requireWorkspaceMember,
+  requireWorkspaceAdmin,
+} from "../middleware/workspace.middleware.js";
+import {
+  createProject,
+  getProjects,
+  getProjectDetails,
+} from "../controllers/project.controller.js";
+
+const router = express.Router({ mergeParams: true });
+
+router.get("/", requireAuth, requireWorkspaceMember, getProjects);
+router.get(
+  "/:projectId",
+  requireAuth,
+  requireWorkspaceMember,
+  getProjectDetails,
+);
+router.post("/", requireAuth, requireWorkspaceAdmin, createProject);
+
+export default router;
diff --git a/server/src/routes/sprint.routes.js b/server/src/routes/sprint.routes.js
new file mode 100644
index 0000000..59d418c
--- /dev/null
+++ b/server/src/routes/sprint.routes.js
@@ -0,0 +1,31 @@
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import {
+  requireWorkspaceMember,
+  requireWorkspaceAdmin,
+} from "../middleware/workspace.middleware.js";
+import {
+  createSprint,
+  getSprints,
+  startSprint,
+  completeSprint,
+} from "../controllers/sprint.controller.js";
+
+const router = express.Router({ mergeParams: true });
+
+router.get("/", requireAuth, requireWorkspaceMember, getSprints);
+router.post("/", requireAuth, requireWorkspaceAdmin, createSprint);
+router.post(
+  "/:sprintId/start",
+  requireAuth,
+  requireWorkspaceAdmin,
+  startSprint,
+);
+router.post(
+  "/:sprintId/complete",
+  requireAuth,
+  requireWorkspaceAdmin,
+  completeSprint,
+);
+
+export default router;
diff --git a/server/src/routes/task.routes.js b/server/src/routes/task.routes.js
new file mode 100644
index 0000000..f31fc7d
--- /dev/null
+++ b/server/src/routes/task.routes.js
@@ -0,0 +1,17 @@
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import { requireWorkspaceMember } from "../middleware/workspace.middleware.js";
+import {
+  createTask,
+  getTasks,
+  updateTask,
+} from "../controllers/task.controller.js";
+
+const router = express.Router({ mergeParams: true });
+
+// Members (including contributors/admins) can manage tasks
+router.get("/", requireAuth, requireWorkspaceMember, getTasks);
+router.post("/", requireAuth, requireWorkspaceMember, createTask);
+router.patch("/:taskId", requireAuth, requireWorkspaceMember, updateTask);
+
+export default router;
diff --git a/server/src/routes/workspace.routes.js b/server/src/routes/workspace.routes.js
new file mode 100644
index 0000000..fa7fce9
--- /dev/null
+++ b/server/src/routes/workspace.routes.js
@@ -0,0 +1,39 @@
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import {
+  requireOrgMember,
+  requireOrgManager,
+} from "../middleware/org.middleware.js";
+import {
+  requireWorkspaceMember,
+  requireWorkspaceAdmin,
+} from "../middleware/workspace.middleware.js";
+import {
+  createWorkspace,
+  getWorkspaces,
+  getWorkspaceDetails,
+  archiveWorkspace,
+} from "../controllers/workspace.controller.js";
+
+// We use mergeParams: true because this router will be nested under /api/organizations/:orgId
+const router = express.Router({ mergeParams: true });
+
+// Workspace List & Creation
+router.get("/", requireAuth, requireOrgMember, getWorkspaces);
+router.post("/", requireAuth, requireOrgManager, createWorkspace);
+
+// Specific Workspace Operations
+router.get(
+  "/:workspaceId",
+  requireAuth,
+  requireWorkspaceMember,
+  getWorkspaceDetails,
+);
+router.patch(
+  "/:workspaceId/archive",
+  requireAuth,
+  requireWorkspaceAdmin,
+  archiveWorkspace,
+);
+
+export default router;
diff --git a/server/src/routes/workspaceMember.routes.js b/server/src/routes/workspaceMember.routes.js
new file mode 100644
index 0000000..4171e11
--- /dev/null
+++ b/server/src/routes/workspaceMember.routes.js
@@ -0,0 +1,31 @@
+import express from "express";
+import { requireAuth } from "../middleware/auth.middleware.js";
+import {
+  requireWorkspaceMember,
+  requireWorkspaceAdmin,
+} from "../middleware/workspace.middleware.js";
+import {
+  getWorkspaceMembers,
+  getAvailableOrgMembers,
+  addWorkspaceMember,
+  removeWorkspaceMember,
+} from "../controllers/workspaceMember.controller.js";
+
+const router = express.Router({ mergeParams: true });
+
+router.get("/", requireAuth, requireWorkspaceMember, getWorkspaceMembers);
+router.get(
+  "/available",
+  requireAuth,
+  requireWorkspaceAdmin,
+  getAvailableOrgMembers,
+);
+router.post("/", requireAuth, requireWorkspaceAdmin, addWorkspaceMember);
+router.delete(
+  "/:userId",
+  requireAuth,
+  requireWorkspaceAdmin,
+  removeWorkspaceMember,
+);
+
+export default router;
diff --git a/server/src/utils/activityLogger.js b/server/src/utils/activityLogger.js
new file mode 100644
index 0000000..50e0d8f
--- /dev/null
+++ b/server/src/utils/activityLogger.js
@@ -0,0 +1,27 @@
+import { PrismaClient } from "@prisma/client";
+const prisma = new PrismaClient();
+
+export const logActivity = async (
+  workspaceId,
+  userId,
+  type,
+  entityType,
+  entityId,
+  message,
+) => {
+  try {
+    await prisma.activity.create({
+      data: {
+        workspaceId,
+        userId,
+        type,
+        entityType,
+        entityId,
+        message,
+      },
+    });
+  } catch (error) {
+    console.error("Failed to log activity:", error);
+    // We swallow the error so that a failed activity log doesn't crash the main API request!
+  }
+};
diff --git a/server/src/utils/token.utils.js b/server/src/utils/token.utils.js
index 585bbbd..6a2b772 100644
--- a/server/src/utils/token.utils.js
+++ b/server/src/utils/token.utils.js
@@ -3,27 +3,29 @@ import crypto from 'crypto';
 
 export const generateAccessToken = (user) =>{
     return jwt.sign(
-        {
-            id: user.id,
-            email: user.email,
-            username: user.username,
-            role: user.role
-        },
-        process.env.ACCESS_TOKEN_SECRET,
-        {expiresIn: process.env.ACCESS_TOKEN_EXPIRY}
+      {
+        id: user.id,
+        email: user.email,
+        username: user.username,
+        jobTitle: user.jobTitle,
+        platformRole: user.platformRole,
+      },
+      process.env.ACCESS_TOKEN_SECRET,
+      { expiresIn: process.env.ACCESS_TOKEN_EXPIRY },
     );
 };
 
 export const generateRefreshToken = (user) =>{
     return jwt.sign(
-        {
-            id: user.id,
-            email: user.email,
-            username: user.username,
-            role: user.role
-        },
-        process.env.REFRESH_TOKEN_SECRET,
-        {expiresIn: process.env.REFRESH_TOKEN_EXPIRY}
+      {
+        id: user.id,
+        email: user.email,
+        username: user.username,
+        jobTitle: user.jobTitle,
+        platformRole: user.platformRole,
+      },
+      process.env.REFRESH_TOKEN_SECRET,
+      { expiresIn: process.env.REFRESH_TOKEN_EXPIRY },
     );
 };
 

From 6b98ddcf83c04acb9356f294398608fa2a366abf Mon Sep 17 00:00:00 2001
From: Ankur Yadav <ankuryadav89666@gmail.com>
Date: Sat, 8 Aug 2026 22:13:41 +0530
Subject: [PATCH 24/24] Fixed platformAdmin Bug

---
 client/src/components/layout/Sidebar.jsx   |   6 +-
 client/src/pages/AdminDashboard.jsx        | 387 ++++++++++++++-------
 client/src/pages/OrganizationDashboard.jsx |   7 +-
 client/src/pages/OrganizationMembers.jsx   |   6 +-
 4 files changed, 271 insertions(+), 135 deletions(-)

diff --git a/client/src/components/layout/Sidebar.jsx b/client/src/components/layout/Sidebar.jsx
index 205f237..65eab1d 100644
--- a/client/src/components/layout/Sidebar.jsx
+++ b/client/src/components/layout/Sidebar.jsx
@@ -4,11 +4,15 @@ import { useOrganization } from "../../context/OrganizationContext";
 import {useState} from 'react'
 import { useParams, useNavigate } from 'react-router-dom';
 
-function Sidebar({ isOpen, setIsOpen, user }) {
+function Sidebar({ isOpen, setIsOpen }) {
   const [isCollapsed, setIsCollapsed] = useState(false);
   const { orgId, workspaceId } = useParams();
   const navigate = useNavigate();
   const { organizations, currentOrg, switchOrganization, loading } = useOrganization();
+  
+  const userStr = localStorage.getItem("user");
+  const user = userStr ? JSON.parse(userStr) : null;
+
     return (
       <>
         {isOpen && (
diff --git a/client/src/pages/AdminDashboard.jsx b/client/src/pages/AdminDashboard.jsx
index 0e1794b..887e3fa 100644
--- a/client/src/pages/AdminDashboard.jsx
+++ b/client/src/pages/AdminDashboard.jsx
@@ -1,162 +1,291 @@
 import React, { useState, useEffect } from "react";
 import axios from "axios";
+import { Users, Building2, Settings, Search, ShieldCheck } from "lucide-react";
+import Sidebar from "../components/layout/Sidebar";
+import Navbar from "../components/layout/Navbar";
 
 const AdminDashboard = () => {
+  const [activeTab, setActiveTab] = useState("users");
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+
+  // Users State
   const [users, setUsers] = useState([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState(null);
+  const [usersLoading, setUsersLoading] = useState(false);
+  const [usersError, setUsersError] = useState(null);
+  const [userPage, setUserPage] = useState(1);
+  const [userTotalPages, setUserTotalPages] = useState(1);
+  const [userSearch, setUserSearch] = useState("");
 
-  // Pagination & Search State
-  const [page, setPage] = useState(1);
-  const [totalPages, setTotalPages] = useState(1);
-  const [search, setSearch] = useState("");
+  // Orgs State
+  const [orgs, setOrgs] = useState([]);
+  const [orgsLoading, setOrgsLoading] = useState(false);
+  const [orgsError, setOrgsError] = useState(null);
+  const [orgPage, setOrgPage] = useState(1);
+  const [orgTotalPages, setOrgTotalPages] = useState(1);
+  const [orgSearch, setOrgSearch] = useState("");
 
-  const API_URL = "http://localhost:5000/api/admin/users";
+  // Settings State (Static for now)
+  const [allowSignups, setAllowSignups] = useState(true);
+  const [maintenanceMode, setMaintenanceMode] = useState(false);
 
   const fetchUsers = async () => {
-    setLoading(true);
-    setError(null);
+    setUsersLoading(true);
+    setUsersError(null);
     try {
       const response = await axios.get(
-        `${API_URL}?page=${page}&limit=10&search=${search}`,
-        { withCredentials: true },
+        `http://localhost:5000/api/admin/users?page=${userPage}&limit=10&search=${userSearch}`,
+        { withCredentials: true }
       );
       setUsers(response.data.data.users);
-      setTotalPages(response.data.data.pagination.totalPages);
+      setUserTotalPages(response.data.data.pagination.totalPages);
+    } catch (err) {
+      setUsersError(err.response?.data?.message || "Failed to fetch users");
+    } finally {
+      setUsersLoading(false);
+    }
+  };
+
+  const fetchOrgs = async () => {
+    setOrgsLoading(true);
+    setOrgsError(null);
+    try {
+      const response = await axios.get(
+        `http://localhost:5000/api/admin/organizations?page=${orgPage}&limit=10&search=${orgSearch}`,
+        { withCredentials: true }
+      );
+      setOrgs(response.data.data.organizations);
+      setOrgTotalPages(response.data.data.pagination.totalPages);
     } catch (err) {
-      setError(err.response?.data?.message || "Failed to fetch users");
+      setOrgsError(err.response?.data?.message || "Failed to fetch organizations");
     } finally {
-      setLoading(false);
+      setOrgsLoading(false);
     }
   };
 
   useEffect(() => {
-    const delayDebounceFn = setTimeout(() => {
-      fetchUsers();
-    }, 500);
-    return () => clearTimeout(delayDebounceFn);
-  }, [page, search]);
+    if (activeTab === "users") {
+      const delay = setTimeout(fetchUsers, 500);
+      return () => clearTimeout(delay);
+    }
+  }, [activeTab, userPage, userSearch]);
 
-  return (
-    <div className="flex h-screen bg-gray-100">
-      <aside className="w-64 bg-white border-r shadow-sm hidden md:block">
-        <div className="p-6">
-          <h2 className="text-2xl font-bold text-gray-800">Admin Panel</h2>
+  useEffect(() => {
+    if (activeTab === "orgs") {
+      const delay = setTimeout(fetchOrgs, 500);
+      return () => clearTimeout(delay);
+    }
+  }, [activeTab, orgPage, orgSearch]);
+
+  const renderUsersTab = () => (
+    <div className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 shadow-lg mt-6">
+      <div className="flex justify-between items-center mb-6">
+        <h2 className="text-xl font-bold flex items-center gap-2"><Users size={20}/> Manage Users</h2>
+        <div className="relative">
+          <Search size={18} className="absolute left-3 top-1/2 -translate-y-1/2 text-slate-400" />
+          <input
+            type="text"
+            placeholder="Search username or email..."
+            className="bg-[#0f111a] border border-slate-700 rounded-lg py-2 pl-10 pr-4 text-white outline-none focus:border-purple-500 w-64"
+            value={userSearch}
+            onChange={(e) => setUserSearch(e.target.value)}
+          />
         </div>
-        <nav className="mt-6 flex flex-col gap-2 px-4">
-          <a
-            href="#"
-            className="p-3 bg-blue-50 text-blue-700 rounded-lg font-medium"
-          >
-            Users
-          </a>
-          <a href="#" className="p-3 text-gray-600 hover:bg-gray-50 rounded-lg">
-            Organizations
-          </a>
-          <a href="#" className="p-3 text-gray-600 hover:bg-gray-50 rounded-lg">
-            Settings
-          </a>
-        </nav>
-      </aside>
-
-      <main className="flex-1 p-8 overflow-y-auto">
-        <div className="flex justify-between items-center mb-6">
-          <h1 className="text-3xl font-bold text-gray-800">Manage Users</h1>
+      </div>
+
+      {usersLoading ? (
+        <div className="text-center p-10 text-slate-400">Loading users...</div>
+      ) : usersError ? (
+        <div className="text-center p-10 text-red-400 bg-red-500/10 rounded-lg">{usersError}</div>
+      ) : users.length === 0 ? (
+        <div className="text-center p-10 text-slate-400">No users found.</div>
+      ) : (
+        <div className="overflow-x-auto">
+          <table className="w-full text-left border-collapse">
+            <thead>
+              <tr className="bg-[#0f111a] text-slate-400 text-sm border-b border-[#ffffff]/10">
+                <th className="p-4 font-semibold">User</th>
+                <th className="p-4 font-semibold">Platform Role</th>
+                <th className="p-4 font-semibold">Joined</th>
+              </tr>
+            </thead>
+            <tbody>
+              {users.map((user) => (
+                <tr key={user.id} className="border-b border-[#ffffff]/10 last:border-0 hover:bg-[#252a3e] transition-colors">
+                  <td className="p-4 flex items-center gap-3">
+                    <div className="h-10 w-10 rounded-full bg-purple-500/20 flex items-center justify-center text-purple-400 font-bold uppercase overflow-hidden shrink-0">
+                      {user.avatar ? <img src={user.avatar} alt="avatar" className="object-cover h-full w-full" /> : user.username[0]}
+                    </div>
+                    <div>
+                      <div className="font-bold text-white">{user.username}</div>
+                      <div className="text-sm text-slate-400">{user.email}</div>
+                    </div>
+                  </td>
+                  <td className="p-4">
+                    <span className={`px-2 py-1 inline-flex text-xs font-semibold rounded-full ${user.platformRole === "PLATFORM_ADMIN" ? "bg-purple-500/20 text-purple-400 border border-purple-500/30" : "bg-slate-700 text-slate-300"}`}>
+                      {user.platformRole}
+                    </span>
+                  </td>
+                  <td className="p-4 text-sm text-slate-400">
+                    {new Date(user.createdAt).toLocaleDateString()}
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+          <div className="flex justify-between items-center p-4 border-t border-[#ffffff]/10">
+            <button disabled={userPage === 1} onClick={() => setUserPage(userPage - 1)} className="px-4 py-2 border border-slate-700 rounded-lg text-slate-300 hover:bg-slate-800 disabled:opacity-50 transition-colors cursor-pointer">Previous</button>
+            <span className="text-sm text-slate-400">Page {userPage} of {userTotalPages || 1}</span>
+            <button disabled={userPage === userTotalPages || userTotalPages === 0} onClick={() => setUserPage(userPage + 1)} className="px-4 py-2 border border-slate-700 rounded-lg text-slate-300 hover:bg-slate-800 disabled:opacity-50 transition-colors cursor-pointer">Next</button>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+
+  const renderOrgsTab = () => (
+    <div className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 shadow-lg mt-6">
+      <div className="flex justify-between items-center mb-6">
+        <h2 className="text-xl font-bold flex items-center gap-2"><Building2 size={20}/> Manage Organizations</h2>
+        <div className="relative">
+          <Search size={18} className="absolute left-3 top-1/2 -translate-y-1/2 text-slate-400" />
           <input
             type="text"
-            placeholder="Search by username or email..."
-            className="p-2 border rounded-lg w-64 shadow-sm focus:ring focus:ring-blue-200"
-            value={search}
-            onChange={(e) => setSearch(e.target.value)}
+            placeholder="Search organizations..."
+            className="bg-[#0f111a] border border-slate-700 rounded-lg py-2 pl-10 pr-4 text-white outline-none focus:border-blue-500 w-64"
+            value={orgSearch}
+            onChange={(e) => setOrgSearch(e.target.value)}
           />
         </div>
+      </div>
+
+      {orgsLoading ? (
+        <div className="text-center p-10 text-slate-400">Loading organizations...</div>
+      ) : orgsError ? (
+        <div className="text-center p-10 text-red-400 bg-red-500/10 rounded-lg">{orgsError}</div>
+      ) : orgs.length === 0 ? (
+        <div className="text-center p-10 text-slate-400">No organizations found.</div>
+      ) : (
+        <div className="overflow-x-auto">
+          <table className="w-full text-left border-collapse">
+            <thead>
+              <tr className="bg-[#0f111a] text-slate-400 text-sm border-b border-[#ffffff]/10">
+                <th className="p-4 font-semibold">Organization Name</th>
+                <th className="p-4 font-semibold">Status</th>
+                <th className="p-4 font-semibold">Total Members</th>
+                <th className="p-4 font-semibold">Created</th>
+              </tr>
+            </thead>
+            <tbody>
+              {orgs.map((org) => (
+                <tr key={org.id} className="border-b border-[#ffffff]/10 last:border-0 hover:bg-[#252a3e] transition-colors">
+                  <td className="p-4">
+                    <div className="font-bold text-white">{org.name}</div>
+                    <div className="text-sm text-slate-400 line-clamp-1">{org.description || "No description"}</div>
+                  </td>
+                  <td className="p-4">
+                    <span className={`px-2 py-1 inline-flex text-xs font-semibold rounded-full bg-green-500/20 text-green-400`}>
+                      ACTIVE
+                    </span>
+                  </td>
+                  <td className="p-4 text-sm text-slate-300 font-medium">
+                    {org._count.members} Members
+                  </td>
+                  <td className="p-4 text-sm text-slate-400">
+                    {new Date(org.createdAt).toLocaleDateString()}
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+          <div className="flex justify-between items-center p-4 border-t border-[#ffffff]/10">
+            <button disabled={orgPage === 1} onClick={() => setOrgPage(orgPage - 1)} className="px-4 py-2 border border-slate-700 rounded-lg text-slate-300 hover:bg-slate-800 disabled:opacity-50 transition-colors cursor-pointer">Previous</button>
+            <span className="text-sm text-slate-400">Page {orgPage} of {orgTotalPages || 1}</span>
+            <button disabled={orgPage === orgTotalPages || orgTotalPages === 0} onClick={() => setOrgPage(orgPage + 1)} className="px-4 py-2 border border-slate-700 rounded-lg text-slate-300 hover:bg-slate-800 disabled:opacity-50 transition-colors cursor-pointer">Next</button>
+          </div>
+        </div>
+      )}
+    </div>
+  );
 
-        {loading ? (
-          <div className="text-center p-10 text-gray-500">Loading users...</div>
-        ) : error ? (
-          <div className="text-center p-10 text-red-500 bg-red-50 rounded-lg">
-            {error}
+  const renderSettingsTab = () => (
+    <div className="bg-[#1c1f2e] p-6 rounded-xl border border-[#ffffff]/10 shadow-lg mt-6 max-w-3xl">
+      <h2 className="text-xl font-bold flex items-center gap-2 mb-6"><Settings size={20}/> Platform Settings</h2>
+      
+      <div className="space-y-6">
+        <div className="flex items-center justify-between p-4 bg-[#0f111a] rounded-lg border border-[#ffffff]/10">
+          <div>
+            <h3 className="text-white font-bold">Allow Public Signups</h3>
+            <p className="text-sm text-slate-400">When disabled, new users can only join via invitation.</p>
           </div>
-        ) : users.length === 0 ? (
-          <div className="text-center p-10 text-gray-500 bg-white rounded-lg shadow">
-            No users found.
+          <label className="relative inline-flex items-center cursor-pointer">
+            <input type="checkbox" className="sr-only peer" checked={allowSignups} onChange={() => setAllowSignups(!allowSignups)} />
+            <div className="w-11 h-6 bg-slate-700 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-purple-500"></div>
+          </label>
+        </div>
+
+        <div className="flex items-center justify-between p-4 bg-[#0f111a] rounded-lg border border-[#ffffff]/10">
+          <div>
+            <h3 className="text-white font-bold">Maintenance Mode</h3>
+            <p className="text-sm text-slate-400">Disable access for all non-admin users while performing upgrades.</p>
           </div>
-        ) : (
-          <div className="bg-white rounded-lg shadow overflow-hidden">
-            <table className="min-w-full divide-y divide-gray-200">
-              <thead className="bg-gray-50">
-                <tr>
-                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">
-                    User
-                  </th>
-                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">
-                    Platform Role
-                  </th>
-                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">
-                    Joined
-                  </th>
-                </tr>
-              </thead>
-              <tbody className="bg-white divide-y divide-gray-200">
-                {users.map((user) => (
-                  <tr key={user.id} className="hover:bg-gray-50">
-                    <td className="px-6 py-4 flex items-center">
-                      <div className="h-10 w-10 rounded-full bg-blue-100 flex items-center justify-center text-blue-600 font-bold uppercase overflow-hidden">
-                        {user.avatar ? (
-                          <img
-                            src={user.avatar}
-                            alt="avatar"
-                            className="object-cover h-full w-full"
-                          />
-                        ) : (
-                          user.username[0]
-                        )}
-                      </div>
-                      <div className="ml-4">
-                        <div className="text-sm font-medium text-gray-900">
-                          {user.username}
-                        </div>
-                        <div className="text-sm text-gray-500">
-                          {user.email}
-                        </div>
-                      </div>
-                    </td>
-                    <td className="px-6 py-4">
-                      <span
-                        className={`px-2 py-1 inline-flex text-xs leading-5 font-semibold rounded-full ${user.platformRole === "PLATFORM_ADMIN" ? "bg-purple-100 text-purple-800" : "bg-gray-100 text-gray-800"}`}
-                      >
-                        {user.platformRole}
-                      </span>
-                    </td>
-                    <td className="px-6 py-4 text-sm text-gray-500">
-                      {new Date(user.createdAt).toLocaleDateString()}
-                    </td>
-                  </tr>
-                ))}
-              </tbody>
-            </table>
-
-            <div className="flex justify-between items-center p-4 border-t">
-              <button
-                disabled={page === 1}
-                onClick={() => setPage(page - 1)}
-                className={`px-4 py-2 border rounded ${page === 1 ? "opacity-50 cursor-not-allowed" : "hover:bg-gray-50"}`}
-              >
-                Previous
-              </button>
-              <span className="text-sm text-gray-600">
-                Page {page} of {totalPages || 1}
-              </span>
-              <button
-                disabled={page === totalPages || totalPages === 0}
-                onClick={() => setPage(page + 1)}
-                className={`px-4 py-2 border rounded ${page === totalPages || totalPages === 0 ? "opacity-50 cursor-not-allowed" : "hover:bg-gray-50"}`}
-              >
-                Next
-              </button>
+          <label className="relative inline-flex items-center cursor-pointer">
+            <input type="checkbox" className="sr-only peer" checked={maintenanceMode} onChange={() => setMaintenanceMode(!maintenanceMode)} />
+            <div className="w-11 h-6 bg-slate-700 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-red-500"></div>
+          </label>
+        </div>
+
+        <div className="flex justify-end pt-4">
+          <button className="bg-purple-600 hover:bg-purple-700 text-white font-bold py-2 px-6 rounded-lg transition-colors shadow-md cursor-pointer">
+            Save Settings
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+
+  return (
+    <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <main className="flex-1 p-4 md:p-8 w-full h-full overflow-y-auto min-w-0">
+        <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
+        
+        <div className="text-white max-w-7xl mx-auto mt-6">
+          <div className="flex items-center gap-4 mb-8 pb-6 border-b border-[#ffffff]/10">
+            <div className="h-16 w-16 bg-purple-600/20 text-purple-500 rounded-2xl flex items-center justify-center shadow-lg shrink-0">
+              <ShieldCheck size={32} />
+            </div>
+            <div>
+              <h1 className="text-3xl font-bold">Platform Administration</h1>
+              <p className="text-slate-400 mt-1">Manage global users, organizations, and system settings.</p>
             </div>
           </div>
-        )}
+
+          <div className="flex gap-2 p-1 bg-[#1c1f2e] rounded-xl border border-[#ffffff]/10 w-fit">
+            <button 
+              onClick={() => setActiveTab("users")}
+              className={`px-6 py-2.5 rounded-lg font-semibold transition-all cursor-pointer ${activeTab === "users" ? "bg-purple-600 text-white shadow-md" : "text-slate-400 hover:text-white hover:bg-slate-800"}`}
+            >
+              Users
+            </button>
+            <button 
+              onClick={() => setActiveTab("orgs")}
+              className={`px-6 py-2.5 rounded-lg font-semibold transition-all cursor-pointer ${activeTab === "orgs" ? "bg-blue-600 text-white shadow-md" : "text-slate-400 hover:text-white hover:bg-slate-800"}`}
+            >
+              Organizations
+            </button>
+            <button 
+              onClick={() => setActiveTab("settings")}
+              className={`px-6 py-2.5 rounded-lg font-semibold transition-all cursor-pointer ${activeTab === "settings" ? "bg-slate-700 text-white shadow-md" : "text-slate-400 hover:text-white hover:bg-slate-800"}`}
+            >
+              Settings
+            </button>
+          </div>
+
+          {activeTab === "users" && renderUsersTab()}
+          {activeTab === "orgs" && renderOrgsTab()}
+          {activeTab === "settings" && renderSettingsTab()}
+
+        </div>
       </main>
     </div>
   );
diff --git a/client/src/pages/OrganizationDashboard.jsx b/client/src/pages/OrganizationDashboard.jsx
index 48749a8..4bd18d9 100644
--- a/client/src/pages/OrganizationDashboard.jsx
+++ b/client/src/pages/OrganizationDashboard.jsx
@@ -41,6 +41,9 @@ const OrganizationDashboard = () => {
     }
   };
 
+  const userStr = localStorage.getItem("user");
+  const user = userStr ? JSON.parse(userStr) : null;
+
   const [isSidebarOpen, setIsSidebarOpen] = useState(false);
 
   if (loading)
@@ -50,7 +53,7 @@ const OrganizationDashboard = () => {
   if (!currentOrg) {
     return (
       <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
-        <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+        <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} user={user} />
         <main className="flex-1 p-4 w-full h-full overflow-y-auto min-w-0">
           <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
           <div className="text-white max-w-xl mx-auto mt-16">
@@ -107,7 +110,7 @@ const OrganizationDashboard = () => {
   // View 2: User has an organization selected!
   return (
     <div className="flex h-screen overflow-hidden bg-gradient-to-br from-slate-950 via-[#111827] to-indigo-950">
-      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} />
+      <Sidebar isOpen={isSidebarOpen} setIsOpen={setIsSidebarOpen} user={user} />
       <main className="flex-1 p-4 md:p-8 w-full h-full overflow-y-auto min-w-0">
         <Navbar toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)} />
         <div className="text-white max-w-5xl mx-auto mt-10">
diff --git a/client/src/pages/OrganizationMembers.jsx b/client/src/pages/OrganizationMembers.jsx
index 6932e10..4afe605 100644
--- a/client/src/pages/OrganizationMembers.jsx
+++ b/client/src/pages/OrganizationMembers.jsx
@@ -216,7 +216,7 @@ const OrganizationMembers = () => {
                       </div>
                     </td>
                     <td className="p-4">
-                      {isAdminOrOwner && member.role !== "OWNER" ? (
+                      {isAdminOrOwner && member.role !== "OWNER" && !(currentOrg?.myRole === "ADMIN" && member.role === "ADMIN") ? (
                         <select
                           className="bg-[#0f111a] text-sm text-white font-semibold rounded p-1 border border-slate-700 outline-none cursor-pointer"
                           value={member.role}
@@ -224,7 +224,7 @@ const OrganizationMembers = () => {
                             handleRoleChange(member.id, e.target.value)
                           }
                         >
-                          <option value="ADMIN">Admin</option>
+                          {currentOrg?.myRole === "OWNER" && <option value="ADMIN">Admin</option>}
                           <option value="MANAGER">Manager</option>
                           <option value="MEMBER">Member</option>
                         </select>
@@ -247,7 +247,7 @@ const OrganizationMembers = () => {
                     </td>
                     {isAdminOrOwner && (
                       <td className="p-4 text-right">
-                        {member.role !== "OWNER" && (
+                        {member.role !== "OWNER" && !(currentOrg?.myRole === "ADMIN" && member.role === "ADMIN") && (
                           <button
                             onClick={() => handleRemoveMember(member.id)}
                             className="p-2 text-slate-400 hover:text-red-500 hover:bg-red-500/10 rounded-lg transition-colors cursor-pointer"