ChefMind 🍳

Your personal AI chef — a premium, mobile-first PWA for recipe generation, meal planning, a smart fridge, grocery lists, nutrition tracking, and a distraction-free step-by-step cook mode.

Built with React + TypeScript + Tailwind + Framer Motion + Vite, AI by Groq (with key rotation), cloud storage by Supabase, and offline-first localStorage so it works on any phone — even before the cloud is wired up.

---

Quick start (local)

cd chefmind
cp .env.example .env     # already created for you with your Groq keys
npm install
npm run dev

Open the printed URL on your computer, or on your phone (same Wi-Fi) via http://<your-computer-ip>:5173. It's a PWA — tap Add to Home Screen to install it like a native app.

The app runs fully without any cloud setup: recipes generate via Groq and all data persists in your browser. Cloud sync + secure server-side keys are opt-in (below).

---

🔐 Security: about your Groq keys

Two transports are supported, chosen automatically:

Mode	When	Keys location	Safe for production?
direct	VITE_GROQ_KEYS set, no Supabase	bundled into the browser	❌ keys are visible to users
proxy	Supabase configured	Supabase Edge Function secret	✅ browser never sees them

.env is git-ignored. Anything starting with VITE_ ends up in the client bundle, so the direct mode is for local development only. For a real deployment, use the Supabase proxy described below and clear VITE_GROQ_KEYS.

⚠️ The two keys you provided were shared in plaintext — rotate them in the Groq console and put the fresh ones in Supabase secrets before going live.

Key rotation is built in: both transports round-robin across the keys and automatically retry on the next key when one hits a rate limit (HTTP 429) or a server error.

---

☁️ Cloud setup (Supabase) — "works without me"

This makes data sync across devices and keeps the Groq keys server-side.

1. Create a project at supabase.com (free tier).
2. Database → SQL Editor → paste & run supabase/schema.sql.
3. Get your keys: Project Settings → API → copy the Project URL and the anon public key into .env:

   VITE_SUPABASE_URL=https://YOUR-PROJECT.supabase.co
   VITE_SUPABASE_ANON_KEY=eyJ...
   

4. Deploy the Groq proxy (holds keys server-side, rotates them):

   npm i -g supabase
   supabase login
   supabase link --project-ref YOUR-PROJECT-REF
   supabase secrets set GROQ_KEYS="gsk_newkey1,gsk_newkey2"
   supabase functions deploy groq-proxy --no-verify-jwt

5. Remove VITE_GROQ_KEYS from .env — the app now routes AI through the secure proxy automatically. Done. The app runs entirely on the cloud.

The Settings screen shows live status: cloud sync on/off and which AI transport is active.

---

📱 Deploying the app

Any static host works (the build output is in dist/):

npm run build      # type-checks then builds
npm run preview    # preview the production build locally

Drag dist/ to Netlify, or connect the repo to Vercel / Cloudflare Pages. Add the same VITE_SUPABASE_* env vars in the host's dashboard. Because it's a PWA, it installs to the home screen and works offline.

---

Features

• AI recipe generator — dish, cuisine, or free description → full recipe, nutrition, timing, difficulty. Unknown dishes return "This recipe does not exist. Please enter another dish."
• Cook with ingredients — recipes from what you have, with substitutions and a missing-items list.
• Smart fridge — quantity + expiry tracking; one-tap "cook what's expiring".
• Weekly meal planner — 7-day plan with macros and an auto grocery list.
• Surprise me — instant random recipe.
• Grocery list — categorized, check-off, auto-built from recipes/plans.
• Nutrition analysis — calories, protein, carbs, fat, fiber, sodium with a macro donut.
• Dietary restrictions — vegetarian, vegan, gluten-free, dairy-free, nut-free, keto, high-protein — respected in every generation.
• Step-by-step cook mode — distraction-free guide with large steps, a per-step timer, and progress tracking.
• Smart autocorrect — every text field is spell-checked by Groq on entry, with one-tap undo.
• Personalization — favorite cuisines, default diet & servings, cooking history.
• Saved recipes & search — cookbook with filtering by cuisine/ingredient/diet.

Project structure

src/
  components/   # AppLayout, RecipeView, NutritionChart, ToastHost, common UI
  lib/          # groq (rotation), ai (prompts + autocorrect), supabase, config, util
  pages/        # Landing, Home, Generate, Ingredients, Fridge, Planner,
                #   Grocery, Saved, Search, Settings, RecipePreview, CookMode
  store.ts      # Zustand store (localStorage + cloud mirror)
  session.ts    # ephemeral UI state (active recipe, toasts)
supabase/
  schema.sql              # cloud storage table + RLS
  functions/groq-proxy/   # Edge Function: server-side keys + rotation