# sowmyanamala/spabooking architecture

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

- Interactive diagram: https://gitdiagram.com/sowmyanamala/spabooking
- Repository: https://github.com/sowmyanamala/spabooking
- Video tour (about a minute): https://gitdiagram.com/sowmyanamala/spabooking/video

## Overview

Spagram is a Next.js marketplace for finding wellness therapists and managing bookings, with separate customer, therapist, and administrator areas. The clearest sampled workflow is customer discovery: the home page filters therapists through a remote API, then stores a selected therapist and opens its detail page. Booking, payment, onboarding, and account-management stages are represented by routes and components in the tree, but their internal wiring is not established by the sampled source. The admin dashboard’s statistics requests and the local services API are directly evidenced.

Main entry points: [`components/admin/index.js`](https://github.com/sowmyanamala/spabooking/blob/main/components/admin/index.js) (Admin dashboard), [`pages/index.js`](https://github.com/sowmyanamala/spabooking/blob/main/pages/index.js) (Search therapists), [`pages/model-backend/index.js`](https://github.com/sowmyanamala/spabooking/blob/main/pages/model-backend/index.js) (Therapist account), [`pages/ConfirmAndPayPage.js`](https://github.com/sowmyanamala/spabooking/blob/main/pages/ConfirmAndPayPage.js) (Confirm and pay)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_discovery["Therapist discovery"]
  node_home["Search therapists<br/>[index.js]"]
  node_filter_api["Therapist filter API"]
  node_selected["Selected therapist"]
end

subgraph group_booking["Booking and payment"]
  node_schedule["Availability and schedule<br/>[schedule.js]"]
  node_booking["Booking details<br/>[booking.js]"]
  node_checkout["Confirm and pay"]
  node_pay_api["Payment API<br/>[pay.js]"]
  node_square["Square payments"]
  node_payment_status["Payment status pages<br/>[index.js]"]
end

subgraph group_accounts["Customer and therapist accounts"]
  node_customer_onboarding["Customer onboarding<br/>[ClientReg.jsx]"]
  node_customer_area["Customer account<br/>[index.js]"]
  node_customer_orders["Customer orders and reviews<br/>[orders.js]"]
  node_model_area["Therapist account<br/>[index.js]"]
  node_model_orders["Therapist orders<br/>[orders.js]"]
  node_model_availability["Therapist availability<br/>[availability.js]"]
end

subgraph group_admin["Administration"]
  node_admin_dashboard["Admin dashboard<br/>[index.js]"]
  node_admin_users["User administration<br/>[users.js]"]
  node_admin_therapists["Therapist administration<br/>[therapists.js]"]
  node_admin_services["Service administration<br/>[services.js]"]
  node_pending_orders["Pending orders API"]
end

subgraph group_shared["Shared application"]
  node_services_data["Service catalog<br/>[services.js]"]
  node_app_layout["Application layouts<br/>[layout.js]"]
end

node_customer(("Customer"))

node_customer -->|"searches"| node_home
node_home -->|"fetches filters"| node_filter_api
node_home -->|"stores selection"| node_selected
node_customer -->|"registers"| node_customer_onboarding
node_customer -->|"chooses time"| node_schedule
node_customer -->|"books"| node_booking
node_customer -->|"pays"| node_checkout
node_checkout -->|"submits payment"| node_pay_api
node_pay_api -.->|"processes payment"| node_square
node_customer -->|"views outcome"| node_payment_status
node_customer -->|"manages account"| node_customer_area
node_customer_area -->|"opens orders"| node_customer_orders
node_model_area -->|"manages orders"| node_model_orders
node_model_area -->|"manages availability"| node_model_availability
node_admin_dashboard -->|"fetches counts"| node_admin_users
node_admin_dashboard -->|"fetches counts"| node_admin_therapists
node_admin_dashboard -->|"fetches orders"| node_pending_orders
node_admin_dashboard -.->|"manages services"| node_admin_services
node_admin_services -->|"reads catalog"| node_services_data

click node_home "https://github.com/sowmyanamala/spabooking/blob/main/pages/index.js"
click node_selected "https://github.com/sowmyanamala/spabooking/blob/main/pages/therapistDetails.js"
click node_schedule "https://github.com/sowmyanamala/spabooking/blob/main/pages/schedule.js"
click node_booking "https://github.com/sowmyanamala/spabooking/blob/main/pages/booking.js"
click node_checkout "https://github.com/sowmyanamala/spabooking/blob/main/pages/ConfirmAndPayPage.js"
click node_pay_api "https://github.com/sowmyanamala/spabooking/blob/main/pages/api/pay.js"
click node_payment_status "https://github.com/sowmyanamala/spabooking/blob/main/pages/cardsaved/index.js"
click node_customer_onboarding "https://github.com/sowmyanamala/spabooking/blob/main/components/onboarding/ClientReg.jsx"
click node_customer_area "https://github.com/sowmyanamala/spabooking/blob/main/pages/customer-backend/index.js"
click node_customer_orders "https://github.com/sowmyanamala/spabooking/blob/main/pages/customer-backend/orders.js"
click node_model_area "https://github.com/sowmyanamala/spabooking/blob/main/pages/model-backend/index.js"
click node_model_orders "https://github.com/sowmyanamala/spabooking/blob/main/pages/model-backend/orders.js"
click node_model_availability "https://github.com/sowmyanamala/spabooking/blob/main/pages/model-backend/availability.js"
click node_admin_dashboard "https://github.com/sowmyanamala/spabooking/blob/main/components/admin/index.js"
click node_admin_users "https://github.com/sowmyanamala/spabooking/blob/main/pages/api/admin/users.js"
click node_admin_therapists "https://github.com/sowmyanamala/spabooking/blob/main/pages/api/admin/therapists.js"
click node_admin_services "https://github.com/sowmyanamala/spabooking/blob/main/pages/api/admin/services.js"
click node_pending_orders "https://github.com/sowmyanamala/spabooking/blob/main/api/getpendingorders.php"
click node_services_data "https://github.com/sowmyanamala/spabooking/blob/main/components/data/services.js"
click node_app_layout "https://github.com/sowmyanamala/spabooking/blob/main/components/layout.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_home,node_filter_api,node_selected toneBlue
class node_schedule,node_booking,node_checkout,node_pay_api,node_square,node_payment_status toneAmber
class node_customer_onboarding,node_customer_area,node_customer_orders,node_model_area,node_model_orders,node_model_availability toneMint
class node_admin_dashboard,node_admin_users,node_admin_therapists,node_admin_services,node_pending_orders toneRose
class node_services_data,node_app_layout,node_customer toneIndigo
```

## Components

### Therapist discovery

- [Search therapists](https://github.com/sowmyanamala/spabooking/blob/main/pages/index.js): `pages/index.js`
- **Therapist filter API**
- [Selected therapist](https://github.com/sowmyanamala/spabooking/blob/main/pages/therapistDetails.js): `pages/therapistDetails.js`

### Booking and payment

- [Availability and schedule](https://github.com/sowmyanamala/spabooking/blob/main/pages/schedule.js): `pages/schedule.js`
- [Booking details](https://github.com/sowmyanamala/spabooking/blob/main/pages/booking.js): `pages/booking.js`
- [Confirm and pay](https://github.com/sowmyanamala/spabooking/blob/main/pages/ConfirmAndPayPage.js): `pages/ConfirmAndPayPage.js`
- [Payment API](https://github.com/sowmyanamala/spabooking/blob/main/pages/api/pay.js): `pages/api/pay.js`
- **Square payments**
- [Payment status pages](https://github.com/sowmyanamala/spabooking/blob/main/pages/cardsaved/index.js): `pages/cardsaved/index.js`

### Customer and therapist accounts

- [Customer onboarding](https://github.com/sowmyanamala/spabooking/blob/main/components/onboarding/ClientReg.jsx): `components/onboarding/ClientReg.jsx`
- [Customer account](https://github.com/sowmyanamala/spabooking/blob/main/pages/customer-backend/index.js): `pages/customer-backend/index.js`
- [Customer orders and reviews](https://github.com/sowmyanamala/spabooking/blob/main/pages/customer-backend/orders.js): `pages/customer-backend/orders.js`
- [Therapist account](https://github.com/sowmyanamala/spabooking/blob/main/pages/model-backend/index.js): `pages/model-backend/index.js`
- [Therapist orders](https://github.com/sowmyanamala/spabooking/blob/main/pages/model-backend/orders.js): `pages/model-backend/orders.js`
- [Therapist availability](https://github.com/sowmyanamala/spabooking/blob/main/pages/model-backend/availability.js): `pages/model-backend/availability.js`

### Administration

- [Admin dashboard](https://github.com/sowmyanamala/spabooking/blob/main/components/admin/index.js): `components/admin/index.js`
- [User administration](https://github.com/sowmyanamala/spabooking/blob/main/pages/api/admin/users.js): `pages/api/admin/users.js`
- [Therapist administration](https://github.com/sowmyanamala/spabooking/blob/main/pages/api/admin/therapists.js): `pages/api/admin/therapists.js`
- [Service administration](https://github.com/sowmyanamala/spabooking/blob/main/pages/api/admin/services.js): `pages/api/admin/services.js`
- [Pending orders API](https://github.com/sowmyanamala/spabooking/blob/main/api/getpendingorders.php): `api/getpendingorders.php`

### Shared application

- [Service catalog](https://github.com/sowmyanamala/spabooking/blob/main/components/data/services.js): `components/data/services.js`
- [Application layouts](https://github.com/sowmyanamala/spabooking/blob/main/components/layout.js): `components/layout.js`

### Other components

- **Customer**

## Connections

- Customer → Search therapists: searches
- Search therapists → Therapist filter API: fetches filters
- Search therapists → Selected therapist: stores selection
- Customer → Customer onboarding: registers
- Customer → Availability and schedule: chooses time
- Customer → Booking details: books
- Customer → Confirm and pay: pays
- Confirm and pay → Payment API: submits payment
- Payment API → Square payments: processes payment
- Customer → Payment status pages: views outcome
- Customer → Customer account: manages account
- Customer account → Customer orders and reviews: opens orders
- Therapist account → Therapist orders: manages orders
- Therapist account → Therapist availability: manages availability
- Admin dashboard → User administration: fetches counts
- Admin dashboard → Therapist administration: fetches counts
- Admin dashboard → Pending orders API: fetches orders
- Admin dashboard → Service administration: manages services
- Service administration → Service catalog: reads catalog