# andareomondi/jambodrive architecture

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

- Interactive diagram: https://gitdiagram.com/andareomondi/jambodrive
- Repository: https://github.com/andareomondi/jambodrive

## Overview

Cosmara is a car-rental application: customers browse vehicles, book a rental or test drive, and pay through M-Pesa; staff manage bookings, vehicles, returns, and gallery content. The graph separates customer workflows, authentication, operations, and shared data/payment infrastructure. The README describes a generic Next.js/Supabase starter and does not document these rental capabilities; several source excerpts are partial, so uncertain connections are omitted.

Main entry points: [`app/cars/page.tsx`](https://github.com/andareomondi/jambodrive/blob/main/app/cars/page.tsx) (Fleet Browse), [`components/booking/booking-client.tsx`](https://github.com/andareomondi/jambodrive/blob/main/components/booking/booking-client.tsx) (Booking and Payment UI), [`app/api/mpesa/stkpush/route.ts`](https://github.com/andareomondi/jambodrive/blob/main/app/api/mpesa/stkpush/route.ts) (M-Pesa STK Push), [`components/facilitator/facilitator-client.tsx`](https://github.com/andareomondi/jambodrive/blob/main/components/facilitator/facilitator-client.tsx) (Return Handling)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_discovery["Fleet Discovery"]
  node_cars["Fleet Browse<br/>[page.tsx]"]
  node_categories["Category Browse<br/>[page.tsx]"]
  node_car_details["Vehicle Details"]
  node_gallery["Fleet Gallery<br/>[gallery-client.tsx]"]
end

subgraph group_rental["Rental and Payments"]
  node_booking_page["Rental Booking<br/>[page.tsx]"]
  node_booking_client["Booking and Payment UI<br/>[booking-client.tsx]"]
  node_testdrive["Test Drive"]
  node_stkpush["M-Pesa STK Push<br/>[route.ts]"]
  node_callback["Payment Callback<br/>[route.ts]"]
  node_dashboard["Customer Dashboard"]
  node_booking_actions["Booking Actions<br/>[bookings.ts]"]
end

subgraph group_identity["Identity"]
  node_auth_pages["Sign In and Sign Up<br/>[page.tsx]"]
  node_auth_provider["Session Provider<br/>[auth-provider.tsx]"]
  node_auth_confirm["Email Confirmation<br/>[route.ts]"]
end

subgraph group_operations["Fleet Operations"]
  node_admin["Admin Dashboard"]
  node_facilitator["Return Handling"]
  node_gallery_admin["Gallery Management"]
  node_admin_actions["Admin Actions<br/>[admin.ts]"]
  node_facilitator_actions["Facilitator Actions<br/>[facilitator.ts]"]
end

subgraph group_platform["Data and Integrations"]
  node_car_service["Car Data Service<br/>[cars.ts]"]
  node_gallery_service["Gallery Data Service<br/>[gallery.ts]"]
  node_supabase_server["Server Client<br/>[server.ts]"]
  node_supabase_browser["Browser Client<br/>[client.ts]"]
  node_bookings_db[("Supabase Bookings")]
end

node_customer(("Customer"))
node_staff(("Staff"))
node_supabase[("Supabase")]
node_mpesa["M-Pesa Daraja"]

node_customer -->|"browses"| node_cars
node_cars -->|"opens vehicle"| node_car_details
node_customer -->|"filters fleet"| node_categories
node_customer -->|"views photos"| node_gallery
node_car_details -->|"starts rental"| node_booking_page
node_booking_page -->|"renders booking"| node_booking_client
node_booking_client -->|"requests payment"| node_stkpush
node_stkpush -->|"requests STK"| node_mpesa
node_mpesa -->|"sends result"| node_callback
node_stkpush -->|"stores checkout ID"| node_bookings_db
node_callback -->|"updates payment"| node_bookings_db
node_customer -->|"requests test drive"| node_testdrive
node_customer -->|"manages rentals"| node_dashboard
node_customer -->|"authenticates"| node_auth_pages
node_auth_pages -->|"confirms email"| node_auth_confirm
node_auth_confirm -->|"verifies OTP"| node_supabase_server
node_auth_provider -->|"uses session"| node_supabase_browser
node_supabase_server -->|"creates session client"| node_supabase
node_supabase_browser -->|"connects"| node_supabase
node_cars -->|"loads fleet"| node_car_service
node_gallery -->|"loads images"| node_gallery_service
node_staff -->|"manages fleet"| node_admin
node_staff -->|"processes returns"| node_facilitator
node_staff -->|"manages gallery"| node_gallery_admin
node_admin -->|"fetches fleet and bookings"| node_admin_actions
node_admin_actions -->|"reads data"| node_supabase
node_facilitator -->|"processes return"| node_facilitator_actions
node_facilitator -->|"initiates fee charge"| node_facilitator_actions
node_booking_client -->|"uses realtime client"| node_supabase_browser
node_booking_actions -->|"accesses booking data"| node_supabase
node_car_service -->|"accesses fleet data"| node_supabase
node_gallery_service -->|"accesses gallery data"| node_supabase

click node_cars "https://github.com/andareomondi/jambodrive/blob/main/app/cars/page.tsx"
click node_categories "https://github.com/andareomondi/jambodrive/blob/main/app/cars/category/%5Btype%5D/page.tsx"
click node_car_details "https://github.com/andareomondi/jambodrive/blob/main/components/cars/car-details-client.tsx"
click node_gallery "https://github.com/andareomondi/jambodrive/blob/main/components/gallery/gallery-client.tsx"
click node_booking_page "https://github.com/andareomondi/jambodrive/blob/main/app/booking/%5BcarId%5D/page.tsx"
click node_booking_client "https://github.com/andareomondi/jambodrive/blob/main/components/booking/booking-client.tsx"
click node_testdrive "https://github.com/andareomondi/jambodrive/blob/main/components/booking/testdrive-client.tsx"
click node_stkpush "https://github.com/andareomondi/jambodrive/blob/main/app/api/mpesa/stkpush/route.ts"
click node_callback "https://github.com/andareomondi/jambodrive/blob/main/app/api/mpesa/callback/route.ts"
click node_dashboard "https://github.com/andareomondi/jambodrive/blob/main/components/dashboard/dashboard-client.tsx"
click node_auth_pages "https://github.com/andareomondi/jambodrive/blob/main/app/auth/login/page.tsx"
click node_auth_provider "https://github.com/andareomondi/jambodrive/blob/main/components/auth/auth-provider.tsx"
click node_auth_confirm "https://github.com/andareomondi/jambodrive/blob/main/app/auth/confirm/route.ts"
click node_admin "https://github.com/andareomondi/jambodrive/blob/main/components/admin/admin-dashboard-client.tsx"
click node_facilitator "https://github.com/andareomondi/jambodrive/blob/main/components/facilitator/facilitator-client.tsx"
click node_gallery_admin "https://github.com/andareomondi/jambodrive/blob/main/components/admin/admin-gallery-section.tsx"
click node_admin_actions "https://github.com/andareomondi/jambodrive/blob/main/lib/actions/admin.ts"
click node_facilitator_actions "https://github.com/andareomondi/jambodrive/blob/main/lib/actions/facilitator.ts"
click node_booking_actions "https://github.com/andareomondi/jambodrive/blob/main/lib/actions/bookings.ts"
click node_car_service "https://github.com/andareomondi/jambodrive/blob/main/lib/services/cars.ts"
click node_gallery_service "https://github.com/andareomondi/jambodrive/blob/main/lib/services/gallery.ts"
click node_supabase_server "https://github.com/andareomondi/jambodrive/blob/main/lib/supabase/server.ts"
click node_supabase_browser "https://github.com/andareomondi/jambodrive/blob/main/lib/supabase/client.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_cars,node_categories,node_car_details,node_gallery toneBlue
class node_booking_page,node_booking_client,node_testdrive,node_stkpush,node_callback,node_dashboard,node_booking_actions,node_supabase toneAmber
class node_auth_pages,node_auth_provider,node_auth_confirm toneMint
class node_admin,node_facilitator,node_gallery_admin,node_admin_actions,node_facilitator_actions toneRose
class node_car_service,node_gallery_service,node_supabase_server,node_supabase_browser,node_bookings_db,node_customer,node_staff,node_mpesa toneIndigo
```

## Components

### Fleet Discovery

- [Fleet Browse](https://github.com/andareomondi/jambodrive/blob/main/app/cars/page.tsx): `app/cars/page.tsx`
- [Category Browse](https://github.com/andareomondi/jambodrive/blob/main/app/cars/category/%5Btype%5D/page.tsx): `app/cars/category/[type]/page.tsx`
- [Vehicle Details](https://github.com/andareomondi/jambodrive/blob/main/components/cars/car-details-client.tsx): `components/cars/car-details-client.tsx`
- [Fleet Gallery](https://github.com/andareomondi/jambodrive/blob/main/components/gallery/gallery-client.tsx): `components/gallery/gallery-client.tsx`

### Rental and Payments

- [Rental Booking](https://github.com/andareomondi/jambodrive/blob/main/app/booking/%5BcarId%5D/page.tsx): `app/booking/[carId]/page.tsx`
- [Booking and Payment UI](https://github.com/andareomondi/jambodrive/blob/main/components/booking/booking-client.tsx): `components/booking/booking-client.tsx`
- [Test Drive](https://github.com/andareomondi/jambodrive/blob/main/components/booking/testdrive-client.tsx): `components/booking/testdrive-client.tsx`
- [M-Pesa STK Push](https://github.com/andareomondi/jambodrive/blob/main/app/api/mpesa/stkpush/route.ts): `app/api/mpesa/stkpush/route.ts`
- [Payment Callback](https://github.com/andareomondi/jambodrive/blob/main/app/api/mpesa/callback/route.ts): `app/api/mpesa/callback/route.ts`
- [Customer Dashboard](https://github.com/andareomondi/jambodrive/blob/main/components/dashboard/dashboard-client.tsx): `components/dashboard/dashboard-client.tsx`
- [Booking Actions](https://github.com/andareomondi/jambodrive/blob/main/lib/actions/bookings.ts): `lib/actions/bookings.ts`

### Identity

- [Sign In and Sign Up](https://github.com/andareomondi/jambodrive/blob/main/app/auth/login/page.tsx): `app/auth/login/page.tsx`
- [Session Provider](https://github.com/andareomondi/jambodrive/blob/main/components/auth/auth-provider.tsx): `components/auth/auth-provider.tsx`
- [Email Confirmation](https://github.com/andareomondi/jambodrive/blob/main/app/auth/confirm/route.ts): `app/auth/confirm/route.ts`

### Fleet Operations

- [Admin Dashboard](https://github.com/andareomondi/jambodrive/blob/main/components/admin/admin-dashboard-client.tsx): `components/admin/admin-dashboard-client.tsx`
- [Return Handling](https://github.com/andareomondi/jambodrive/blob/main/components/facilitator/facilitator-client.tsx): `components/facilitator/facilitator-client.tsx`
- [Gallery Management](https://github.com/andareomondi/jambodrive/blob/main/components/admin/admin-gallery-section.tsx): `components/admin/admin-gallery-section.tsx`
- [Admin Actions](https://github.com/andareomondi/jambodrive/blob/main/lib/actions/admin.ts): `lib/actions/admin.ts`
- [Facilitator Actions](https://github.com/andareomondi/jambodrive/blob/main/lib/actions/facilitator.ts): `lib/actions/facilitator.ts`

### Data and Integrations

- [Car Data Service](https://github.com/andareomondi/jambodrive/blob/main/lib/services/cars.ts): `lib/services/cars.ts`
- [Gallery Data Service](https://github.com/andareomondi/jambodrive/blob/main/lib/services/gallery.ts): `lib/services/gallery.ts`
- [Server Client](https://github.com/andareomondi/jambodrive/blob/main/lib/supabase/server.ts): `lib/supabase/server.ts`
- [Browser Client](https://github.com/andareomondi/jambodrive/blob/main/lib/supabase/client.ts): `lib/supabase/client.ts`
- **Supabase Bookings**

### Other components

- **Customer**
- **Staff**
- **Supabase**
- **M-Pesa Daraja**

## Connections

- Customer → Fleet Browse: browses
- Fleet Browse → Vehicle Details: opens vehicle
- Customer → Category Browse: filters fleet
- Customer → Fleet Gallery: views photos
- Vehicle Details → Rental Booking: starts rental
- Rental Booking → Booking and Payment UI: renders booking
- Booking and Payment UI → M-Pesa STK Push: requests payment
- M-Pesa STK Push → M-Pesa Daraja: requests STK
- M-Pesa Daraja → Payment Callback: sends result
- M-Pesa STK Push → Supabase Bookings: stores checkout ID
- Payment Callback → Supabase Bookings: updates payment
- Customer → Test Drive: requests test drive
- Customer → Customer Dashboard: manages rentals
- Customer → Sign In and Sign Up: authenticates
- Sign In and Sign Up → Email Confirmation: confirms email
- Email Confirmation → Server Client: verifies OTP
- Session Provider → Browser Client: uses session
- Server Client → Supabase: creates session client
- Browser Client → Supabase: connects
- Fleet Browse → Car Data Service: loads fleet
- Fleet Gallery → Gallery Data Service: loads images
- Staff → Admin Dashboard: manages fleet
- Staff → Return Handling: processes returns
- Staff → Gallery Management: manages gallery
- Admin Dashboard → Admin Actions: fetches fleet and bookings
- Admin Actions → Supabase: reads data
- Return Handling → Facilitator Actions: processes return
- Return Handling → Facilitator Actions: initiates fee charge
- Booking and Payment UI → Browser Client: uses realtime client
- Booking Actions → Supabase: accesses booking data
- Car Data Service → Supabase: accesses fleet data
- Gallery Data Service → Supabase: accesses gallery data