# zisanurrahmanbd-netizen/solutionapp architecture

> Architecture diagram of the GitHub repository zisanurrahmanbd-netizen/solutionapp, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/zisanurrahmanbd-netizen/solutionapp
- Repository: https://github.com/zisanurrahmanbd-netizen/solutionapp

## Overview

This is a browser-based bank-file tracking and debt-recovery operations app, implemented here as a React frontend backed by Supabase. Users sign in, navigate role-scoped operational views, find a case, and inspect or update its recovery activity; administrators also upload files and manage users. The graph includes the documented reporting, mapping, messaging, and import areas. Source excerpts are partial, so links for unsampled screens and integrations are omitted rather than inferred.

Main entry points: [`src/App.tsx`](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/App.tsx) (App router), [`src/services/dataService.ts`](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/dataService.ts) (Recovery data service), [`src/main.tsx`](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/main.tsx) (React bootstrap), [`src/context/AuthContext.tsx`](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/context/AuthContext.tsx) (Authentication)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["App entry and navigation"]
  node_entrypoint["React bootstrap<br/>[main.tsx]"]
  node_app["App router<br/>[App.tsx]"]
  node_layout["Application layout<br/>[Layout.tsx]"]
  node_localization["Language context"]
end

subgraph group_access["Identity and access"]
  node_login["Sign-in<br/>[Login.tsx]"]
  node_auth["Authentication<br/>[AuthContext.tsx]"]
  node_permissions["Role permissions"]
  node_sessions["Device sessions<br/>[sessionService.ts]"]
end

subgraph group_operations["Cases and field operations"]
  node_cases["Case list<br/>[CasesList.tsx]"]
  node_case_detail["Case detail<br/>[CaseDetail.tsx]"]
  node_tracking["Agent tracking map<br/>[TrackingMap.tsx]"]
  node_excel["Excel import<br/>[ExcelUpload.tsx]"]
  node_messaging["Bulk messaging"]
  node_badge["Case status badge<br/>[StatusBadge.tsx]"]
end

subgraph group_insights["Reports and administration"]
  node_dashboard["Operations dashboard<br/>[Dashboard.tsx]"]
  node_powerbi["Analytics dashboard"]
  node_performance["Agent performance"]
  node_expiry["Expiry tracker<br/>[ExpiryTracker.tsx]"]
  node_flagged["Flagged cases<br/>[FlaggedCases.tsx]"]
  node_contacts["Bank contacts<br/>[BankContacts.tsx]"]
  node_team["Team management<br/>[TeamManagement.tsx]"]
end

subgraph group_platform["Data and integrations"]
  node_message_service["Message dispatch<br/>[messaging.ts]"]
  node_attachments["Attachment builder"]
  node_data["Recovery data service<br/>[dataService.ts]"]
  node_supabase["Supabase client<br/>[supabase.ts]"]
  node_offline["Offline queue<br/>[offlineQueue.ts]"]
end

node_operator(("User"))

node_operator -->|"opens app"| node_entrypoint
node_entrypoint -->|"renders"| node_app
node_entrypoint -->|"provides context"| node_auth
node_entrypoint -->|"provides context"| node_permissions
node_entrypoint -->|"provides context"| node_localization
node_app -->|"checks identity"| node_auth
node_app -->|"shows signed-out view"| node_login
node_app -->|"wraps pages"| node_layout
node_app -->|"routes to"| node_dashboard
node_app -->|"routes to"| node_cases
node_app -->|"opens selected case"| node_case_detail
node_app -->|"routes to"| node_tracking
node_app -->|"routes to"| node_contacts
node_app -->|"routes to"| node_performance
node_app -->|"routes to"| node_team
node_app -->|"routes to"| node_excel
node_app -->|"routes to"| node_powerbi
node_app -->|"checks access"| node_permissions
node_auth -->|"authenticates with"| node_supabase
node_auth -->|"records sessions"| node_sessions
node_auth -->|"queues offline changes"| node_offline
node_cases -->|"reads and updates"| node_data
node_case_detail -->|"loads case activity"| node_data
node_cases -->|"renders status"| node_badge
node_case_detail -->|"renders status"| node_badge
node_contacts -->|"reads contacts"| node_data
node_contacts -->|"opens bulk message"| node_messaging
node_messaging -->|"dispatches messages"| node_message_service
node_messaging -->|"builds attachment"| node_attachments
node_performance -->|"loads report data"| node_data
node_expiry -->|"loads expiry data"| node_data
node_powerbi -->|"loads analytics data"| node_data
node_team -->|"manages team data"| node_data
node_data -->|"persists data"| node_supabase
node_data -->|"queues offline work"| node_offline
node_data -.->|"stores recovery records"| node_operator
node_dashboard -.->|"loads dashboard data"| node_data
node_tracking -.->|"loads agent locations"| node_data
node_excel -.->|"imports case records"| node_data
node_flagged -.->|"loads flagged records"| node_data

