# khant-min-htut/team-accesss-control-app architecture

> Architecture diagram of the GitHub repository khant-min-htut/team-accesss-control-app, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-23). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/khant-min-htut/team-accesss-control-app
- Repository: https://github.com/khant-min-htut/team-accesss-control-app

## Overview

This is a client-side administrative dashboard for authentication and management of users, organizations, roles/permissions, invitations, sessions, and audit activity. The main flow is sign-in or sign-up, token storage and current-user resolution, guarded dashboard access, then domain pages that query or mutate the API and render results. The sampled code confirms authentication, session operations, dashboard data queries, and the users/roles page integrations; other domain wiring is represented conservatively from the repository structure.

Main entry points: [`src/lib/api.ts`](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/lib/api.ts) (HTTP API client), [`src/hooks/use-auth.ts`](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-auth.ts) (Authentication actions), [`src/app/(dashboard)/page.tsx`](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/page.tsx) (Overview), [`src/hooks/use-audit-logs.ts`](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-audit-logs.ts) (Audit queries)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_access["Access and Shell"]
  node_login["Login and signup<br/>[page.tsx]"]
  node_auth_logic["Authentication actions<br/>[use-auth.ts]"]
  node_auth_api["Authentication API<br/>[auth-api.ts]"]
  node_auth_state["Auth state<br/>[store.ts]"]
  node_guard["Route guard<br/>[auth-guard.tsx]"]
  node_dashboard_shell["Dashboard shell"]
end

subgraph group_overview["Dashboard and Activity"]
  node_dashboard["Overview<br/>[page.tsx]"]
  node_audit_page["Audit log viewer<br/>[page.tsx]"]
  node_audit_hook["Audit queries<br/>[use-audit-logs.ts]"]
  node_audit_service["Audit API service<br/>[audit-logs.ts]"]
end

subgraph group_directory["People and Organizations"]
  node_org_page["Organizations<br/>[page.tsx]"]
  node_org_detail["Organization detail<br/>[page.tsx]"]
  node_org_hook["Organization queries"]
  node_org_service["Organization API service<br/>[organizations.ts]"]
  node_users_page["User management<br/>[page.tsx]"]
  node_users_hook["User queries and mutations<br/>[use-users.ts]"]
  node_users_service["User API service<br/>[users.ts]"]
  node_invitations["Invitations<br/>[invitations.ts]"]
end

subgraph group_security["Access Administration"]
  node_roles_page["Roles and permissions<br/>[page.tsx]"]
  node_rbac_hook["RBAC queries<br/>[use-rbac.ts]"]
  node_rbac_service["RBAC API service<br/>[rbac.ts]"]
  node_sessions_page["Session management<br/>[page.tsx]"]
  node_sessions_hook["Session queries and actions<br/>[use-sessions.ts]"]
  node_sessions_service["Session API service<br/>[sessions.ts]"]
  node_profile_page["Profile<br/>[page.tsx]"]
end

subgraph group_runtime["Client Data Runtime"]
  node_query_runtime["Query hooks runtime"]
  node_api_client["HTTP API client<br/>[api.ts]"]
end

node_operator(("Dashboard user"))
node_backend{{"Management API"}}

node_operator -->|"submits credentials"| node_login
node_login -->|"starts auth"| node_auth_logic
node_auth_logic -->|"requests tokens"| node_auth_api
node_auth_logic -->|"stores tokens"| node_auth_state
node_auth_logic -->|"resolves user"| node_users_service
node_auth_api -->|"sends auth requests"| node_api_client
node_guard -->|"checks access"| node_auth_state
node_dashboard_shell -->|"guards pages"| node_guard
node_operator -->|"opens dashboard"| node_dashboard
node_dashboard -->|"loads organizations"| node_org_hook
node_dashboard -->|"loads activity"| node_audit_hook
node_dashboard -->|"loads sessions"| node_sessions_hook
node_audit_page -->|"queries and filters"| node_audit_hook
node_audit_hook -->|"requests logs"| node_audit_service
node_org_page -->|"loads organizations"| node_org_hook
node_org_detail -->|"loads organization"| node_org_hook
node_users_page -->|"manages users"| node_users_hook
node_users_hook -->|"requests user data"| node_users_service
node_roles_page -->|"manages roles"| node_rbac_hook
node_sessions_page -->|"manages sessions"| node_sessions_hook
node_sessions_hook -->|"requests sessions"| node_sessions_service
node_audit_service -->|"calls API"| node_api_client
node_org_service -->|"calls API"| node_api_client
node_users_service -->|"calls API"| node_api_client
node_rbac_service -->|"calls API"| node_api_client
node_sessions_service -->|"calls API"| node_api_client
node_api_client -->|"sends requests"| node_backend

