# kenfemboy/city-wide-concern-portal-cwcp architecture

> Architecture diagram of the GitHub repository kenfemboy/city-wide-concern-portal-cwcp, 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/kenfemboy/city-wide-concern-portal-cwcp
- Repository: https://github.com/kenfemboy/city-wide-concern-portal-cwcp

## Overview

CWCP is a city-wide concern reporting and moderation portal. Residents submit concerns and browse or filter reports; moderators review reports, change their status, or reject them with a reason. The frontend periodically fetches reports and presents statistics and area-based map views. The backend routes those requests to report, moderation, authentication, and statistics handlers, backed by MongoDB; report images are uploaded to Firebase Storage. Several frontend-to-API interactions are visible in excerpts, while the form submission and login wiring are not, so those links are marked unverified.

Main entry points: [`CWCP-Backend/routes/userRoute.js`](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/routes/userRoute.js) (API routes), [`CWCP-Frontend/src/MAINPAGE/main.jsx`](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/MAINPAGE/main.jsx) (Portal dashboard), [`CWCP-Frontend/src/app.jsx`](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/app.jsx) (App routes), [`CWCP-Backend/model/postModel.js`](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/model/postModel.js) (Concern records)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Portal interface"]
  node_app["App routes<br/>[app.jsx]"]
  node_main["Portal dashboard<br/>[main.jsx]"]
  node_header["Navigation and actions<br/>[HeaderFrame.jsx]"]
  node_form["Concern form<br/>[form.jsx]"]
  node_report_views["Concern lists and cards<br/>[cards.jsx]"]
  node_categories["Status categories"]
  node_filters["Search and filters<br/>[filters.jsx]"]
end

subgraph group_reports["Report handling"]
  node_routes["API routes<br/>[userRoute.js]"]
  node_create["Create report<br/>[createPost.js]"]
  node_fetch["Report queries<br/>[fetchPosts.js]"]
end

subgraph group_moderation["Moderation and access"]
  node_admin_login["Admin login<br/>[login.jsx]"]
  node_moderation_actions["Approve, reject, status<br/>[postController.js]"]
  node_login_handler["Admin authentication<br/>[adminLogin.js]"]
end

subgraph group_insights["Statistics and mapping"]
  node_map["Area map<br/>[gmap.jsx]"]
  node_stats_ui["Statistics dashboard<br/>[statistics.jsx]"]
  node_stats_api["Report statistics<br/>[statistics.js]"]
end

subgraph group_persistence["Storage and media"]
  node_concern_store[("Concern records<br/>[postModel.js]")]
  node_admin_store[("Admin records<br/>[adminModel.js]")]
  node_image_upload["Image upload"]
  node_firebase[("Firebase Storage")]
end

node_resident(("Resident"))
node_moderator(("Moderator"))
node_maps_service["Google Maps services"]

node_resident -->|"opens portal"| node_app
node_moderator -->|"opens portal"| node_app
node_app -->|"routes to"| node_main
node_app -->|"routes to"| node_admin_login
node_main -->|"renders"| node_header
node_main -->|"renders"| node_form
node_main -->|"renders"| node_report_views
node_main -->|"renders"| node_categories
node_main -->|"filters reports"| node_filters
node_main -->|"renders"| node_stats_ui
node_main -->|"renders"| node_map
node_main -->|"fetches reports"| node_fetch
node_form -.->|"submits report"| node_routes
node_report_views -->|"sends moderation actions"| node_routes
node_stats_ui -->|"requests statistics"| node_routes
node_map -->|"requests area stats"| node_routes
node_map -->|"geocodes area"| node_maps_service
node_admin_login -.->|"authenticates"| node_routes
node_routes -->|"dispatches create"| node_create
node_routes -->|"dispatches queries"| node_fetch
node_routes -->|"dispatches updates"| node_moderation_actions
node_routes -->|"dispatches login"| node_login_handler
node_routes -->|"dispatches statistics"| node_stats_api
node_create -->|"creates report"| node_concern_store
node_create -->|"uploads image"| node_image_upload
node_fetch -->|"queries reports"| node_concern_store
node_moderation_actions -->|"updates report"| node_concern_store
node_login_handler -->|"looks up admin"| node_admin_store
node_stats_api -->|"aggregates reports"| node_concern_store
node_image_upload -->|"writes image"| node_firebase