click node_entrypoint "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/main.tsx"
click node_app "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/App.tsx"
click node_layout "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/components/Layout.tsx"
click node_login "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/Login.tsx"
click node_auth "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/context/AuthContext.tsx"
click node_permissions "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/context/PermissionsContext.tsx"
click node_sessions "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/sessionService.ts"
click node_cases "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/CasesList.tsx"
click node_case_detail "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/CaseDetail.tsx"
click node_tracking "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/TrackingMap.tsx"
click node_dashboard "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/Dashboard.tsx"
click node_powerbi "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/PowerBIDashboard.tsx"
click node_performance "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/AgentPerformance.tsx"
click node_expiry "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/ExpiryTracker.tsx"
click node_flagged "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/FlaggedCases.tsx"
click node_contacts "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/BankContacts.tsx"
click node_team "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/TeamManagement.tsx"
click node_excel "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/ExcelUpload.tsx"
click node_messaging "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/components/BulkMessageModal.tsx"
click node_message_service "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/messaging.ts"
click node_attachments "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/attachmentService.ts"
click node_data "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/dataService.ts"
click node_supabase "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/lib/supabase.ts"
click node_offline "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/offlineQueue.ts"
click node_badge "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/components/StatusBadge.tsx"
click node_localization "https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/context/LanguageContext.tsx"

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_entrypoint,node_app,node_layout,node_localization,node_operator toneBlue
class node_login,node_auth,node_permissions,node_sessions toneAmber
class node_cases,node_case_detail,node_tracking,node_excel,node_messaging,node_badge toneMint
class node_dashboard,node_powerbi,node_performance,node_expiry,node_flagged,node_contacts,node_team toneRose
class node_message_service,node_attachments,node_data,node_supabase,node_offline toneIndigo
```

## Components

### App entry and navigation

- [React bootstrap](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/main.tsx): `src/main.tsx`
- [App router](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/App.tsx): `src/App.tsx`
- [Application layout](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/components/Layout.tsx): `src/components/Layout.tsx`
- [Language context](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/context/LanguageContext.tsx): `src/context/LanguageContext.tsx`

### Identity and access

- [Sign-in](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/Login.tsx): `src/pages/Login.tsx`
- [Authentication](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/context/AuthContext.tsx): `src/context/AuthContext.tsx`
- [Role permissions](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/context/PermissionsContext.tsx): `src/context/PermissionsContext.tsx`
- [Device sessions](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/sessionService.ts): `src/services/sessionService.ts`

### Cases and field operations

- [Case list](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/CasesList.tsx): `src/pages/CasesList.tsx`
- [Case detail](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/CaseDetail.tsx): `src/pages/CaseDetail.tsx`
- [Agent tracking map](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/TrackingMap.tsx): `src/pages/TrackingMap.tsx`
- [Excel import](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/ExcelUpload.tsx): `src/pages/ExcelUpload.tsx`
- [Bulk messaging](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/components/BulkMessageModal.tsx): `src/components/BulkMessageModal.tsx`
- [Case status badge](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/components/StatusBadge.tsx): `src/components/StatusBadge.tsx`

### Reports and administration

- [Operations dashboard](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/Dashboard.tsx): `src/pages/Dashboard.tsx`
- [Analytics dashboard](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/PowerBIDashboard.tsx): `src/pages/PowerBIDashboard.tsx`
- [Agent performance](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/AgentPerformance.tsx): `src/pages/AgentPerformance.tsx`
- [Expiry tracker](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/ExpiryTracker.tsx): `src/pages/ExpiryTracker.tsx`
- [Flagged cases](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/FlaggedCases.tsx): `src/pages/FlaggedCases.tsx`
- [Bank contacts](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/BankContacts.tsx): `src/pages/BankContacts.tsx`
- [Team management](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/pages/TeamManagement.tsx): `src/pages/TeamManagement.tsx`

### Data and integrations

- [Message dispatch](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/messaging.ts): `src/services/messaging.ts`
- [Attachment builder](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/attachmentService.ts): `src/services/attachmentService.ts`
- [Recovery data service](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/dataService.ts): `src/services/dataService.ts`
- [Supabase client](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/lib/supabase.ts): `src/lib/supabase.ts`
- [Offline queue](https://github.com/zisanurrahmanbd-netizen/solutionapp/blob/main/src/services/offlineQueue.ts): `src/services/offlineQueue.ts`

### Other components

- **User**

## Connections

- User → React bootstrap: opens app
- React bootstrap → App router: renders (evidence: `src/main.tsx`)
- React bootstrap → Authentication: provides context (evidence: `src/main.tsx`)
- React bootstrap → Role permissions: provides context (evidence: `src/main.tsx`)
- React bootstrap → Language context: provides context (evidence: `src/main.tsx`)
- App router → Authentication: checks identity (evidence: `src/App.tsx`)
- App router → Sign-in: shows signed-out view (evidence: `src/App.tsx`)
- App router → Application layout: wraps pages (evidence: `src/App.tsx`)
- App router → Operations dashboard: routes to (evidence: `src/App.tsx`)
- App router → Case list: routes to (evidence: `src/App.tsx`)
- App router → Case detail: opens selected case (evidence: `src/App.tsx`)
- App router → Agent tracking map: routes to (evidence: `src/App.tsx`)
- App router → Bank contacts: routes to (evidence: `src/App.tsx`)
- App router → Agent performance: routes to (evidence: `src/App.tsx`)
- App router → Team management: routes to (evidence: `src/App.tsx`)
- App router → Excel import: routes to (evidence: `src/App.tsx`)
- App router → Analytics dashboard: routes to (evidence: `src/App.tsx`)
- App router → Role permissions: checks access (evidence: `src/context/PermissionsContext.tsx`)
- Authentication → Supabase client: authenticates with (evidence: `src/context/AuthContext.tsx`)
- Authentication → Device sessions: records sessions (evidence: `src/context/AuthContext.tsx`)
- Authentication → Offline queue: queues offline changes (evidence: `src/context/AuthContext.tsx`)
- Case list → Recovery data service: reads and updates (evidence: `src/pages/CasesList.tsx`)
- Case detail → Recovery data service: loads case activity (evidence: `src/pages/CaseDetail.tsx`)
- Case list → Case status badge: renders status (evidence: `src/pages/CasesList.tsx`)
- Case detail → Case status badge: renders status (evidence: `src/pages/CaseDetail.tsx`)
- Bank contacts → Recovery data service: reads contacts (evidence: `src/pages/BankContacts.tsx`)
- Bank contacts → Bulk messaging: opens bulk message (evidence: `src/pages/BankContacts.tsx`)
- Bulk messaging → Message dispatch: dispatches messages (evidence: `src/components/BulkMessageModal.tsx`)
- Bulk messaging → Attachment builder: builds attachment (evidence: `src/components/BulkMessageModal.tsx`)
- Agent performance → Recovery data service: loads report data (evidence: `src/pages/AgentPerformance.tsx`)
- Expiry tracker → Recovery data service: loads expiry data (evidence: `src/pages/ExpiryTracker.tsx`)
- Analytics dashboard → Recovery data service: loads analytics data (evidence: `src/pages/PowerBIDashboard.tsx`)
- Team management → Recovery data service: manages team data (evidence: `src/pages/TeamManagement.tsx`)
- Recovery data service → Supabase client: persists data (evidence: `src/services/dataService.ts`)
- Recovery data service → Offline queue: queues offline work (evidence: `src/services/dataService.ts`)
- Recovery data service → User: stores recovery records
- Operations dashboard → Recovery data service: loads dashboard data
- Agent tracking map → Recovery data service: loads agent locations
- Excel import → Recovery data service: imports case records
- Flagged cases → Recovery data service: loads flagged records