# khoalaotu40-creator/cogo_uii architecture

> Architecture diagram of the GitHub repository khoalaotu40-creator/cogo_uii, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-10-02). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/khoalaotu40-creator/cogo_uii
- Repository: https://github.com/khoalaotu40-creator/cogo_uii

## Overview

CoGo_uii implements phone-based login and registration, OTP verification, profile creation, and student-status verification. The browser app routes users through those states, while an Express API handles OTP/profile operations and student-verification requests; Supabase supplies authentication and persistence. The source index confirms several component dependencies, but the README provides no additional product capabilities, and the student-verification server implementation was not excerpted, so its internal behavior is not expanded here.

Main entry points: [`src/app/routes.tsx`](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/app/routes.tsx) (Auth routing), [`src/shared/lib/api.ts`](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/shared/lib/api.ts) (API client), [`server/server.ts`](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/server.ts) (Express server), [`src/app/context/AuthContext.tsx`](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/app/context/AuthContext.tsx) (Auth context)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_browser["Browser application"]
  node_entry["React entry<br/>[main.tsx]"]
  node_app["App shell<br/>[App.tsx]"]
  node_routes["Auth routing<br/>[routes.tsx]"]
  node_layout["Auth layout<br/>[AuthLayout.tsx]"]
  node_context["Auth context<br/>[AuthContext.tsx]"]
end

subgraph group_authflow["Phone authentication"]
  node_login["Login form<br/>[Login.tsx]"]
  node_register["Registration form<br/>[Register.tsx]"]
  node_otp["OTP verification"]
  node_student_ui["Student verification"]
end

subgraph group_backend["API services"]
  node_api_client["API client<br/>[api.ts]"]
  node_express["Express server<br/>[server.ts]"]
  node_auth_api["Auth endpoints<br/>[auth.ts]"]
  node_verification_api["Verification endpoint"]
end

subgraph group_persistence["Supabase services"]
  node_admin_client["Admin client<br/>[index.ts]"]
  node_browser_client["Browser client<br/>[supabase.ts]"]
end

node_user(("User"))
node_supabase[("Supabase")]

node_user -->|"uses"| node_entry
node_entry -->|"renders"| node_app
node_app -->|"provides"| node_context
node_app -->|"renders"| node_routes
node_routes -->|"renders"| node_layout
node_routes -->|"routes to"| node_login
node_routes -->|"routes to"| node_register
node_routes -->|"routes to"| node_otp
node_routes -->|"routes to"| node_student_ui
node_routes -->|"reads state"| node_context
node_context -->|"tracks session"| node_browser_client
node_context -->|"loads profile"| node_api_client
node_login -->|"requests OTP"| node_api_client
node_register -->|"requests OTP"| node_api_client
node_otp -->|"verifies OTP"| node_api_client
node_otp -->|"sets session"| node_browser_client
node_otp -->|"refreshes profile"| node_context
node_student_ui -->|"loads universities"| node_api_client
node_student_ui -->|"submits verification"| node_express
node_api_client -->|"sends API requests"| node_express
node_express -->|"mounts routes"| node_auth_api
node_express -->|"mounts routes"| node_verification_api
node_express -->|"queries universities"| node_admin_client
node_auth_api -->|"queries auth data"| node_admin_client
node_verification_api -->|"uses database"| node_admin_client
node_admin_client -->|"connects to"| node_supabase
node_browser_client -->|"authenticates with"| node_supabase

