# community-vercel/ustaadpro-app architecture

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

- Interactive diagram: https://gitdiagram.com/community-vercel/ustaadpro-app
- Repository: https://github.com/community-vercel/ustaadpro-app

## Overview

Ustaad Pro is a React Native on-demand home-services marketplace. Users can onboard or authenticate, discover services, book and track service orders, and shop for products; account, location, complaints, and notifications support that journey. The sampled store code demonstrates mocked auth/cart/order state alongside API-backed operations and local persistence. The README documents the app stack, while several screen and store internals were not sampled, so uncertain screen-to-operation links are omitted.

Main entry points: [`src/store/useAppStore.ts`](https://github.com/community-vercel/ustaadpro-app/blob/main/src/store/useAppStore.ts) (App state), [`src/navigation/MainNavigator.tsx`](https://github.com/community-vercel/ustaadpro-app/blob/main/src/navigation/MainNavigator.tsx) (Main navigation), [`src/App.tsx`](https://github.com/community-vercel/ustaadpro-app/blob/main/src/App.tsx) (Application root), [`src/services/PushNotificationService.ts`](https://github.com/community-vercel/ustaadpro-app/blob/main/src/services/PushNotificationService.ts) (Push notifications)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["App and navigation"]
  node_application["Application root<br/>[App.tsx]"]
  node_authnav["Auth navigation<br/>[AuthNavigator.tsx]"]
  node_mainnav["Main navigation<br/>[MainNavigator.tsx]"]
  node_notificationui["Notification center"]
end

subgraph group_marketplace["Marketplace journeys"]
  node_home["Home and categories<br/>[HomeTab.tsx]"]
  node_servicebrowse["Service discovery<br/>[CategoryScreen.tsx]"]
  node_booking["Service booking<br/>[BookingScreen.tsx]"]
  node_bookings["Bookings<br/>[BookingsTab.tsx]"]
  node_storefront["Product storefront<br/>[StoreTab.tsx]"]
  node_shopping["Shopping orders"]
  node_complaints["Complaints"]
end

subgraph group_account["Account and state"]
  node_authscreens["Auth screens"]
  node_profile["Profile and settings<br/>[ProfileTab.tsx]"]
  node_appstate[("App state<br/>[useAppStore.ts]")]
end

subgraph group_integrations["External integrations"]
  node_apiclient["API client<br/>[client.ts]"]
  node_backend["Ustaad Pro API"]
  node_location["Location service<br/>[locationService.ts]"]
  node_nativegeo["Native location"]
  node_geocoders["Geocoding services"]
  node_push["Push notifications"]
  node_messaging["Firebase messaging"]
end

node_customer(("Customer"))

node_customer -->|"opens app"| node_application
node_application -->|"routes auth"| node_authnav
node_application -->|"routes main"| node_mainnav
node_authnav -->|"presents"| node_authscreens
node_authscreens -->|"authenticates"| node_appstate
node_mainnav -->|"presents"| node_home
node_mainnav -->|"presents"| node_servicebrowse
node_mainnav -->|"presents"| node_booking
node_mainnav -->|"presents"| node_bookings
node_mainnav -->|"presents"| node_storefront
node_mainnav -->|"presents"| node_shopping
node_mainnav -->|"presents"| node_complaints
node_mainnav -->|"presents"| node_profile
node_home -->|"reads catalog"| node_appstate
node_servicebrowse -->|"reads catalog"| node_appstate
node_booking -->|"submits booking"| node_appstate
node_bookings -->|"reads orders"| node_appstate
node_storefront -->|"manages cart"| node_appstate
node_shopping -->|"reads orders"| node_appstate
node_complaints -->|"submits complaints"| node_appstate
node_profile -->|"manages account"| node_appstate
node_application -->|"locates address"| node_location
node_location -->|"gets coordinates"| node_nativegeo
node_location -->|"reverse geocodes"| node_geocoders
node_appstate -->|"requests data"| node_apiclient
node_application -->|"checks order status"| node_apiclient
node_apiclient -->|"sends requests"| node_backend
node_push -->|"receives messages"| node_messaging
node_push -->|"registers token"| node_apiclient
node_push -->|"updates notifications"| node_appstate
node_application -->|"sets up listeners"| node_push
node_application -->|"displays notifications"| node_notificationui
node_notificationui -->|"reads and marks"| node_appstate

click node_application "https://github.com/community-vercel/ustaadpro-app/blob/main/src/App.tsx"
click node_authnav "https://github.com/community-vercel/ustaadpro-app/blob/main/src/navigation/AuthNavigator.tsx"
click node_mainnav "https://github.com/community-vercel/ustaadpro-app/blob/main/src/navigation/MainNavigator.tsx"
click node_authscreens "https://github.com/community-vercel/ustaadpro-app/tree/main/src/screens/auth"
click node_home "https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/HomeTab.tsx"
click node_servicebrowse "https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/CategoryScreen.tsx"
click node_booking "https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/BookingScreen.tsx"
click node_bookings "https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/BookingsTab.tsx"
click node_storefront "https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/StoreTab.tsx"
click node_shopping "https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/ShoppingOrdersScreen.tsx"
click node_complaints "https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/ComplaintsScreen.tsx"
click node_profile "https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/ProfileTab.tsx"
click node_appstate "https://github.com/community-vercel/ustaadpro-app/blob/main/src/store/useAppStore.ts"
click node_apiclient "https://github.com/community-vercel/ustaadpro-app/blob/main/src/api/client.ts"
click node_location "https://github.com/community-vercel/ustaadpro-app/blob/main/src/services/locationService.ts"
click node_nativegeo "https://github.com/community-vercel/ustaadpro-app/blob/main/android/app/src/main/java/app/sharplogicians/ustaadpro/CurrentLocationModule.kt"
click node_push "https://github.com/community-vercel/ustaadpro-app/blob/main/src/services/PushNotificationService.ts"
click node_notificationui "https://github.com/community-vercel/ustaadpro-app/blob/main/src/components/NotificationCenter.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_application,node_authnav,node_mainnav,node_notificationui toneBlue
class node_home,node_servicebrowse,node_booking,node_bookings,node_storefront,node_shopping,node_complaints toneAmber
class node_authscreens,node_profile,node_appstate toneMint
class node_apiclient,node_backend,node_location,node_nativegeo,node_geocoders,node_push,node_messaging toneRose
class node_customer toneIndigo
```

## Components

### App and navigation

- [Application root](https://github.com/community-vercel/ustaadpro-app/blob/main/src/App.tsx): `src/App.tsx`
- [Auth navigation](https://github.com/community-vercel/ustaadpro-app/blob/main/src/navigation/AuthNavigator.tsx): `src/navigation/AuthNavigator.tsx`
- [Main navigation](https://github.com/community-vercel/ustaadpro-app/blob/main/src/navigation/MainNavigator.tsx): `src/navigation/MainNavigator.tsx`
- [Notification center](https://github.com/community-vercel/ustaadpro-app/blob/main/src/components/NotificationCenter.tsx): `src/components/NotificationCenter.tsx`

### Marketplace journeys

- [Home and categories](https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/HomeTab.tsx): `src/screens/main/HomeTab.tsx`
- [Service discovery](https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/CategoryScreen.tsx): `src/screens/main/CategoryScreen.tsx`
- [Service booking](https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/BookingScreen.tsx): `src/screens/main/BookingScreen.tsx`
- [Bookings](https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/BookingsTab.tsx): `src/screens/main/BookingsTab.tsx`
- [Product storefront](https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/StoreTab.tsx): `src/screens/main/StoreTab.tsx`
- [Shopping orders](https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/ShoppingOrdersScreen.tsx): `src/screens/main/ShoppingOrdersScreen.tsx`
- [Complaints](https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/ComplaintsScreen.tsx): `src/screens/main/ComplaintsScreen.tsx`

### Account and state

- [Auth screens](https://github.com/community-vercel/ustaadpro-app/tree/main/src/screens/auth): `src/screens/auth`
- [Profile and settings](https://github.com/community-vercel/ustaadpro-app/blob/main/src/screens/main/ProfileTab.tsx): `src/screens/main/ProfileTab.tsx`
- [App state](https://github.com/community-vercel/ustaadpro-app/blob/main/src/store/useAppStore.ts): `src/store/useAppStore.ts`

### External integrations

- [API client](https://github.com/community-vercel/ustaadpro-app/blob/main/src/api/client.ts): `src/api/client.ts`
- **Ustaad Pro API**
- [Location service](https://github.com/community-vercel/ustaadpro-app/blob/main/src/services/locationService.ts): `src/services/locationService.ts`
- [Native location](https://github.com/community-vercel/ustaadpro-app/blob/main/android/app/src/main/java/app/sharplogicians/ustaadpro/CurrentLocationModule.kt): `android/app/src/main/java/app/sharplogicians/ustaadpro/CurrentLocationModule.kt`
- **Geocoding services**
- [Push notifications](https://github.com/community-vercel/ustaadpro-app/blob/main/src/services/PushNotificationService.ts): `src/services/PushNotificationService.ts`
- **Firebase messaging**

### Other components

- **Customer**

## Connections

- Customer → Application root: opens app
- Application root → Auth navigation: routes auth
- Application root → Main navigation: routes main
- Auth navigation → Auth screens: presents
- Auth screens → App state: authenticates
- Main navigation → Home and categories: presents
- Main navigation → Service discovery: presents
- Main navigation → Service booking: presents
- Main navigation → Bookings: presents
- Main navigation → Product storefront: presents
- Main navigation → Shopping orders: presents
- Main navigation → Complaints: presents
- Main navigation → Profile and settings: presents
- Home and categories → App state: reads catalog
- Service discovery → App state: reads catalog
- Service booking → App state: submits booking
- Bookings → App state: reads orders
- Product storefront → App state: manages cart
- Shopping orders → App state: reads orders
- Complaints → App state: submits complaints
- Profile and settings → App state: manages account
- Application root → Location service: locates address
- Location service → Native location: gets coordinates
- Location service → Geocoding services: reverse geocodes
- App state → API client: requests data
- Application root → API client: checks order status
- API client → Ustaad Pro API: sends requests
- Push notifications → Firebase messaging: receives messages
- Push notifications → API client: registers token
- Push notifications → App state: updates notifications
- Application root → Push notifications: sets up listeners
- Application root → Notification center: displays notifications
- Notification center → App state: reads and marks