-
- ![Atlas logo]({require("./atlas.png")})
+
);
@@ -90,12 +98,14 @@ const AtlasRoleSelect = () => {
return (
+
Aτλας
Access your workspace
@@ -56,9 +59,12 @@ const AtlasRoleSelect = () => { return (
-
-
+
-
+
+
Aτλας
Access your workspace
@@ -80,7 +86,9 @@ const AtlasRoleSelect = () => { ))}
-
diff --git a/src/App.js b/src/App.js
index c325024..8ac60ef 100644
--- a/src/App.js
+++ b/src/App.js
@@ -36,6 +36,9 @@ import EmployeeDetails from "./Adminside/Components/EmployeeDetailspage";
import EmployeeProfile from "./Employee Side/Components/EmployeeProfile";
import ManagerLogin from "./Managerside/components/ManagerLogin";
import HRLogin from "./hrside/Components/HRLogin";
+import HRNavbar from "./hrside/Components/HRNavbar";
+import HRDashboard from "./hrside/Components/HRDashboard";
+import { SidebarProvider } from "./hrside/Components/SidebarContext";
import Manager from "./Adminside/Components/Manager";
import Activity from "./Adminside/Components/Activity";
@@ -45,10 +48,11 @@ function Layout({ children }) {
const hideNavbarRoutes = ["/","/login","/employeelogin","/managerlogin","/hrlogin"];
const hideNavbar = hideNavbarRoutes.includes(location.pathname);
+ const isHRRoute = location.pathname.startsWith("/hr/");
return (
<>
- {!hideNavbar &&
@@ -101,17 +106,15 @@ function App() {
{/* hr */}
} />
+
+
+ {children}
+
+ );
+}
+
+export function useSidebar() {
+ return useContext(SidebarContext);
+}
\ No newline at end of file
-
Welcome to Aτλας Workspace
++ Welcome to Aτλας Workspace +
- Select your functional portal to access the workspace
environments designed for your role.
+ Select your functional portal to access the workspace
+ environments designed for your role.
- ✓ Secure authentication @@ -105,28 +115,64 @@ const AtlasRoleSelect = () => {
- navigate("/employeelogin")}>
- navigate("/employeelogin")}
+ >
+
- navigate("/managerlogin")}>
- navigate("/managerlogin")}
+ >
+
- navigate("/hrlogin")}>
- navigate("/hrlogin")}
+ >
+
- navigate("/login")}>
- navigate("/login")}
+ >
+
+
Employee
-Access your personal dashboard, pay stubs, benefits, and training modules.
++ Access your personal dashboard, pay stubs, benefits, and + training modules. +
+
Manager
-Review team performance metrics, approve requests, and manage talent pipelines.
++ Review team performance metrics, approve requests, and manage + talent pipelines. +
+
Human Resource
-Administer company-wide policies, recruitment cycles, and employee relations.
++ Administer company-wide policies, recruitment cycles, and + employee relations. +
+
Administrator
-Full system overrides, configuration management, and security auditing logs.
++ Full system overrides, configuration management, and security + auditing logs. +
+
+ );
+}
+
+export default HRDashboard;
diff --git a/src/hrside/Components/HRNavbar.js b/src/hrside/Components/HRNavbar.js
new file mode 100644
index 0000000..a136137
--- /dev/null
+++ b/src/hrside/Components/HRNavbar.js
@@ -0,0 +1,306 @@
+import React, { useState } from "react";
+import styles from "../CSS/navbar.module.css";
+import {
+ Headphones,
+ UserCircle,
+ Settings,
+ LogOut,
+} from "lucide-react";
+import { useNavigate, useLocation } from "react-router-dom";
+
+// Custom Home icon
+const HomeIcon = ({ size = 20 }) => (
+
+);
+
+// Custom People icon
+const PeopleIcon = ({ size = 20 }) => (
+
+);
+
+// Custom Briefcase icon
+const BriefcaseIcon = ({ size = 20 }) => (
+
+);
+
+// Custom Documents icon
+const DocumentsIcon = ({ size = 20 }) => (
+
+);
+
+// Custom Documents and Payroll icon
+const DocumentsPayrollIcon = ({ size = 20 }) => (
+
+);
+
+function HRNavbar() {
+ const [menuopen, setMenuopen] = useState(false);
+ const navigate = useNavigate();
+ const location = useLocation();
+ const [info, setinfo] = useState(false);
+ const profileDropdownRef = React.useRef(null);
+
+ const getActive = (path) => location.pathname === path;
+
+ React.useEffect(() => {
+ const handleClickOutside = (event) => {
+ if (
+ profileDropdownRef.current &&
+ !profileDropdownRef.current.contains(event.target)
+ ) {
+ setinfo(false);
+ }
+ };
+ document.addEventListener("mousedown", handleClickOutside);
+ return () => document.removeEventListener("mousedown", handleClickOutside);
+ }, []);
+
+ const handlelogout = () => {
+ navigate("/hrlogin");
+ };
+
+ const handlesidebar = () => {
+ setMenuopen(!menuopen);
+ };
+
+ return (
+ <>
+
+
+
+
+
+ Dashboard
+
+ Real-time HR operations and organizational health.
+
+
+
+
+
+
+ {cards.map((card, i) => (
+
+
+
+
+ ))}
+
+
+ {card.icon}
+
+
+ {card.title}
+ {card.value}
+ {card.subtitle}
+
+ {/* Organizational Health */}
+
+
+
+
+
+ {/* Pulse Sentiment */}
+
+
+
+
+
+
+ Organizational Health
+ Last 30 days
+
+
+
+
+
+
+
+
+ 85%
+
+ Employee Satisfaction
+
+
+
+
+
+ 4
+ Open Grievances
+
+
+ Attrition Trend (-1.2%)
+
+
+
+
+
+
+
+
+
+
+
+
+ Pulse Sentiment
+
+
+
+
+
+
+
+
+
+ Positive
+
+ 65%
+
+
+
+
+
+
+
+
+
+
+ Neutral
+
+ 25%
+
+
+
+
+
+
+
+
+
+ Negative
+
+ 10%
+
+
+
+
+ {/* Action Center */}
+
+
+
+
+
+ {/* Leaves & Exits */}
+
+
+
+
+
+ View All
+
+
+
+
+
+
+
+
+
+
+
+
+ Compliance Escalation
+
+
+ Review
+
+
+ + I-9 verification delayed for 3 new hires in EU region. +
+
+
+
+
+
+
+
+ SLA Breach Warning
+
+
+ Assign
+
+
+ + 4 payroll tickets nearing 48h limit. +
+
+
+
+
+
+
+ Onboarding Stalled
+
+
+ Nudge
+
+
+ + 2 hires haven't completed day-1 tasks. +
+
+
+
+ {/* Doc Verification */}
+ Leaves & Exits
+
+
+
+
+
+
+ 12
+ ACTIVE LEAVES
+
+
+
+
+ 3
+ PENDING EXITS
+
+
+ Doc Verification
+
+
+
+
+
+
+ Pending
+ 18
+
+
+ Approved (Today)
+ 42
+
+
+ Re-upload Req.
+ 5
+
+
+ {/* Onboarding Pipeline */}
+
+
+
+
+
+ {/* Payroll Cycle */}
+
+ Onboarding Pipeline
+
+
+
+
+ Pending
+
+
+ In Progress
+
+
+ Completed
+
+
+
+ {pipeline.map((p, i) => (
+
+
+
+ ))}
+ {p.dept}
+
+
+
+
+
+
+ {/* Ticket Overview */}
+
+ Payroll Cycle
+
+
+
+
+
+
+
+ {payrollPercent}%
+ Processed
+ Total: $1.2M
+ Scheduled: Tomorrow
+
+
+
+
+
+ Ticket Overview
+
+
+
+
+
+
+
+
+
+
+ Open
+
+ 45
+
+
+
+
+
+ In Progress
+
+ 12
+
+
+
+
+ 4
+
+
+
+
+
+
+
+ Last 90 Days
+
+
+
+
+
+
+
+
+ 8
+ Employees
+
+
+
+ Requires PIP review within 14 days.
+
+
+
+
+
+
+ BEHAVIORAL FLAGS
+
+
+ 3
+ Incidents
+
+
+
+ Peer review anomalies detected.
+
+
+
+
+
+ INACTIVITY / BURNOUT
+
+
+ 15%
+ Of Workforce
+
+
+
+ Showing sustained low activity levels.
+
+
+
+
+ {menuopen && (
+
+
+
+
+
+
+ setinfo(!info)}
+ >
+
+ H
+
+ {info && (
+
+
+
+
+
+ )}
+ setMenuopen(false)}
+ >
+
+ )}
+
+ );
+}
+
+export default HRNavbar;
\ No newline at end of file
diff --git a/src/hrside/Components/SidebarContext.js b/src/hrside/Components/SidebarContext.js
new file mode 100644
index 0000000..197867f
--- /dev/null
+++ b/src/hrside/Components/SidebarContext.js
@@ -0,0 +1,17 @@
+
+import React, { createContext, useContext, useState } from "react";
+
+const SidebarContext = createContext();
+
+export function SidebarProvider({ children }) {
+ const [collapsed, setCollapsed] = useState(true);
+ return (
+ e.stopPropagation()}
+ >
+
+
+
+
+
+
+
+
+
+ {
+ navigate("/hr/dashboard");
+ setMenuopen(false);
+ }}
+ >
+
+
+ {
+ navigate("/hr/employees");
+ setMenuopen(false);
+ }}
+ >
+
+
+ {
+ navigate("/hr/attendance");
+ setMenuopen(false);
+ }}
+ >
+
+
+ {
+ navigate("/hr/payroll");
+ setMenuopen(false);
+ }}
+ >
+
+
+ {
+ navigate("/hr/payroll-reports");
+ setMenuopen(false);
+ }}
+ >
+
+
+
+ {
+ navigate("/hr/support");
+ setMenuopen(false);
+ }}
+ >
+
+
+ {
+ navigate("/hr/admin-profile");
+ setMenuopen(false);
+ }}
+ >
+
+