diff --git a/TODO.md b/TODO.md index 26a8dee..df73cb7 100644 --- a/TODO.md +++ b/TODO.md @@ -32,7 +32,7 @@ MVP is functionally complete (core app + docs + tests). ### Phase 2: Import UI - [x] Add “Import from URL” UI page/form in frontend -- [ ] Show parsed preview (title, ingredients, steps, source URL) +- [x] Show parsed preview (title, ingredients, steps, source URL) - [ ] Allow edit-before-save flow, then save to existing create recipe API - [ ] Add frontend error states (invalid URL, parse failure, timeout) diff --git a/frontend/src/pages/ImportUrlPage.tsx b/frontend/src/pages/ImportUrlPage.tsx index 2518a82..64e9aea 100644 --- a/frontend/src/pages/ImportUrlPage.tsx +++ b/frontend/src/pages/ImportUrlPage.tsx @@ -67,10 +67,42 @@ export function ImportUrlPage() { )} {result && ( -
-

Import fetched successfully

-

Source: {result.source_url}

-

JSON-LD blocks found: {result.json_ld_blocks.length}

+
+
+

Parsed Preview

+

Source: {result.source_url}

+

JSON-LD blocks found: {result.json_ld_blocks.length}

+
+ + {result.draft_recipe ? ( + <> +
+

{result.draft_recipe.title}

+
+ +
+
Ingredients
+
    + {result.draft_recipe.ingredients.map((ingredient, index) => ( +
  • {ingredient}
  • + ))} +
+
+ +
+
Steps
+
    + {result.draft_recipe.instructions.map((instruction, index) => ( +
  1. {instruction}
  2. + ))} +
+
+ + ) : ( +

+ Could not parse a recipe preview from this URL. +

+ )}
)}