# ajaykreigns/my-hrms architecture

> Architecture diagram of the GitHub repository ajaykreigns/my-hrms, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-12). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/ajaykreigns/my-hrms
- Repository: https://github.com/ajaykreigns/my-hrms

## Overview

iFluids HRMS is a browser-only HR, payroll, and time-management demo. Employees sign in, use the app shell to reach role-appropriate modules, and submit or manage HR records; managers and administrators review requests and configure operational data. Modules share a localStorage-backed browser database seeded with fictional data. The README documents additional areas such as documents, learning, helpdesk, and reporting; these are represented at the available app directory level where their implementation was not sampled. Edges reflect excerpts, indexed references, or README statements; unsampled subsystem links are omitted.

Main entry points: [`app/src/App.jsx`](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/App.jsx) (App shell and navigation), [`app/src/store.js`](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/store.js) (Browser data store), [`app/src/pages/Admin.jsx`](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Admin.jsx) (Employee administration), [`app/src/pages/TimeOff.jsx`](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/TimeOff.jsx) (Attendance and leave)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_access["Access and Shell"]
  node_app_shell["App shell and navigation<br/>[App.jsx]"]
  node_login["Role-based login<br/>[Login.jsx]"]
  node_home["Home dashboard<br/>[Home.jsx]"]
end

subgraph group_people["People and Organization"]
  node_profile["Employee profiles<br/>[Profile.jsx]"]
  node_org["Org directory<br/>[Org.jsx]"]
  node_team["Team views<br/>[Team.jsx]"]
  node_performance["Goals and reviews<br/>[Performance.jsx]"]
end

subgraph group_work["Workplace Requests"]
  node_inbox["Request inbox<br/>[Inbox.jsx]"]
  node_timeoff["Attendance and leave<br/>[TimeOff.jsx]"]
  node_requests["Expenses and requests<br/>[Requests.jsx]"]
  node_timesheets["Timesheets<br/>[Timesheets.jsx]"]
  node_other_modules["Other HR modules"]
end

subgraph group_admin["Administration and Pay"]
  node_admin["Employee administration<br/>[Admin.jsx]"]
  node_admin_ops["HR operations<br/>[AdminOps.jsx]"]
  node_hiring["Hiring<br/>[Hiring.jsx]"]
  node_payroll["Payroll processing<br/>[Payroll.jsx]"]
  node_finances["My finances<br/>[Finances.jsx]"]
end

subgraph group_runtime["Shared Runtime"]
  node_db[("Browser data store<br/>[store.js]")]
  node_seed["Demo data seed<br/>[seed.js]"]
  node_ui["Shared UI components<br/>[ui.jsx]"]
  node_utils["Date and HR calculations<br/>[utils.js]"]
  node_browser_storage[("Browser localStorage")]
end

node_employee(("Employee or manager"))

node_employee -->|"signs in"| node_login
node_login -->|"checks session"| node_db
node_app_shell -->|"reads session data"| node_db
node_app_shell -->|"routes to"| node_home
node_app_shell -->|"routes to"| node_timeoff
node_app_shell -->|"routes to"| node_requests
node_app_shell -->|"routes to"| node_performance
node_app_shell -->|"routes to"| node_timesheets
node_app_shell -->|"routes to"| node_inbox
node_app_shell -->|"routes to"| node_profile
node_app_shell -->|"routes to"| node_org
node_app_shell -->|"routes to"| node_team
node_app_shell -->|"routes to"| node_finances
node_app_shell -->|"routes to"| node_admin
node_admin -->|"delegates to"| node_admin_ops
node_admin -->|"routes to"| node_hiring
node_admin -->|"routes to"| node_payroll
node_timeoff -->|"submits requests"| node_db
node_timeoff -->|"notifies manager"| node_inbox
node_db -->|"initializes from"| node_seed
node_db -->|"persists state"| node_browser_storage
node_ui -->|"reads and mutates"| node_db
node_home -->|"uses inbox data"| node_inbox
node_payroll -->|"uses finance functions"| node_finances
node_admin_ops -->|"uses leave module"| node_timeoff
node_profile -->|"navigates via"| node_app_shell
node_other_modules -.->|"supports documented areas"| node_employee

