# prajaakeeya/prajaakeeya-frontend architecture

> Architecture diagram of the GitHub repository prajaakeeya/prajaakeeya-frontend, 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/prajaakeeya/prajaakeeya-frontend
- Repository: https://github.com/prajaakeeya/prajaakeeya-frontend

## Overview

Prajaakeeya is a React web frontend for voters, aspirants, guests, and election administrators. Users enter through the routed application, then browse election and constituency information, complete voter or aspirant workflows, participate in civic and communication features, or administer users and election structures; domain services connect these experiences to the backend. The README also documents multilingual and installable/offline capabilities. Some page-to-service wiring is inferred from module names and README features because those implementations were not sampled.

Main entry points: [`src/App.tsx`](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/App.tsx) (Routes and access), [`src/services/apiClient.ts`](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/apiClient.ts) (HTTP client), [`src/store/useAuthStore.ts`](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/store/useAuthStore.ts) (Session state), [`src/pages/AdminDashboardPage.tsx`](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/AdminDashboardPage.tsx) (Admin operations)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_shell["Application shell"]
  node_app["Routes and access<br/>[App.tsx]"]
  node_authlayout["Authentication layout<br/>[AuthLayout.tsx]"]
  node_userlayout["Voter layout<br/>[UserLayout.tsx]"]
  node_guestlayout["Guest layout<br/>[GuestLayout.tsx]"]
  node_adminlayout["Admin layout<br/>[AdminLayout.tsx]"]
  node_authstate["Session state<br/>[useAuthStore.ts]"]
  node_i18n["Language resources<br/>[index.ts]"]
  node_offline["Offline experience<br/>[OfflineBanner.tsx]"]
  node_worker["Push service worker"]
end

subgraph group_voter["Voter and public"]
  node_home["Landing and login<br/>[HomePage.tsx]"]
  node_voterflow["Registration and profile"]
  node_voterdashboard["Voter dashboard"]
  node_elections["Candidates and results"]
  node_civic["Civic issues"]
  node_voterchat["Voter chat<br/>[UserChatPage.tsx]"]
end

subgraph group_aspirant["Aspirant experience"]
  node_aspirantflow["Aspirant registration"]
  node_documents["Documents and SOP"]
  node_aspirantprofile["Aspirant profile"]
  node_aspirantposts["Posts and meetings"]
  node_aspirantrequests["Requests and chat"]
end

subgraph group_admin["Election administration"]
  node_adminpages["Admin operations"]
  node_adminusers["User management"]
  node_admingeo["Election geography"]
end

subgraph group_services["Domain services"]
  node_voterservice["Voting and voter data<br/>[voteService.ts]"]
  node_civicservice["Civic issue service"]
  node_aspirantservice["Aspirant service<br/>[aspirantService.ts]"]
  node_chatservice["Aspirant chat service"]
  node_adminservice["Administration services<br/>[adminService.ts]"]
  node_authservice["Authentication service<br/>[authService.ts]"]
  node_apiclient["HTTP client<br/>[apiClient.ts]"]
end

node_people(("Platform participants"))
node_backend["Prajaakeeya backend"]
node_firebase["Firebase messaging"]

node_people -->|"navigate"| node_app
node_app -->|"routes auth"| node_authlayout
node_app -->|"routes users"| node_userlayout
node_app -->|"routes guests"| node_guestlayout
node_app -->|"routes admins"| node_adminlayout
node_app -->|"routes landing"| node_home
node_app -->|"restores session"| node_authstate
node_authstate -->|"loads profile"| node_authservice
node_authstate -->|"loads ward"| node_backend
node_people -->|"register"| node_voterflow
node_voterflow -->|"register profile"| node_authservice
node_authservice -->|"sends requests"| node_apiclient
node_apiclient -->|"calls API"| node_backend
node_people -->|"browse"| node_voterdashboard
node_voterdashboard -->|"browse candidates"| node_elections
node_people -->|"raise issues"| node_civic
node_people -->|"chat"| node_voterchat
node_voterchat -->|"loads conversations"| node_chatservice
node_people -->|"apply"| node_aspirantflow
node_aspirantflow -->|"continue application"| node_documents
node_documents -->|"submits materials"| node_aspirantservice
node_people -->|"manage profile"| node_aspirantprofile
node_people -->|"manage posts"| node_aspirantposts
node_people -->|"handle requests"| node_aspirantrequests
node_aspirantrequests -->|"uses chat"| node_chatservice
node_aspirantservice -->|"sends requests"| node_apiclient
node_chatservice -->|"sends requests"| node_apiclient
node_people -->|"administer"| node_adminpages
node_adminpages -->|"manage users"| node_adminusers
node_adminpages -->|"manage elections"| node_admingeo
node_adminusers -->|"manages accounts"| node_adminservice
node_admingeo -->|"manages structures"| node_adminservice
node_adminservice -->|"sends requests"| node_apiclient
node_voterservice -->|"sends requests"| node_apiclient
node_civic -->|"loads and submits"| node_civicservice
node_civicservice -->|"sends requests"| node_apiclient
node_app -->|"renders translations"| node_i18n
node_app -.->|"shows network status"| node_offline
node_worker -.->|"handles messaging"| node_firebase