click node_login "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/login/page.tsx"
click node_auth_logic "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-auth.ts"
click node_auth_api "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/lib/auth-api.ts"
click node_auth_state "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/lib/store.ts"
click node_guard "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/components/auth-guard.tsx"
click node_dashboard_shell "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/components/layout/dashboard-shell.tsx"
click node_dashboard "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/page.tsx"
click node_audit_page "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/audit-logs/page.tsx"
click node_audit_hook "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-audit-logs.ts"
click node_audit_service "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/audit-logs.ts"
click node_org_page "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/organizations/page.tsx"
click node_org_detail "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/organizations/%5Bid%5D/page.tsx"
click node_org_hook "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-organizations.ts"
click node_org_service "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/organizations.ts"
click node_users_page "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/users/page.tsx"
click node_users_hook "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-users.ts"
click node_users_service "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/users.ts"
click node_invitations "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/invitations.ts"
click node_roles_page "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/roles/page.tsx"
click node_rbac_hook "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-rbac.ts"
click node_rbac_service "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/rbac.ts"
click node_sessions_page "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/sessions/page.tsx"
click node_sessions_hook "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-sessions.ts"
click node_sessions_service "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/sessions.ts"
click node_profile_page "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/profile/page.tsx"
click node_query_runtime "https://github.com/khant-min-htut/team-accesss-control-app/tree/main/src/hooks"
click node_api_client "https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/lib/api.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_login,node_auth_logic,node_auth_api,node_auth_state,node_guard,node_dashboard_shell,node_operator toneBlue
class node_dashboard,node_audit_page,node_audit_hook,node_audit_service toneAmber
class node_org_page,node_org_detail,node_org_hook,node_org_service,node_users_page,node_users_hook,node_users_service,node_invitations,node_backend toneMint
class node_roles_page,node_rbac_hook,node_rbac_service,node_sessions_page,node_sessions_hook,node_sessions_service,node_profile_page toneRose
class node_query_runtime,node_api_client toneIndigo
```

## Components

### Access and Shell

- [Login and signup](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/login/page.tsx): `src/app/login/page.tsx`
- [Authentication actions](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-auth.ts): `src/hooks/use-auth.ts`
- [Authentication API](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/lib/auth-api.ts): `src/lib/auth-api.ts`
- [Auth state](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/lib/store.ts): `src/lib/store.ts`
- [Route guard](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/components/auth-guard.tsx): `src/components/auth-guard.tsx`
- [Dashboard shell](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/components/layout/dashboard-shell.tsx): `src/components/layout/dashboard-shell.tsx`

### Dashboard and Activity

- [Overview](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/page.tsx): `src/app/(dashboard)/page.tsx`
- [Audit log viewer](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/audit-logs/page.tsx): `src/app/(dashboard)/audit-logs/page.tsx`
- [Audit queries](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-audit-logs.ts): `src/hooks/use-audit-logs.ts`
- [Audit API service](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/audit-logs.ts): `src/services/audit-logs.ts`

### People and Organizations

- [Organizations](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/organizations/page.tsx): `src/app/(dashboard)/organizations/page.tsx`
- [Organization detail](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/organizations/%5Bid%5D/page.tsx): `src/app/(dashboard)/organizations/[id]/page.tsx`
- [Organization queries](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-organizations.ts): `src/hooks/use-organizations.ts`
- [Organization API service](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/organizations.ts): `src/services/organizations.ts`
- [User management](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/users/page.tsx): `src/app/(dashboard)/users/page.tsx`
- [User queries and mutations](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-users.ts): `src/hooks/use-users.ts`
- [User API service](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/users.ts): `src/services/users.ts`
- [Invitations](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/invitations.ts): `src/services/invitations.ts`

### Access Administration

- [Roles and permissions](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/roles/page.tsx): `src/app/(dashboard)/roles/page.tsx`
- [RBAC queries](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-rbac.ts): `src/hooks/use-rbac.ts`
- [RBAC API service](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/rbac.ts): `src/services/rbac.ts`
- [Session management](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/sessions/page.tsx): `src/app/(dashboard)/sessions/page.tsx`
- [Session queries and actions](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/hooks/use-sessions.ts): `src/hooks/use-sessions.ts`
- [Session API service](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/services/sessions.ts): `src/services/sessions.ts`
- [Profile](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/app/(dashboard)/profile/page.tsx): `src/app/(dashboard)/profile/page.tsx`

### Client Data Runtime

- [Query hooks runtime](https://github.com/khant-min-htut/team-accesss-control-app/tree/main/src/hooks): `src/hooks`
- [HTTP API client](https://github.com/khant-min-htut/team-accesss-control-app/blob/main/src/lib/api.ts): `src/lib/api.ts`

### Other components

- **Dashboard user**
- **Management API**

## Connections

- Dashboard user → Login and signup: submits credentials
- Login and signup → Authentication actions: starts auth
- Authentication actions → Authentication API: requests tokens
- Authentication actions → Auth state: stores tokens
- Authentication actions → User API service: resolves user
- Authentication API → HTTP API client: sends auth requests
- Route guard → Auth state: checks access
- Dashboard shell → Route guard: guards pages
- Dashboard user → Overview: opens dashboard
- Overview → Organization queries: loads organizations
- Overview → Audit queries: loads activity
- Overview → Session queries and actions: loads sessions
- Audit log viewer → Audit queries: queries and filters
- Audit queries → Audit API service: requests logs
- Organizations → Organization queries: loads organizations
- Organization detail → Organization queries: loads organization
- User management → User queries and mutations: manages users
- User queries and mutations → User API service: requests user data
- Roles and permissions → RBAC queries: manages roles
- Session management → Session queries and actions: manages sessions
- Session queries and actions → Session API service: requests sessions
- Audit API service → HTTP API client: calls API
- Organization API service → HTTP API client: calls API
- User API service → HTTP API client: calls API
- RBAC API service → HTTP API client: calls API
- Session API service → HTTP API client: calls API
- HTTP API client → Management API: sends requests
