# pritam844/sank-hack architecture

> Architecture diagram of the GitHub repository pritam844/sank-hack, 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/pritam844/sank-hack
- Repository: https://github.com/pritam844/sank-hack

## Overview

Fridge2Table turns a user’s leftover ingredients into ranked rescue recipes, then supports recipe details, grocery ordering, and saved favorites. The main search flow is visible in the sampled App and service code; the README documents additional sorting, shopping, and saved-recipe capabilities. Some component wiring is unsampled, so the graph includes documented UI branches but avoids inferring their internal calls.

Main entry points: [`src/App.jsx`](https://github.com/pritam844/sank-hack/blob/main/src/App.jsx) (App state), [`src/services/api.js`](https://github.com/pritam844/sank-hack/blob/main/src/services/api.js) (Recipe API service), [`src/components/RecipeCard.jsx`](https://github.com/pritam844/sank-hack/blob/main/src/components/RecipeCard.jsx) (Recipe card), [`src/components/RecipeModal.jsx`](https://github.com/pritam844/sank-hack/blob/main/src/components/RecipeModal.jsx) (Recipe details)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Recipe experience"]
  node_root["React entry<br/>[main.jsx]"]
  node_app["App state<br/>[App.jsx]"]
  node_ingredient["Ingredient input"]
  node_grid["Recipe results<br/>[RecipeGrid.jsx]"]
  node_card["Recipe card<br/>[RecipeCard.jsx]"]
  node_modal["Recipe details<br/>[RecipeModal.jsx]"]
  node_missing["Grocery links"]
  node_tips["Rescue tips<br/>[RescueTips.jsx]"]
  node_header["Header navigation<br/>[Header.jsx]"]
  node_bottomnav["Bottom navigation<br/>[BottomNav.jsx]"]
  node_footer["Footer<br/>[Footer.jsx]"]
end

subgraph group_matching["Recipe matching"]
  node_api["Recipe API service<br/>[api.js]"]
  node_localmatch["Local matching<br/>[recipeDatabase.js]"]
end

subgraph group_favorites["Saved favorites"]
  node_savedui["Saved recipes<br/>[SavedRecipes.jsx]"]
  node_firebaseinit["Firebase setup<br/>[firebase.js]"]
end

subgraph group_integrations["External services"]
  node_firebase[("Realtime Database")]
  node_spoonacular["Spoonacular API"]
  node_browser[("Browser storage")]
  node_grocers["Grocery platforms"]
end

node_user(("Home cook"))

node_user -->|"enters ingredients"| node_ingredient
node_root -->|"renders"| node_app
node_ingredient -->|"submits ingredients"| node_app
node_app -->|"requests matches"| node_api
node_api -->|"queries recipes"| node_spoonacular
node_api -->|"falls back"| node_localmatch
node_localmatch -->|"returns matches"| node_api
node_spoonacular -->|"returns recipes"| node_api
node_app -->|"shows results"| node_grid
node_grid -->|"renders cards"| node_card
node_card -->|"selects or saves"| node_app
node_app -->|"opens recipe"| node_modal
node_modal -->|"requests details"| node_api
node_modal -->|"shows missing items"| node_missing
node_card -->|"shows missing items"| node_missing
node_missing -->|"opens ingredient search"| node_grocers
node_app -->|"shows favorites"| node_savedui
node_app -->|"uses database setup"| node_firebaseinit
node_firebaseinit -->|"initializes connection"| node_firebase
node_app -->|"syncs favorites"| node_firebase
node_app -.->|"uses offline fallback"| node_browser
node_app -->|"renders navigation"| node_header
node_app -->|"renders navigation"| node_bottomnav
node_app -->|"shows tips tab"| node_tips
node_app -->|"renders footer"| node_footer

click node_root "https://github.com/pritam844/sank-hack/blob/main/src/main.jsx"
click node_app "https://github.com/pritam844/sank-hack/blob/main/src/App.jsx"
click node_ingredient "https://github.com/pritam844/sank-hack/blob/main/src/components/IngredientInput.jsx"
click node_grid "https://github.com/pritam844/sank-hack/blob/main/src/components/RecipeGrid.jsx"
click node_card "https://github.com/pritam844/sank-hack/blob/main/src/components/RecipeCard.jsx"
click node_modal "https://github.com/pritam844/sank-hack/blob/main/src/components/RecipeModal.jsx"
click node_missing "https://github.com/pritam844/sank-hack/blob/main/src/components/MissingIngredientItem.jsx"
click node_savedui "https://github.com/pritam844/sank-hack/blob/main/src/components/SavedRecipes.jsx"
click node_tips "https://github.com/pritam844/sank-hack/blob/main/src/components/RescueTips.jsx"
click node_header "https://github.com/pritam844/sank-hack/blob/main/src/components/Header.jsx"
click node_bottomnav "https://github.com/pritam844/sank-hack/blob/main/src/components/BottomNav.jsx"
click node_footer "https://github.com/pritam844/sank-hack/blob/main/src/components/Footer.jsx"
click node_api "https://github.com/pritam844/sank-hack/blob/main/src/services/api.js"
click node_localmatch "https://github.com/pritam844/sank-hack/blob/main/src/services/recipeDatabase.js"
click node_firebaseinit "https://github.com/pritam844/sank-hack/blob/main/src/firebase.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_root,node_app,node_ingredient,node_grid,node_card,node_modal,node_missing,node_tips,node_header,node_bottomnav,node_footer toneBlue
class node_api,node_localmatch toneAmber
class node_savedui,node_firebaseinit toneMint
class node_firebase,node_spoonacular,node_browser,node_grocers toneRose
class node_user toneIndigo
```

## Components

### Recipe experience

- [React entry](https://github.com/pritam844/sank-hack/blob/main/src/main.jsx): `src/main.jsx`
- [App state](https://github.com/pritam844/sank-hack/blob/main/src/App.jsx): `src/App.jsx`
- [Ingredient input](https://github.com/pritam844/sank-hack/blob/main/src/components/IngredientInput.jsx): `src/components/IngredientInput.jsx`
- [Recipe results](https://github.com/pritam844/sank-hack/blob/main/src/components/RecipeGrid.jsx): `src/components/RecipeGrid.jsx`
- [Recipe card](https://github.com/pritam844/sank-hack/blob/main/src/components/RecipeCard.jsx): `src/components/RecipeCard.jsx`
- [Recipe details](https://github.com/pritam844/sank-hack/blob/main/src/components/RecipeModal.jsx): `src/components/RecipeModal.jsx`
- [Grocery links](https://github.com/pritam844/sank-hack/blob/main/src/components/MissingIngredientItem.jsx): `src/components/MissingIngredientItem.jsx`
- [Rescue tips](https://github.com/pritam844/sank-hack/blob/main/src/components/RescueTips.jsx): `src/components/RescueTips.jsx`
- [Header navigation](https://github.com/pritam844/sank-hack/blob/main/src/components/Header.jsx): `src/components/Header.jsx`
- [Bottom navigation](https://github.com/pritam844/sank-hack/blob/main/src/components/BottomNav.jsx): `src/components/BottomNav.jsx`
- [Footer](https://github.com/pritam844/sank-hack/blob/main/src/components/Footer.jsx): `src/components/Footer.jsx`

### Recipe matching

- [Recipe API service](https://github.com/pritam844/sank-hack/blob/main/src/services/api.js): `src/services/api.js`
- [Local matching](https://github.com/pritam844/sank-hack/blob/main/src/services/recipeDatabase.js): `src/services/recipeDatabase.js`

### Saved favorites

- [Saved recipes](https://github.com/pritam844/sank-hack/blob/main/src/components/SavedRecipes.jsx): `src/components/SavedRecipes.jsx`
- [Firebase setup](https://github.com/pritam844/sank-hack/blob/main/src/firebase.js): `src/firebase.js`

### External services

- **Realtime Database**
- **Spoonacular API**
- **Browser storage**
- **Grocery platforms**

### Other components

- **Home cook**

## Connections

- Home cook → Ingredient input: enters ingredients
- React entry → App state: renders
- Ingredient input → App state: submits ingredients
- App state → Recipe API service: requests matches
- Recipe API service → Spoonacular API: queries recipes
- Recipe API service → Local matching: falls back
- Local matching → Recipe API service: returns matches
- Spoonacular API → Recipe API service: returns recipes
- App state → Recipe results: shows results
- Recipe results → Recipe card: renders cards
- Recipe card → App state: selects or saves
- App state → Recipe details: opens recipe
- Recipe details → Recipe API service: requests details
- Recipe details → Grocery links: shows missing items
- Recipe card → Grocery links: shows missing items
- Grocery links → Grocery platforms: opens ingredient search
- App state → Saved recipes: shows favorites
- App state → Firebase setup: uses database setup
- Firebase setup → Realtime Database: initializes connection
- App state → Realtime Database: syncs favorites
- App state → Browser storage: uses offline fallback
- App state → Header navigation: renders navigation
- App state → Bottom navigation: renders navigation
- App state → Rescue tips: shows tips tab
- App state → Footer: renders footer