# rare-art/gents-pg-electricity architecture

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

- Interactive diagram: https://gitdiagram.com/rare-art/gents-pg-electricity
- Repository: https://github.com/rare-art/gents-pg-electricity

## Overview

GentsPG Electricity Manager is a PG-owner portal for managing residents, meters, monthly electricity bills, and payments. The owner uses the dashboard to maintain records, generate and split a meter bill among residents, then track payment status and view reports. The React app calls an Express API backed by Mongoose models; OTP login protects owner operations. The tree and excerpts establish the main routes and bill workflow, but unsampled page and route implementations limit detail on their internal behavior.

Main entry points: [`client/src/App.jsx`](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/App.jsx) (Portal shell), [`client/src/api.js`](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/api.js) (API client), [`server/index.js`](https://github.com/rare-art/gents-pg-electricity/blob/main/server/index.js) (Express server), [`server/routes/auth.js`](https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/auth.js) (Auth routes)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Owner portal"]
  node_app["Portal shell<br/>[App.jsx]"]
  node_dashboard["Dashboard<br/>[Dashboard.jsx]"]
  node_residents_ui["Residents<br/>[Residents.jsx]"]
  node_meters_ui["Meters<br/>[Meters.jsx]"]
  node_bills_ui["Bills<br/>[Bills.jsx]"]
  node_reports["Payment reports<br/>[Reports.jsx]"]
  node_bill_form["Bill generator<br/>[BillModal.jsx]"]
  node_login["Login modal<br/>[LoginModal.jsx]"]
  node_whatsapp["WhatsApp dialog<br/>[WhatsAppModal.jsx]"]
  node_client_api["API client<br/>[api.js]"]
end

subgraph group_api["Backend API"]
  node_server["Express server<br/>[index.js]"]
end

subgraph group_identity["Owner authentication"]
  node_auth_context["Session context<br/>[AuthContext.jsx]"]
  node_auth_routes["Auth routes<br/>[auth.js]"]
  node_auth_middleware["JWT middleware<br/>[auth.js]"]
  node_user_model["User model<br/>[User.js]"]
end

subgraph group_records["Utility records"]
  node_resident_routes["Resident routes<br/>[residents.js]"]
  node_meter_routes["Meter routes<br/>[meters.js]"]
  node_bill_routes["Bill routes<br/>[bills.js]"]
  node_payment_routes["Payment routes<br/>[payments.js]"]
  node_stats_routes["Stats route<br/>[stats.js]"]
  node_resident_model["Resident model<br/>[Resident.js]"]
  node_meter_model["Meter model<br/>[Meter.js]"]
  node_bill_model["Bill model<br/>[Bill.js]"]
  node_payment_model["Payment model<br/>[Payment.js]"]
end

node_owner(("PG owner"))
node_mongo[("MongoDB")]
node_email["Email service"]

node_owner -->|"uses"| node_app
node_app -->|"renders"| node_dashboard
node_app -->|"renders"| node_residents_ui
node_app -->|"renders"| node_meters_ui
node_app -->|"renders"| node_bills_ui
node_app -->|"renders"| node_reports
node_app -->|"renders"| node_bill_form
node_app -->|"renders"| node_login
node_app -->|"renders"| node_whatsapp
node_app -->|"provides session"| node_auth_context
node_app -->|"fetches initial data"| node_client_api
node_auth_context -->|"requests identity"| node_client_api
node_bill_form -->|"creates bill"| node_client_api
node_client_api -->|"HTTP auth requests"| node_auth_routes
node_client_api -->|"HTTP resident requests"| node_resident_routes
node_client_api -->|"HTTP meter requests"| node_meter_routes
node_client_api -->|"HTTP bill requests"| node_bill_routes
node_client_api -->|"HTTP payment requests"| node_payment_routes
node_client_api -->|"HTTP stats requests"| node_stats_routes
node_server -->|"registers routes"| node_auth_routes
node_server -->|"registers routes"| node_resident_routes
node_server -->|"registers routes"| node_meter_routes
node_server -->|"registers routes"| node_bill_routes
node_server -->|"registers routes"| node_payment_routes
node_server -->|"registers routes"| node_stats_routes
node_auth_routes -->|"reads and updates"| node_user_model
node_auth_routes -->|"protects identity route"| node_auth_middleware
node_bill_routes -->|"protects mutations"| node_auth_middleware
node_bill_routes -->|"reads and writes"| node_bill_model
node_bill_routes -->|"creates and deletes"| node_payment_model
node_bill_routes -->|"updates reading"| node_meter_model
node_resident_routes -->|"uses model"| node_resident_model
node_resident_routes -->|"uses model"| node_payment_model
node_meter_routes -->|"uses model"| node_meter_model
node_payment_routes -->|"uses model"| node_payment_model
node_stats_routes -->|"aggregates data"| node_bill_model
node_stats_routes -->|"aggregates data"| node_payment_model
node_stats_routes -->|"aggregates data"| node_resident_model
node_stats_routes -->|"aggregates data"| node_meter_model
node_server -->|"connects database"| node_mongo
node_auth_routes -->|"sends OTP"| node_email
node_auth_routes -->|"stores OTP state"| node_user_model

click node_app "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/App.jsx"
click node_dashboard "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Dashboard.jsx"
click node_residents_ui "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Residents.jsx"
click node_meters_ui "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Meters.jsx"
click node_bills_ui "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Bills.jsx"
click node_reports "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Reports.jsx"
click node_bill_form "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/components/BillModal.jsx"
click node_login "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/components/LoginModal.jsx"
click node_whatsapp "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/components/WhatsAppModal.jsx"
click node_auth_context "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/context/AuthContext.jsx"
click node_client_api "https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/api.js"
click node_server "https://github.com/rare-art/gents-pg-electricity/blob/main/server/index.js"
click node_auth_routes "https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/auth.js"
click node_auth_middleware "https://github.com/rare-art/gents-pg-electricity/blob/main/server/middleware/auth.js"
click node_resident_routes "https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/residents.js"
click node_meter_routes "https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/meters.js"
click node_bill_routes "https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/bills.js"
click node_payment_routes "https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/payments.js"
click node_stats_routes "https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/stats.js"
click node_user_model "https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/User.js"
click node_resident_model "https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/Resident.js"
click node_meter_model "https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/Meter.js"
click node_bill_model "https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/Bill.js"
click node_payment_model "https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/Payment.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_dashboard,node_residents_ui,node_meters_ui,node_bills_ui,node_reports,node_bill_form,node_login,node_whatsapp,node_client_api toneBlue
class node_server,node_mongo toneAmber
class node_auth_context,node_auth_routes,node_auth_middleware,node_user_model toneMint
class node_resident_routes,node_meter_routes,node_bill_routes,node_payment_routes,node_stats_routes,node_resident_model,node_meter_model,node_bill_model,node_payment_model toneRose
class node_owner,node_email toneIndigo
```

## Components

### Owner portal

- [Portal shell](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/App.jsx): `client/src/App.jsx`
- [Dashboard](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Dashboard.jsx): `client/src/pages/Dashboard.jsx`
- [Residents](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Residents.jsx): `client/src/pages/Residents.jsx`
- [Meters](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Meters.jsx): `client/src/pages/Meters.jsx`
- [Bills](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Bills.jsx): `client/src/pages/Bills.jsx`
- [Payment reports](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/pages/Reports.jsx): `client/src/pages/Reports.jsx`
- [Bill generator](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/components/BillModal.jsx): `client/src/components/BillModal.jsx`
- [Login modal](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/components/LoginModal.jsx): `client/src/components/LoginModal.jsx`
- [WhatsApp dialog](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/components/WhatsAppModal.jsx): `client/src/components/WhatsAppModal.jsx`
- [API client](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/api.js): `client/src/api.js`

### Backend API

- [Express server](https://github.com/rare-art/gents-pg-electricity/blob/main/server/index.js): `server/index.js`

### Owner authentication

- [Session context](https://github.com/rare-art/gents-pg-electricity/blob/main/client/src/context/AuthContext.jsx): `client/src/context/AuthContext.jsx`
- [Auth routes](https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/auth.js): `server/routes/auth.js`
- [JWT middleware](https://github.com/rare-art/gents-pg-electricity/blob/main/server/middleware/auth.js): `server/middleware/auth.js`
- [User model](https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/User.js): `server/models/User.js`

### Utility records

- [Resident routes](https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/residents.js): `server/routes/residents.js`
- [Meter routes](https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/meters.js): `server/routes/meters.js`
- [Bill routes](https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/bills.js): `server/routes/bills.js`
- [Payment routes](https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/payments.js): `server/routes/payments.js`
- [Stats route](https://github.com/rare-art/gents-pg-electricity/blob/main/server/routes/stats.js): `server/routes/stats.js`
- [Resident model](https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/Resident.js): `server/models/Resident.js`
- [Meter model](https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/Meter.js): `server/models/Meter.js`
- [Bill model](https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/Bill.js): `server/models/Bill.js`
- [Payment model](https://github.com/rare-art/gents-pg-electricity/blob/main/server/models/Payment.js): `server/models/Payment.js`

### Other components

- **PG owner**
- **MongoDB**
- **Email service**

## Connections

- PG owner → Portal shell: uses
- Portal shell → Dashboard: renders (evidence: `client/src/App.jsx`)
- Portal shell → Residents: renders (evidence: `client/src/App.jsx`)
- Portal shell → Meters: renders (evidence: `client/src/App.jsx`)
- Portal shell → Bills: renders (evidence: `client/src/App.jsx`)
- Portal shell → Payment reports: renders (evidence: `client/src/App.jsx`)
- Portal shell → Bill generator: renders (evidence: `client/src/App.jsx`)
- Portal shell → Login modal: renders (evidence: `client/src/App.jsx`)
- Portal shell → WhatsApp dialog: renders (evidence: `client/src/App.jsx`)
- Portal shell → Session context: provides session (evidence: `client/src/App.jsx`)
- Portal shell → API client: fetches initial data (evidence: `client/src/App.jsx`)
- Session context → API client: requests identity (evidence: `client/src/context/AuthContext.jsx`)
- Bill generator → API client: creates bill (evidence: `client/src/components/BillModal.jsx`)
- API client → Auth routes: HTTP auth requests (evidence: `client/src/api.js`)
- API client → Resident routes: HTTP resident requests (evidence: `client/src/api.js`)
- API client → Meter routes: HTTP meter requests (evidence: `client/src/api.js`)
- API client → Bill routes: HTTP bill requests (evidence: `client/src/api.js`)
- API client → Payment routes: HTTP payment requests (evidence: `client/src/api.js`)
- API client → Stats route: HTTP stats requests (evidence: `client/src/api.js`)
- Express server → Auth routes: registers routes (evidence: `server/index.js`)
- Express server → Resident routes: registers routes (evidence: `server/index.js`)
- Express server → Meter routes: registers routes (evidence: `server/index.js`)
- Express server → Bill routes: registers routes (evidence: `server/index.js`)
- Express server → Payment routes: registers routes (evidence: `server/index.js`)
- Express server → Stats route: registers routes (evidence: `server/index.js`)
- Auth routes → User model: reads and updates (evidence: `server/routes/auth.js`)
- Auth routes → JWT middleware: protects identity route (evidence: `server/routes/auth.js`)
- Bill routes → JWT middleware: protects mutations (evidence: `server/routes/bills.js`)
- Bill routes → Bill model: reads and writes (evidence: `server/routes/bills.js`)
- Bill routes → Payment model: creates and deletes (evidence: `server/routes/bills.js`)
- Bill routes → Meter model: updates reading (evidence: `server/routes/bills.js`)
- Resident routes → Resident model: uses model (evidence: `server/routes/residents.js`)
- Resident routes → Payment model: uses model (evidence: `server/routes/residents.js`)
- Meter routes → Meter model: uses model (evidence: `server/routes/meters.js`)
- Payment routes → Payment model: uses model (evidence: `server/routes/payments.js`)
- Stats route → Bill model: aggregates data (evidence: `server/routes/stats.js`)
- Stats route → Payment model: aggregates data (evidence: `server/routes/stats.js`)
- Stats route → Resident model: aggregates data (evidence: `server/routes/stats.js`)
- Stats route → Meter model: aggregates data (evidence: `server/routes/stats.js`)
- Express server → MongoDB: connects database (evidence: `server/index.js`)
- Auth routes → Email service: sends OTP (evidence: `server/routes/auth.js`)
- Auth routes → User model: stores OTP state (evidence: `server/routes/auth.js`)