Make a Recipe – Implementation Status

Make a Recipe – Implementation Status

Implementation of the Make a Recipe user story, phased for incremental delivery.

Phase 1: Ingredient availability check ✅ (Mar 2026)

• Entry: Recipe detail → “Make This Recipe” → navigates to /(tabs)/recipes/make/[id].
• Screen: shaker/app/(tabs)/recipes/make/[id]/index.tsx
  • Shows recipe name and short summary.
  • For each recipe ingredient:
    • Status: In stock / Low / Missing / Unknown.
    • Required: quantity + unit from recipe.
    • Available: from inventory (via ingredient → product mapping and unit conversion).
    • “Enough for X drinks” when applicable.
  • Overall: “You can make N drinks with current stock” or “Some ingredients are missing or low.”
• Actions:
  • Proceed to make: If any ingredient has 2+ instances → select-instances screen; else → steps. Step-by-step mode in Phase 3.
  • Add N missing to shopping list: Adds missing/low ingredients to default list sl-1 (name, quantity, unit, ingredientId), then shows confirmation and goes back.
  • Cancel: Pops the screen.
• Data:
  • shaker/utils/recipeAvailability.ts: getRecipeAvailability(recipe) → per-ingredient availability and overallDrinksPossible.
  • shaker/utils/inventoryComparison.ts: compareRecipeIngredientWithInventory(), findMatchingProductsForNameAndIngredient() (reused for recipe ingredients).

Phase 2: Product instance selection ✅ (Mar 2026)

• Screen: make/[id]/select-instances.tsx. Shown when ≥1 ingredient has 2+ non-empty instances.
• Per ingredient: instances with fill %, location, status, opened date; user selects one. “Start making” → steps with selections JSON.

Phase 3: Step-by-step making mode ✅ (Mar 2026)

• Screen: make/[id]/steps.tsx. Steps = ingredients then instructions; Step N of M, progress dots, Prev/Next.
• Ingredient step: name, qty, which bottle, Mark as added. Instruction step: text, optional timer (e.g. “Step 2 of 5”), prev/next, check-off for ingredients, optional timers for instructions.
• Finish drink shows alert: Make another or Back to recipe (inventory deduction in Phase 4).

Phase 4: Inventory deduction and completion ✅ (Mar 2026)

• On “mark complete”: convert recipe units to inventory units, deduct from selected instance or quantity tracking.
• Update fill level / quantity; record what was consumed; show success and remaining quantities.
• Low-stock warnings before/after completion.

Phase 5: Make another, low-stock warnings, errors ✅ (Mar 2026)

• “Make another” of same recipe in session; re-check availability and instance selection.
• Optional recipe-making history (list, filters).
• Error handling (e.g. bottle empty mid-drink, substitute suggestions).

Files touched (Phase 1)

Area	File(s)
Entry	shaker/app/(tabs)/recipes/[id].tsx – handleMakeRecipe navigates to make flow
Make flow	make/[id]/index.tsx, make/[id]/select-instances.tsx, make/[id]/steps.tsx, make/[id]/complete.tsx, make/[id]/completionStore.ts
Consumption	shaker/utils/recipeConsumption.ts – applyRecipeConsumption, getLowStockWarningsAfterConsumption
Layout	shaker/app/(tabs)/recipes/_layout.tsx – Stack screen for make/[id]
Availability	shaker/utils/recipeAvailability.ts – getRecipeAvailability()
Comparison	shaker/utils/inventoryComparison.ts – compareRecipeIngredientWithInventory(), findMatchingProductsForNameAndIngredient()
Shopping	shaker/data/shopping-lists – addItem() used for “Add missing to list”