paulh
/
recipe-manager
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
recipe-manager/TODO.md

7.1 KiB
Raw Blame History

TODO — Recipe Manager

Last Updated: 2026-03-24
Current Milestone: MVP (v0.1)

🎯 Active Tasks

Backend Setup

  • Initialize Node.js backend: Create src/backend/, package.json with express, better-sqlite3, zod, vitest. Create src/backend/index.ts with "Hello World" server on port 3000. Verify: npm install && npm run dev (server starts). Commit as "feat(backend): initialize Node.js project with Express"
  • Set up TypeScript: Create tsconfig.json (strict mode, ES2022, Node16 module resolution). Add build script to package.json. Verify: npm run build succeeds. Commit.
  • Create SQLite schema: Create src/backend/db/schema.sql with recipes, tags, recipe_tags tables per ARCHITECTURE.md. Create src/backend/db/migrate.ts to apply schema using sql.js (see ADR-001). Verify: npm run migrate creates data/recipes.db. Commit.
  • Implement recipe CRUD API endpoints
  • Add Zod validation schemas
  • Write API integration tests

Frontend Setup

  • Initialize React + Vite project
  • Configure Tailwind CSS
  • Set up React Router
  • Create recipe list page
  • Create recipe detail/edit page
  • Implement cook mode UI

Features

  • Tag management (create, assign, filter)
  • Text search (title + ingredients)
  • Basic error handling + loading states

DevOps

  • Create Dockerfile for backend
  • Create Dockerfile for frontend (nginx)
  • Write docker-compose.yml
  • Test local deployment

Documentation

  • Write API documentation (docs/api.md)
  • Create user guide (docs/user-guide.md)
  • Add setup instructions to README
  • Document first architecture decisions (ADRs)

✅ Completed Tasks

2026-03-24

  • Tag management implementation

    • Backend: Created Tag types, TagRepository, TagService
    • Backend: Implemented tag CRUD API endpoints (GET, POST, PUT, DELETE /api/tags)
    • Backend: Implemented tag assignment endpoints (POST/DELETE /api/tags/recipes/:id/tags)
    • Backend: Added 18 integration tests for tag functionality (all passing)
    • Frontend: Updated API client with tag methods
    • Frontend: Created useTags hook for tag state management
    • Frontend: Created TagSelector component for tag selection in forms
    • Frontend: Updated RecipeForm to support tag assignment
    • Frontend: Updated RecipeDetailPage to display and manage recipe tags
    • Frontend: Updated RecipeCard to display tags
    • Frontend: Added tag filter UI to RecipeListPage (note: full filtering pending backend support)
    • Verified: All 34 backend tests passing (16 recipe tests + 18 tag tests)
    • Verified: Frontend builds successfully with TypeScript compilation

  • Cook mode UI implementation

    • Implemented full cooking interface with ingredient and step checklists
    • Added progress tracking with visual progress bars
    • Integrated Screen Wake Lock API to prevent screen sleep during cooking
    • Created touch-friendly UI with large text and clear spacing
    • Added completion celebration when all steps are done
    • Included loading and error states with navigation back to recipe detail
    • Verified TypeScript compilation and Vite build succeed

  • Recipe detail/edit page implementation

    • Created useRecipe hook for fetching single recipe with loading/error states
    • Created RecipeForm component with full validation (title, ingredients, instructions required)
    • Implemented RecipeDetailPage with view/edit modes
    • Added create new recipe functionality (/recipe/new route)
    • Implemented edit existing recipe with form pre-population
    • Added delete recipe with confirmation dialog
    • Included metadata display (servings, prep time, cook time)
    • Added navigation to cook mode and back to list
    • Verified TypeScript compilation and Vite build succeed

  • Recipe list page implementation

    • Created API client service (src/services/api.ts) with all CRUD operations
    • Created useRecipes hook for data fetching with search and pagination
    • Created RecipeCard component for displaying individual recipes
    • Implemented RecipeListPage with search bar, empty state, loading state, error handling
    • Added grid layout with responsive design (1-3 columns)
    • Implemented "Load More" button for pagination
    • Added recipe count display and meta information (servings, time, last cooked)
    • Verified TypeScript compilation and Vite build succeed

  • React Router setup

    • Updated main.tsx to wrap App in BrowserRouter
    • Configured routes in App.tsx with navigation header
    • Created page components: RecipeListPage, RecipeDetailPage, CookModePage, NotFoundPage
    • Added active link highlighting in navigation
    • Defined routes: / (list), /recipe/new, /recipe/:id, /recipe/:id/cook, * (404)
    • Verified build and dev server work correctly

  • Tailwind CSS configuration

    • Installed Tailwind CSS v4 with PostCSS and Autoprefixer
    • Installed @tailwindcss/postcss plugin for v4 compatibility
    • Created tailwind.config.js with content paths
    • Created postcss.config.js with Tailwind and Autoprefixer
    • Updated index.css with Tailwind directives
    • Updated App.tsx to demonstrate Tailwind utility classes
    • Verified build and dev server work correctly

  • Frontend initialization

    • Created frontend/ directory with Vite + React + TypeScript
    • Installed React Router 7
    • Set up project structure (components/, hooks/, pages/, services/, types/)
    • Created Recipe and Tag TypeScript interfaces
    • Verified dev server starts successfully on port 5173
    • Added frontend README with development instructions

  • Recipe CRUD API implementation (commit e2599b8)

    • Implemented GET /api/recipes (list with pagination & search)
    • Implemented GET /api/recipes/:id (get single recipe)
    • Implemented POST /api/recipes (create recipe)
    • Implemented PUT /api/recipes/:id (update recipe)
    • Implemented DELETE /api/recipes/:id (delete recipe)
    • Added Zod validation schemas for all endpoints
    • Created layered architecture (Routes → Services → Repositories)
    • Wrote 16 integration tests (all passing)
    • Database auto-save functionality

2026-03-23

  • Backend initialization (Node.js + Express)
  • TypeScript setup with strict mode
  • SQLite schema creation with sql.js

📋 Backlog (Post-MVP)

v1.0

  • Browser extension for recipe scraping
  • Recipe scaling (adjust servings)
  • Print styles
  • Advanced search filters
  • Random recipe suggestion

v2.0

  • AI ingredient substitutions
  • Meal planning
  • Shopping list generation
  • Fintrove cost tracking integration

🚧 Blocked / Needs Decision

  • Tag filtering in recipe list: Currently shows UI but doesn't filter results. Need to add backend support for filtering recipes by tag_id parameter in GET /api/recipes endpoint, or implement a separate endpoint that returns recipes with their tags. (Low priority - tags work for assignment/display, just not list filtering yet)

Notes for Agents

  • Check this file before starting work
  • Move completed tasks to "Completed" section
  • Add new tasks as you discover them
  • Flag blockers for Paul's attention
  • Keep this file current (update after each commit)

This is your working task list. Keep it honest and up-to-date.