# tomakpo/harmonyhealth architecture

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

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

## Overview

Harmony Health Wellness Center’s website presents wellness services and business information, lets visitors browse service details and initiate appointment booking, and provides a contact form backed by an email API. The client entry point routes visitors to the home page or privacy policy; the home page composes its content sections. The contact API validates messages and sends them to the business, then sends a confirmation to the visitor. Booking integration is indicated by the client’s booking helper, but its external wiring was not shown; contact-to-server transport is likewise unverified.

Main entry points: [`client/src/pages/home/home.page.tsx`](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/home.page.tsx) (Home page), [`client/src/app.tsx`](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/app.tsx) (App routing), [`server/src/apis/api.messaging.ts`](https://github.com/tomakpo/harmonyhealth/blob/main/server/src/apis/api.messaging.ts) (Contact API route), [`client/src/pages/home/sections/contact/contact.section.tsx`](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/contact/contact.section.tsx) (Contact section)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Website experience"]
  node_browser["Browser entry<br/>[main.tsx]"]
  node_app["App routing<br/>[app.tsx]"]
  node_header["Site navigation<br/>[header.layout.tsx]"]
  node_home["Home page<br/>[home.page.tsx]"]
  node_hero["Hero section<br/>[hero.section.tsx]"]
  node_about["About section<br/>[about.section.tsx]"]
  node_services["Services catalog"]
  node_contact["Contact section"]
  node_map["Location map<br/>[map.section.tsx]"]
  node_footer["Site footer<br/>[footer.layout.tsx]"]
  node_privacy["Privacy policy"]
  node_booking["Booking helper<br/>[bookings.ts]"]
end

subgraph group_business["Business information"]
  node_business_info["Business details<br/>[info.ts]"]
  node_hours["Opening-hours display"]
  node_icon["Icon component<br/>[icon.component.tsx]"]
end

subgraph group_messaging["Contact messaging"]
  node_messaging_api["Contact API route<br/>[api.messaging.ts]"]
  node_api_router["API router<br/>[index.ts]"]
  node_server["HTTP server<br/>[server.ts]"]
  node_email["Email service<br/>[email.ts]"]
  node_response["API response helper<br/>[apiResponse.ts]"]
end

subgraph group_external["External services"]
  node_booking_service["Booking provider"]
  node_smtp["SMTP service"]
end

node_visitor(("Website visitor"))

node_visitor -->|"opens site"| node_browser
node_browser -->|"renders"| node_app
node_app -->|"renders"| node_header
node_app -->|"routes to"| node_home
node_app -->|"routes to"| node_privacy
node_header -->|"renders button"| node_booking
node_home -->|"renders"| node_hero
node_home -->|"renders"| node_about
node_home -->|"renders"| node_services
node_home -->|"renders"| node_contact
node_home -->|"renders"| node_map
node_home -->|"renders"| node_footer
node_services -->|"calls"| node_booking
node_booking -.->|"opens booking"| node_booking_service
node_contact -->|"reads details"| node_business_info
node_map -->|"reads details"| node_business_info
node_hours -->|"reads hours"| node_business_info
node_hours -->|"renders"| node_icon
node_contact -.->|"submits message"| node_messaging_api
node_server -->|"mounts routes"| node_api_router
node_api_router -->|"registers route"| node_messaging_api
node_messaging_api -->|"validates and sends"| node_email
node_messaging_api -->|"builds response"| node_response
node_email -->|"builds response"| node_response
node_email -->|"sends mail"| node_smtp

click node_browser "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/main.tsx"
click node_app "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/app.tsx"
click node_header "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/layout/header/header.layout.tsx"
click node_home "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/home.page.tsx"
click node_hero "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/hero/hero.section.tsx"
click node_about "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/about/about.section.tsx"
click node_services "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/services/services.section.tsx"
click node_contact "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/contact/contact.section.tsx"
click node_map "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/map/map.section.tsx"
click node_footer "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/layout/footer/footer.layout.tsx"
click node_privacy "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/privacy/privacy-policy.page.tsx"
click node_booking "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/lib/bookings.ts"
click node_business_info "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/store/info.ts"
click node_hours "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/components/hours/hours.component.tsx"
click node_icon "https://github.com/tomakpo/harmonyhealth/blob/main/client/src/components/icon/icon.component.tsx"
click node_messaging_api "https://github.com/tomakpo/harmonyhealth/blob/main/server/src/apis/api.messaging.ts"
click node_api_router "https://github.com/tomakpo/harmonyhealth/blob/main/server/src/apis/index.ts"
click node_server "https://github.com/tomakpo/harmonyhealth/blob/main/server/src/server.ts"
click node_email "https://github.com/tomakpo/harmonyhealth/blob/main/server/src/service/email.ts"
click node_response "https://github.com/tomakpo/harmonyhealth/blob/main/server/src/lib/apiResponse.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_browser,node_app,node_header,node_home,node_hero,node_about,node_services,node_contact,node_map,node_footer,node_privacy,node_booking toneBlue
class node_business_info,node_hours,node_icon toneAmber
class node_messaging_api,node_api_router,node_server,node_email,node_response toneMint
class node_booking_service,node_smtp toneRose
class node_visitor toneIndigo
```

## Components

### Website experience

- [Browser entry](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/main.tsx): `client/src/main.tsx`
- [App routing](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/app.tsx): `client/src/app.tsx`
- [Site navigation](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/layout/header/header.layout.tsx): `client/src/layout/header/header.layout.tsx`
- [Home page](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/home.page.tsx): `client/src/pages/home/home.page.tsx`
- [Hero section](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/hero/hero.section.tsx): `client/src/pages/home/sections/hero/hero.section.tsx`
- [About section](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/about/about.section.tsx): `client/src/pages/home/sections/about/about.section.tsx`
- [Services catalog](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/services/services.section.tsx): `client/src/pages/home/sections/services/services.section.tsx`
- [Contact section](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/contact/contact.section.tsx): `client/src/pages/home/sections/contact/contact.section.tsx`
- [Location map](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/home/sections/map/map.section.tsx): `client/src/pages/home/sections/map/map.section.tsx`
- [Site footer](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/layout/footer/footer.layout.tsx): `client/src/layout/footer/footer.layout.tsx`
- [Privacy policy](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/pages/privacy/privacy-policy.page.tsx): `client/src/pages/privacy/privacy-policy.page.tsx`
- [Booking helper](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/lib/bookings.ts): `client/src/lib/bookings.ts`

### Business information

- [Business details](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/store/info.ts): `client/src/store/info.ts`
- [Opening-hours display](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/components/hours/hours.component.tsx): `client/src/components/hours/hours.component.tsx`
- [Icon component](https://github.com/tomakpo/harmonyhealth/blob/main/client/src/components/icon/icon.component.tsx): `client/src/components/icon/icon.component.tsx`

### Contact messaging

- [Contact API route](https://github.com/tomakpo/harmonyhealth/blob/main/server/src/apis/api.messaging.ts): `server/src/apis/api.messaging.ts`
- [API router](https://github.com/tomakpo/harmonyhealth/blob/main/server/src/apis/index.ts): `server/src/apis/index.ts`
- [HTTP server](https://github.com/tomakpo/harmonyhealth/blob/main/server/src/server.ts): `server/src/server.ts`
- [Email service](https://github.com/tomakpo/harmonyhealth/blob/main/server/src/service/email.ts): `server/src/service/email.ts`
- [API response helper](https://github.com/tomakpo/harmonyhealth/blob/main/server/src/lib/apiResponse.ts): `server/src/lib/apiResponse.ts`

### External services

- **Booking provider**
- **SMTP service**

### Other components

- **Website visitor**

## Connections

- Website visitor → Browser entry: opens site (evidence: `client/src/main.tsx`)
- Browser entry → App routing: renders (evidence: `client/src/main.tsx`)
- App routing → Site navigation: renders (evidence: `client/src/app.tsx`)
- App routing → Home page: routes to (evidence: `client/src/app.tsx`)
- App routing → Privacy policy: routes to (evidence: `client/src/app.tsx`)
- Site navigation → Booking helper: renders button (evidence: `client/src/layout/header/header.layout.tsx`)
- Home page → Hero section: renders (evidence: `client/src/pages/home/home.page.tsx`)
- Home page → About section: renders (evidence: `client/src/pages/home/home.page.tsx`)
- Home page → Services catalog: renders (evidence: `client/src/pages/home/home.page.tsx`)
- Home page → Contact section: renders (evidence: `client/src/pages/home/home.page.tsx`)
- Home page → Location map: renders (evidence: `client/src/pages/home/home.page.tsx`)
- Home page → Site footer: renders (evidence: `client/src/pages/home/home.page.tsx`)
- Services catalog → Booking helper: calls (evidence: `client/src/pages/home/sections/services/services.section.tsx`)
- Booking helper → Booking provider: opens booking
- Contact section → Business details: reads details (evidence: `client/src/pages/home/sections/contact/contact.section.tsx`)
- Location map → Business details: reads details (evidence: `client/src/pages/home/sections/map/map.section.tsx`)
- Opening-hours display → Business details: reads hours (evidence: `client/src/components/hours/hours.component.tsx`)
- Opening-hours display → Icon component: renders (evidence: `client/src/components/hours/hours.component.tsx`)
- Contact section → Contact API route: submits message
- HTTP server → API router: mounts routes (evidence: `server/src/server.ts`)
- API router → Contact API route: registers route (evidence: `server/src/apis/index.ts`)
- Contact API route → Email service: validates and sends (evidence: `server/src/apis/api.messaging.ts`)
- Contact API route → API response helper: builds response (evidence: `server/src/apis/api.messaging.ts`)
- Email service → API response helper: builds response (evidence: `server/src/service/email.ts`)
- Email service → SMTP service: sends mail (evidence: `server/src/service/email.ts`)