# sabbir2268/zap-shift architecture

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

## Overview

ZapShift is a courier platform spanning a React client and an Express/MongoDB API. Customers authenticate, submit parcels, track and update them, then pay; riders apply to deliver, and admins review riders and manage platform records. Public pages provide service information and branch coverage. The client router guards customer and admin areas, while shared API access attaches Firebase tokens. The server verifies authentication and enforces roles before accessing MongoDB or payment and upload integrations. Server routing and persistence are in one file; unsampled details are represented only where documented.

Main entry points: [`client/src/routes/Router.jsx`](https://github.com/sabbir2268/zap-shift/blob/main/client/src/routes/Router.jsx) (Client router), [`client/src/context/AxiosContext/axiosClient.js`](https://github.com/sabbir2268/zap-shift/blob/main/client/src/context/AxiosContext/axiosClient.js) (Authenticated API client), [`server/index.js`](https://github.com/sabbir2268/zap-shift/blob/main/server/index.js) (API and access control), [`client/src/context/AuthContext/AuthProvider.jsx`](https://github.com/sabbir2268/zap-shift/blob/main/client/src/context/AuthContext/AuthProvider.jsx) (Session and role)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_public["Public experience"]
  node_public_pages["Public pages<br/>[Home.jsx]"]
  node_coverage["Branch coverage<br/>[Coverage.jsx]"]
end

subgraph group_customer["Customer workflow"]
  node_parcel_pages["Parcel booking and tracking<br/>[SendParcel.jsx]"]
  node_parcel_api["Parcel data access<br/>[parcels.js]"]
  node_payment_pages["Checkout and history<br/>[Payment.jsx]"]
  node_payment_api["Payment data access<br/>[payments.js]"]
  node_rider_application["Rider application<br/>[BeARider.jsx]"]
end

subgraph group_admin["Operations"]
  node_admin_pages["Admin dashboard<br/>[AdminHome.jsx]"]
  node_admin_records["Admin management<br/>[ManageParcels.jsx]"]
end

subgraph group_platform["Shared platform"]
  node_auth_pages["Sign in and registration<br/>[LogIn.jsx]"]
  node_router["Client router<br/>[Router.jsx]"]
  node_route_guards["Route guards<br/>[PrivateRoutes.jsx]"]
  node_auth_context["Session and role<br/>[AuthProvider.jsx]"]
  node_axios["Authenticated API client<br/>[axiosClient.js]"]
  node_api_server["API and access control<br/>[index.js]"]
  node_mongo[("MongoDB records<br/>[index.js]")]
end

node_visitor(("Visitor"))
node_customer_actor(("Customer"))
node_rider_actor(("Rider applicant"))
node_admin_actor(("Administrator"))
node_firebase{{"Firebase Auth"}}
node_stripe{{"Stripe"}}
node_imgbb{{"imgBB uploads"}}

node_visitor -->|"opens"| node_router
node_customer_actor -->|"opens"| node_router
node_rider_actor -->|"opens"| node_router
node_admin_actor -->|"opens"| node_router
node_router -->|"routes"| node_public_pages
node_router -->|"routes"| node_coverage
node_router -->|"routes"| node_auth_pages
node_router -->|"guards"| node_route_guards
node_route_guards -->|"checks session"| node_auth_context
node_auth_pages -->|"signs in"| node_auth_context
node_auth_context -->|"authenticates"| node_firebase
node_auth_context -->|"loads role"| node_api_server
node_parcel_pages -->|"requests parcel data"| node_parcel_api
node_payment_pages -->|"requests payment data"| node_payment_api
node_rider_application -->|"submits application"| node_axios
node_parcel_api -->|"sends API requests"| node_axios
node_payment_api -->|"sends API requests"| node_axios
node_admin_pages -->|"sends API requests"| node_axios
node_axios -->|"calls API"| node_api_server
node_api_server -->|"reads and writes"| node_mongo
node_payment_pages -->|"checkout"| node_stripe
node_api_server -->|"creates payment intents"| node_stripe
node_api_server -->|"proxies uploads"| node_imgbb
node_admin_records -->|"manages records"| node_axios

click node_public_pages "https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/home/Home.jsx"
click node_coverage "https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/coverage/Coverage.jsx"
click node_auth_pages "https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/auth/LogIn.jsx"
click node_router "https://github.com/sabbir2268/zap-shift/blob/main/client/src/routes/Router.jsx"
click node_route_guards "https://github.com/sabbir2268/zap-shift/blob/main/client/src/routes/PrivateRoutes.jsx"
click node_auth_context "https://github.com/sabbir2268/zap-shift/blob/main/client/src/context/AuthContext/AuthProvider.jsx"
click node_axios "https://github.com/sabbir2268/zap-shift/blob/main/client/src/context/AxiosContext/axiosClient.js"
click node_parcel_pages "https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/dashboard/sendParcel/SendParcel.jsx"
click node_parcel_api "https://github.com/sabbir2268/zap-shift/blob/main/client/src/api/parcels.js"
click node_payment_pages "https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/dashboard/payment/Payment.jsx"
click node_payment_api "https://github.com/sabbir2268/zap-shift/blob/main/client/src/api/payments.js"
click node_rider_application "https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/beARider/BeARider.jsx"
click node_admin_pages "https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/admin/AdminHome.jsx"
click node_admin_records "https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/admin/manageParcels/ManageParcels.jsx"
click node_api_server "https://github.com/sabbir2268/zap-shift/blob/main/server/index.js"
click node_mongo "https://github.com/sabbir2268/zap-shift/blob/main/server/index.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_public_pages,node_coverage toneBlue
class node_parcel_pages,node_parcel_api,node_payment_pages,node_payment_api,node_rider_application toneAmber
class node_admin_pages,node_admin_records toneMint
class node_auth_pages,node_router,node_route_guards,node_auth_context,node_axios,node_api_server,node_mongo toneRose
class node_visitor,node_customer_actor,node_rider_actor,node_admin_actor,node_firebase,node_stripe,node_imgbb toneIndigo
```

## Components

### Public experience

- [Public pages](https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/home/Home.jsx): `client/src/pages/home/Home.jsx`
- [Branch coverage](https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/coverage/Coverage.jsx): `client/src/pages/coverage/Coverage.jsx`

### Customer workflow

- [Parcel booking and tracking](https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/dashboard/sendParcel/SendParcel.jsx): `client/src/pages/dashboard/sendParcel/SendParcel.jsx`
- [Parcel data access](https://github.com/sabbir2268/zap-shift/blob/main/client/src/api/parcels.js): `client/src/api/parcels.js`
- [Checkout and history](https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/dashboard/payment/Payment.jsx): `client/src/pages/dashboard/payment/Payment.jsx`
- [Payment data access](https://github.com/sabbir2268/zap-shift/blob/main/client/src/api/payments.js): `client/src/api/payments.js`
- [Rider application](https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/beARider/BeARider.jsx): `client/src/pages/beARider/BeARider.jsx`

### Operations

- [Admin dashboard](https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/admin/AdminHome.jsx): `client/src/pages/admin/AdminHome.jsx`
- [Admin management](https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/admin/manageParcels/ManageParcels.jsx): `client/src/pages/admin/manageParcels/ManageParcels.jsx`

### Shared platform

- [Sign in and registration](https://github.com/sabbir2268/zap-shift/blob/main/client/src/pages/auth/LogIn.jsx): `client/src/pages/auth/LogIn.jsx`
- [Client router](https://github.com/sabbir2268/zap-shift/blob/main/client/src/routes/Router.jsx): `client/src/routes/Router.jsx`
- [Route guards](https://github.com/sabbir2268/zap-shift/blob/main/client/src/routes/PrivateRoutes.jsx): `client/src/routes/PrivateRoutes.jsx`
- [Session and role](https://github.com/sabbir2268/zap-shift/blob/main/client/src/context/AuthContext/AuthProvider.jsx): `client/src/context/AuthContext/AuthProvider.jsx`
- [Authenticated API client](https://github.com/sabbir2268/zap-shift/blob/main/client/src/context/AxiosContext/axiosClient.js): `client/src/context/AxiosContext/axiosClient.js`
- [API and access control](https://github.com/sabbir2268/zap-shift/blob/main/server/index.js): `server/index.js`
- [MongoDB records](https://github.com/sabbir2268/zap-shift/blob/main/server/index.js): `server/index.js`

### Other components

- **Visitor**
- **Customer**
- **Rider applicant**
- **Administrator**
- **Firebase Auth**
- **Stripe**
- **imgBB uploads**

## Connections

- Visitor → Client router: opens
- Customer → Client router: opens
- Rider applicant → Client router: opens
- Administrator → Client router: opens
- Client router → Public pages: routes
- Client router → Branch coverage: routes
- Client router → Sign in and registration: routes
- Client router → Route guards: guards
- Route guards → Session and role: checks session
- Sign in and registration → Session and role: signs in
- Session and role → Firebase Auth: authenticates
- Session and role → API and access control: loads role
- Parcel booking and tracking → Parcel data access: requests parcel data
- Checkout and history → Payment data access: requests payment data
- Rider application → Authenticated API client: submits application
- Parcel data access → Authenticated API client: sends API requests
- Payment data access → Authenticated API client: sends API requests
- Admin dashboard → Authenticated API client: sends API requests
- Authenticated API client → API and access control: calls API
- API and access control → MongoDB records: reads and writes
- Checkout and history → Stripe: checkout
- API and access control → Stripe: creates payment intents
- API and access control → imgBB uploads: proxies uploads
- Admin management → Authenticated API client: manages records