# johnpbell7/whats_in_my_fridge architecture

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

- Interactive diagram: https://gitdiagram.com/johnpbell7/whats_in_my_fridge
- Repository: https://github.com/johnpbell7/whats_in_my_fridge

## Overview

Fridge is a phone-friendly fridge inventory PWA: users track food and expiry, then use scans or meal/chat suggestions to decide what to cook or buy. The main flow runs through the app shell into inventory, shopping, scan, or chat features, with browser-backed state and optional account sync. The server exposes AI, account, and billing operations. The README documents photo/receipt recognition and production serverless handlers; their detailed implementation wiring is not fully sampled, so those links are kept at the documented boundary.

Main entry points: [`src/App.jsx`](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/App.jsx) (App shell), [`server/index.js`](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/index.js) (Local API), [`src/lib/api.js`](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/api.js) (API client), [`server/core.js`](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/core.js) (AI handlers)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["App experience"]
  node_app["App shell<br/>[App.jsx]"]
end

subgraph group_food["Food workflows"]
  node_inventory["Inventory"]
  node_scan["Photo scan<br/>[ScanScreen.jsx]"]
  node_chat["Meal chat<br/>[ChatScreen.jsx]"]
  node_shopping["Shopping list<br/>[ShoppingScreen.jsx]"]
  node_saved["Saved meals<br/>[SavedMeals.jsx]"]
end

subgraph group_state["State and accounts"]
  node_store[("Inventory store<br/>[store.js]")]
  node_shoppingstate[("Shopping state<br/>[shopping.js]")]
  node_cloud["Cloud sync<br/>[cloud.js]"]
  node_auth["Auth state<br/>[useAuth.js]"]
end

subgraph group_backend["API and AI"]
  node_clientapi["API client<br/>[api.js]"]
  node_localapi["Local API<br/>[index.js]"]
  node_handlers["AI handlers<br/>[core.js]"]
  node_accounting["Usage and accounts<br/>[auth.js]"]
  node_billing["Billing handlers<br/>[stripe.js]"]
  node_serverless["Production API"]
end

subgraph group_services["External services"]
  node_supabase[("Supabase<br/>[supabase.js]")]
  node_anthropic["Anthropic Claude"]
  node_stripe["Stripe"]
end

node_person(("Fridge user"))

node_person -->|"uses"| node_app
node_app -->|"opens"| node_inventory
node_app -->|"opens"| node_scan
node_app -->|"opens"| node_chat
node_app -->|"opens"| node_shopping
node_app -->|"opens"| node_saved
node_app -->|"initializes"| node_store
node_app -->|"initializes"| node_shoppingstate
node_inventory -->|"reads and updates"| node_store
node_scan -->|"requests recognition"| node_clientapi
node_chat -->|"requests suggestions"| node_clientapi
node_shopping -->|"reads and updates"| node_shoppingstate
node_clientapi -->|"sends requests"| node_localapi
node_localapi -->|"dispatches AI calls"| node_handlers
node_localapi -->|"checks accounts"| node_accounting
node_localapi -->|"dispatches billing"| node_billing
node_handlers -->|"calls models"| node_anthropic
node_accounting -->|"verifies and meters"| node_supabase
node_auth -->|"reads session"| node_supabase
node_cloud -.->|"syncs data"| node_supabase
node_serverless -.->|"exposes handlers"| node_handlers
node_serverless -.->|"exposes billing"| node_billing
node_billing -->|"manages payments"| node_stripe

click node_app "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/App.jsx"
click node_inventory "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/InventoryScreen.jsx"
click node_scan "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/ScanScreen.jsx"
click node_chat "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/ChatScreen.jsx"
click node_shopping "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/ShoppingScreen.jsx"
click node_saved "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/SavedMeals.jsx"
click node_clientapi "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/api.js"
click node_store "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/store.js"
click node_shoppingstate "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/shopping.js"
click node_cloud "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/cloud.js"
click node_auth "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/useAuth.js"
click node_supabase "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/supabase.js"
click node_localapi "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/index.js"
click node_handlers "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/core.js"
click node_accounting "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/auth.js"
click node_billing "https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/stripe.js"
click node_serverless "https://github.com/johnpbell7/whats_in_my_fridge/tree/main/api"

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_person toneBlue
class node_inventory,node_scan,node_chat,node_shopping,node_saved toneAmber
class node_store,node_shoppingstate,node_cloud,node_auth toneMint
class node_clientapi,node_localapi,node_handlers,node_accounting,node_billing,node_serverless toneRose
class node_supabase,node_anthropic,node_stripe toneIndigo
```

## Components

### App experience

- [App shell](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/App.jsx): `src/App.jsx`

### Food workflows

- [Inventory](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/InventoryScreen.jsx): `src/components/InventoryScreen.jsx`
- [Photo scan](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/ScanScreen.jsx): `src/components/ScanScreen.jsx`
- [Meal chat](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/ChatScreen.jsx): `src/components/ChatScreen.jsx`
- [Shopping list](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/ShoppingScreen.jsx): `src/components/ShoppingScreen.jsx`
- [Saved meals](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/components/SavedMeals.jsx): `src/components/SavedMeals.jsx`

### State and accounts

- [Inventory store](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/store.js): `src/lib/store.js`
- [Shopping state](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/shopping.js): `src/lib/shopping.js`
- [Cloud sync](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/cloud.js): `src/lib/cloud.js`
- [Auth state](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/useAuth.js): `src/lib/useAuth.js`

### API and AI

- [API client](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/api.js): `src/lib/api.js`
- [Local API](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/index.js): `server/index.js`
- [AI handlers](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/core.js): `server/core.js`
- [Usage and accounts](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/auth.js): `server/auth.js`
- [Billing handlers](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/server/stripe.js): `server/stripe.js`
- [Production API](https://github.com/johnpbell7/whats_in_my_fridge/tree/main/api): `api`

### External services

- [Supabase](https://github.com/johnpbell7/whats_in_my_fridge/blob/main/src/lib/supabase.js): `src/lib/supabase.js`
- **Anthropic Claude**
- **Stripe**

### Other components

- **Fridge user**

## Connections

- Fridge user → App shell: uses
- App shell → Inventory: opens
- App shell → Photo scan: opens
- App shell → Meal chat: opens
- App shell → Shopping list: opens
- App shell → Saved meals: opens
- App shell → Inventory store: initializes
- App shell → Shopping state: initializes
- Inventory → Inventory store: reads and updates
- Photo scan → API client: requests recognition
- Meal chat → API client: requests suggestions
- Shopping list → Shopping state: reads and updates
- API client → Local API: sends requests
- Local API → AI handlers: dispatches AI calls
- Local API → Usage and accounts: checks accounts
- Local API → Billing handlers: dispatches billing
- AI handlers → Anthropic Claude: calls models
- Usage and accounts → Supabase: verifies and meters
- Auth state → Supabase: reads session
- Cloud sync → Supabase: syncs data
- Production API → AI handlers: exposes handlers
- Production API → Billing handlers: exposes billing
- Billing handlers → Stripe: manages payments