click node_app "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/App.tsx"
click node_authlayout "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/layouts/AuthLayout.tsx"
click node_userlayout "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/layouts/UserLayout.tsx"
click node_guestlayout "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/layouts/GuestLayout.tsx"
click node_adminlayout "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/layouts/AdminLayout.tsx"
click node_authstate "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/store/useAuthStore.ts"
click node_home "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/HomePage.tsx"
click node_voterflow "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/UserRegisterPage.tsx"
click node_voterdashboard "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/UserDashboardPage.tsx"
click node_elections "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/VotingResultPage.tsx"
click node_civic "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/CivicIssuesPage.tsx"
click node_voterchat "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/UserChatPage.tsx"
click node_voterservice "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/voteService.ts"
click node_civicservice "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/civicIssuesService.ts"
click node_aspirantflow "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/AspirantRegistrationPage.tsx"
click node_documents "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/DocumentsUploadPage.tsx"
click node_aspirantprofile "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/aspirant/AspirantProfilePage.tsx"
click node_aspirantposts "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/aspirant/AspirantPostsPage.tsx"
click node_aspirantrequests "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/aspirant/AspirantRequestsPage.tsx"
click node_aspirantservice "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/aspirantService.ts"
click node_chatservice "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/aspirantChatService.ts"
click node_adminpages "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/AdminDashboardPage.tsx"
click node_adminusers "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/admin/AdminUsersListPage.tsx"
click node_admingeo "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/admin/AdminAssemblyPage.tsx"
click node_adminservice "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/adminService.ts"
click node_authservice "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/authService.ts"
click node_apiclient "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/apiClient.ts"
click node_i18n "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/i18n/index.ts"
click node_offline "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/components/OfflineBanner.tsx"
click node_worker "https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/public/firebase-messaging-sw.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_authlayout,node_userlayout,node_guestlayout,node_adminlayout,node_authstate,node_i18n,node_offline,node_worker toneBlue
class node_home,node_voterflow,node_voterdashboard,node_elections,node_civic,node_voterchat toneAmber
class node_aspirantflow,node_documents,node_aspirantprofile,node_aspirantposts,node_aspirantrequests toneMint
class node_adminpages,node_adminusers,node_admingeo toneRose
class node_voterservice,node_civicservice,node_aspirantservice,node_chatservice,node_adminservice,node_authservice,node_apiclient,node_people,node_backend,node_firebase toneIndigo
```

## Components

### Application shell

- [Routes and access](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/App.tsx): `src/App.tsx`
- [Authentication layout](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/layouts/AuthLayout.tsx): `src/layouts/AuthLayout.tsx`
- [Voter layout](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/layouts/UserLayout.tsx): `src/layouts/UserLayout.tsx`
- [Guest layout](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/layouts/GuestLayout.tsx): `src/layouts/GuestLayout.tsx`
- [Admin layout](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/layouts/AdminLayout.tsx): `src/layouts/AdminLayout.tsx`
- [Session state](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/store/useAuthStore.ts): `src/store/useAuthStore.ts`
- [Language resources](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/i18n/index.ts): `src/i18n/index.ts`
- [Offline experience](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/components/OfflineBanner.tsx): `src/components/OfflineBanner.tsx`
- [Push service worker](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/public/firebase-messaging-sw.js): `public/firebase-messaging-sw.js`

### Voter and public

- [Landing and login](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/HomePage.tsx): `src/pages/HomePage.tsx`
- [Registration and profile](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/UserRegisterPage.tsx): `src/pages/UserRegisterPage.tsx`
- [Voter dashboard](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/UserDashboardPage.tsx): `src/pages/UserDashboardPage.tsx`
- [Candidates and results](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/VotingResultPage.tsx): `src/pages/VotingResultPage.tsx`
- [Civic issues](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/CivicIssuesPage.tsx): `src/pages/CivicIssuesPage.tsx`
- [Voter chat](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/UserChatPage.tsx): `src/pages/UserChatPage.tsx`

### Aspirant experience

- [Aspirant registration](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/AspirantRegistrationPage.tsx): `src/pages/AspirantRegistrationPage.tsx`
- [Documents and SOP](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/DocumentsUploadPage.tsx): `src/pages/DocumentsUploadPage.tsx`
- [Aspirant profile](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/aspirant/AspirantProfilePage.tsx): `src/pages/aspirant/AspirantProfilePage.tsx`
- [Posts and meetings](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/aspirant/AspirantPostsPage.tsx): `src/pages/aspirant/AspirantPostsPage.tsx`
- [Requests and chat](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/aspirant/AspirantRequestsPage.tsx): `src/pages/aspirant/AspirantRequestsPage.tsx`

### Election administration

- [Admin operations](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/AdminDashboardPage.tsx): `src/pages/AdminDashboardPage.tsx`
- [User management](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/admin/AdminUsersListPage.tsx): `src/pages/admin/AdminUsersListPage.tsx`
- [Election geography](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/pages/admin/AdminAssemblyPage.tsx): `src/pages/admin/AdminAssemblyPage.tsx`

### Domain services

- [Voting and voter data](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/voteService.ts): `src/services/voteService.ts`
- [Civic issue service](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/civicIssuesService.ts): `src/services/civicIssuesService.ts`
- [Aspirant service](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/aspirantService.ts): `src/services/aspirantService.ts`
- [Aspirant chat service](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/aspirantChatService.ts): `src/services/aspirantChatService.ts`
- [Administration services](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/adminService.ts): `src/services/adminService.ts`
- [Authentication service](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/authService.ts): `src/services/authService.ts`
- [HTTP client](https://github.com/prajaakeeya/prajaakeeya-frontend/blob/main/src/services/apiClient.ts): `src/services/apiClient.ts`

### Other components

- **Platform participants**
- **Prajaakeeya backend**
- **Firebase messaging**

## Connections

- Platform participants → Routes and access: navigate
- Routes and access → Authentication layout: routes auth
- Routes and access → Voter layout: routes users
- Routes and access → Guest layout: routes guests
- Routes and access → Admin layout: routes admins
- Routes and access → Landing and login: routes landing
- Routes and access → Session state: restores session
- Session state → Authentication service: loads profile
- Session state → Prajaakeeya backend: loads ward
- Platform participants → Registration and profile: register
- Registration and profile → Authentication service: register profile
- Authentication service → HTTP client: sends requests
- HTTP client → Prajaakeeya backend: calls API
- Platform participants → Voter dashboard: browse
- Voter dashboard → Candidates and results: browse candidates
- Platform participants → Civic issues: raise issues
- Platform participants → Voter chat: chat
- Voter chat → Aspirant chat service: loads conversations
- Platform participants → Aspirant registration: apply
- Aspirant registration → Documents and SOP: continue application
- Documents and SOP → Aspirant service: submits materials
- Platform participants → Aspirant profile: manage profile
- Platform participants → Posts and meetings: manage posts
- Platform participants → Requests and chat: handle requests
- Requests and chat → Aspirant chat service: uses chat
- Aspirant service → HTTP client: sends requests
- Aspirant chat service → HTTP client: sends requests
- Platform participants → Admin operations: administer
- Admin operations → User management: manage users
- Admin operations → Election geography: manage elections
- User management → Administration services: manages accounts
- Election geography → Administration services: manages structures
- Administration services → HTTP client: sends requests
- Voting and voter data → HTTP client: sends requests
- Civic issues → Civic issue service: loads and submits
- Civic issue service → HTTP client: sends requests
- Routes and access → Language resources: renders translations
- Routes and access → Offline experience: shows network status
- Push service worker → Firebase messaging: handles messaging