# dwisusanto29/doctor_appointment_booking_app architecture

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

- Interactive diagram: https://gitdiagram.com/dwisusanto29/doctor_appointment_booking_app
- Repository: https://github.com/dwisusanto29/doctor_appointment_booking_app

## Overview

This is a Next.js doctor-discovery frontend: users browse specialties, view category-based doctor results, and open doctor details with suggestions. The sampled code fetches category and doctor data directly from an external Backendless API; Kinde provides authentication endpoints, although the middleware file’s activation is unclear. The README names appointment booking, but the booking component is commented out in the sampled detail view, so no booking workflow is represented. Several listed page components were not sampled, so their internal wiring is left unspecified.

Main entry points: [`app/(route)/search/[cname]/page.jsx`](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/search/%5Bcname%5D/page.jsx) (Category results), [`app/(route)/details/[id]/page.jsx`](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/details/%5Bid%5D/page.jsx) (Doctor detail page), [`app/(route)/search/_components/CategoryList.jsx`](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/search/_components/CategoryList.jsx) (Category sidebar), [`app/(route)/details/[id]/_components/DoctorDetail.jsx`](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/details/%5Bid%5D/_components/DoctorDetail.jsx) (Doctor detail)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_discovery["Doctor discovery"]
  node_home["Home page<br/>[page.js]"]
  node_category_search["Category search<br/>[CategorySearch.jsx]"]
  node_category_sidebar["Category sidebar<br/>[CategoryList.jsx]"]
  node_search_layout["Search layout<br/>[layout.jsx]"]
  node_category_page["Category results<br/>[page.jsx]"]
  node_doctor_list["Doctor list<br/>[DoctorList.jsx]"]
  node_category_api["Backendless categories"]
end

subgraph group_profiles["Doctor profiles"]
  node_doctor_api["Backendless doctors"]
  node_detail_page["Doctor detail page<br/>[page.jsx]"]
  node_doctor_detail["Doctor detail<br/>[DoctorDetail.jsx]"]
  node_suggestions["Doctor suggestions"]
end

subgraph group_identity["Authentication"]
  node_auth_route["Kinde auth route<br/>[route.js]"]
  node_auth_service["Kinde service"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_home
node_visitor -->|"selects category"| node_category_page
node_visitor -->|"opens profile"| node_detail_page
node_category_search -->|"fetches categories"| node_category_api
node_category_sidebar -->|"fetches categories"| node_category_api
node_search_layout -->|"renders sidebar"| node_category_sidebar
node_category_page -->|"renders list"| node_doctor_list
node_category_page -->|"fetches doctors"| node_doctor_api
node_detail_page -->|"renders detail"| node_doctor_detail
node_doctor_detail -->|"fetches profile"| node_doctor_api
node_detail_page -->|"renders suggestions"| node_suggestions
node_auth_route -->|"delegates auth"| node_auth_service

click node_home "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/page.js"
click node_category_search "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/_components/CategorySearch.jsx"
click node_category_sidebar "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/search/_components/CategoryList.jsx"
click node_search_layout "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/search/layout.jsx"
click node_category_page "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/search/%5Bcname%5D/page.jsx"
click node_doctor_list "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/_components/DoctorList.jsx"
click node_detail_page "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/details/%5Bid%5D/page.jsx"
click node_doctor_detail "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/details/%5Bid%5D/_components/DoctorDetail.jsx"
click node_suggestions "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/details/%5Bid%5D/_components/DoctorSuggestionList.jsx"
click node_auth_route "https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/api/auth/%5BkindeAuth%5D/route.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_category_search,node_category_sidebar,node_search_layout,node_category_page,node_doctor_list,node_category_api toneBlue
class node_doctor_api,node_detail_page,node_doctor_detail,node_suggestions toneAmber
class node_auth_route,node_auth_service toneMint
class node_visitor toneIndigo
```

## Components

### Doctor discovery

- [Home page](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/page.js): `app/page.js`
- [Category search](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/_components/CategorySearch.jsx): `app/_components/CategorySearch.jsx`
- [Category sidebar](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/search/_components/CategoryList.jsx): `app/(route)/search/_components/CategoryList.jsx`
- [Search layout](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/search/layout.jsx): `app/(route)/search/layout.jsx`
- [Category results](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/search/%5Bcname%5D/page.jsx): `app/(route)/search/[cname]/page.jsx`
- [Doctor list](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/_components/DoctorList.jsx): `app/_components/DoctorList.jsx`
- **Backendless categories**

### Doctor profiles

- **Backendless doctors**
- [Doctor detail page](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/details/%5Bid%5D/page.jsx): `app/(route)/details/[id]/page.jsx`
- [Doctor detail](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/details/%5Bid%5D/_components/DoctorDetail.jsx): `app/(route)/details/[id]/_components/DoctorDetail.jsx`
- [Doctor suggestions](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/(route)/details/%5Bid%5D/_components/DoctorSuggestionList.jsx): `app/(route)/details/[id]/_components/DoctorSuggestionList.jsx`

### Authentication

- [Kinde auth route](https://github.com/dwisusanto29/doctor_appointment_booking_app/blob/main/app/api/auth/%5BkindeAuth%5D/route.js): `app/api/auth/[kindeAuth]/route.js`
- **Kinde service**

### Other components

- **Visitor**

## Connections

- Visitor → Home page: opens
- Visitor → Category results: selects category
- Visitor → Doctor detail page: opens profile
- Category search → Backendless categories: fetches categories
- Category sidebar → Backendless categories: fetches categories
- Search layout → Category sidebar: renders sidebar
- Category results → Doctor list: renders list
- Category results → Backendless doctors: fetches doctors
- Doctor detail page → Doctor detail: renders detail
- Doctor detail → Backendless doctors: fetches profile
- Doctor detail page → Doctor suggestions: renders suggestions
- Kinde auth route → Kinde service: delegates auth
