# laibatajshaik/parking-management architecture

> Architecture diagram of the GitHub repository laibatajshaik/parking-management, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-25). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/laibatajshaik/parking-management
- Repository: https://github.com/laibatajshaik/parking-management

## Overview

Shnoor Parking is a role-based parking operations product: customers can browse plans and reserve parking, staff manage gate entry, slot assignment, fees and payment, and administrators oversee facilities, users, pricing and reports. The frontend routes users into protected role dashboards; its screens communicate with a central Express API backed by PostgreSQL. Notifications and email support account, reservation, payment and operational events. The README is empty, and the sampled backend source is partial, so unsampled API wiring and individual dashboard actions are represented only where the tree or excerpts support them.

Main entry points: [`frontend/src/StaffDashboard.jsx`](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/StaffDashboard.jsx) (Staff dashboard), [`backend/server.js`](https://github.com/laibatajshaik/parking-management/blob/main/backend/server.js) (Express API), [`frontend/src/App.jsx`](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/App.jsx) (Role-based routing), [`frontend/src/AdminDashboard.jsx`](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/AdminDashboard.jsx) (Admin dashboard)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web client"]
  node_app["Role-based routing<br/>[App.jsx]"]
  node_signup["Login and signup<br/>[SignUp.jsx]"]
  node_customer["Customer dashboard"]
  node_staff["Staff dashboard<br/>[StaffDashboard.jsx]"]
  node_admin["Admin dashboard<br/>[AdminDashboard.jsx]"]
end

subgraph group_operations["Parking operations"]
  node_reserve["Plan and reservation<br/>[ReserveParking.jsx]"]
  node_customerparking["Parking and receipts<br/>[MyParking.jsx]"]
  node_entry["Vehicle check-in<br/>[VehicleEntry.jsx]"]
  node_validation["Reservation validation"]
  node_fees["Fee calculation<br/>[FeeCalculation.jsx]"]
  node_payment["Payment processing<br/>[Payment.jsx]"]
  node_exit["Vehicle exit<br/>[VehicleExit.jsx]"]
end

subgraph group_administration["Administration"]
  node_slots["Slot management"]
  node_sessions["Active sessions"]
  node_plans["Pricing plans<br/>[PricingPlans.jsx]"]
  node_reports["Reports and revenue"]
end

subgraph group_backend["Backend services"]
  node_api["Express API<br/>[server.js]"]
  node_dbconn["Database connection<br/>[db.js]"]
  node_store[("PostgreSQL data")]
  node_notifications["Notification service"]
  node_notificationapi["Notification routes"]
  node_notificationcontroller["Notification controller"]
  node_email["Email service<br/>[emailService.js]"]
end

node_user(("Customer / staff / admin"))
node_mailprovider{{"Email provider"}}
node_google{{"Google identity"}}

node_user -->|"uses"| node_app
node_app -->|"routes to"| node_signup
node_app -->|"routes to"| node_customer
node_app -->|"routes to"| node_staff
node_app -->|"routes to"| node_admin
node_customer -->|"opens"| node_reserve
node_customer -->|"opens"| node_customerparking
node_staff -->|"opens"| node_entry
node_staff -->|"opens"| node_validation
node_staff -->|"opens"| node_fees
node_staff -->|"opens"| node_payment
node_staff -->|"opens"| node_exit
node_admin -->|"opens"| node_slots
node_admin -->|"opens"| node_sessions
node_admin -->|"opens"| node_plans
node_admin -->|"opens"| node_reports
node_reserve -->|"requests plans"| node_api
node_entry -->|"submits entry"| node_api
node_api -->|"queries"| node_dbconn
node_dbconn -->|"reads / writes"| node_store
node_api -->|"dispatches"| node_notifications
node_notificationapi -->|"dispatches"| node_notificationcontroller
node_notificationcontroller -->|"calls"| node_notifications
node_notifications -->|"queries"| node_dbconn
node_api -->|"sends email"| node_email
node_email -.->|"sends via"| node_mailprovider
node_signup -.->|"authenticates with"| node_google
node_signup -.->|"exchanges credentials"| node_api

click node_app "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/App.jsx"
click node_signup "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/SignUp.jsx"
click node_customer "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/CustomerDashboard.jsx"
click node_staff "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/StaffDashboard.jsx"
click node_admin "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/AdminDashboard.jsx"
click node_reserve "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/customer/ReserveParking.jsx"
click node_customerparking "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/customer/MyParking.jsx"
click node_entry "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/VehicleEntry.jsx"
click node_validation "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/ReservationValidation.jsx"
click node_fees "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/FeeCalculation.jsx"
click node_payment "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/Payment.jsx"
click node_exit "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/VehicleExit.jsx"
click node_slots "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/admin/ParkingSlotManagement.jsx"
click node_sessions "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/admin/ActiveParkingSessions.jsx"
click node_plans "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/admin/PricingPlans.jsx"
click node_reports "https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/admin/ReportsAnalytics.jsx"
click node_api "https://github.com/laibatajshaik/parking-management/blob/main/backend/server.js"
click node_dbconn "https://github.com/laibatajshaik/parking-management/blob/main/backend/db.js"
click node_notifications "https://github.com/laibatajshaik/parking-management/blob/main/backend/modules/notifications/notificationService.js"
click node_notificationapi "https://github.com/laibatajshaik/parking-management/blob/main/backend/modules/notifications/notificationRoutes.js"
click node_notificationcontroller "https://github.com/laibatajshaik/parking-management/blob/main/backend/modules/notifications/notificationController.js"
click node_email "https://github.com/laibatajshaik/parking-management/blob/main/backend/modules/email/emailService.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,node_signup,node_customer,node_staff,node_admin toneBlue
class node_reserve,node_customerparking,node_entry,node_validation,node_fees,node_payment,node_exit toneAmber
class node_slots,node_sessions,node_plans,node_reports toneMint
class node_api,node_dbconn,node_store,node_notifications,node_notificationapi,node_notificationcontroller,node_email toneRose
class node_user,node_mailprovider,node_google toneIndigo
```

## Components

### Web client

- [Role-based routing](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Login and signup](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/SignUp.jsx): `frontend/src/SignUp.jsx`
- [Customer dashboard](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/CustomerDashboard.jsx): `frontend/src/CustomerDashboard.jsx`
- [Staff dashboard](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/StaffDashboard.jsx): `frontend/src/StaffDashboard.jsx`
- [Admin dashboard](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/AdminDashboard.jsx): `frontend/src/AdminDashboard.jsx`

### Parking operations

- [Plan and reservation](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/customer/ReserveParking.jsx): `frontend/src/pages/customer/ReserveParking.jsx`
- [Parking and receipts](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/customer/MyParking.jsx): `frontend/src/pages/customer/MyParking.jsx`
- [Vehicle check-in](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/VehicleEntry.jsx): `frontend/src/pages/staff/VehicleEntry.jsx`
- [Reservation validation](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/ReservationValidation.jsx): `frontend/src/pages/staff/ReservationValidation.jsx`
- [Fee calculation](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/FeeCalculation.jsx): `frontend/src/pages/staff/FeeCalculation.jsx`
- [Payment processing](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/Payment.jsx): `frontend/src/pages/staff/Payment.jsx`
- [Vehicle exit](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/staff/VehicleExit.jsx): `frontend/src/pages/staff/VehicleExit.jsx`

### Administration

- [Slot management](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/admin/ParkingSlotManagement.jsx): `frontend/src/pages/admin/ParkingSlotManagement.jsx`
- [Active sessions](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/admin/ActiveParkingSessions.jsx): `frontend/src/pages/admin/ActiveParkingSessions.jsx`
- [Pricing plans](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/admin/PricingPlans.jsx): `frontend/src/pages/admin/PricingPlans.jsx`
- [Reports and revenue](https://github.com/laibatajshaik/parking-management/blob/main/frontend/src/pages/admin/ReportsAnalytics.jsx): `frontend/src/pages/admin/ReportsAnalytics.jsx`

### Backend services

- [Express API](https://github.com/laibatajshaik/parking-management/blob/main/backend/server.js): `backend/server.js`
- [Database connection](https://github.com/laibatajshaik/parking-management/blob/main/backend/db.js): `backend/db.js`
- **PostgreSQL data**
- [Notification service](https://github.com/laibatajshaik/parking-management/blob/main/backend/modules/notifications/notificationService.js): `backend/modules/notifications/notificationService.js`
- [Notification routes](https://github.com/laibatajshaik/parking-management/blob/main/backend/modules/notifications/notificationRoutes.js): `backend/modules/notifications/notificationRoutes.js`
- [Notification controller](https://github.com/laibatajshaik/parking-management/blob/main/backend/modules/notifications/notificationController.js): `backend/modules/notifications/notificationController.js`
- [Email service](https://github.com/laibatajshaik/parking-management/blob/main/backend/modules/email/emailService.js): `backend/modules/email/emailService.js`

### Other components

- **Customer / staff / admin**
- **Email provider**
- **Google identity**

## Connections

- Customer / staff / admin → Role-based routing: uses
- Role-based routing → Login and signup: routes to
- Role-based routing → Customer dashboard: routes to
- Role-based routing → Staff dashboard: routes to
- Role-based routing → Admin dashboard: routes to
- Customer dashboard → Plan and reservation: opens
- Customer dashboard → Parking and receipts: opens
- Staff dashboard → Vehicle check-in: opens
- Staff dashboard → Reservation validation: opens
- Staff dashboard → Fee calculation: opens
- Staff dashboard → Payment processing: opens
- Staff dashboard → Vehicle exit: opens
- Admin dashboard → Slot management: opens
- Admin dashboard → Active sessions: opens
- Admin dashboard → Pricing plans: opens
- Admin dashboard → Reports and revenue: opens
- Plan and reservation → Express API: requests plans
- Vehicle check-in → Express API: submits entry
- Express API → Database connection: queries
- Database connection → PostgreSQL data: reads / writes
- Express API → Notification service: dispatches
- Notification routes → Notification controller: dispatches
- Notification controller → Notification service: calls
- Notification service → Database connection: queries
- Express API → Email service: sends email
- Email service → Email provider: sends via
- Login and signup → Google identity: authenticates with
- Login and signup → Express API: exchanges credentials