click node_app "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/app.jsx"
click node_main "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/MAINPAGE/main.jsx"
click node_header "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/HeaderFrame/HeaderFrame.jsx"
click node_form "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/FORM/form.jsx"
click node_report_views "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/CARDS/cards.jsx"
click node_categories "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/tree/main/CWCP-Frontend/src/CARDS/Categories"
click node_filters "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/FILTER/filters.jsx"
click node_map "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/GMAP/gmap.jsx"
click node_stats_ui "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/Stats/statistics.jsx"
click node_admin_login "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/MODERATOR/login.jsx"
click node_routes "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/routes/userRoute.js"
click node_create "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/controller/createPost.js"
click node_fetch "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/controller/fetchPosts.js"
click node_moderation_actions "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/controller/postController.js"
click node_login_handler "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/authentication/adminLogin.js"
click node_stats_api "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/statistics/statistics.js"
click node_concern_store "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/model/postModel.js"
click node_admin_store "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/model/adminModel.js"
click node_image_upload "https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/util/uploadToFirebase.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_main,node_header,node_form,node_report_views,node_categories,node_filters toneBlue
class node_routes,node_create,node_fetch toneAmber
class node_admin_login,node_moderation_actions,node_login_handler toneMint
class node_map,node_stats_ui,node_stats_api toneRose
class node_concern_store,node_admin_store,node_image_upload,node_firebase,node_resident,node_moderator,node_maps_service toneIndigo
```

## Components

### Portal interface

- [App routes](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/app.jsx): `CWCP-Frontend/src/app.jsx`
- [Portal dashboard](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/MAINPAGE/main.jsx): `CWCP-Frontend/src/MAINPAGE/main.jsx`
- [Navigation and actions](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/HeaderFrame/HeaderFrame.jsx): `CWCP-Frontend/src/HeaderFrame/HeaderFrame.jsx`
- [Concern form](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/FORM/form.jsx): `CWCP-Frontend/src/FORM/form.jsx`
- [Concern lists and cards](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/CARDS/cards.jsx): `CWCP-Frontend/src/CARDS/cards.jsx`
- [Status categories](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/tree/main/CWCP-Frontend/src/CARDS/Categories): `CWCP-Frontend/src/CARDS/Categories`
- [Search and filters](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/FILTER/filters.jsx): `CWCP-Frontend/src/FILTER/filters.jsx`

### Report handling

- [API routes](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/routes/userRoute.js): `CWCP-Backend/routes/userRoute.js`
- [Create report](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/controller/createPost.js): `CWCP-Backend/controller/createPost.js`
- [Report queries](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/controller/fetchPosts.js): `CWCP-Backend/controller/fetchPosts.js`

### Moderation and access

- [Admin login](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/MODERATOR/login.jsx): `CWCP-Frontend/src/MODERATOR/login.jsx`
- [Approve, reject, status](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/controller/postController.js): `CWCP-Backend/controller/postController.js`
- [Admin authentication](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/authentication/adminLogin.js): `CWCP-Backend/authentication/adminLogin.js`

### Statistics and mapping

- [Area map](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/GMAP/gmap.jsx): `CWCP-Frontend/src/GMAP/gmap.jsx`
- [Statistics dashboard](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Frontend/src/Stats/statistics.jsx): `CWCP-Frontend/src/Stats/statistics.jsx`
- [Report statistics](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/statistics/statistics.js): `CWCP-Backend/statistics/statistics.js`

### Storage and media

- [Concern records](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/model/postModel.js): `CWCP-Backend/model/postModel.js`
- [Admin records](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/model/adminModel.js): `CWCP-Backend/model/adminModel.js`
- [Image upload](https://github.com/kenfemboy/city-wide-concern-portal-cwcp/blob/main/CWCP-Backend/util/uploadToFirebase.js): `CWCP-Backend/util/uploadToFirebase.js`
- **Firebase Storage**

### Other components

- **Resident**
- **Moderator**
- **Google Maps services**

## Connections

- Resident → App routes: opens portal (evidence: `CWCP-Frontend/src/app.jsx`)
- Moderator → App routes: opens portal (evidence: `CWCP-Frontend/src/app.jsx`)
- App routes → Portal dashboard: routes to (evidence: `CWCP-Frontend/src/app.jsx`)
- App routes → Admin login: routes to (evidence: `CWCP-Frontend/src/app.jsx`)
- Portal dashboard → Navigation and actions: renders (evidence: `CWCP-Frontend/src/MAINPAGE/main.jsx`)
- Portal dashboard → Concern form: renders (evidence: `CWCP-Frontend/src/MAINPAGE/main.jsx`)
- Portal dashboard → Concern lists and cards: renders (evidence: `CWCP-Frontend/src/MAINPAGE/main.jsx`)
- Portal dashboard → Status categories: renders (evidence: `CWCP-Frontend/src/MAINPAGE/main.jsx`)
- Portal dashboard → Search and filters: filters reports (evidence: `CWCP-Frontend/src/MAINPAGE/main.jsx`)
- Portal dashboard → Statistics dashboard: renders (evidence: `CWCP-Frontend/src/MAINPAGE/main.jsx`)
- Portal dashboard → Area map: renders (evidence: `CWCP-Frontend/src/MAINPAGE/main.jsx`)
- Portal dashboard → Report queries: fetches reports (evidence: `CWCP-Frontend/src/MAINPAGE/main.jsx`)
- Concern form → API routes: submits report
- Concern lists and cards → API routes: sends moderation actions (evidence: `CWCP-Frontend/src/CARDS/cards.jsx`)
- Statistics dashboard → API routes: requests statistics (evidence: `CWCP-Frontend/src/Stats/statistics.jsx`)
- Area map → API routes: requests area stats (evidence: `CWCP-Frontend/src/GMAP/gmap.jsx`)
- Area map → Google Maps services: geocodes area (evidence: `CWCP-Frontend/src/GMAP/gmap.jsx`)
- Admin login → API routes: authenticates
- API routes → Create report: dispatches create (evidence: `CWCP-Backend/routes/userRoute.js`)
- API routes → Report queries: dispatches queries (evidence: `CWCP-Backend/routes/userRoute.js`)
- API routes → Approve, reject, status: dispatches updates (evidence: `CWCP-Backend/routes/userRoute.js`)
- API routes → Admin authentication: dispatches login (evidence: `CWCP-Backend/routes/userRoute.js`)
- API routes → Report statistics: dispatches statistics (evidence: `CWCP-Backend/routes/userRoute.js`)
- Create report → Concern records: creates report (evidence: `CWCP-Backend/controller/createPost.js`)
- Create report → Image upload: uploads image (evidence: `CWCP-Backend/controller/createPost.js`)
- Report queries → Concern records: queries reports (evidence: `CWCP-Backend/controller/fetchPosts.js`)
- Approve, reject, status → Concern records: updates report (evidence: `CWCP-Backend/controller/postController.js`)
- Admin authentication → Admin records: looks up admin (evidence: `CWCP-Backend/authentication/adminLogin.js`)
- Report statistics → Concern records: aggregates reports (evidence: `CWCP-Backend/statistics/statistics.js`)
- Image upload → Firebase Storage: writes image (evidence: `CWCP-Backend/util/uploadToFirebase.js`)