# johnseltan032-web/h-a-cozy-pad architecture

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

- Interactive diagram: https://gitdiagram.com/johnseltan032-web/h-a-cozy-pad
- Repository: https://github.com/johnseltan032-web/h-a-cozy-pad

## Overview

H&A Cozy Pad is a vacation-rental marketplace with guest booking and trip management, host listing and reservation tools, and administrative features. The principal flow routes visitors through property discovery, listing details and booking confirmation; hosts manage listings, reservations and calendar availability. PHP endpoints provide backend capabilities and a shared database connection. The README is empty, and many endpoint and page implementations were not sampled, so unsourced runtime links are omitted rather than inferred.

Main entry points: [`src/App.jsx`](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/App.jsx) (Route and auth state), [`src/components/AuthModal.jsx`](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/components/AuthModal.jsx) (Sign-in), [`api/login.php`](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/login.php) (Authentication endpoints), [`api/db.php`](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/db.php) (MySQL connection)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["Application"]
  node_router["Route and auth state<br/>[App.jsx]"]
  node_auth["Sign-in<br/>[AuthModal.jsx]"]
  node_googlebutton["Google sign-in button"]
  node_googleauth["Google auth config<br/>[googleAuth.js]"]
end

subgraph group_guest["Guest Experience"]
  node_home["Home and search<br/>[HomePage.jsx]"]
  node_listing["Property details<br/>[ListedProperty.jsx]"]
  node_booking["Booking confirmation"]
  node_bookingalt["Booking submission"]
  node_trips["Guest trips<br/>[Trips.jsx]"]
  node_profile["Account profile<br/>[Profile.jsx]"]
  node_help["Help and FAQs<br/>[HelpCenter.jsx]"]
end

subgraph group_host["Host Management"]
  node_listingflow["Listing creation flow"]
  node_draft["Listing draft state<br/>[listingDraft.js]"]
  node_hostlistings["Host listings"]
  node_reservations["Reservations"]
  node_calendar["Calendar and blocks"]
  node_dashboard["Host dashboard"]
  node_inbox["Host inbox<br/>[Inbox.jsx]"]
end

subgraph group_backend["Backend Services"]
  node_apihelper["API configuration<br/>[api.js]"]
  node_bookingapi["Booking endpoints<br/>[create_booking.php]"]
  node_authapi["Authentication endpoints<br/>[login.php]"]
  node_availabilityapi["Availability endpoints<br/>[blocked_dates.php]"]
  node_db[("MySQL connection<br/>[db.php]")]
end

node_visitor(("Visitor / user"))

node_visitor -->|"opens app"| node_router
node_router -->|"renders"| node_auth
node_router -->|"routes to"| node_home
node_router -->|"routes to"| node_trips
node_router -->|"routes to"| node_profile
node_router -->|"routes to"| node_help
node_router -->|"routes to"| node_hostlistings
node_router -->|"routes to"| node_reservations
node_router -->|"routes to"| node_calendar
node_router -->|"routes to"| node_dashboard
node_router -->|"routes to"| node_inbox
node_router -->|"routes to"| node_booking
node_router -->|"checks session"| node_authapi
node_auth -->|"posts login"| node_authapi
node_auth -->|"renders"| node_googlebutton
node_googlebutton -->|"reads config"| node_googleauth
node_auth -->|"reads config"| node_googleauth
node_bookingalt -->|"posts booking"| node_bookingapi
node_calendar -->|"posts date blocks"| node_availabilityapi
node_listingflow -->|"updates draft"| node_draft
node_listingflow -->|"updates draft"| node_draft
node_authapi -.->|"uses connection"| node_db
node_bookingapi -.->|"uses connection"| node_db
node_availabilityapi -.->|"uses connection"| node_db

