# kokoy123-web/sad-servicerequest-quimson architecture

> Architecture diagram of the GitHub repository kokoy123-web/sad-servicerequest-quimson, 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/kokoy123-web/sad-servicerequest-quimson
- Repository: https://github.com/kokoy123-web/sad-servicerequest-quimson

## Overview

SAD is a browser-based service-request manager. A user signs in through the login flow, then works with requests in the dashboard: the app loads records, supports search and filtering, validates create/update input, confirms deletion, and displays summary and category/priority analytics. Supabase provides authentication and PostgreSQL storage, with SQL-defined RLS policies protecting access. The JavaScript excerpt shows these interactions; some README-listed capabilities, including responsive presentation and logout/session handling, are documented but not fully sampled.

Main entry points: [`js/supabase.js`](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/supabase.js) (Supabase client), [`js/app.js`](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js) (Dashboard controller), [`index.html`](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/index.html) (Dashboard page), [`login.html`](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/login.html) (Login page)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_access["Access"]
  node_login["Login page<br/>[login.html]"]
  node_authjs["Login and session<br/>[auth.js]"]
end

subgraph group_requests["Request management"]
  node_app["Dashboard controller<br/>[app.js]"]
  node_requestlist["Request list and filters<br/>[app.js]"]
  node_requestform["Validated request CRUD<br/>[app.js]"]
  node_analytics["Request analytics<br/>[app.js]"]
end

subgraph group_backend["Supabase backend"]
  node_client["Supabase client<br/>[supabase.js]"]
  node_authservice["Supabase Auth"]
  node_requestsdb[("Service requests<br/>[schema.sql]")]
  node_rls["RLS policies<br/>[schema.sql]"]
  node_postgres[("Supabase PostgreSQL")]
end

subgraph group_presentation["Presentation"]
  node_dashboard["Dashboard page<br/>[index.html]"]
  node_styles["Responsive styling<br/>[style.css]"]
end

node_user(("Service user"))

node_user -->|"opens"| node_login
node_login -->|"submits credentials"| node_authjs
node_authjs -->|"calls auth"| node_client
node_client -->|"auth requests"| node_authservice
node_authservice -->|"returns session"| node_client
node_user -->|"uses"| node_dashboard
node_dashboard -->|"loads script"| node_app
node_app -->|"checks session"| node_client
node_app -->|"loads and filters"| node_requestlist
node_app -->|"handles request actions"| node_requestform
node_app -->|"renders summaries"| node_analytics
node_requestlist -->|"selects records"| node_client
node_requestform -->|"writes records"| node_client
node_client -->|"database requests"| node_postgres
node_postgres -->|"stores records"| node_requestsdb
node_requestsdb -->|"access governed by"| node_rls
node_dashboard -->|"styled by"| node_styles

click node_login "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/login.html"
click node_authjs "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/auth.js"
click node_client "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/supabase.js"
click node_dashboard "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/index.html"
click node_app "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js"
click node_requestlist "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js"
click node_requestform "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js"
click node_analytics "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js"
click node_styles "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/css/style.css"
click node_requestsdb "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/sql/schema.sql"
click node_rls "https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/sql/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_login,node_authjs,node_user toneBlue
class node_app,node_requestlist,node_requestform,node_analytics toneAmber
class node_client,node_authservice,node_requestsdb,node_rls,node_postgres toneMint
class node_dashboard,node_styles toneRose
```

## Components

### Access

- [Login page](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/login.html): `login.html`
- [Login and session](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/auth.js): `js/auth.js`

### Request management

- [Dashboard controller](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js): `js/app.js`
- [Request list and filters](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js): `js/app.js`
- [Validated request CRUD](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js): `js/app.js`
- [Request analytics](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/app.js): `js/app.js`

### Supabase backend

- [Supabase client](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/js/supabase.js): `js/supabase.js`
- **Supabase Auth**
- [Service requests](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/sql/schema.sql): `sql/schema.sql`
- [RLS policies](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/sql/schema.sql): `sql/schema.sql`
- **Supabase PostgreSQL**

### Presentation

- [Dashboard page](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/index.html): `index.html`
- [Responsive styling](https://github.com/kokoy123-web/sad-servicerequest-quimson/blob/main/css/style.css): `css/style.css`

### Other components

- **Service user**

## Connections

- Service user → Login page: opens
- Login page → Login and session: submits credentials
- Login and session → Supabase client: calls auth
- Supabase client → Supabase Auth: auth requests
- Supabase Auth → Supabase client: returns session
- Service user → Dashboard page: uses
- Dashboard page → Dashboard controller: loads script
- Dashboard controller → Supabase client: checks session
- Dashboard controller → Request list and filters: loads and filters
- Dashboard controller → Validated request CRUD: handles request actions
- Dashboard controller → Request analytics: renders summaries
- Request list and filters → Supabase client: selects records
- Validated request CRUD → Supabase client: writes records
- Supabase client → Supabase PostgreSQL: database requests
- Supabase PostgreSQL → Service requests: stores records
- Service requests → RLS policies: access governed by
- Dashboard page → Responsive styling: styled by