# aj110arjun/dinebook architecture

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

- Interactive diagram: https://gitdiagram.com/aj110arjun/dinebook
- Repository: https://github.com/aj110arjun/dinebook

## Overview

DineBook is a React frontend for restaurant discovery and customer account access, with a separate admin portal also present in the source tree. The main customer journey routes visitors through session-aware sign-in or registration to a curated discovery home; discovery content is sample data, and reservations are presentation-only. Customer credentials and session checks use a separately hosted API. The graph reflects documented routes and indexed imports; unsampled modules are represented only where the tree or README supports their role.

Main entry points: [`src/App.jsx`](https://github.com/aj110arjun/dinebook/blob/main/src/App.jsx) (Route table), [`src/pages/customer/CustomerLandingPage.jsx`](https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerLandingPage.jsx) (Discovery home), [`src/lib/authApi.js`](https://github.com/aj110arjun/dinebook/blob/main/src/lib/authApi.js) (Credentialed API client), [`src/pages/customer/CustomerRegisterPage.jsx`](https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerRegisterPage.jsx) (Account registration)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_routing["Routing and access"]
  node_app["Route table<br/>[App.jsx]"]
  node_guestguard["Guest guard<br/>[GuestOnlyRoute.jsx]"]
  node_customer_guard["Customer guard<br/>[ProtectedRoute.jsx]"]
  node_admin_guard["Admin guard"]
end

subgraph group_customer["Customer account"]
  node_login["Customer sign-in"]
  node_register["Account registration"]
  node_recovery["Recovery placeholder"]
  node_password["Password change"]
  node_verification["Email verification"]
  node_form_fields["Auth form fields<br/>[FormField.jsx]"]
  node_auth_layout["Customer auth layout<br/>[AuthLayout.jsx]"]
  node_notices["Form feedback<br/>[Notice.jsx]"]
  node_auth_api["Credentialed API client<br/>[authApi.js]"]
  node_demo_identity["Demo identity<br/>[demoCustomer.js]"]
end

subgraph group_discovery["Restaurant discovery"]
  node_customer_home["Discovery home"]
  node_header["Customer navigation<br/>[CustomerHeader.jsx]"]
  node_cuisines["Cuisine filters<br/>[CuisineGrid.jsx]"]
  node_restaurants["Restaurant sections"]
  node_dishes["Signature dishes<br/>[DishSection.jsx]"]
  node_discovery_content["Curated content<br/>[landingData.js]"]
  node_hero["Discovery hero<br/>[HeroBanner.jsx]"]
  node_offers["Offers banner<br/>[PromoBanner.jsx]"]
  node_how_it_works["How it works<br/>[HowItWorks.jsx]"]
  node_testimonials["Guest testimonials<br/>[Testimonials.jsx]"]
  node_footer["Landing footer<br/>[LandingFooter.jsx]"]
end

subgraph group_admin["Administration"]
  node_admin_login["Admin sign-in<br/>[AdminLoginPage.jsx]"]
  node_admin_dashboard["Admin dashboard"]
  node_admin_restaurants["Admin restaurants"]
  node_admin_layout["Admin layout<br/>[AdminLayout.jsx]"]
end

node_visitor(("Visitor"))
node_backend[("DineBook API")]

node_visitor -->|"opens routes"| node_app
node_app -->|"guards guests"| node_guestguard
node_app -->|"routes through"| node_customer_guard
node_app -->|"routes through"| node_admin_guard
node_app -->|"routes to"| node_login
node_app -->|"routes to"| node_register
node_app -->|"routes to"| node_recovery
node_app -->|"routes to"| node_password
node_app -->|"routes to"| node_verification
node_app -->|"routes to"| node_customer_home
node_app -->|"routes to"| node_admin_login
node_app -->|"routes to"| node_admin_dashboard
node_app -->|"routes to"| node_admin_restaurants
node_guestguard -->|"checks session"| node_auth_api
node_guestguard -->|"checks demo"| node_demo_identity
node_customer_guard -->|"checks session"| node_auth_api
node_customer_guard -->|"checks demo"| node_demo_identity
node_login -->|"submits credentials"| node_auth_api
node_register -->|"creates account"| node_auth_api
node_register -->|"navigates after"| node_verification
node_login -->|"renders within"| node_auth_layout
node_register -->|"renders within"| node_auth_layout
node_login -->|"renders fields"| node_form_fields
node_register -->|"renders fields"| node_form_fields
node_login -->|"renders feedback"| node_notices
node_register -->|"renders feedback"| node_notices
node_password -->|"checks and changes"| node_auth_api
node_verification -->|"uses API client"| node_auth_api
node_auth_api -->|"sends requests"| node_backend
node_customer_home -->|"checks session"| node_auth_api
node_customer_home -->|"uses preview identity"| node_demo_identity
node_customer_home -->|"renders"| node_header
node_customer_home -->|"renders"| node_cuisines
node_customer_home -->|"renders"| node_restaurants
node_customer_home -->|"renders"| node_dishes
node_customer_home -->|"renders"| node_hero
node_customer_home -->|"renders"| node_offers
node_customer_home -->|"renders"| node_how_it_works
node_customer_home -->|"renders"| node_testimonials
node_customer_home -->|"renders"| node_footer
node_customer_home -->|"filters content"| node_discovery_content
node_header -->|"logs out through"| node_auth_api
node_header -->|"checks demo session"| node_demo_identity
node_cuisines -->|"reads cuisines"| node_discovery_content
node_restaurants -->|"reads restaurant data"| node_discovery_content
node_dishes -->|"reads dishes"| node_discovery_content
node_admin_login -->|"submits credentials"| node_auth_api
node_admin_login -->|"renders fields"| node_form_fields

click node_app "https://github.com/aj110arjun/dinebook/blob/main/src/App.jsx"
click node_guestguard "https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/GuestOnlyRoute.jsx"
click node_customer_guard "https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/ProtectedRoute.jsx"
click node_admin_guard "https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/AdminProtectedRoute.jsx"
click node_login "https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerLoginPage.jsx"
click node_register "https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerRegisterPage.jsx"
click node_recovery "https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerRecoveryPage.jsx"
click node_password "https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerChangePasswordPage.jsx"
click node_verification "https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerEmailVerificationPage.jsx"
click node_form_fields "https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/FormField.jsx"
click node_auth_layout "https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/AuthLayout.jsx"
click node_notices "https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/Notice.jsx"
click node_auth_api "https://github.com/aj110arjun/dinebook/blob/main/src/lib/authApi.js"
click node_customer_home "https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerLandingPage.jsx"
click node_header "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/CustomerHeader.jsx"
click node_cuisines "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/CuisineGrid.jsx"
click node_restaurants "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/RestaurantSection.jsx"
click node_dishes "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/DishSection.jsx"
click node_discovery_content "https://github.com/aj110arjun/dinebook/blob/main/src/data/landingData.js"
click node_hero "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/HeroBanner.jsx"
click node_offers "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/PromoBanner.jsx"
click node_how_it_works "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/HowItWorks.jsx"
click node_testimonials "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/Testimonials.jsx"
click node_footer "https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/LandingFooter.jsx"
click node_demo_identity "https://github.com/aj110arjun/dinebook/blob/main/src/data/demoCustomer.js"
click node_admin_login "https://github.com/aj110arjun/dinebook/blob/main/src/pages/admin/AdminLoginPage.jsx"
click node_admin_dashboard "https://github.com/aj110arjun/dinebook/blob/main/src/pages/admin/AdminDashboardPage.jsx"
click node_admin_restaurants "https://github.com/aj110arjun/dinebook/blob/main/src/pages/admin/AdminRestaurantsPage.jsx"
click node_admin_layout "https://github.com/aj110arjun/dinebook/blob/main/src/components/admin/AdminLayout.jsx"

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_app,node_guestguard,node_customer_guard,node_admin_guard toneBlue
class node_login,node_register,node_recovery,node_password,node_verification,node_form_fields,node_auth_layout,node_notices,node_auth_api,node_demo_identity,node_backend toneAmber
class node_customer_home,node_header,node_cuisines,node_restaurants,node_dishes,node_discovery_content,node_hero,node_offers,node_how_it_works,node_testimonials,node_footer toneMint
class node_admin_login,node_admin_dashboard,node_admin_restaurants,node_admin_layout toneRose
class node_visitor toneIndigo
```

## Components

### Routing and access

- [Route table](https://github.com/aj110arjun/dinebook/blob/main/src/App.jsx): `src/App.jsx`
- [Guest guard](https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/GuestOnlyRoute.jsx): `src/components/auth/GuestOnlyRoute.jsx`
- [Customer guard](https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/ProtectedRoute.jsx): `src/components/auth/ProtectedRoute.jsx`
- [Admin guard](https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/AdminProtectedRoute.jsx): `src/components/auth/AdminProtectedRoute.jsx`

### Customer account

- [Customer sign-in](https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerLoginPage.jsx): `src/pages/customer/CustomerLoginPage.jsx`
- [Account registration](https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerRegisterPage.jsx): `src/pages/customer/CustomerRegisterPage.jsx`
- [Recovery placeholder](https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerRecoveryPage.jsx): `src/pages/customer/CustomerRecoveryPage.jsx`
- [Password change](https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerChangePasswordPage.jsx): `src/pages/customer/CustomerChangePasswordPage.jsx`
- [Email verification](https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerEmailVerificationPage.jsx): `src/pages/customer/CustomerEmailVerificationPage.jsx`
- [Auth form fields](https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/FormField.jsx): `src/components/auth/FormField.jsx`
- [Customer auth layout](https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/AuthLayout.jsx): `src/components/auth/AuthLayout.jsx`
- [Form feedback](https://github.com/aj110arjun/dinebook/blob/main/src/components/auth/Notice.jsx): `src/components/auth/Notice.jsx`
- [Credentialed API client](https://github.com/aj110arjun/dinebook/blob/main/src/lib/authApi.js): `src/lib/authApi.js`
- [Demo identity](https://github.com/aj110arjun/dinebook/blob/main/src/data/demoCustomer.js): `src/data/demoCustomer.js`

### Restaurant discovery

- [Discovery home](https://github.com/aj110arjun/dinebook/blob/main/src/pages/customer/CustomerLandingPage.jsx): `src/pages/customer/CustomerLandingPage.jsx`
- [Customer navigation](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/CustomerHeader.jsx): `src/components/landing/CustomerHeader.jsx`
- [Cuisine filters](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/CuisineGrid.jsx): `src/components/landing/CuisineGrid.jsx`
- [Restaurant sections](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/RestaurantSection.jsx): `src/components/landing/RestaurantSection.jsx`
- [Signature dishes](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/DishSection.jsx): `src/components/landing/DishSection.jsx`
- [Curated content](https://github.com/aj110arjun/dinebook/blob/main/src/data/landingData.js): `src/data/landingData.js`
- [Discovery hero](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/HeroBanner.jsx): `src/components/landing/HeroBanner.jsx`
- [Offers banner](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/PromoBanner.jsx): `src/components/landing/PromoBanner.jsx`
- [How it works](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/HowItWorks.jsx): `src/components/landing/HowItWorks.jsx`
- [Guest testimonials](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/Testimonials.jsx): `src/components/landing/Testimonials.jsx`
- [Landing footer](https://github.com/aj110arjun/dinebook/blob/main/src/components/landing/LandingFooter.jsx): `src/components/landing/LandingFooter.jsx`

### Administration

- [Admin sign-in](https://github.com/aj110arjun/dinebook/blob/main/src/pages/admin/AdminLoginPage.jsx): `src/pages/admin/AdminLoginPage.jsx`
- [Admin dashboard](https://github.com/aj110arjun/dinebook/blob/main/src/pages/admin/AdminDashboardPage.jsx): `src/pages/admin/AdminDashboardPage.jsx`
- [Admin restaurants](https://github.com/aj110arjun/dinebook/blob/main/src/pages/admin/AdminRestaurantsPage.jsx): `src/pages/admin/AdminRestaurantsPage.jsx`
- [Admin layout](https://github.com/aj110arjun/dinebook/blob/main/src/components/admin/AdminLayout.jsx): `src/components/admin/AdminLayout.jsx`

### Other components

- **Visitor**
- **DineBook API**

## Connections

- Visitor → Route table: opens routes (evidence: `src/App.jsx`)
- Route table → Guest guard: guards guests (evidence: `src/App.jsx`)
- Route table → Customer guard: routes through (evidence: `src/App.jsx`)
- Route table → Admin guard: routes through (evidence: `src/App.jsx`)
- Route table → Customer sign-in: routes to (evidence: `src/App.jsx`)
- Route table → Account registration: routes to (evidence: `src/App.jsx`)
- Route table → Recovery placeholder: routes to (evidence: `src/App.jsx`)
- Route table → Password change: routes to (evidence: `src/App.jsx`)
- Route table → Email verification: routes to (evidence: `src/App.jsx`)
- Route table → Discovery home: routes to (evidence: `src/App.jsx`)
- Route table → Admin sign-in: routes to (evidence: `src/App.jsx`)
- Route table → Admin dashboard: routes to (evidence: `src/App.jsx`)
- Route table → Admin restaurants: routes to (evidence: `src/App.jsx`)
- Guest guard → Credentialed API client: checks session (evidence: `src/components/auth/GuestOnlyRoute.jsx`)
- Guest guard → Demo identity: checks demo (evidence: `src/components/auth/GuestOnlyRoute.jsx`)
- Customer guard → Credentialed API client: checks session (evidence: `src/components/auth/ProtectedRoute.jsx`)
- Customer guard → Demo identity: checks demo (evidence: `src/components/auth/ProtectedRoute.jsx`)
- Customer sign-in → Credentialed API client: submits credentials (evidence: `src/pages/customer/CustomerLoginPage.jsx`)
- Account registration → Credentialed API client: creates account (evidence: `src/pages/customer/CustomerRegisterPage.jsx`)
- Account registration → Email verification: navigates after (evidence: `src/pages/customer/CustomerRegisterPage.jsx`)
- Customer sign-in → Customer auth layout: renders within (evidence: `src/pages/customer/CustomerLoginPage.jsx`)
- Account registration → Customer auth layout: renders within (evidence: `src/pages/customer/CustomerRegisterPage.jsx`)
- Customer sign-in → Auth form fields: renders fields (evidence: `src/pages/customer/CustomerLoginPage.jsx`)
- Account registration → Auth form fields: renders fields (evidence: `src/pages/customer/CustomerRegisterPage.jsx`)
- Customer sign-in → Form feedback: renders feedback (evidence: `src/pages/customer/CustomerLoginPage.jsx`)
- Account registration → Form feedback: renders feedback (evidence: `src/pages/customer/CustomerRegisterPage.jsx`)
- Password change → Credentialed API client: checks and changes (evidence: `README.md`)
- Email verification → Credentialed API client: uses API client (evidence: `src/pages/customer/CustomerEmailVerificationPage.jsx`)
- Credentialed API client → DineBook API: sends requests (evidence: `README.md`)
- Discovery home → Credentialed API client: checks session (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Demo identity: uses preview identity (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Customer navigation: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Cuisine filters: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Restaurant sections: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Signature dishes: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Discovery hero: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Offers banner: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → How it works: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Guest testimonials: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Landing footer: renders (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Discovery home → Curated content: filters content (evidence: `src/pages/customer/CustomerLandingPage.jsx`)
- Customer navigation → Credentialed API client: logs out through (evidence: `src/components/landing/CustomerHeader.jsx`)
- Customer navigation → Demo identity: checks demo session (evidence: `src/components/landing/CustomerHeader.jsx`)
- Cuisine filters → Curated content: reads cuisines (evidence: `src/components/landing/CuisineGrid.jsx`)
- Restaurant sections → Curated content: reads restaurant data
- Signature dishes → Curated content: reads dishes (evidence: `src/components/landing/DishSection.jsx`)
- Admin sign-in → Credentialed API client: submits credentials (evidence: `src/pages/admin/AdminLoginPage.jsx`)
- Admin sign-in → Auth form fields: renders fields (evidence: `src/pages/admin/AdminLoginPage.jsx`)