# maorlv52/client-app architecture

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

- Interactive diagram: https://gitdiagram.com/maorlv52/client-app
- Repository: https://github.com/maorlv52/client-app

## Overview

This is a React Native client for account access, service-request creation and tracking, profile management, and supporting health/user screens. The main user workflow is to choose a request type, review a commitment, complete a dynamic form, submit documents, and later view request status and details. App.tsx establishes providers and navigation; feature modules follow the documented API-and-hook pattern. Several feature and navigator implementations were not sampled, so uncertain screen-to-hook wiring is not shown.

Main entry points: [`src/api/client.ts`](https://github.com/maorlv52/client-app/blob/main/src/api/client.ts) (HTTP client), [`App.tsx`](https://github.com/maorlv52/client-app/blob/main/App.tsx) (App entry), [`src/features/requests/hooks/useSubmitRequest.ts`](https://github.com/maorlv52/client-app/blob/main/src/features/requests/hooks/useSubmitRequest.ts) (Request operations), [`src/features/requests/api.ts`](https://github.com/maorlv52/client-app/blob/main/src/features/requests/api.ts) (Request API)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["App runtime"]
  node_app["App entry<br/>[App.tsx]"]
  node_providers["App providers<br/>[index.tsx]"]
  node_navigation["Root navigation<br/>[RootNavigator.tsx]"]
end

subgraph group_identity["Identity"]
  node_authscreens["Login and register<br/>[LoginScreen.tsx]"]
  node_authhooks["Auth mutations<br/>[useLogin.ts]"]
  node_authapi["Auth API<br/>[api.ts]"]
  node_authstate[("Persisted auth state<br/>[useAuthStore.ts]")]
end

subgraph group_requests["Service requests"]
  node_requesttypes["Choose request type"]
  node_commitment["Review commitment"]
  node_requestform["Complete request form"]
  node_requesthooks["Request operations"]
  node_requestapi["Request API<br/>[api.ts]"]
  node_documents["Request documents"]
  node_tracking["Request list and details"]
end

subgraph group_account["Account and operations"]
  node_home["Home dashboard<br/>[HomeScreen.tsx]"]
  node_profile["Profile management"]
  node_users["User administration"]
  node_health["Backend health check<br/>[HealthScreen.tsx]"]
  node_notifications["Notifications screen"]
end

subgraph group_shared["Shared infrastructure"]
  node_api["HTTP client<br/>[client.ts]"]
  node_query["Server-state provider<br/>[QueryProvider.tsx]"]
  node_config["API configuration<br/>[index.ts]"]
end

node_user(("Mobile user"))
node_backend["Backend API"]

node_user -->|"opens app"| node_app
node_app -->|"wraps app"| node_providers
node_app -->|"renders"| node_navigation
node_providers -->|"provides queries"| node_query
node_authscreens -->|"uses mutations"| node_authhooks
node_authhooks -->|"requests auth"| node_authapi
node_authapi -->|"uses client"| node_api
node_api -->|"reads settings"| node_config
node_api -->|"reads token"| node_authstate
node_api -->|"clears on 401"| node_authstate
node_requestform -->|"submits request"| node_requesthooks
node_requesthooks -->|"calls endpoints"| node_requestapi
node_requestapi -->|"uses client"| node_api
node_documents -->|"manages documents"| node_requestapi
node_tracking -->|"loads requests"| node_requesthooks
node_requesttypes -->|"continues flow"| node_commitment
node_commitment -->|"continues flow"| node_requestform
node_api -->|"sends HTTP"| node_backend
node_health -->|"checks health"| node_backend
node_users -->|"manages users"| node_backend
node_profile -->|"updates profile"| node_users
node_home -.->|"offers request access"| node_tracking

click node_app "https://github.com/maorlv52/client-app/blob/main/App.tsx"
click node_providers "https://github.com/maorlv52/client-app/blob/main/src/providers/index.tsx"
click node_navigation "https://github.com/maorlv52/client-app/blob/main/src/navigation/RootNavigator.tsx"
click node_authscreens "https://github.com/maorlv52/client-app/blob/main/src/features/auth/screens/LoginScreen.tsx"
click node_authhooks "https://github.com/maorlv52/client-app/blob/main/src/features/auth/hooks/useLogin.ts"
click node_authapi "https://github.com/maorlv52/client-app/blob/main/src/features/auth/api.ts"
click node_authstate "https://github.com/maorlv52/client-app/blob/main/src/store/useAuthStore.ts"
click node_requesttypes "https://github.com/maorlv52/client-app/blob/main/src/features/requests/screens/RequestTypeSelectionScreen.tsx"
click node_commitment "https://github.com/maorlv52/client-app/blob/main/src/features/requests/screens/CommitmentScreen.tsx"
click node_requestform "https://github.com/maorlv52/client-app/blob/main/src/features/requests/screens/CreateRequestFormScreen.tsx"
click node_requesthooks "https://github.com/maorlv52/client-app/blob/main/src/features/requests/hooks/useSubmitRequest.ts"
click node_requestapi "https://github.com/maorlv52/client-app/blob/main/src/features/requests/api.ts"
click node_documents "https://github.com/maorlv52/client-app/blob/main/src/features/requests/components/RequestDocumentsSection.tsx"
click node_tracking "https://github.com/maorlv52/client-app/blob/main/src/features/requests/screens/RequestsListScreen.tsx"
click node_home "https://github.com/maorlv52/client-app/blob/main/src/features/home/screens/HomeScreen.tsx"
click node_profile "https://github.com/maorlv52/client-app/blob/main/src/features/profile/screens/ProfileViewScreen.tsx"
click node_users "https://github.com/maorlv52/client-app/blob/main/src/features/users/screens/UsersListScreen.tsx"
click node_health "https://github.com/maorlv52/client-app/blob/main/src/features/health/screens/HealthScreen.tsx"
click node_notifications "https://github.com/maorlv52/client-app/blob/main/src/screens/NotificationsScreen.tsx"
click node_api "https://github.com/maorlv52/client-app/blob/main/src/api/client.ts"
click node_query "https://github.com/maorlv52/client-app/blob/main/src/providers/QueryProvider.tsx"
click node_config "https://github.com/maorlv52/client-app/blob/main/src/config/index.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_app,node_providers,node_navigation,node_user toneBlue
class node_authscreens,node_authhooks,node_authapi,node_authstate toneAmber
class node_requesttypes,node_commitment,node_requestform,node_requesthooks,node_requestapi,node_documents,node_tracking,node_backend toneMint
class node_home,node_profile,node_users,node_health,node_notifications toneRose
class node_api,node_query,node_config toneIndigo
```

## Components

### App runtime

- [App entry](https://github.com/maorlv52/client-app/blob/main/App.tsx): `App.tsx`
- [App providers](https://github.com/maorlv52/client-app/blob/main/src/providers/index.tsx): `src/providers/index.tsx`
- [Root navigation](https://github.com/maorlv52/client-app/blob/main/src/navigation/RootNavigator.tsx): `src/navigation/RootNavigator.tsx`

### Identity

- [Login and register](https://github.com/maorlv52/client-app/blob/main/src/features/auth/screens/LoginScreen.tsx): `src/features/auth/screens/LoginScreen.tsx`
- [Auth mutations](https://github.com/maorlv52/client-app/blob/main/src/features/auth/hooks/useLogin.ts): `src/features/auth/hooks/useLogin.ts`
- [Auth API](https://github.com/maorlv52/client-app/blob/main/src/features/auth/api.ts): `src/features/auth/api.ts`
- [Persisted auth state](https://github.com/maorlv52/client-app/blob/main/src/store/useAuthStore.ts): `src/store/useAuthStore.ts`

### Service requests

- [Choose request type](https://github.com/maorlv52/client-app/blob/main/src/features/requests/screens/RequestTypeSelectionScreen.tsx): `src/features/requests/screens/RequestTypeSelectionScreen.tsx`
- [Review commitment](https://github.com/maorlv52/client-app/blob/main/src/features/requests/screens/CommitmentScreen.tsx): `src/features/requests/screens/CommitmentScreen.tsx`
- [Complete request form](https://github.com/maorlv52/client-app/blob/main/src/features/requests/screens/CreateRequestFormScreen.tsx): `src/features/requests/screens/CreateRequestFormScreen.tsx`
- [Request operations](https://github.com/maorlv52/client-app/blob/main/src/features/requests/hooks/useSubmitRequest.ts): `src/features/requests/hooks/useSubmitRequest.ts`
- [Request API](https://github.com/maorlv52/client-app/blob/main/src/features/requests/api.ts): `src/features/requests/api.ts`
- [Request documents](https://github.com/maorlv52/client-app/blob/main/src/features/requests/components/RequestDocumentsSection.tsx): `src/features/requests/components/RequestDocumentsSection.tsx`
- [Request list and details](https://github.com/maorlv52/client-app/blob/main/src/features/requests/screens/RequestsListScreen.tsx): `src/features/requests/screens/RequestsListScreen.tsx`

### Account and operations

- [Home dashboard](https://github.com/maorlv52/client-app/blob/main/src/features/home/screens/HomeScreen.tsx): `src/features/home/screens/HomeScreen.tsx`
- [Profile management](https://github.com/maorlv52/client-app/blob/main/src/features/profile/screens/ProfileViewScreen.tsx): `src/features/profile/screens/ProfileViewScreen.tsx`
- [User administration](https://github.com/maorlv52/client-app/blob/main/src/features/users/screens/UsersListScreen.tsx): `src/features/users/screens/UsersListScreen.tsx`
- [Backend health check](https://github.com/maorlv52/client-app/blob/main/src/features/health/screens/HealthScreen.tsx): `src/features/health/screens/HealthScreen.tsx`
- [Notifications screen](https://github.com/maorlv52/client-app/blob/main/src/screens/NotificationsScreen.tsx): `src/screens/NotificationsScreen.tsx`

### Shared infrastructure

- [HTTP client](https://github.com/maorlv52/client-app/blob/main/src/api/client.ts): `src/api/client.ts`
- [Server-state provider](https://github.com/maorlv52/client-app/blob/main/src/providers/QueryProvider.tsx): `src/providers/QueryProvider.tsx`
- [API configuration](https://github.com/maorlv52/client-app/blob/main/src/config/index.ts): `src/config/index.ts`

### Other components

- **Mobile user**
- **Backend API**

## Connections

- Mobile user → App entry: opens app
- App entry → App providers: wraps app
- App entry → Root navigation: renders
- App providers → Server-state provider: provides queries
- Login and register → Auth mutations: uses mutations
- Auth mutations → Auth API: requests auth
- Auth API → HTTP client: uses client
- HTTP client → API configuration: reads settings
- HTTP client → Persisted auth state: reads token
- HTTP client → Persisted auth state: clears on 401
- Complete request form → Request operations: submits request
- Request operations → Request API: calls endpoints
- Request API → HTTP client: uses client
- Request documents → Request API: manages documents
- Request list and details → Request operations: loads requests
- Choose request type → Review commitment: continues flow
- Review commitment → Complete request form: continues flow
- HTTP client → Backend API: sends HTTP
- Backend health check → Backend API: checks health
- User administration → Backend API: manages users
- Profile management → User administration: updates profile
- Home dashboard → Request list and details: offers request access