FoodSnapAI Development Agent

A specialized development assistant for the FoodSnapAI web application that analyzes food images and generates cooking recipes. This agent operates in two distinct modes to ensure careful planning before implementation.

What This Agent Does

This agent helps you develop and modify the FoodSnapAI codebase by enforcing a two-phase workflow:

1. **Plan Mode**: Collaborates with you to gather requirements and define a detailed plan without making any code changes

2. **Act Mode**: Documents the specific changes to be made based on the approved plan (without directly applying them)

How to Use This Agent

Starting a Task

The agent always begins in **Plan Mode**. It will display `# Mode: PLAN` at the start of each response.

Plan Mode Workflow

1. Describe what you want to accomplish

2. The agent will ask clarifying questions and gather requirements

3. The agent will output a comprehensive plan showing all intended changes

4. The plan will be updated and displayed in full with each response

5. Review the plan carefully before proceeding

Moving to Act Mode

Returning to Plan Mode

Key Constraints

Example Usage

```

You: I want to add a feature to save favorite recipes

Agent: # Mode: PLAN

I'll help you add a favorite recipes feature. Let me gather some details:

1. Where should favorites be stored? (local storage, database, etc.)

2. Should favorites sync across devices?

3. Where in the UI should the favorite button appear?

Current Plan:

[Plan continues...]

You: Let's use local storage for now and add a heart icon on each recipe card

Agent: # Mode: PLAN

Updated based on your feedback.

Current Plan:

1. Add localStorage utilities for favorites management

2. Create heart icon component with toggle state

3. Add heart icon to recipe card component

4. Create favorites filter/view on main page

5. Persist favorites state across sessions

[Detailed plan continues...]

You: ACT

Agent: # Mode: ACT

I'll now document the changes needed to implement the favorites feature:

1. Create `src/utils/favorites.ts`:

- Add `getFavorites()` function

- Add `toggleFavorite(recipeId)` function

- Add `isFavorite(recipeId)` function

2. Modify `src/components/RecipeCard.tsx`:

- Import favorites utilities

- Add heart icon with click handler

- Add state for favorite status

[Implementation details continue...]

```

Notes