click node_entry "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/main.tsx"
click node_app "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/app/App.tsx"
click node_routes "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/app/routes.tsx"
click node_layout "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/AuthLayout.tsx"
click node_context "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/app/context/AuthContext.tsx"
click node_login "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/Login.tsx"
click node_register "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/Register.tsx"
click node_otp "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/OtpVerification.tsx"
click node_student_ui "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/StudentVerification.tsx"
click node_api_client "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/shared/lib/api.ts"
click node_express "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/server.ts"
click node_auth_api "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/api/auth.ts"
click node_verification_api "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/api/student_verifications.ts"
click node_admin_client "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/db/index.ts"
click node_browser_client "https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/shared/lib/supabase.ts"

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_entry,node_app,node_routes,node_layout,node_context,node_user toneBlue
class node_login,node_register,node_otp,node_student_ui,node_supabase toneAmber
class node_api_client,node_express,node_auth_api,node_verification_api toneMint
class node_admin_client,node_browser_client toneRose
```

## Components

### Browser application

- [React entry](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/main.tsx): `src/main.tsx`
- [App shell](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/app/App.tsx): `src/app/App.tsx`
- [Auth routing](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/app/routes.tsx): `src/app/routes.tsx`
- [Auth layout](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/AuthLayout.tsx): `src/user/auth/AuthLayout.tsx`
- [Auth context](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/app/context/AuthContext.tsx): `src/app/context/AuthContext.tsx`

### Phone authentication

- [Login form](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/Login.tsx): `src/user/auth/Login.tsx`
- [Registration form](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/Register.tsx): `src/user/auth/Register.tsx`
- [OTP verification](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/OtpVerification.tsx): `src/user/auth/OtpVerification.tsx`
- [Student verification](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/user/auth/StudentVerification.tsx): `src/user/auth/StudentVerification.tsx`

### API services

- [API client](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/shared/lib/api.ts): `src/shared/lib/api.ts`
- [Express server](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/server.ts): `server/server.ts`
- [Auth endpoints](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/api/auth.ts): `server/api/auth.ts`
- [Verification endpoint](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/api/student_verifications.ts): `server/api/student_verifications.ts`

### Supabase services

- [Admin client](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/server/db/index.ts): `server/db/index.ts`
- [Browser client](https://github.com/khoalaotu40-creator/cogo_uii/blob/main/src/shared/lib/supabase.ts): `src/shared/lib/supabase.ts`

### Other components

- **User**
- **Supabase**

## Connections

- User → React entry: uses (evidence: `src/main.tsx`)
- React entry → App shell: renders (evidence: `src/main.tsx`)
- App shell → Auth context: provides (evidence: `src/app/App.tsx`)
- App shell → Auth routing: renders (evidence: `src/app/App.tsx`)
- Auth routing → Auth layout: renders (evidence: `src/app/routes.tsx`)
- Auth routing → Login form: routes to (evidence: `src/app/routes.tsx`)
- Auth routing → Registration form: routes to (evidence: `src/app/routes.tsx`)
- Auth routing → OTP verification: routes to (evidence: `src/app/routes.tsx`)
- Auth routing → Student verification: routes to (evidence: `src/app/routes.tsx`)
- Auth routing → Auth context: reads state (evidence: `src/app/routes.tsx`)
- Auth context → Browser client: tracks session (evidence: `src/app/context/AuthContext.tsx`)
- Auth context → API client: loads profile (evidence: `src/app/context/AuthContext.tsx`)
- Login form → API client: requests OTP (evidence: `src/user/auth/Login.tsx`)
- Registration form → API client: requests OTP (evidence: `src/user/auth/Register.tsx`)
- OTP verification → API client: verifies OTP (evidence: `src/user/auth/OtpVerification.tsx`)
- OTP verification → Browser client: sets session (evidence: `src/user/auth/OtpVerification.tsx`)
- OTP verification → Auth context: refreshes profile (evidence: `src/user/auth/OtpVerification.tsx`)
- Student verification → API client: loads universities (evidence: `src/user/auth/StudentVerification.tsx`)
- Student verification → Express server: submits verification (evidence: `src/user/auth/StudentVerification.tsx`)
- API client → Express server: sends API requests (evidence: `src/shared/lib/api.ts`)
- Express server → Auth endpoints: mounts routes (evidence: `server/server.ts`)
- Express server → Verification endpoint: mounts routes (evidence: `server/server.ts`)
- Express server → Admin client: queries universities (evidence: `server/server.ts`)
- Auth endpoints → Admin client: queries auth data (evidence: `server/api/auth.ts`)
- Verification endpoint → Admin client: uses database (evidence: `server/api/student_verifications.ts`)
- Admin client → Supabase: connects to (evidence: `server/db/index.ts`)
- Browser client → Supabase: authenticates with (evidence: `src/shared/lib/supabase.ts`)