# ritsuetc/-it-helpdesk-self-service-portal architecture

> Architecture diagram of the GitHub repository ritsuetc/-it-helpdesk-self-service-portal, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-28). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/ritsuetc/-it-helpdesk-self-service-portal
- Repository: https://github.com/ritsuetc/-it-helpdesk-self-service-portal

## Overview

IT Helpdesk & Self-Service Portal: employees search self-service guidance, create and track support tickets, and IT staff resolve and report on work while managing knowledge and inventory. The React portal calls an Express API, whose route modules implement the domain operations and query PostgreSQL/Supabase. Authentication and role checks protect the workflows; ticket activity is auditable. The README documents additional capabilities such as SLA indicators, auto-assignment, notifications, ratings, and inventory operations; some source excerpts were partial, so links are shown only where supported by sampled code or documentation.

Main entry points: [`backend/db.js`](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/db.js) (Database Client), [`backend/server.js`](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/server.js) (Express API), [`frontend/src/main.jsx`](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/main.jsx) (Portal Shell), [`frontend/src/api.js`](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/api.js) (API Client)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_portal["User Portal"]
  node_main["Portal Shell<br/>[main.jsx]"]
  node_api_client["API Client<br/>[api.js]"]
  node_tickets_ui["Ticketing<br/>[tickets.jsx]"]
  node_knowledge_ui["Knowledge Base<br/>[knowledge.jsx]"]
  node_troubleshoot_ui["Self-Service"]
  node_inventory_ui["Inventory<br/>[inventory.jsx]"]
  node_dashboard_ui["Dashboard<br/>[dashboard.jsx]"]
  node_report_ui["Reports<br/>[report.jsx]"]
end

subgraph group_api["API and Access"]
  node_server["Express API<br/>[server.js]"]
  node_auth_routes["Authentication<br/>[auth.js]"]
  node_token_mw["Token Verification<br/>[verifyToken.js]"]
  node_role_mw["Role Authorization<br/>[roleMiddleware.js]"]
end

subgraph group_workflows["Helpdesk Workflows"]
  node_ticket_routes["Ticket Operations<br/>[ticket.js]"]
  node_knowledge_routes["Knowledge Operations<br/>[knowledge.js]"]
  node_troubleshooting_routes["Troubleshooting<br/>[troubleshooting.js]"]
  node_inventory_routes["Inventory Operations<br/>[inventory.js]"]
  node_admin_routes["Administration<br/>[admin.js]"]
  node_notifications_routes["Notifications<br/>[notifications.js]"]
  node_audit_routes["Audit Trail<br/>[audit.js]"]
  node_audit_util["Audit Writer<br/>[audit.js]"]
end

subgraph group_data["Persistence"]
  node_db_client["Database Client<br/>[db.js]"]
  node_postgres[("Helpdesk Database<br/>[schema.sql]")]
end

node_employee(("Employee"))
node_itstaff(("Technician / Admin"))

node_employee -->|"uses portal"| node_main
node_itstaff -->|"uses portal"| node_main
node_main -->|"requests data"| node_api_client
node_main -->|"renders"| node_dashboard_ui
node_main -->|"renders"| node_knowledge_ui
node_main -->|"renders"| node_troubleshoot_ui
node_main -->|"opens tickets"| node_tickets_ui
node_main -->|"opens reports"| node_report_ui
node_main -->|"opens inventory"| node_inventory_ui
node_tickets_ui -->|"loads and updates"| node_api_client
node_knowledge_ui -->|"loads articles"| node_api_client
node_inventory_ui -->|"loads and updates"| node_api_client
node_dashboard_ui -->|"requests summaries"| node_api_client
node_report_ui -->|"requests reports"| node_api_client
node_api_client -->|"sends HTTP requests"| node_server
node_server -->|"mounts auth"| node_auth_routes
node_server -->|"mounts tickets"| node_ticket_routes
node_server -->|"mounts knowledge"| node_knowledge_routes
node_server -->|"mounts troubleshooting"| node_troubleshooting_routes
node_server -->|"mounts inventory"| node_inventory_routes
node_server -->|"mounts administration"| node_admin_routes
node_server -->|"mounts notifications"| node_notifications_routes
node_server -->|"mounts audit"| node_audit_routes
node_ticket_routes -->|"verifies protected requests"| node_token_mw
node_ticket_routes -->|"checks permitted roles"| node_role_mw
node_inventory_routes -->|"verifies protected requests"| node_token_mw
node_auth_routes -->|"queries accounts"| node_db_client
node_token_mw -->|"logs invalid tokens"| node_db_client
node_ticket_routes -->|"reads and writes tickets"| node_db_client
node_ticket_routes -->|"records activity"| node_audit_util
node_audit_routes -->|"reads audit trail"| node_db_client
node_audit_util -->|"writes audit events"| node_db_client
node_knowledge_routes -->|"queries articles"| node_db_client
node_troubleshooting_routes -->|"queries solutions"| node_db_client
node_inventory_routes -->|"reads and writes inventory"| node_db_client
node_notifications_routes -->|"queries notifications"| node_db_client
node_admin_routes -->|"queries administration data"| node_db_client
node_db_client -->|"queries PostgreSQL"| node_postgres

