# esde-seai8/fe07_recipebook architecture

> Architecture diagram of the GitHub repository esde-seai8/fe07_recipebook, 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/esde-seai8/fe07_recipebook
- Repository: https://github.com/esde-seai8/fe07_recipebook

## Overview

Recipe Book is a recipe discovery, creation, and personal-cookbook web app. Users browse or filter recipes, open a recipe for cooking instructions, and can register or sign in to save recipes and manage notes and ratings. The dashboard presents saved recipes; recipe and cookbook operations are handled by server actions and recipe APIs, with SQL persistence through a shared PostgreSQL pool. The graph follows documented routes and indexed imports; where implementation excerpts were unavailable, edges rely on README statements or SOURCE INDEX references.

Main entry points: [`src/features/recipes/server.js`](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/server.js) (Recipe data access), [`src/app/search/page.jsx`](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/search/page.jsx) (Recipe search), [`src/app/recipes/[id]/page.tsx`](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/recipes/%5Bid%5D/page.tsx) (Recipe detail), [`src/features/recipes/components/CookbookManager.jsx`](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/CookbookManager.jsx) (Cookbook manager)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["App experience"]
  node_home["Home page<br/>[page.tsx]"]
  node_dashboard["Cookbook dashboard<br/>[page.jsx]"]
  node_navbar["Session-aware navigation<br/>[Navbar.jsx]"]
end

subgraph group_recipes["Recipe discovery"]
  node_search["Recipe search<br/>[page.jsx]"]
  node_recipe_detail["Recipe detail<br/>[page.tsx]"]
  node_ingredient_checklist["Ingredient checklist"]
  node_recipe_cards["Recipe cards<br/>[RecipeCard.jsx]"]
  node_recipe_list["Recipe list<br/>[RecipesList.jsx]"]
  node_add_recipe["Add recipe form<br/>[AddRecipeForm.jsx]"]
  node_cookbook_save["Cookbook save"]
  node_cookbook_manager["Cookbook manager"]
  node_cookbook_item["Cookbook item"]
  node_recipe_queries["Recipe queries<br/>[queries.js]"]
  node_recipe_mutations["Recipe mutations<br/>[mutations.js]"]
  node_recipe_actions["Recipe actions<br/>[actions.js]"]
  node_recipe_server["Recipe data access<br/>[server.js]"]
  node_recipe_api["Recipe API routes<br/>[route.js]"]
end

subgraph group_identity["Identity"]
  node_auth_pages["Sign-in and registration<br/>[page.jsx]"]
  node_auth_forms["Auth forms<br/>[FormSignIn.jsx]"]
  node_auth_actions["Auth actions<br/>[actions.js]"]
  node_auth_server["Auth services<br/>[server.js]"]
  node_auth_api["Auth API routes<br/>[route.js]"]
end

subgraph group_persistence["Persistence"]
  node_database_client["PostgreSQL pool<br/>[db.js]"]
  node_postgres[("Neon PostgreSQL")]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_home
node_visitor -->|"searches"| node_search
node_visitor -->|"views"| node_recipe_detail
node_visitor -->|"signs in"| node_auth_pages
node_home -->|"loads recipes"| node_recipe_server
node_home -->|"renders"| node_recipe_cards
node_search -->|"queries"| node_recipe_queries
node_search -->|"mutates"| node_recipe_mutations
node_search -->|"renders"| node_recipe_list
node_search -->|"opens"| node_add_recipe
node_recipe_list -->|"renders"| node_recipe_cards
node_recipe_detail -->|"loads recipe"| node_recipe_server
node_recipe_detail -->|"renders"| node_ingredient_checklist
node_recipe_detail -->|"renders"| node_cookbook_save
node_cookbook_save -->|"saves recipe"| node_recipe_mutations
node_dashboard -->|"loads cookbook"| node_recipe_server
node_dashboard -->|"renders"| node_cookbook_manager
node_cookbook_manager -->|"renders"| node_cookbook_item
node_cookbook_manager -->|"opens"| node_add_recipe
node_cookbook_manager -->|"creates recipe"| node_recipe_mutations
node_auth_pages -->|"renders"| node_auth_forms
node_auth_forms -->|"submits"| node_auth_actions
node_auth_actions -->|"authenticates"| node_auth_server
node_auth_api -->|"uses"| node_auth_server
node_navbar -->|"fetches session"| node_auth_api
node_recipe_api -->|"calls"| node_recipe_server
node_recipe_mutations -->|"dispatches"| node_recipe_actions
node_recipe_actions -->|"updates data"| node_recipe_server
node_recipe_server -->|"queries"| node_database_client
node_auth_server -->|"queries"| node_database_client
node_database_client -->|"connects"| node_postgres