click node_router "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/App.jsx"
click node_auth "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/components/AuthModal.jsx"
click node_googlebutton "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/components/GoogleAuthButton.jsx"
click node_googleauth "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/lib/googleAuth.js"
click node_apihelper "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/lib/api.js"
click node_home "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/home_page/HomePage.jsx"
click node_listing "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/ListedProperty.jsx"
click node_booking "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/booking_page/Bookingconfirmation.jsx"
click node_bookingalt "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/booking_page/Bookingconfirmation_2.jsx"
click node_trips "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/Trips.jsx"
click node_profile "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/Profile.jsx"
click node_help "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/faq_page/HelpCenter.jsx"
click node_listingflow "https://github.com/johnseltan032-web/h-a-cozy-pad/tree/main/src/pages/listing_page"
click node_draft "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/lib/listingDraft.js"
click node_hostlistings "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/DashboardListings.jsx"
click node_reservations "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/DashboardReservations.jsx"
click node_calendar "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/DashboardCalendar.jsx"
click node_dashboard "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/dashboardOverview.jsx"
click node_inbox "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/Inbox.jsx"
click node_bookingapi "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/create_booking.php"
click node_authapi "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/login.php"
click node_availabilityapi "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/blocked_dates.php"
click node_db "https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/db.php"

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_router,node_auth,node_googlebutton,node_googleauth,node_visitor toneBlue
class node_home,node_listing,node_booking,node_bookingalt,node_trips,node_profile,node_help toneAmber
class node_listingflow,node_draft,node_hostlistings,node_reservations,node_calendar,node_dashboard,node_inbox toneMint
class node_apihelper,node_bookingapi,node_authapi,node_availabilityapi,node_db toneRose
```

## Components

### Application

- [Route and auth state](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/App.jsx): `src/App.jsx`
- [Sign-in](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/components/AuthModal.jsx): `src/components/AuthModal.jsx`
- [Google sign-in button](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/components/GoogleAuthButton.jsx): `src/components/GoogleAuthButton.jsx`
- [Google auth config](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/lib/googleAuth.js): `src/lib/googleAuth.js`

### Guest Experience

- [Home and search](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/home_page/HomePage.jsx): `src/pages/home_page/HomePage.jsx`
- [Property details](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/ListedProperty.jsx): `src/pages/ListedProperty.jsx`
- [Booking confirmation](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/booking_page/Bookingconfirmation.jsx): `src/pages/booking_page/Bookingconfirmation.jsx`
- [Booking submission](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/booking_page/Bookingconfirmation_2.jsx): `src/pages/booking_page/Bookingconfirmation_2.jsx`
- [Guest trips](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/Trips.jsx): `src/pages/Trips.jsx`
- [Account profile](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/Profile.jsx): `src/pages/Profile.jsx`
- [Help and FAQs](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/faq_page/HelpCenter.jsx): `src/pages/faq_page/HelpCenter.jsx`

### Host Management

- [Listing creation flow](https://github.com/johnseltan032-web/h-a-cozy-pad/tree/main/src/pages/listing_page): `src/pages/listing_page`
- [Listing draft state](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/lib/listingDraft.js): `src/lib/listingDraft.js`
- [Host listings](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/DashboardListings.jsx): `src/pages/dashboard_page/DashboardListings.jsx`
- [Reservations](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/DashboardReservations.jsx): `src/pages/dashboard_page/DashboardReservations.jsx`
- [Calendar and blocks](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/DashboardCalendar.jsx): `src/pages/dashboard_page/DashboardCalendar.jsx`
- [Host dashboard](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/dashboardOverview.jsx): `src/pages/dashboard_page/dashboardOverview.jsx`
- [Host inbox](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/pages/dashboard_page/Inbox.jsx): `src/pages/dashboard_page/Inbox.jsx`

### Backend Services

- [API configuration](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/src/lib/api.js): `src/lib/api.js`
- [Booking endpoints](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/create_booking.php): `api/create_booking.php`
- [Authentication endpoints](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/login.php): `api/login.php`
- [Availability endpoints](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/blocked_dates.php): `api/blocked_dates.php`
- [MySQL connection](https://github.com/johnseltan032-web/h-a-cozy-pad/blob/main/api/db.php): `api/db.php`

### Other components

- **Visitor / user**

## Connections

- Visitor / user → Route and auth state: opens app
- Route and auth state → Sign-in: renders (evidence: `src/App.jsx`)
- Route and auth state → Home and search: routes to (evidence: `src/App.jsx`)
- Route and auth state → Guest trips: routes to (evidence: `src/App.jsx`)
- Route and auth state → Account profile: routes to (evidence: `src/App.jsx`)
- Route and auth state → Help and FAQs: routes to (evidence: `src/App.jsx`)
- Route and auth state → Host listings: routes to (evidence: `src/App.jsx`)
- Route and auth state → Reservations: routes to (evidence: `src/App.jsx`)
- Route and auth state → Calendar and blocks: routes to (evidence: `src/App.jsx`)
- Route and auth state → Host dashboard: routes to (evidence: `src/App.jsx`)
- Route and auth state → Host inbox: routes to (evidence: `src/App.jsx`)
- Route and auth state → Booking confirmation: routes to (evidence: `src/App.jsx`)
- Route and auth state → Authentication endpoints: checks session (evidence: `src/App.jsx`)
- Sign-in → Authentication endpoints: posts login (evidence: `src/components/AuthModal.jsx`)
- Sign-in → Google sign-in button: renders (evidence: `src/components/AuthModal.jsx`)
- Google sign-in button → Google auth config: reads config (evidence: `src/components/GoogleAuthButton.jsx`)
- Sign-in → Google auth config: reads config (evidence: `src/components/AuthModal.jsx`)
- Booking submission → Booking endpoints: posts booking (evidence: `src/pages/booking_page/Bookingconfirmation_2.jsx`)
- Calendar and blocks → Availability endpoints: posts date blocks (evidence: `src/pages/dashboard_page/DashboardCalendar.jsx`)
- Listing creation flow → Listing draft state: updates draft (evidence: `src/pages/listing_page/PlaceLocation.jsx`)
- Listing creation flow → Listing draft state: updates draft (evidence: `src/pages/listing_page/PlaceRate.jsx`)
- Authentication endpoints → MySQL connection: uses connection
- Booking endpoints → MySQL connection: uses connection
- Availability endpoints → MySQL connection: uses connection