click node_main "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/main.jsx"
click node_api_client "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/api.js"
click node_tickets_ui "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/tickets.jsx"
click node_knowledge_ui "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/knowledge.jsx"
click node_troubleshoot_ui "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/troubleshooting.jsx"
click node_inventory_ui "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/inventory.jsx"
click node_dashboard_ui "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/dashboard.jsx"
click node_report_ui "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/report.jsx"
click node_server "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/server.js"
click node_auth_routes "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/auth.js"
click node_token_mw "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/middleware/verifyToken.js"
click node_role_mw "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/middleware/roleMiddleware.js"
click node_ticket_routes "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/ticket.js"
click node_knowledge_routes "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/knowledge.js"
click node_troubleshooting_routes "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/troubleshooting.js"
click node_inventory_routes "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/inventory.js"
click node_admin_routes "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/admin.js"
click node_notifications_routes "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/notifications.js"
click node_audit_routes "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/audit.js"
click node_audit_util "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/utils/audit.js"
click node_db_client "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/db.js"
click node_postgres "https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/supabase/schemas/public/schema.sql"

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_main,node_api_client,node_tickets_ui,node_knowledge_ui,node_troubleshoot_ui,node_inventory_ui,node_dashboard_ui,node_report_ui toneBlue
class node_server,node_auth_routes,node_token_mw,node_role_mw toneAmber
class node_ticket_routes,node_knowledge_routes,node_troubleshooting_routes,node_inventory_routes,node_admin_routes,node_notifications_routes,node_audit_routes,node_audit_util toneMint
class node_db_client,node_postgres toneRose
class node_employee,node_itstaff toneIndigo
```

## Components

### User Portal

- [Portal Shell](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/main.jsx): `frontend/src/main.jsx`
- [API Client](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/api.js): `frontend/src/api.js`
- [Ticketing](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/tickets.jsx): `frontend/src/tickets.jsx`
- [Knowledge Base](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/knowledge.jsx): `frontend/src/knowledge.jsx`
- [Self-Service](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/troubleshooting.jsx): `frontend/src/troubleshooting.jsx`
- [Inventory](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/inventory.jsx): `frontend/src/inventory.jsx`
- [Dashboard](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/dashboard.jsx): `frontend/src/dashboard.jsx`
- [Reports](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/frontend/src/report.jsx): `frontend/src/report.jsx`

### API and Access

- [Express API](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/server.js): `backend/server.js`
- [Authentication](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/auth.js): `backend/routes/auth.js`
- [Token Verification](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/middleware/verifyToken.js): `backend/middleware/verifyToken.js`
- [Role Authorization](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/middleware/roleMiddleware.js): `backend/middleware/roleMiddleware.js`

### Helpdesk Workflows

- [Ticket Operations](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/ticket.js): `backend/routes/ticket.js`
- [Knowledge Operations](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/knowledge.js): `backend/routes/knowledge.js`
- [Troubleshooting](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/troubleshooting.js): `backend/routes/troubleshooting.js`
- [Inventory Operations](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/inventory.js): `backend/routes/inventory.js`
- [Administration](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/admin.js): `backend/routes/admin.js`
- [Notifications](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/notifications.js): `backend/routes/notifications.js`
- [Audit Trail](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/routes/audit.js): `backend/routes/audit.js`
- [Audit Writer](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/utils/audit.js): `backend/utils/audit.js`

### Persistence

- [Database Client](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/backend/db.js): `backend/db.js`
- [Helpdesk Database](https://github.com/ritsuetc/-it-helpdesk-self-service-portal/blob/main/supabase/schemas/public/schema.sql): `supabase/schemas/public/schema.sql`

### Other components

- **Employee**
- **Technician / Admin**

## Connections

- Employee → Portal Shell: uses portal
- Technician / Admin → Portal Shell: uses portal
- Portal Shell → API Client: requests data
- Portal Shell → Dashboard: renders
- Portal Shell → Knowledge Base: renders
- Portal Shell → Self-Service: renders
- Portal Shell → Ticketing: opens tickets
- Portal Shell → Reports: opens reports
- Portal Shell → Inventory: opens inventory
- Ticketing → API Client: loads and updates
- Knowledge Base → API Client: loads articles
- Inventory → API Client: loads and updates
- Dashboard → API Client: requests summaries
- Reports → API Client: requests reports
- API Client → Express API: sends HTTP requests
- Express API → Authentication: mounts auth
- Express API → Ticket Operations: mounts tickets
- Express API → Knowledge Operations: mounts knowledge
- Express API → Troubleshooting: mounts troubleshooting
- Express API → Inventory Operations: mounts inventory
- Express API → Administration: mounts administration
- Express API → Notifications: mounts notifications
- Express API → Audit Trail: mounts audit
- Ticket Operations → Token Verification: verifies protected requests
- Ticket Operations → Role Authorization: checks permitted roles
- Inventory Operations → Token Verification: verifies protected requests
- Authentication → Database Client: queries accounts
- Token Verification → Database Client: logs invalid tokens
- Ticket Operations → Database Client: reads and writes tickets
- Ticket Operations → Audit Writer: records activity
- Audit Trail → Database Client: reads audit trail
- Audit Writer → Database Client: writes audit events
- Knowledge Operations → Database Client: queries articles
- Troubleshooting → Database Client: queries solutions
- Inventory Operations → Database Client: reads and writes inventory
- Notifications → Database Client: queries notifications
- Administration → Database Client: queries administration data
- Database Client → Helpdesk Database: queries PostgreSQL