click node_home "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/page.tsx"
click node_search "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/search/page.jsx"
click node_recipe_detail "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/recipes/%5Bid%5D/page.tsx"
click node_ingredient_checklist "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/InteractiveIngredients.tsx"
click node_recipe_cards "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/RecipeCard.jsx"
click node_recipe_list "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/RecipesList.jsx"
click node_add_recipe "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/AddRecipeForm.jsx"
click node_cookbook_save "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/DetailCookbookSave.jsx"
click node_dashboard "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/dashboard/page.jsx"
click node_cookbook_manager "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/CookbookManager.jsx"
click node_cookbook_item "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/CookbookItemCard.jsx"
click node_recipe_queries "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/queries.js"
click node_recipe_mutations "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/mutations.js"
click node_recipe_actions "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/actions.js"
click node_recipe_server "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/server.js"
click node_recipe_api "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/api/recipes/route.js"
click node_auth_pages "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/(auth)/login/page.jsx"
click node_auth_forms "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/auth/components/FormSignIn.jsx"
click node_auth_actions "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/auth/actions.js"
click node_auth_server "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/auth/server.js"
click node_auth_api "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/api/auth/%5B...all%5D/route.js"
click node_navbar "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/components/Navbar.jsx"
click node_database_client "https://github.com/esde-seai8/fe07_recipebook/blob/main/src/lib/db.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_dashboard,node_navbar toneBlue
class node_search,node_recipe_detail,node_ingredient_checklist,node_recipe_cards,node_recipe_list,node_add_recipe,node_cookbook_save,node_cookbook_manager,node_cookbook_item,node_recipe_queries,node_recipe_mutations,node_recipe_actions,node_recipe_server,node_recipe_api toneAmber
class node_auth_pages,node_auth_forms,node_auth_actions,node_auth_server,node_auth_api toneMint
class node_database_client,node_postgres toneRose
class node_visitor toneIndigo
```

## Components

### App experience

- [Home page](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/page.tsx): `src/app/page.tsx`
- [Cookbook dashboard](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/dashboard/page.jsx): `src/app/dashboard/page.jsx`
- [Session-aware navigation](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/components/Navbar.jsx): `src/components/Navbar.jsx`

### Recipe discovery

- [Recipe search](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/search/page.jsx): `src/app/search/page.jsx`
- [Recipe detail](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/recipes/%5Bid%5D/page.tsx): `src/app/recipes/[id]/page.tsx`
- [Ingredient checklist](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/InteractiveIngredients.tsx): `src/features/recipes/components/InteractiveIngredients.tsx`
- [Recipe cards](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/RecipeCard.jsx): `src/features/recipes/components/RecipeCard.jsx`
- [Recipe list](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/RecipesList.jsx): `src/features/recipes/components/RecipesList.jsx`
- [Add recipe form](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/AddRecipeForm.jsx): `src/features/recipes/components/AddRecipeForm.jsx`
- [Cookbook save](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/DetailCookbookSave.jsx): `src/features/recipes/components/DetailCookbookSave.jsx`
- [Cookbook manager](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/CookbookManager.jsx): `src/features/recipes/components/CookbookManager.jsx`
- [Cookbook item](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/components/CookbookItemCard.jsx): `src/features/recipes/components/CookbookItemCard.jsx`
- [Recipe queries](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/queries.js): `src/features/recipes/queries.js`
- [Recipe mutations](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/mutations.js): `src/features/recipes/mutations.js`
- [Recipe actions](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/actions.js): `src/features/recipes/actions.js`
- [Recipe data access](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/recipes/server.js): `src/features/recipes/server.js`
- [Recipe API routes](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/api/recipes/route.js): `src/app/api/recipes/route.js`

### Identity

- [Sign-in and registration](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/(auth)/login/page.jsx): `src/app/(auth)/login/page.jsx`
- [Auth forms](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/auth/components/FormSignIn.jsx): `src/features/auth/components/FormSignIn.jsx`
- [Auth actions](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/auth/actions.js): `src/features/auth/actions.js`
- [Auth services](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/features/auth/server.js): `src/features/auth/server.js`
- [Auth API routes](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/app/api/auth/%5B...all%5D/route.js): `src/app/api/auth/[...all]/route.js`

### Persistence

- [PostgreSQL pool](https://github.com/esde-seai8/fe07_recipebook/blob/main/src/lib/db.js): `src/lib/db.js`
- **Neon PostgreSQL**

### Other components

- **Visitor**

## Connections

- Visitor → Home page: opens
- Visitor → Recipe search: searches
- Visitor → Recipe detail: views
- Visitor → Sign-in and registration: signs in
- Home page → Recipe data access: loads recipes (evidence: `src/app/page.tsx`)
- Home page → Recipe cards: renders (evidence: `src/app/page.tsx`)
- Recipe search → Recipe queries: queries (evidence: `src/app/search/page.jsx`)
- Recipe search → Recipe mutations: mutates (evidence: `src/app/search/page.jsx`)
- Recipe search → Recipe list: renders (evidence: `src/app/search/page.jsx`)
- Recipe search → Add recipe form: opens (evidence: `src/app/search/page.jsx`)
- Recipe list → Recipe cards: renders (evidence: `src/features/recipes/components/RecipesList.jsx`)
- Recipe detail → Recipe data access: loads recipe (evidence: `src/app/recipes/[id]/page.tsx`)
- Recipe detail → Ingredient checklist: renders (evidence: `src/app/recipes/[id]/page.tsx`)
- Recipe detail → Cookbook save: renders (evidence: `src/app/recipes/[id]/page.tsx`)
- Cookbook save → Recipe mutations: saves recipe (evidence: `src/features/recipes/components/DetailCookbookSave.jsx`)
- Cookbook dashboard → Recipe data access: loads cookbook (evidence: `src/app/dashboard/page.jsx`)
- Cookbook dashboard → Cookbook manager: renders (evidence: `src/app/dashboard/page.jsx`)
- Cookbook manager → Cookbook item: renders (evidence: `src/features/recipes/components/CookbookManager.jsx`)
- Cookbook manager → Add recipe form: opens (evidence: `src/features/recipes/components/CookbookManager.jsx`)
- Cookbook manager → Recipe mutations: creates recipe (evidence: `src/features/recipes/components/CookbookManager.jsx`)
- Sign-in and registration → Auth forms: renders (evidence: `src/app/(auth)/login/page.jsx`)
- Auth forms → Auth actions: submits (evidence: `src/features/auth/components/FormSignIn.jsx`)
- Auth actions → Auth services: authenticates (evidence: `src/features/auth/actions.js`)
- Auth API routes → Auth services: uses (evidence: `src/app/api/auth/[...all]/route.js`)
- Session-aware navigation → Auth API routes: fetches session (evidence: `src/components/Navbar.jsx`)
- Recipe API routes → Recipe data access: calls (evidence: `src/app/api/recipes/route.js`)
- Recipe mutations → Recipe actions: dispatches (evidence: `src/features/recipes/mutations.js`)
- Recipe actions → Recipe data access: updates data (evidence: `src/features/recipes/actions.js`)
- Recipe data access → PostgreSQL pool: queries (evidence: `src/features/recipes/server.js`)
- Auth services → PostgreSQL pool: queries (evidence: `src/features/auth/server.js`)
- PostgreSQL pool → Neon PostgreSQL: connects