click node_app_shell "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/App.jsx"
click node_login "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Login.jsx"
click node_home "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Home.jsx"
click node_inbox "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Inbox.jsx"
click node_profile "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Profile.jsx"
click node_org "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Org.jsx"
click node_team "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Team.jsx"
click node_timeoff "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/TimeOff.jsx"
click node_requests "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Requests.jsx"
click node_timesheets "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Timesheets.jsx"
click node_performance "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Performance.jsx"
click node_admin "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Admin.jsx"
click node_admin_ops "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/AdminOps.jsx"
click node_hiring "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Hiring.jsx"
click node_payroll "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Payroll.jsx"
click node_finances "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Finances.jsx"
click node_other_modules "https://github.com/ajaykreigns/my-hrms/tree/main/app/src/pages"
click node_db "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/store.js"
click node_seed "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/seed.js"
click node_ui "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/ui.jsx"
click node_utils "https://github.com/ajaykreigns/my-hrms/blob/main/app/src/utils.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_app_shell,node_login,node_home toneBlue
class node_profile,node_org,node_team,node_performance toneAmber
class node_inbox,node_timeoff,node_requests,node_timesheets,node_other_modules toneMint
class node_admin,node_admin_ops,node_hiring,node_payroll,node_finances toneRose
class node_db,node_seed,node_ui,node_utils,node_browser_storage,node_employee toneIndigo
```

## Components

### Access and Shell

- [App shell and navigation](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/App.jsx): `app/src/App.jsx`
- [Role-based login](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Login.jsx): `app/src/pages/Login.jsx`
- [Home dashboard](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Home.jsx): `app/src/pages/Home.jsx`

### People and Organization

- [Employee profiles](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Profile.jsx): `app/src/pages/Profile.jsx`
- [Org directory](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Org.jsx): `app/src/pages/Org.jsx`
- [Team views](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Team.jsx): `app/src/pages/Team.jsx`
- [Goals and reviews](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Performance.jsx): `app/src/pages/Performance.jsx`

### Workplace Requests

- [Request inbox](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Inbox.jsx): `app/src/pages/Inbox.jsx`
- [Attendance and leave](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/TimeOff.jsx): `app/src/pages/TimeOff.jsx`
- [Expenses and requests](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Requests.jsx): `app/src/pages/Requests.jsx`
- [Timesheets](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Timesheets.jsx): `app/src/pages/Timesheets.jsx`
- [Other HR modules](https://github.com/ajaykreigns/my-hrms/tree/main/app/src/pages): `app/src/pages`

### Administration and Pay

- [Employee administration](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Admin.jsx): `app/src/pages/Admin.jsx`
- [HR operations](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/AdminOps.jsx): `app/src/pages/AdminOps.jsx`
- [Hiring](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Hiring.jsx): `app/src/pages/Hiring.jsx`
- [Payroll processing](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Payroll.jsx): `app/src/pages/Payroll.jsx`
- [My finances](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/pages/Finances.jsx): `app/src/pages/Finances.jsx`

### Shared Runtime

- [Browser data store](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/store.js): `app/src/store.js`
- [Demo data seed](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/seed.js): `app/src/seed.js`
- [Shared UI components](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/ui.jsx): `app/src/ui.jsx`
- [Date and HR calculations](https://github.com/ajaykreigns/my-hrms/blob/main/app/src/utils.js): `app/src/utils.js`
- **Browser localStorage**

### Other components

- **Employee or manager**

## Connections

- Employee or manager → Role-based login: signs in (evidence: `README.md`)
- Role-based login → Browser data store: checks session (evidence: `app/src/pages/Login.jsx`)
- App shell and navigation → Browser data store: reads session data (evidence: `app/src/App.jsx`)
- App shell and navigation → Home dashboard: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Attendance and leave: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Expenses and requests: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Goals and reviews: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Timesheets: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Request inbox: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Employee profiles: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Org directory: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Team views: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → My finances: routes to (evidence: `app/src/App.jsx`)
- App shell and navigation → Employee administration: routes to (evidence: `app/src/App.jsx`)
- Employee administration → HR operations: delegates to (evidence: `app/src/pages/Admin.jsx`)
- Employee administration → Hiring: routes to (evidence: `app/src/pages/Admin.jsx`)
- Employee administration → Payroll processing: routes to (evidence: `app/src/pages/Admin.jsx`)
- Attendance and leave → Browser data store: submits requests (evidence: `app/src/pages/TimeOff.jsx`)
- Attendance and leave → Request inbox: notifies manager (evidence: `app/src/pages/TimeOff.jsx`)
- Browser data store → Demo data seed: initializes from (evidence: `app/src/store.js`)
- Browser data store → Browser localStorage: persists state (evidence: `app/src/store.js`)
- Shared UI components → Browser data store: reads and mutates (evidence: `app/src/ui.jsx`)
- Home dashboard → Request inbox: uses inbox data (evidence: `app/src/pages/Home.jsx`)
- Payroll processing → My finances: uses finance functions (evidence: `app/src/pages/Payroll.jsx`)
- HR operations → Attendance and leave: uses leave module (evidence: `app/src/pages/AdminOps.jsx`)
- Employee profiles → App shell and navigation: navigates via (evidence: `app/src/pages/Profile.jsx`)
- Other HR modules → Employee or manager: supports documented areas (evidence: `README.md`)