): Promise {\n const { ingredients, steps, tags, ...recipeData } = recipe;\n \n // Validate ingredients array\n if (!ingredients || ingredients.length === 0) {\n throw new Error('Recipe must have at least one ingredient');\n }\n \n // Validate steps array\n if (!steps || steps.length === 0) {\n throw new Error('Recipe must have at least one step');\n }\n \n // Insert recipe\n const recipeResult = await sqlite.execute(`\n INSERT INTO ${RECIPES_TABLE} \n (title, description, servings, prep_time, cook_time, difficulty, tags, source, image_url, steps)\n VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?)\n `, [\n recipeData.title,\n recipeData.description || null,\n recipeData.servings || null,\n recipeData.prepTime || null,\n recipeData.cookTime || null,\n recipeData.difficulty || null,\n tags ? JSON.stringify(tags) : null,\n recipeData.source || null,\n recipeData.imageUrl || null,\n JSON.stringify(steps)\n ]);\n\n // Get the recipe ID (note: property name is lastInsertRowid, not lastInsertRowId)\n const recipeId = recipeResult.lastInsertRowid;\n \n if (!recipeId) {\n console.error('Failed to get recipe ID from insert result:', recipeResult);\n throw new Error('Failed to create recipe: no ID returned from database');\n }\n \n // Convert to number if it's a string\n const numericRecipeId = typeof recipeId === 'string' ? parseInt(recipeId, 10) : Number(recipeId);\n \n if (isNaN(numericRecipeId) || numericRecipeId <= 0) {\n console.error('Recipe ID is not a valid number:', recipeId);\n throw new Error('Failed to create recipe: invalid ID returned from database');\n }\n\n // Insert ingredients\n for (let i = 0; i < ingredients.length; i++) {\n const ingredient = ingredients[i];\n \n await sqlite.execute(`\n INSERT INTO ${INGREDIENTS_TABLE} \n (recipe_id, name, amount, unit, notes, order_index)\n VALUES (?, ?, ?, ?, ?, ?)\n `, [\n numericRecipeId,\n ingredient.name,\n ingredient.amount || '',\n ingredient.unit || '',\n ingredient.notes || null,\n i\n ]);\n }\n\n return await getRecipeById(numericRecipeId);\n}\n\nexport async function getRecipeById(id: number): Promise {\n const recipeResult = await sqlite.execute(`\n SELECT * FROM ${RECIPES_TABLE} WHERE id = ?\n `, [id]);\n\n if (recipeResult.rows.length === 0) {\n return null;\n }\n\n const recipeRow = recipeResult.rows[0];\n \n const ingredientsResult = await sqlite.execute(`\n SELECT * FROM ${INGREDIENTS_TABLE} \n WHERE recipe_id = ? \n ORDER BY order_index\n `, [id]);\n\n const ingredients: Ingredient[] = ingredientsResult.rows.map(row => ({\n id: row.id as number,\n name: row.name as string,\n amount: row.amount as string,\n unit: row.unit as string,\n notes: row.notes as string || undefined\n }));\n\n return {\n id: recipeRow.id as number,\n title: recipeRow.title as string,\n description: recipeRow.description as string || undefined,\n ingredients,\n steps: JSON.parse(recipeRow.steps as string),\n servings: recipeRow.servings as number || undefined,\n prepTime: recipeRow.prep_time as number || undefined,\n cookTime: recipeRow.cook_time as number || undefined,\n difficulty: recipeRow.difficulty as Recipe['difficulty'] || undefined,\n tags: recipeRow.tags ? JSON.parse(recipeRow.tags as string) : undefined,\n source: recipeRow.source as string || undefined,\n imageUrl: recipeRow.image_url as string || undefined,\n createdAt: recipeRow.created_at as string,\n updatedAt: recipeRow.updated_at as string\n };\n}\n\nexport async function getAllRecipes(filters?: RecipeFilters): Promise {\n let query = `SELECT * FROM ${RECIPES_TABLE}`;\n const params: any[] = [];\n const conditions: string[] = [];\n\n if (filters?.search) {\n conditions.push(`title LIKE ?`);\n params.push(`%${filters.search}%`);\n }\n\n if (filters?.difficulty) {\n conditions.push(`difficulty = ?`);\n params.push(filters.difficulty);\n }\n\n if (filters?.maxPrepTime) {\n conditions.push(`prep_time <= ?`);\n params.push(filters.maxPrepTime);\n }\n\n if (filters?.maxCookTime) {\n conditions.push(`cook_time <= ?`);\n params.push(filters.maxCookTime);\n }\n\n if (conditions.length > 0) {\n query += ` WHERE ${conditions.join(' AND ')}`;\n }\n\n query += ` ORDER BY created_at DESC`;\n\n const result = await sqlite.execute(query, params);\n \n const recipes: Recipe[] = [];\n for (const row of result.rows) {\n const recipe = await getRecipeById(row.id as number);\n if (recipe) {\n recipes.push(recipe);\n }\n }\n\n return recipes;\n}\n\nexport async function updateRecipe(id: number, updates: Partial): Promise {\n const { ingredients, steps, tags, ...recipeData } = updates;\n \n const setParts: string[] = [];\n const params: any[] = [];\n\n Object.entries(recipeData).forEach(([key, value]) => {\n if (value !== undefined && key !== 'id' && key !== 'createdAt' && key !== 'updatedAt') {\n const dbKey = key === 'prepTime' ? 'prep_time' : \n key === 'cookTime' ? 'cook_time' : \n key === 'imageUrl' ? 'image_url' : key;\n setParts.push(`${dbKey} = ?`);\n params.push(value);\n }\n });\n\n if (steps) {\n setParts.push(`steps = ?`);\n params.push(JSON.stringify(steps));\n }\n\n if (tags) {\n setParts.push(`tags = ?`);\n params.push(JSON.stringify(tags));\n }\n\n if (setParts.length > 0) {\n setParts.push(`updated_at = CURRENT_TIMESTAMP`);\n params.push(id);\n \n await sqlite.execute(`\n UPDATE ${RECIPES_TABLE} \n SET ${setParts.join(', ')} \n WHERE id = ?\n `, params);\n }\n\n // Update ingredients if provided\n if (ingredients) {\n // Delete existing ingredients\n await sqlite.execute(`DELETE FROM ${INGREDIENTS_TABLE} WHERE recipe_id = ?`, [id]);\n \n // Insert new ingredients\n for (let i = 0; i < ingredients.length; i++) {\n const ingredient = ingredients[i];\n await sqlite.execute(`\n INSERT INTO ${INGREDIENTS_TABLE} \n (recipe_id, name, amount, unit, notes, order_index)\n VALUES (?, ?, ?, ?, ?, ?)\n `, [\n id,\n ingredient.name,\n ingredient.amount,\n ingredient.unit,\n ingredient.notes || null,\n i\n ]);\n }\n }\n\n return await getRecipeById(id);\n}\n\nexport async function deleteRecipe(id: number): Promise {\n const result = await sqlite.execute(`DELETE FROM ${RECIPES_TABLE} WHERE id = ?`, [id]);\n \n // The SQLite library returns rowsAffected, not changes\n return (result.rowsAffected || 0) > 0;\n}",[],[186,193,208],[186,193],{"_108":218,"_100":219,"_152":220,"_154":187,"_155":139,"_156":221,"_157":158,"_110":222,"_105":31,"_160":161,"_162":-5,"_163":27,"_164":-5,"_165":223,"_103":242},"9e4604d4-494d-11f0-9177-76b3cceeab13","routes","efd2e129-3d21-4605-9278-9a564a0e49b2",5,["D",1749925816509],[224,233],{"_108":225,"_100":226,"_152":227,"_154":220,"_155":139,"_156":138,"_157":158,"_110":228,"_105":229,"_160":202,"_162":230,"_163":27,"_164":-5,"_165":231,"_103":232},"70206032-499c-11f0-aceb-76b3cceeab13","parse.ts","9e45f5b6-494d-11f0-9177-76b3cceeab13",["D",1749959669326],16,"import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { extractText, getDocumentProxy } from \"https://esm.sh/unpdf@1.0.6\";\nimport { OpenAI } from \"https://esm.town/v/std/openai\";\nimport type { ParseRequest, ParseResponse, Recipe } from \"../../shared/types.ts\";\n\nconst app = new Hono();\nconst openai = new OpenAI();\n\n// PDF parsing is now handled by unpdf library\n\n// Function to validate and clean recipe data\nfunction validateAndCleanRecipe(recipe: any): Recipe {\n // Ensure required fields exist\n if (!recipe.title || typeof recipe.title !== \"string\") {\n throw new Error(\"Recipe must have a valid title\");\n }\n\n if (!recipe.ingredients || !Array.isArray(recipe.ingredients) || recipe.ingredients.length === 0) {\n throw new Error(\"Recipe must have at least one ingredient\");\n }\n\n if (!recipe.steps || !Array.isArray(recipe.steps) || recipe.steps.length === 0) {\n throw new Error(\"Recipe must have at least one step\");\n }\n\n // Clean and validate ingredients\n const cleanedIngredients = recipe.ingredients.map((ingredient: any, index: number) => {\n if (!ingredient.name || typeof ingredient.name !== \"string\") {\n throw new Error(`Ingredient ${index + 1} must have a valid name`);\n }\n\n // Convert amount to string if it's a number\n let amount = ingredient.amount;\n if (typeof amount === \"number\") {\n amount = amount.toString();\n } else if (typeof amount !== \"string\") {\n amount = \"\";\n }\n\n // Ensure unit is a string\n let unit = ingredient.unit;\n if (typeof unit !== \"string\") {\n unit = \"\";\n }\n\n return {\n name: ingredient.name.trim(),\n amount: amount.trim(),\n unit: unit.trim(),\n notes: ingredient.notes && typeof ingredient.notes === \"string\" ? ingredient.notes.trim() : undefined,\n };\n });\n\n // Clean steps\n const cleanedSteps = recipe.steps.map((step: any) => {\n if (typeof step !== \"string\") {\n return String(step);\n }\n return step.trim();\n }).filter((step: string) => step.length > 0);\n\n return {\n title: recipe.title.trim(),\n description: recipe.description && typeof recipe.description === \"string\" ? recipe.description.trim() : undefined,\n ingredients: cleanedIngredients,\n steps: cleanedSteps,\n servings: typeof recipe.servings === \"number\" ? recipe.servings : undefined,\n prepTime: typeof recipe.prepTime === \"number\" ? recipe.prepTime : undefined,\n cookTime: typeof recipe.cookTime === \"number\" ? recipe.cookTime : undefined,\n difficulty: [\"easy\", \"medium\", \"hard\"].includes(recipe.difficulty) ? recipe.difficulty : undefined,\n tags: Array.isArray(recipe.tags) ? recipe.tags.filter(tag => typeof tag === \"string\") : undefined,\n source: recipe.source && typeof recipe.source === \"string\" ? recipe.source.trim() : undefined,\n imageUrl: recipe.imageUrl && typeof recipe.imageUrl === \"string\" ? recipe.imageUrl.trim() : undefined,\n };\n}\n\n// Function to convert fractional Unicode characters to decimal values\nfunction convertFractionsToDecimals(text: string): string {\n const fractionMap: { [key: string]: string } = {\n \"¼\": \"0.25\",\n \"½\": \"0.5\",\n \"¾\": \"0.75\",\n \"⅐\": \"0.142857\",\n \"⅑\": \"0.111111\",\n \"⅒\": \"0.1\",\n \"⅓\": \"0.333333\",\n \"⅔\": \"0.666667\",\n \"⅕\": \"0.2\",\n \"⅖\": \"0.4\",\n \"⅗\": \"0.6\",\n \"⅘\": \"0.8\",\n \"⅙\": \"0.166667\",\n \"⅚\": \"0.833333\",\n \"⅛\": \"0.125\",\n \"⅜\": \"0.375\",\n \"⅝\": \"0.625\",\n \"⅞\": \"0.875\",\n \"⅟\": \"1\",\n // Additional fractions\n \"⁄\": \"/\", // fraction slash - handle separately\n };\n\n let result = text;\n\n // Replace Unicode fractions with decimal equivalents\n for (const [fraction, decimal] of Object.entries(fractionMap)) {\n result = result.replace(new RegExp(fraction, \"g\"), decimal);\n }\n\n // Handle mixed numbers like \"1¼\" -> \"1.25\"\n result = result.replace(/(\\d+)([¼½¾⅐⅑⅒⅓⅔⅕⅖⅗⅘⅙⅚⅛⅜⅝⅞])/g, (match, whole, fraction) => {\n const fractionValue = fractionMap[fraction] || fraction;\n return (parseFloat(whole) + parseFloat(fractionValue)).toString();\n });\n\n // Handle simple fractions like \"1/4\" -> \"0.25\"\n result = result.replace(/(\\d+)\\/(\\d+)/g, (match, numerator, denominator) => {\n const decimal = parseFloat(numerator) / parseFloat(denominator);\n return decimal.toString();\n });\n\n return result;\n}\n\n// System prompt for recipe parsing\nconst RECIPE_PARSING_PROMPT =\n `You are a recipe parsing expert. Your task is to extract structured recipe information from various sources (text, images, PDFs).\n\nIMPORTANT: You must return ONLY a valid JSON object with no additional text, markdown formatting, or explanations.\n\nExtract the following information and return it as a JSON object:\n{\n \"title\": \"Recipe name\",\n \"description\": \"Brief description (optional)\",\n \"ingredients\": [\n {\n \"name\": \"ingredient name\",\n \"amount\": \"quantity as string (e.g., '1.25', '0.5')\",\n \"unit\": \"measurement unit (e.g., 'cups', 'teaspoons')\",\n \"notes\": \"any additional notes (optional)\"\n }\n ],\n \"steps\": [\"step 1\", \"step 2\", ...],\n \"servings\": number (optional),\n \"prepTime\": minutes as number (optional),\n \"cookTime\": minutes as number (optional),\n \"difficulty\": \"easy\" | \"medium\" | \"hard\" (optional),\n \"tags\": [\"tag1\", \"tag2\"] (optional)\n}\n\nGuidelines:\n- Return ONLY the JSON object, no markdown code blocks or additional text\n- Extract ingredients with precise amounts and units\n- Amount should be a string representation of the number (e.g., \"1.25\", \"0.5\", \"2\")\n- Break down cooking steps into clear, sequential instructions\n- Normalize units (e.g., \"cups\" not \"c.\", \"teaspoons\" not \"tsp\")\n- If amounts are ranges (e.g., \"2-3 cups\"), use the middle value\n- For missing information, omit the field rather than guessing\n- Be precise and accurate\n- CRITICAL: Use decimal numbers for fractional amounts (e.g., \"0.25\" instead of \"¼\", \"0.5\" instead of \"½\")\n- Never use Unicode fraction characters (¼, ½, ¾, etc.) in the JSON output\n- Ensure all ingredient objects have name, amount, and unit fields`;\n\napp.post(\"/url\", async (c) => {\n try {\n const { content: url } = await c.req.json() as ParseRequest;\n\n // Fetch the webpage content\n const response = await fetch(url);\n if (!response.ok) {\n return c.json({ success: false, error: \"Failed to fetch URL\" } as ParseResponse);\n }\n\n const html = await response.text();\n\n // Use OpenAI to parse the recipe from HTML\n const completion = await openai.chat.completions.create({\n model: \"gpt-4o-mini\",\n messages: [\n { role: \"system\", content: RECIPE_PARSING_PROMPT },\n {\n role: \"user\",\n content:\n `This html contains the recipe for a dish. Parse the recipe - all of the listed ingredients and their quantiities, plus the specific cooking steps - from this webpage HTML. Focus on the main recipe content and ignore stories, web navigation, ads, and other fluffy non-recipe elements:\\n\\n${\n html.slice(0, 8000)\n }`,\n },\n ],\n temperature: 0.1,\n max_tokens: 2000,\n });\n\n const recipeText = completion.choices[0]?.message?.content;\n if (!recipeText) {\n return c.json({ success: false, error: \"Failed to parse recipe\" } as ParseResponse);\n }\n\n try {\n // Try to extract JSON from the response (sometimes OpenAI adds extra text)\n let jsonText = recipeText.trim();\n\n // Look for JSON block if wrapped in markdown\n const jsonMatch = jsonText.match(/```(?:json)?\\s*(\\{[\\s\\S]*\\})\\s*```/);\n if (jsonMatch) {\n jsonText = jsonMatch[1];\n }\n\n // If it doesn't start with {, try to find the JSON part\n if (!jsonText.startsWith(\"{\")) {\n const startIndex = jsonText.indexOf(\"{\");\n const endIndex = jsonText.lastIndexOf(\"}\");\n if (startIndex !== -1 && endIndex !== -1 && endIndex > startIndex) {\n jsonText = jsonText.substring(startIndex, endIndex + 1);\n }\n }\n\n // Convert fractional characters to decimal values before parsing\n jsonText = convertFractionsToDecimals(jsonText);\n\n const rawRecipe = JSON.parse(jsonText);\n const recipe = validateAndCleanRecipe(rawRecipe);\n recipe.source = url;\n\n return c.json({ success: true, recipe } as ParseResponse);\n } catch (parseError) {\n console.error(\"JSON parsing error for URL:\", parseError);\n console.error(\"Raw response from OpenAI:\", recipeText);\n return c.json({\n success: false,\n error: `Invalid recipe format returned. OpenAI response: ${recipeText.substring(0, 200)}...`,\n } as ParseResponse);\n }\n } catch (error) {\n console.error(\"URL parsing error:\", error);\n return c.json({ success: false, error: \"Failed to parse recipe from URL\" } as ParseResponse);\n }\n});\n\napp.post(\"/image\", async (c) => {\n try {\n const { content: base64Image } = await c.req.json() as ParseRequest;\n\n console.log(\"Processing image upload, base64 length:\", base64Image?.length);\n\n // Validate base64 image\n if (!base64Image || base64Image.length < 100) {\n return c.json({ success: false, error: \"Invalid or empty image data\" } as ParseResponse);\n }\n\n // Use OpenAI Vision to parse recipe from image\n const completion = await openai.chat.completions.create({\n model: \"gpt-4o-mini\",\n messages: [\n { role: \"system\", content: RECIPE_PARSING_PROMPT },\n {\n role: \"user\",\n content: [\n {\n type: \"text\",\n text:\n \"Parse the recipe from this image. Extract all visible recipe information including title, ingredients with amounts, and cooking steps.\",\n },\n {\n type: \"image_url\",\n image_url: {\n url: base64Image.startsWith(\"data:\") ? base64Image : `data:image/jpeg;base64,${base64Image}`,\n },\n },\n ],\n },\n ],\n temperature: 0.1,\n max_tokens: 2000,\n });\n\n const recipeText = completion.choices[0]?.message?.content;\n console.log(\"OpenAI response:\", recipeText);\n\n if (!recipeText) {\n return c.json({ success: false, error: \"OpenAI returned empty response\" } as ParseResponse);\n }\n\n try {\n // Try to extract JSON from the response (sometimes OpenAI adds extra text)\n let jsonText = recipeText.trim();\n\n // Look for JSON block if wrapped in markdown\n const jsonMatch = jsonText.match(/```(?:json)?\\s*(\\{[\\s\\S]*\\})\\s*```/);\n if (jsonMatch) {\n jsonText = jsonMatch[1];\n }\n\n // If it doesn't start with {, try to find the JSON part\n if (!jsonText.startsWith(\"{\")) {\n const startIndex = jsonText.indexOf(\"{\");\n const endIndex = jsonText.lastIndexOf(\"}\");\n if (startIndex !== -1 && endIndex !== -1 && endIndex > startIndex) {\n jsonText = jsonText.substring(startIndex, endIndex + 1);\n }\n }\n\n // Convert fractional characters to decimal values before parsing\n jsonText = convertFractionsToDecimals(jsonText);\n\n console.log(\"Attempting to parse JSON:\", jsonText);\n const rawRecipe = JSON.parse(jsonText);\n const recipe = validateAndCleanRecipe(rawRecipe);\n recipe.source = \"Image upload\";\n\n return c.json({ success: true, recipe } as ParseResponse);\n } catch (parseError) {\n console.error(\"JSON parsing error:\", parseError);\n console.error(\"Raw response from OpenAI:\", recipeText);\n return c.json({\n success: false,\n error: `Invalid recipe format returned. OpenAI response: ${recipeText.substring(0, 200)}...`,\n } as ParseResponse);\n }\n } catch (error) {\n console.error(\"Image parsing error:\", error);\n return c.json({\n success: false,\n error: `Failed to parse recipe from image: ${error.message}`,\n } as ParseResponse);\n }\n});\n\napp.post(\"/pdf\", async (c) => {\n try {\n const { content: base64Pdf } = await c.req.json() as ParseRequest;\n\n // Validate base64 PDF\n if (!base64Pdf || base64Pdf.length < 100) {\n return c.json({ success: false, error: \"Invalid or empty PDF data\" } as ParseResponse);\n }\n\n // Convert base64 to buffer\n const base64Data = base64Pdf.replace(/^data:application\\/pdf;base64,/, \"\");\n const pdfBuffer = Uint8Array.from(atob(base64Data), c => c.charCodeAt(0));\n\n // Use unpdf to extract text from PDF\n const pdf = await getDocumentProxy(pdfBuffer);\n const { totalPages, text } = await extractText(pdf, { mergePages: true });\n const fullText = text as string;\n\n if (!fullText || fullText.trim().length < 10) {\n return c.json({ success: false, error: \"No readable text found in PDF\" } as ParseResponse);\n }\n\n // Log the number of pages processed\n console.log(`Processed PDF with ${totalPages} pages`);\n\n // Use OpenAI to parse the recipe\n const completion = await openai.chat.completions.create({\n model: \"gpt-4o-mini\",\n messages: [\n { role: \"system\", content: RECIPE_PARSING_PROMPT },\n {\n role: \"user\",\n content: `Parse this recipe text extracted from a PDF and extract the structured information:\\n\\n${fullText}`,\n },\n ],\n temperature: 0.1,\n max_tokens: 2000,\n });\n\n const recipeText = completion.choices[0]?.message?.content;\n console.log(\"OpenAI response for PDF:\", recipeText);\n\n if (!recipeText) {\n return c.json({ success: false, error: \"OpenAI returned empty response\" } as ParseResponse);\n }\n\n try {\n // Try to extract JSON from the response (sometimes OpenAI adds extra text)\n let jsonText = recipeText.trim();\n\n // Look for JSON block if wrapped in markdown\n const jsonMatch = jsonText.match(/```(?:json)?\\s*(\\{[\\s\\S]*\\})\\s*```/);\n if (jsonMatch) {\n jsonText = jsonMatch[1];\n }\n\n // If it doesn't start with {, try to find the JSON part\n if (!jsonText.startsWith(\"{\")) {\n const startIndex = jsonText.indexOf(\"{\");\n const endIndex = jsonText.lastIndexOf(\"}\");\n if (startIndex !== -1 && endIndex !== -1 && endIndex > startIndex) {\n jsonText = jsonText.substring(startIndex, endIndex + 1);\n }\n }\n\n // Convert fractional characters to decimal values before parsing\n jsonText = convertFractionsToDecimals(jsonText);\n\n console.log(\"Attempting to parse JSON for PDF:\", jsonText);\n const rawRecipe = JSON.parse(jsonText);\n const recipe = validateAndCleanRecipe(rawRecipe);\n recipe.source = \"PDF upload\";\n\n return c.json({ success: true, recipe } as ParseResponse);\n } catch (parseError) {\n console.error(\"JSON parsing error for PDF:\", parseError);\n console.error(\"Raw response from OpenAI:\", recipeText);\n return c.json({\n success: false,\n error: `Invalid recipe format returned. OpenAI response: ${recipeText.substring(0, 200)}...`,\n } as ParseResponse);\n }\n } catch (error) {\n console.error(\"PDF parsing error:\", error);\n return c.json({\n success: false,\n error: `Failed to parse recipe from PDF: ${error.message}`,\n } as ParseResponse);\n }\n});\n\napp.post(\"/text\", async (c) => {\n try {\n const { content: text } = await c.req.json() as ParseRequest;\n\n console.log(\"Processing text input, length:\", text?.length);\n\n if (!text || text.trim().length < 10) {\n return c.json({ success: false, error: \"Text input is too short or empty\" } as ParseResponse);\n }\n\n // Parse recipe from plain text\n const completion = await openai.chat.completions.create({\n model: \"gpt-4o-mini\",\n messages: [\n { role: \"system\", content: RECIPE_PARSING_PROMPT },\n {\n role: \"user\",\n content: `Parse this recipe text and extract the structured information:\\n\\n${text}`,\n },\n ],\n temperature: 0.1,\n max_tokens: 2000,\n });\n\n const recipeText = completion.choices[0]?.message?.content;\n console.log(\"OpenAI response for text:\", recipeText);\n\n if (!recipeText) {\n return c.json({ success: false, error: \"OpenAI returned empty response\" } as ParseResponse);\n }\n\n try {\n // Try to extract JSON from the response (sometimes OpenAI adds extra text)\n let jsonText = recipeText.trim();\n\n // Look for JSON block if wrapped in markdown\n const jsonMatch = jsonText.match(/```(?:json)?\\s*(\\{[\\s\\S]*\\})\\s*```/);\n if (jsonMatch) {\n jsonText = jsonMatch[1];\n }\n\n // If it doesn't start with {, try to find the JSON part\n if (!jsonText.startsWith(\"{\")) {\n const startIndex = jsonText.indexOf(\"{\");\n const endIndex = jsonText.lastIndexOf(\"}\");\n if (startIndex !== -1 && endIndex !== -1 && endIndex > startIndex) {\n jsonText = jsonText.substring(startIndex, endIndex + 1);\n }\n }\n\n // Convert fractional characters to decimal values before parsing\n jsonText = convertFractionsToDecimals(jsonText);\n\n console.log(\"Attempting to parse JSON for text:\", jsonText);\n const rawRecipe = JSON.parse(jsonText);\n const recipe = validateAndCleanRecipe(rawRecipe);\n recipe.source = \"Text input\";\n\n return c.json({ success: true, recipe } as ParseResponse);\n } catch (parseError) {\n console.error(\"JSON parsing error for text:\", parseError);\n console.error(\"Raw response from OpenAI:\", recipeText);\n return c.json({\n success: false,\n error: `Invalid recipe format returned. OpenAI response: ${recipeText.substring(0, 200)}...`,\n } as ParseResponse);\n }\n } catch (error) {\n console.error(\"Text parsing error:\", error);\n return c.json({\n success: false,\n error: `Failed to parse recipe from text: ${error.message}`,\n } as ParseResponse);\n }\n});\n\nexport default app;",[],[186,219,226],{"_108":234,"_100":235,"_152":236,"_154":220,"_155":139,"_156":237,"_157":158,"_110":238,"_105":31,"_160":202,"_162":239,"_163":27,"_164":-5,"_165":240,"_103":241},"ad0aa722-494d-11f0-bd19-76b3cceeab13","recipes.ts","ad0aa7f4-494d-11f0-bd19-76b3cceeab13",6,["D",1749925841289],"import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport type { Recipe, RecipeFilters, ApiResponse } from \"../../shared/types.ts\";\nimport { \n createRecipe, \n getRecipeById, \n getAllRecipes, \n updateRecipe, \n deleteRecipe \n} from \"../database/queries.ts\";\n\nconst app = new Hono();\n\n// Get all recipes with optional filters\napp.get('/', async (c) => {\n try {\n const search = c.req.query('search');\n const difficulty = c.req.query('difficulty');\n const maxPrepTime = c.req.query('maxPrepTime');\n const maxCookTime = c.req.query('maxCookTime');\n const tags = c.req.query('tags');\n\n const filters: RecipeFilters = {};\n if (search) filters.search = search;\n if (difficulty) filters.difficulty = difficulty;\n if (maxPrepTime) filters.maxPrepTime = parseInt(maxPrepTime);\n if (maxCookTime) filters.maxCookTime = parseInt(maxCookTime);\n if (tags) filters.tags = tags.split(',');\n\n const recipes = await getAllRecipes(filters);\n return c.json({ success: true, data: recipes } as ApiResponse);\n } catch (error) {\n console.error('Error fetching recipes:', error);\n return c.json({ success: false, error: 'Failed to fetch recipes' } as ApiResponse, 500);\n }\n});\n\n// Get a specific recipe by ID\napp.get('/:id', async (c) => {\n try {\n const id = parseInt(c.req.param('id'));\n if (isNaN(id)) {\n return c.json({ success: false, error: 'Invalid recipe ID' } as ApiResponse, 400);\n }\n\n const recipe = await getRecipeById(id);\n if (!recipe) {\n return c.json({ success: false, error: 'Recipe not found' } as ApiResponse, 404);\n }\n\n return c.json({ success: true, data: recipe } as ApiResponse);\n } catch (error) {\n console.error('Error fetching recipe:', error);\n return c.json({ success: false, error: 'Failed to fetch recipe' } as ApiResponse, 500);\n }\n});\n\n// Create a new recipe\napp.post('/', async (c) => {\n try {\n const recipeData = await c.req.json() as Omit;\n \n // Validate required fields\n if (!recipeData.title || !recipeData.ingredients || !recipeData.steps) {\n return c.json({ \n success: false, \n error: 'Missing required fields: title, ingredients, and steps are required' \n } as ApiResponse, 400);\n }\n\n if (recipeData.ingredients.length === 0) {\n return c.json({ \n success: false, \n error: 'At least one ingredient is required' \n } as ApiResponse, 400);\n }\n\n if (recipeData.steps.length === 0) {\n return c.json({ \n success: false, \n error: 'At least one cooking step is required' \n } as ApiResponse, 400);\n }\n\n const recipe = await createRecipe(recipeData);\n return c.json({ success: true, data: recipe } as ApiResponse, 201);\n } catch (error) {\n console.error('Error creating recipe:', error);\n return c.json({ success: false, error: 'Failed to create recipe' } as ApiResponse, 500);\n }\n});\n\n// Update an existing recipe\napp.put('/:id', async (c) => {\n try {\n const id = parseInt(c.req.param('id'));\n if (isNaN(id)) {\n return c.json({ success: false, error: 'Invalid recipe ID' } as ApiResponse, 400);\n }\n\n const updates = await c.req.json() as Partial;\n \n const recipe = await updateRecipe(id, updates);\n if (!recipe) {\n return c.json({ success: false, error: 'Recipe not found' } as ApiResponse, 404);\n }\n\n return c.json({ success: true, data: recipe } as ApiResponse);\n } catch (error) {\n console.error('Error updating recipe:', error);\n return c.json({ success: false, error: 'Failed to update recipe' } as ApiResponse, 500);\n }\n});\n\n// Delete a recipe\napp.delete('/:id', async (c) => {\n try {\n const id = parseInt(c.req.param('id'));\n if (isNaN(id)) {\n return c.json({ success: false, error: 'Invalid recipe ID' } as ApiResponse, 400);\n }\n\n const deleted = await deleteRecipe(id);\n if (!deleted) {\n return c.json({ success: false, error: 'Recipe not found' } as ApiResponse, 404);\n }\n\n return c.json({ success: true, data: { deleted: true } } as ApiResponse);\n } catch (error) {\n console.error('Error deleting recipe:', error);\n return c.json({ success: false, error: 'Failed to delete recipe' } as ApiResponse, 500);\n }\n});\n\nexport default app;",[],[186,219,235],[186,219],{"_108":244,"_100":245,"_152":246,"_154":187,"_155":139,"_156":247,"_157":158,"_110":248,"_105":188,"_160":249,"_162":250,"_163":27,"_164":251,"_165":252,"_103":253},"e9887d9a-4953-11f0-8944-76b3cceeab13","index.ts","b5a28792-494d-11f0-a95b-76b3cceeab13",50,["D",1749928519754],"http","import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { runMigrations } from \"./database/migrations.ts\";\nimport recipesRoutes from \"./routes/recipes.ts\";\nimport parseRoutes from \"./routes/parse.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Initialize database on startup\nawait runMigrations();\n\n// API routes\napp.route('/api/recipes', recipesRoutes);\napp.route('/api/parse', parseRoutes);\n\n// Health check endpoint\napp.get('/api/health', (c) => {\n return c.json({ status: 'ok', timestamp: new Date().toISOString() });\n});\n\n// Test delete endpoint\napp.get('/api/test-delete', async (c) => {\n try {\n const { createRecipe, deleteRecipe, getAllRecipes } = await import('./database/queries.ts');\n \n // Create a test recipe\n const testRecipe = await createRecipe({\n title: 'Test Recipe for Delete',\n ingredients: [{ name: 'test', amount: '1', unit: 'cup' }],\n steps: ['Test step'],\n source: 'Test'\n });\n \n console.log('Created test recipe:', testRecipe.id);\n \n // Try to delete it\n const deleteResult = await deleteRecipe(testRecipe.id!);\n console.log('Delete result:', deleteResult);\n \n // Check if it's gone\n const remainingRecipes = await getAllRecipes();\n const stillExists = remainingRecipes.some(r => r.id === testRecipe.id);\n \n return c.json({\n success: true,\n testRecipeId: testRecipe.id,\n deleteResult,\n stillExists,\n message: deleteResult ? 'Delete successful' : 'Delete failed'\n });\n } catch (error) {\n console.error('Test delete error:', error);\n return c.json({ success: false, error: error.message });\n }\n});\n\n// Serve static files\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Serve the main application\napp.get(\"/\", async c => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n \n // Add some initial data to avoid extra round-trips\n const initialData = {\n appName: \"Recipe Parser\",\n version: \"1.0.0\"\n };\n \n const dataScript = ``;\n\n html = html.replace(\"\", `${dataScript}`);\n return c.html(html);\n});\n\n// Catch-all route for SPA routing\napp.get(\"*\", async c => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n \n const initialData = {\n appName: \"Recipe Parser\",\n version: \"1.0.0\"\n };\n \n const dataScript = ``;\n\n html = html.replace(\"\", `${dataScript}`);\n return c.html(html);\n});\n\n// This is the entry point for HTTP vals\nexport default app.fetch;","caradmon",[],[186,245],[186],{"_108":256,"_100":257,"_152":258,"_154":-5,"_155":139,"_156":259,"_157":158,"_110":260,"_105":31,"_160":161,"_162":-5,"_163":27,"_164":-5,"_165":261,"_103":322},"c0a26dd8-494d-11f0-a1c9-76b3cceeab13","frontend","4dd70d89-3aed-476f-9356-7e26d18e7aa9",8,["D",1749925874156],[262,306,314],{"_108":263,"_100":264,"_152":265,"_154":258,"_155":139,"_156":266,"_157":158,"_110":267,"_105":31,"_160":161,"_162":-5,"_163":27,"_164":-5,"_165":268,"_103":305},"d71a6b92-494d-11f0-84aa-76b3cceeab13","components","5841737e-c0d7-4f36-bedd-f408bd6dc9f4",10,["D",1749925911851],[269,277,287,296],{"_108":270,"_100":271,"_152":272,"_154":265,"_155":139,"_156":266,"_157":158,"_110":273,"_105":31,"_160":202,"_162":274,"_163":27,"_164":-5,"_165":275,"_103":276},"d71a524c-494d-11f0-84aa-76b3cceeab13","App.tsx","d71a530a-494d-11f0-84aa-76b3cceeab13",["D",1749925911851],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe } from \"../../shared/types.ts\";\nimport RecipeForm from \"./RecipeForm.tsx\";\nimport RecipeList from \"./RecipeList.tsx\";\nimport RecipeView from \"./RecipeView.tsx\";\n\ntype View = 'list' | 'add' | 'view' | 'edit';\n\ninterface AppState {\n view: View;\n recipes: Recipe[];\n selectedRecipe: Recipe | null;\n loading: boolean;\n error: string | null;\n}\n\nexport default function App() {\n const [state, setState] = useState({\n view: 'list',\n recipes: [],\n selectedRecipe: null,\n loading: false,\n error: null\n });\n\n // Load recipes on app start\n useEffect(() => {\n loadRecipes();\n }, []);\n\n const loadRecipes = async () => {\n setState(prev => ({ ...prev, loading: true, error: null }));\n try {\n const response = await fetch('/api/recipes');\n const data = await response.json();\n \n if (data.success) {\n setState(prev => ({ \n ...prev, \n recipes: data.data, \n loading: false \n }));\n } else {\n setState(prev => ({ \n ...prev, \n error: data.error || 'Failed to load recipes', \n loading: false \n }));\n }\n } catch (error) {\n setState(prev => ({ \n ...prev, \n error: 'Network error loading recipes', \n loading: false \n }));\n }\n };\n\n const handleRecipeSaved = (recipe: Recipe) => {\n setState(prev => ({\n ...prev,\n recipes: recipe.id \n ? prev.recipes.map(r => r.id === recipe.id ? recipe : r)\n : [...prev.recipes, recipe],\n view: 'view',\n selectedRecipe: recipe\n }));\n };\n\n const handleRecipeDeleted = (recipeId: number) => {\n setState(prev => ({\n ...prev,\n recipes: prev.recipes.filter(r => r.id !== recipeId),\n view: 'list',\n selectedRecipe: null\n }));\n };\n\n const navigateTo = (view: View, recipe?: Recipe) => {\n setState(prev => ({\n ...prev,\n view,\n selectedRecipe: recipe || null,\n error: null\n }));\n };\n\n const renderHeader = () => (\n

🍳

Recipe Parser

Capture, Parse & Store Recipes

\n \n

\n navigateTo('list')}\n className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${\n state.view === 'list' \n ? 'bg-blue-100 text-blue-700' \n : 'text-gray-600 hover:text-gray-900 hover:bg-gray-100'\n }`}\n >\n 📚 Recipes\n \n navigateTo('add')}\n className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${\n state.view === 'add' \n ? 'bg-green-100 text-green-700' \n : 'text-gray-600 hover:text-gray-900 hover:bg-gray-100'\n }`}\n >\n ➕ Add Recipe\n \n

\n );\n\n const renderContent = () => {\n if (state.loading) {\n return (\n

\n Loading...\n

\n );\n }\n\n if (state.error) {\n return (\n

⚠️

Error

{state.error}

\n setState(prev => ({ ...prev, error: null }))}\n className=\"mt-3 text-red-600 hover:text-red-800 text-sm font-medium\"\n >\n Dismiss\n \n

\n );\n }\n\n switch (state.view) {\n case 'list':\n return (\n navigateTo('view', recipe)}\n onRecipeEdit={(recipe) => navigateTo('edit', recipe)}\n onRecipeDelete={handleRecipeDeleted}\n onRefresh={loadRecipes}\n />\n );\n \n case 'add':\n return (\n navigateTo('list')}\n />\n );\n \n case 'edit':\n return (\n navigateTo('view', state.selectedRecipe)}\n />\n );\n \n case 'view':\n return (\n navigateTo('edit', recipe)}\n onDelete={handleRecipeDeleted}\n onBack={() => navigateTo('list')}\n />\n );\n \n default:\n return

Unknown view

;\n }\n };\n\n return (\n

\n {renderHeader()}\n

\n {renderContent()}\n

\n );\n}",[],[257,264,271],{"_108":278,"_100":279,"_152":280,"_154":265,"_155":139,"_156":281,"_157":158,"_110":282,"_105":283,"_160":202,"_162":284,"_163":27,"_164":-5,"_165":285,"_103":286},"f3544fd8-4954-11f0-a82a-76b3cceeab13","RecipeForm.tsx","093b2ada-494e-11f0-8925-76b3cceeab13",58,["D",1749928965683],9,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'file' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const [uploadedFile, setUploadedFile] = useState(null);\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n // Validation based on parse mode\n if (parseMode === 'file') {\n if (!uploadedFile || !parseInput.trim()) {\n setError('Please select a file to parse');\n return;\n }\n } else {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'file':\n if (!uploadedFile) {\n throw new Error('No file selected');\n }\n \n if (uploadedFile.type.startsWith('image/')) {\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n } else if (uploadedFile.type === 'application/pdf') {\n endpoint = '/api/parse/pdf';\n requestData = { type: 'pdf', content: parseInput };\n } else {\n throw new Error('Unsupported file type');\n }\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleFileUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n // Validate file type\n const isImage = file.type.startsWith('image/');\n const isPDF = file.type === 'application/pdf';\n \n if (!isImage && !isPDF) {\n setError('Please select an image file (JPG, PNG, etc.) or a PDF file');\n return;\n }\n\n setUploadedFile(file);\n setError(null);\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n {(['url', 'text', 'file'] as const).map(mode => (\n setParseMode(mode)}\n className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${\n parseMode === mode\n ? 'bg-blue-600 text-white'\n : 'bg-white text-blue-600 border border-blue-300 hover:bg-blue-50'\n }`}\n >\n {mode === 'url' && '🔗 URL'}\n {mode === 'text' && '📝 Text'}\n {mode === 'file' && '📄 File'}\n \n ))}\n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'file' && (\n

\n \n

\n 📷 Images (JPG, PNG, etc.) or 📄 PDF files supported\n

\n {uploadedFile && (\n

\n ✅\n \n {uploadedFile.type.startsWith('image/') ? '📷' : '📄'} \n {uploadedFile.name} uploaded and ready to parse\n \n

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n \n Recipe Title *\n \n handleInputChange('title', e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"Enter recipe title\"\n required\n />\n

\n\n

\n \n Description\n \n handleInputChange('description', e.target.value)}\n rows={2}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"Brief description of the recipe\"\n />\n

\n\n

\n \n Servings\n \n handleInputChange('servings', e.target.value ? parseInt(e.target.value) : undefined)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"4\"\n min=\"1\"\n />\n

\n\n

\n \n Difficulty\n \n handleInputChange('difficulty', e.target.value || undefined)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n >\n \n \n \n \n \n

\n\n

\n \n Prep Time (minutes)\n \n handleInputChange('prepTime', e.target.value ? parseInt(e.target.value) : undefined)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"15\"\n min=\"0\"\n />\n

\n\n

\n \n Cook Time (minutes)\n \n handleInputChange('cookTime', e.target.value ? parseInt(e.target.value) : undefined)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"30\"\n min=\"0\"\n />\n

\n\n

\n \n Tags (comma-separated)\n \n handleTagsChange(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"vegetarian, quick, healthy\"\n />\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n handleIngredientChange(index, 'name', e.target.value)}\n className=\"flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n handleIngredientChange(index, 'amount', e.target.value)}\n className=\"w-20 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n handleIngredientChange(index, 'unit', e.target.value)}\n className=\"w-20 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n removeIngredient(index)}\n className=\"text-red-500 hover:text-red-700 p-2\"\n >\n 🗑️\n \n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n handleStepChange(index, e.target.value)}\n rows={2}\n className=\"flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n removeStep(index)}\n className=\"text-red-500 hover:text-red-700 p-2 mt-2\"\n >\n 🗑️\n \n

\n ))}\n

\n\n {/* Source */}\n

\n \n Source\n \n handleInputChange('source', e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"Recipe source (URL, book, etc.)\"\n />\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",[],[257,264,279],{"_108":288,"_100":289,"_152":290,"_154":265,"_155":139,"_156":291,"_157":158,"_110":292,"_105":31,"_160":202,"_162":293,"_163":27,"_164":-5,"_165":294,"_103":295},"28dc5454-494e-11f0-b588-76b3cceeab13","RecipeList.tsx","28dc54fe-494e-11f0-b588-76b3cceeab13",12,["D",1749926049021],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe } from \"../../shared/types.ts\";\n\ninterface RecipeListProps {\n recipes: Recipe[];\n onRecipeSelect: (recipe: Recipe) => void;\n onRecipeEdit: (recipe: Recipe) => void;\n onRecipeDelete: (recipeId: number) => void;\n onRefresh: () => void;\n}\n\nexport default function RecipeList({ \n recipes, \n onRecipeSelect, \n onRecipeEdit, \n onRecipeDelete, \n onRefresh \n}: RecipeListProps) {\n const [searchTerm, setSearchTerm] = useState('');\n const [filterDifficulty, setFilterDifficulty] = useState('');\n const [sortBy, setSortBy] = useState<'title' | 'created' | 'prepTime'>('created');\n const [deleteConfirm, setDeleteConfirm] = useState(null);\n\n // Filter and sort recipes\n const filteredRecipes = recipes\n .filter(recipe => {\n const matchesSearch = recipe.title.toLowerCase().includes(searchTerm.toLowerCase()) ||\n recipe.description?.toLowerCase().includes(searchTerm.toLowerCase()) ||\n recipe.tags?.some(tag => tag.toLowerCase().includes(searchTerm.toLowerCase()));\n \n const matchesDifficulty = !filterDifficulty || recipe.difficulty === filterDifficulty;\n \n return matchesSearch && matchesDifficulty;\n })\n .sort((a, b) => {\n switch (sortBy) {\n case 'title':\n return a.title.localeCompare(b.title);\n case 'prepTime':\n return (a.prepTime || 0) - (b.prepTime || 0);\n case 'created':\n default:\n return new Date(b.createdAt || 0).getTime() - new Date(a.createdAt || 0).getTime();\n }\n });\n\n const handleDelete = async (recipeId: number) => {\n try {\n const response = await fetch(`/api/recipes/${recipeId}`, {\n method: 'DELETE'\n });\n \n const data = await response.json();\n \n if (data.success) {\n onRecipeDelete(recipeId);\n setDeleteConfirm(null);\n } else {\n alert('Failed to delete recipe: ' + (data.error || 'Unknown error'));\n }\n } catch (error) {\n alert('Network error while deleting recipe');\n }\n };\n\n const formatTime = (minutes?: number) => {\n if (!minutes) return '';\n if (minutes < 60) return `${minutes}m`;\n const hours = Math.floor(minutes / 60);\n const mins = minutes % 60;\n return mins > 0 ? `${hours}h ${mins}m` : `${hours}h`;\n };\n\n const getDifficultyColor = (difficulty?: string) => {\n switch (difficulty) {\n case 'easy': return 'bg-green-100 text-green-800';\n case 'medium': return 'bg-yellow-100 text-yellow-800';\n case 'hard': return 'bg-red-100 text-red-800';\n default: return 'bg-gray-100 text-gray-800';\n }\n };\n\n const renderEmptyState = () => (\n

🍳

No recipes yet

\n Start building your recipe collection by adding your first recipe!\n

\n window.location.hash = '#add'}\n className=\"bg-blue-600 text-white px-6 py-3 rounded-lg hover:bg-blue-700 font-medium\"\n >\n ➕ Add Your First Recipe\n \n

\n );\n\n const renderFilters = () => (\n

\n setSearchTerm(e.target.value)}\n className=\"w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n \n

\n setFilterDifficulty(e.target.value)}\n className=\"px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n >\n \n \n \n \n \n \n setSortBy(e.target.value as any)}\n className=\"px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n >\n \n \n \n \n \n \n 🔄\n \n

\n );\n\n const renderRecipeCard = (recipe: Recipe) => (\n

onRecipeSelect(recipe)}\n >\n {recipe.title}\n

\n \n

\n onRecipeEdit(recipe)}\n className=\"text-gray-400 hover:text-blue-600 p-1\"\n title=\"Edit recipe\"\n >\n ✏️\n \n setDeleteConfirm(recipe.id!)}\n className=\"text-gray-400 hover:text-red-600 p-1\"\n title=\"Delete recipe\"\n >\n 🗑️\n \n

\n\n {recipe.description && (\n

\n {recipe.description}\n

\n )}\n\n

\n {recipe.difficulty && (\n \n {recipe.difficulty}\n \n )}\n \n {recipe.servings && (\n \n 👥 {recipe.servings} servings\n \n )}\n \n {recipe.prepTime && (\n \n ⏱️ {formatTime(recipe.prepTime)} prep\n \n )}\n \n {recipe.cookTime && (\n \n 🔥 {formatTime(recipe.cookTime)} cook\n \n )}\n

\n\n

\n 🥕 {recipe.ingredients.length} ingredients\n 👩‍🍳 {recipe.steps.length} steps\n

\n \n {recipe.createdAt && (\n \n {new Date(recipe.createdAt).toLocaleDateString()}\n \n )}\n

\n\n {recipe.tags && recipe.tags.length > 0 && (\n

\n {recipe.tags.slice(0, 3).map(tag => (\n \n #{tag}\n \n ))}\n {recipe.tags.length > 3 && (\n \n +{recipe.tags.length - 3} more\n \n )}\n

\n )}\n

\n );\n\n return (\n

📚 My Recipes

\n {filteredRecipes.length} of {recipes.length} recipes\n

\n\n {recipes.length === 0 ? (\n renderEmptyState()\n ) : (\n <>\n {renderFilters()}\n \n {filteredRecipes.length === 0 ? (\n

🔍

No recipes found

\n Try adjusting your search terms or filters\n

\n ) : (\n

\n {filteredRecipes.map(renderRecipeCard)}\n

\n )}\n \n )}\n\n {/* Delete Confirmation Modal */}\n {deleteConfirm && (\n

⚠️

Delete Recipe?

\n This action cannot be undone. The recipe will be permanently deleted.\n

\n handleDelete(deleteConfirm)}\n className=\"flex-1 bg-red-600 text-white px-4 py-2 rounded-md hover:bg-red-700\"\n >\n Delete\n \n setDeleteConfirm(null)}\n className=\"flex-1 bg-gray-300 text-gray-700 px-4 py-2 rounded-md hover:bg-gray-400\"\n >\n Cancel\n \n

\n )}\n

\n );\n}",[],[257,264,289],{"_108":297,"_100":298,"_152":299,"_154":265,"_155":139,"_156":300,"_157":158,"_110":301,"_105":31,"_160":202,"_162":302,"_163":27,"_164":-5,"_165":303,"_103":304},"4cbb0b36-494e-11f0-a719-76b3cceeab13","RecipeView.tsx","4cbb0bc2-494e-11f0-a719-76b3cceeab13",13,["D",1749926109201],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe } from \"../../shared/types.ts\";\n\ninterface RecipeViewProps {\n recipe: Recipe | null;\n onEdit: (recipe: Recipe) => void;\n onDelete: (recipeId: number) => void;\n onBack: () => void;\n}\n\nexport default function RecipeView({ recipe, onEdit, onDelete, onBack }: RecipeViewProps) {\n const [servingMultiplier, setServingMultiplier] = useState(1);\n const [deleteConfirm, setDeleteConfirm] = useState(false);\n const [checkedSteps, setCheckedSteps] = useState>(new Set());\n\n if (!recipe) {\n return (\n

❓

Recipe not found

\n \n ← Back to Recipes\n \n

\n );\n }\n\n const handleDelete = async () => {\n try {\n const response = await fetch(`/api/recipes/${recipe.id}`, {\n method: 'DELETE'\n });\n \n const data = await response.json();\n \n if (data.success) {\n onDelete(recipe.id!);\n } else {\n alert('Failed to delete recipe: ' + (data.error || 'Unknown error'));\n }\n } catch (error) {\n alert('Network error while deleting recipe');\n }\n };\n\n const toggleStepCheck = (stepIndex: number) => {\n const newChecked = new Set(checkedSteps);\n if (newChecked.has(stepIndex)) {\n newChecked.delete(stepIndex);\n } else {\n newChecked.add(stepIndex);\n }\n setCheckedSteps(newChecked);\n };\n\n const formatTime = (minutes?: number) => {\n if (!minutes) return '';\n if (minutes < 60) return `${minutes} minutes`;\n const hours = Math.floor(minutes / 60);\n const mins = minutes % 60;\n return mins > 0 ? `${hours} hour${hours > 1 ? 's' : ''} ${mins} minutes` : `${hours} hour${hours > 1 ? 's' : ''}`;\n };\n\n const getDifficultyColor = (difficulty?: string) => {\n switch (difficulty) {\n case 'easy': return 'bg-green-100 text-green-800';\n case 'medium': return 'bg-yellow-100 text-yellow-800';\n case 'hard': return 'bg-red-100 text-red-800';\n default: return 'bg-gray-100 text-gray-800';\n }\n };\n\n const adjustIngredientAmount = (amount: string, multiplier: number) => {\n // Try to parse and multiply numeric amounts\n const numMatch = amount.match(/^(\\d+(?:\\.\\d+)?)/);\n if (numMatch) {\n const num = parseFloat(numMatch[1]);\n const adjustedNum = num * multiplier;\n const remainder = amount.replace(numMatch[1], '');\n \n // Format the number nicely\n const formattedNum = adjustedNum % 1 === 0 ? adjustedNum.toString() : adjustedNum.toFixed(2);\n return formattedNum + remainder;\n }\n \n // For fractions or complex amounts, just show original with note\n return multiplier === 1 ? amount : `${amount} (×${multiplier})`;\n };\n\n const totalTime = (recipe.prepTime || 0) + (recipe.cookTime || 0);\n\n return (\n

\n {/* Header */}\n

\n \n ← Back to Recipes\n \n \n

\n onEdit(recipe)}\n className=\"bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 text-sm\"\n >\n ✏️ Edit\n \n setDeleteConfirm(true)}\n className=\"bg-red-600 text-white px-4 py-2 rounded-md hover:bg-red-700 text-sm\"\n >\n 🗑️ Delete\n \n

\n\n

{recipe.title}

\n \n {recipe.description && (\n

{recipe.description}

\n )}\n\n {/* Recipe Meta Info */}\n

\n {recipe.servings && (\n

👥

Servings

{recipe.servings}

\n )}\n \n {recipe.prepTime && (\n

⏱️

Prep Time

{formatTime(recipe.prepTime)}

\n )}\n \n {recipe.cookTime && (\n

🔥

Cook Time

{formatTime(recipe.cookTime)}

\n )}\n \n {totalTime > 0 && (\n

⏰

Total Time

{formatTime(totalTime)}

\n )}\n

\n\n {/* Tags and Difficulty */}\n

\n {recipe.difficulty && (\n \n {recipe.difficulty.charAt(0).toUpperCase() + recipe.difficulty.slice(1)}\n \n )}\n \n {recipe.tags?.map(tag => (\n \n #{tag}\n \n ))}\n

\n\n

\n {/* Ingredients */}\n

🥕 Ingredients

\n \n {recipe.servings && (\n

\n Servings:\n setServingMultiplier(parseFloat(e.target.value))}\n className=\"px-2 py-1 border border-gray-300 rounded text-sm\"\n >\n \n \n \n \n \n \n

\n )}\n

\n\n

\n {recipe.ingredients.map((ingredient, index) => (\n

\n {adjustIngredientAmount(ingredient.amount, servingMultiplier)} {ingredient.unit} {ingredient.name}\n

\n {ingredient.notes && (\n

{ingredient.notes}

\n )}\n

\n ))}\n

\n\n {/* Instructions */}\n

👩‍🍳 Instructions

\n \n

\n {recipe.steps.map((step, index) => (\n

\n toggleStepCheck(index)}\n className={`mt-1 w-6 h-6 rounded-full border-2 flex items-center justify-center transition-colors ${\n checkedSteps.has(index)\n ? 'bg-green-500 border-green-500 text-white'\n : 'border-gray-300 hover:border-green-400'\n }`}\n >\n {checkedSteps.has(index) && '✓'}\n \n

\n {step}\n

\n ))}\n

\n\n {/* Progress */}\n {checkedSteps.size > 0 && (\n

\n Progress\n \n {checkedSteps.size} of {recipe.steps.length} steps completed\n \n

\n )}\n

\n\n {/* Footer */}\n {recipe.source && (\n

\n Source: {recipe.source}\n

\n )}\n

\n\n {/* Delete Confirmation Modal */}\n {deleteConfirm && (\n

⚠️

Delete Recipe?

\n Are you sure you want to delete \"{recipe.title}\"? This action cannot be undone.\n

\n \n Delete\n \n setDeleteConfirm(false)}\n className=\"flex-1 bg-gray-300 text-gray-700 px-4 py-2 rounded-md hover:bg-gray-400\"\n >\n Cancel\n \n

\n )}\n

\n );\n}",[],[257,264,298],[257,264],{"_108":307,"_100":308,"_152":309,"_154":258,"_155":139,"_156":259,"_157":158,"_110":310,"_105":31,"_160":178,"_162":311,"_163":27,"_164":-5,"_165":312,"_103":313},"c0a25f1e-494d-11f0-a1c9-76b3cceeab13","index.html","c0a25fe6-494d-11f0-a1c9-76b3cceeab13",["D",1749925874156],"\n\n\n \n \n Recipe Parser - Capture, Parse & Store Recipes\n \n \n \n \n \n \n \n \n \n \n \n \n \n\n\n

\n \n \n \n\n",[],[257,308],{"_108":315,"_100":316,"_152":317,"_154":258,"_155":139,"_156":283,"_157":158,"_110":318,"_105":31,"_160":202,"_162":319,"_163":27,"_164":-5,"_165":320,"_103":321},"c4e1ca2e-494d-11f0-a1c9-76b3cceeab13","index.tsx","c4e1caf6-494d-11f0-a1c9-76b3cceeab13",["D",1749925881285],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport ReactDOM from \"https://esm.sh/react-dom@18.2.0/client\";\nimport App from \"./components/App.tsx\";\n\nconst root = ReactDOM.createRoot(document.getElementById('root')!);\nroot.render();",[],[257,316],[257],{"_108":324,"_100":325,"_152":326,"_154":-5,"_155":139,"_156":327,"_157":158,"_110":328,"_105":31,"_160":161,"_162":-5,"_163":27,"_164":-5,"_165":329,"_103":338},"711995ac-494d-11f0-bc66-76b3cceeab13","shared","17a72b47-8d83-4d42-9c87-58fceff0e9c7",2,["D",1749925740721],[330],{"_108":331,"_100":332,"_152":333,"_154":326,"_155":139,"_156":327,"_157":158,"_110":334,"_105":31,"_160":202,"_162":335,"_163":27,"_164":-5,"_165":336,"_103":337},"71198bd4-494d-11f0-bc66-76b3cceeab13","types.ts","71198cc4-494d-11f0-bc66-76b3cceeab13",["D",1749925740721],"// Shared types for the Recipe Parser App\n\nexport interface Ingredient {\n id?: number;\n name: string;\n amount: string;\n unit: string;\n notes?: string;\n}\n\nexport interface Recipe {\n id?: number;\n title: string;\n description?: string;\n ingredients: Ingredient[];\n steps: string[];\n servings?: number;\n prepTime?: number; // in minutes\n cookTime?: number; // in minutes\n difficulty?: 'easy' | 'medium' | 'hard';\n tags?: string[];\n source?: string; // URL or source description\n imageUrl?: string;\n createdAt?: string;\n updatedAt?: string;\n}\n\nexport interface ParseRequest {\n type: 'url' | 'pdf' | 'image';\n content: string; // URL, base64 PDF, or base64 image\n filename?: string;\n}\n\nexport interface ParseResponse {\n success: boolean;\n recipe?: Recipe;\n error?: string;\n}\n\nexport interface ApiResponse {\n success: boolean;\n data?: T;\n error?: string;\n}\n\nexport interface RecipeFilters {\n search?: string;\n tags?: string[];\n difficulty?: string;\n maxPrepTime?: number;\n maxCookTime?: number;\n}",[],[325,332],[325],{"_108":340,"_100":341,"_152":342,"_154":-5,"_155":139,"_156":138,"_157":158,"_110":343,"_105":31,"_160":178,"_162":344,"_163":27,"_164":-5,"_165":345,"_103":346},"702053da-499c-11f0-aceb-76b3cceeab13",".vtignore","70205466-499c-11f0-aceb-76b3cceeab13",["D",1749959669326],".git\n.vscode\n.cursorrules\n.DS_Store\nnode_modules\nvendor",[],[341],{"_108":348,"_100":349,"_152":350,"_154":-5,"_155":139,"_156":351,"_157":158,"_110":352,"_105":31,"_160":178,"_162":353,"_163":27,"_164":-5,"_165":354,"_103":355},"6af3e66e-494d-11f0-b6e4-76b3cceeab13","README.md","6af3e754-494d-11f0-b6e4-76b3cceeab13",1,["D",1749925730409],"# Recipe Parser App\n\nA mobile-friendly web application that captures, parses, and stores recipes from multiple sources including URLs, PDFs, and images.\n\n## Features\n\n- **Multi-source Recipe Input**: Accept recipes from:\n - Web URLs (recipe websites)\n - PDF files\n - Images (photos of recipes)\n- **Intelligent Parsing**: Automatically extracts:\n - Dish title\n - Ingredients with quantities\n - Cooking steps/instructions\n- **Mobile-Friendly**: Responsive design optimized for mobile devices\n- **Recipe Storage**: Persistent storage of parsed recipes\n- **Recipe Management**: View, edit, and organize saved recipes\n\n## Tech Stack\n\n- **Frontend**: React with TypeScript, TailwindCSS\n- **Backend**: Hono API framework\n- **Database**: SQLite for recipe storage\n- **AI**: OpenAI GPT-4 for intelligent recipe parsing\n- **File Processing**: PDF parsing and image OCR capabilities\n\n## Project Structure\n\n```\n├── backend/\n│ ├── database/\n│ │ ├── migrations.ts # Database schema\n│ │ └── queries.ts # Database operations\n│ ├── routes/\n│ │ ├── recipes.ts # Recipe CRUD operations\n│ │ └── parse.ts # Recipe parsing endpoints\n│ └── index.ts # Main API entry point\n├── frontend/\n│ ├── components/\n│ │ ├── App.tsx # Main app component\n│ │ ├── RecipeForm.tsx # Recipe input form\n│ │ ├── RecipeList.tsx # Recipe listing\n│ │ └── RecipeView.tsx # Individual recipe display\n│ ├── index.html # Main HTML template\n│ └── index.tsx # Frontend entry point\n└── shared/\n └── types.ts # Shared TypeScript types\n```\n\n## API Endpoints\n\n- `POST /api/parse/url` - Parse recipe from URL\n- `POST /api/parse/pdf` - Parse recipe from PDF\n- `POST /api/parse/image` - Parse recipe from image\n- `GET /api/recipes` - Get all recipes\n- `POST /api/recipes` - Save a recipe\n- `GET /api/recipes/:id` - Get specific recipe\n- `PUT /api/recipes/:id` - Update recipe\n- `DELETE /api/recipes/:id` - Delete recipe\n\n## Usage\n\n1. Open the app in your browser\n2. Choose input method (URL, PDF, or image)\n3. Submit your recipe source\n4. Review and edit the parsed recipe\n5. Save to your recipe collection",[],[349],{"_108":357,"_100":358,"_152":359,"_154":-5,"_155":139,"_156":138,"_157":158,"_110":360,"_105":31,"_160":178,"_162":361,"_163":27,"_164":-5,"_165":362,"_103":363},"70205a2e-499c-11f0-aceb-76b3cceeab13","deno.json","70205ab0-499c-11f0-aceb-76b3cceeab13",["D",1749959669326],"{\n \"$schema\": \"https://raw.githubusercontent.com/denoland/deno/348900b8b79f4a434cab4c74b3bc8d4d2fa8ee74/cli/schemas/config-file.v1.json\",\n \"lock\": false,\n \"compilerOptions\": {\n \"noImplicitAny\": false,\n \"strict\": false,\n \"types\": [\n \"https://www.val.town/types/valtown.d.ts\"\n ],\n \"lib\": [\n \"dom\",\n \"dom.iterable\",\n \"dom.asynciterable\",\n \"deno.ns\",\n \"deno.unstable\"\n ]\n },\n \"lint\": {\n \"files\": {\n \"include\": [\n \"deno:/https/esm.town/**/*\"\n ]\n },\n \"rules\": {\n \"exclude\": [\n \"no-explicit-any\"\n ]\n }\n },\n \"node_modules_dir\": false,\n \"experimental\": {\n \"unstable-node-globals\": true,\n \"unstable-temporal\": true,\n \"unstable-worker-options\": true,\n \"unstable-sloppy-imports\": true\n }\n}",[],[358],"files",[149,167,173,184,191,197,206,217,224,233,243,255,262,269,277,287,296,306,314,323,330,339,347,356],"counts",{"_368":31,"_369":327,"_370":31,"_371":31},"pulls","branches","forks","envVars","contents",[],{"_108":278,"_100":279,"_152":280,"_154":265,"_155":139,"_156":281,"_157":158,"_110":375,"_105":283,"_160":202,"_162":284,"_163":27,"_164":-5,"_103":376},["D",1749928965683],[257,264,279],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","routes/_app.x.$handle.$name.branch.$branch.history_.$",{"_98":99,"_100":101,"_102":42,"_103":104,"_106":383,"_178":387,"_390":391,"_439":440,"_452":-7,"_453":31,"_454":27},{"_108":109,"_100":101,"_110":384,"_112":-5,"_113":27,"_114":115,"_116":-5,"_117":-5,"_12":118,"_119":-5,"_120":27,"_121":-5,"_122":31,"_123":124,"_125":124,"_126":127,"_128":127,"_129":127,"_130":124,"_131":124,"_132":27,"_21":385,"_136":386},["D",1749925632351],{"_98":99,"_134":135},{"_105":138,"_100":42,"_108":139,"_140":109,"_141":-5,"_142":-5,"_143":-5,"_144":-5,"_145":101,"_146":99},{"_108":278,"_100":279,"_152":280,"_154":265,"_155":139,"_156":281,"_157":158,"_110":388,"_105":283,"_160":202,"_162":284,"_163":27,"_164":-5,"_103":389},["D",1749928965683],[257,264,279],"history",[392,394,399,405,410,415,421,426,431,435],{"_108":278,"_155":139,"_152":280,"_100":279,"_162":284,"_160":202,"_105":283,"_154":265,"_110":393,"_156":281,"_164":-5},["D",1749928965683],{"_108":395,"_155":139,"_152":280,"_100":279,"_162":396,"_160":202,"_105":259,"_154":265,"_110":397,"_156":398,"_164":-5},"ec850396-4954-11f0-86a3-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'file' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const [uploadedFile, setUploadedFile] = useState(null);\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n // Validation based on parse mode\n if (parseMode === 'file') {\n if (!uploadedFile || !parseInput.trim()) {\n setError('Please select a file to parse');\n return;\n }\n } else {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'file':\n if (!uploadedFile) {\n throw new Error('No file selected');\n }\n \n if (uploadedFile.type.startsWith('image/')) {\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n } else if (uploadedFile.type === 'application/pdf') {\n endpoint = '/api/parse/pdf';\n requestData = { type: 'pdf', content: parseInput };\n } else {\n throw new Error('Unsupported file type');\n }\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleFileUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n // Validate file type\n const isImage = file.type.startsWith('image/');\n const isPDF = file.type === 'application/pdf';\n \n if (!isImage && !isPDF) {\n setError('Please select an image file (JPG, PNG, etc.) or a PDF file');\n return;\n }\n\n setUploadedFile(file);\n setError(null);\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'file' && (\n

\n \n

\n 📷 Images (JPG, PNG, etc.) or 📄 PDF files supported\n

\n {uploadedFile && (\n

\n ✅\n \n {uploadedFile.type.startsWith('image/') ? '📷' : '📄'} \n {uploadedFile.name} uploaded and ready to parse\n \n

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",["D",1749928954259],57,{"_108":400,"_155":139,"_152":280,"_100":279,"_162":401,"_160":202,"_105":402,"_154":265,"_110":403,"_156":404,"_164":-5},"e72b4e1e-4954-11f0-b76e-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'file' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const [uploadedFile, setUploadedFile] = useState(null);\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'file':\n if (!uploadedFile) {\n throw new Error('No file selected');\n }\n \n if (uploadedFile.type.startsWith('image/')) {\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n } else if (uploadedFile.type === 'application/pdf') {\n endpoint = '/api/parse/pdf';\n requestData = { type: 'pdf', content: parseInput };\n } else {\n throw new Error('Unsupported file type');\n }\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleFileUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n // Validate file type\n const isImage = file.type.startsWith('image/');\n const isPDF = file.type === 'application/pdf';\n \n if (!isImage && !isPDF) {\n setError('Please select an image file (JPG, PNG, etc.) or a PDF file');\n return;\n }\n\n setUploadedFile(file);\n setError(null);\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'file' && (\n

\n \n

\n 📷 Images (JPG, PNG, etc.) or 📄 PDF files supported\n

\n {uploadedFile && (\n

\n ✅\n \n {uploadedFile.type.startsWith('image/') ? '📷' : '📄'} \n {uploadedFile.name} uploaded and ready to parse\n \n

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",7,["D",1749928945285],56,{"_108":406,"_155":139,"_152":280,"_100":279,"_162":407,"_160":202,"_105":237,"_154":265,"_110":408,"_156":409,"_164":-5},"e054285e-4954-11f0-b564-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'file' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const [uploadedFile, setUploadedFile] = useState(null);\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'file':\n if (!uploadedFile) {\n throw new Error('No file selected');\n }\n \n if (uploadedFile.type.startsWith('image/')) {\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n } else if (uploadedFile.type === 'application/pdf') {\n endpoint = '/api/parse/pdf';\n requestData = { type: 'pdf', content: parseInput };\n } else {\n throw new Error('Unsupported file type');\n }\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleFileUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n // Validate file type\n const isImage = file.type.startsWith('image/');\n const isPDF = file.type === 'application/pdf';\n \n if (!isImage && !isPDF) {\n setError('Please select an image file (JPG, PNG, etc.) or a PDF file');\n return;\n }\n\n setUploadedFile(file);\n setError(null);\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'image' && (\n

\n \n {parseInput && (\n

✅ Image uploaded and ready to parse

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",["D",1749928933808],55,{"_108":411,"_155":139,"_152":280,"_100":279,"_162":412,"_160":202,"_105":221,"_154":265,"_110":413,"_156":414,"_164":-5},"d8a9f4c6-4954-11f0-8308-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'file' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const [uploadedFile, setUploadedFile] = useState(null);\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'file':\n if (!uploadedFile) {\n throw new Error('No file selected');\n }\n \n if (uploadedFile.type.startsWith('image/')) {\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n } else if (uploadedFile.type === 'application/pdf') {\n endpoint = '/api/parse/pdf';\n requestData = { type: 'pdf', content: parseInput };\n } else {\n throw new Error('Unsupported file type');\n }\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleFileUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n // Validate file type\n const isImage = file.type.startsWith('image/');\n const isPDF = file.type === 'application/pdf';\n \n if (!isImage && !isPDF) {\n setError('Please select an image file (JPG, PNG, etc.) or a PDF file');\n return;\n }\n\n setUploadedFile(file);\n setError(null);\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n {(['url', 'text', 'image'] as const).map(mode => (\n setParseMode(mode)}\n className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${\n parseMode === mode\n ? 'bg-blue-600 text-white'\n : 'bg-white text-blue-600 border border-blue-300 hover:bg-blue-50'\n }`}\n >\n {mode === 'url' && '🔗 URL'}\n {mode === 'text' && '📝 Text'}\n {mode === 'image' && '📷 Image'}\n \n ))}\n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'image' && (\n

\n \n {parseInput && (\n

✅ Image uploaded and ready to parse

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",["D",1749928920883],54,{"_108":416,"_155":139,"_152":280,"_100":279,"_162":417,"_160":202,"_105":418,"_154":265,"_110":419,"_156":420,"_164":-5},"d347d5d4-4954-11f0-9624-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'file' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const [uploadedFile, setUploadedFile] = useState(null);\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'file':\n if (!uploadedFile) {\n throw new Error('No file selected');\n }\n \n if (uploadedFile.type.startsWith('image/')) {\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n } else if (uploadedFile.type === 'application/pdf') {\n endpoint = '/api/parse/pdf';\n requestData = { type: 'pdf', content: parseInput };\n } else {\n throw new Error('Unsupported file type');\n }\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleImageUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n if (!file.type.startsWith('image/')) {\n setError('Please select an image file');\n return;\n }\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'image' && (\n

\n \n {parseInput && (\n

✅ Image uploaded and ready to parse

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",4,["D",1749928911915],53,{"_108":422,"_155":139,"_152":280,"_100":279,"_162":423,"_160":202,"_105":188,"_154":265,"_110":424,"_156":425,"_164":-5},"bc52f368-4954-11f0-a714-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'file' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const [uploadedFile, setUploadedFile] = useState(null);\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'image':\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleImageUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n if (!file.type.startsWith('image/')) {\n setError('Please select an image file');\n return;\n }\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'image' && (\n

\n \n {parseInput && (\n

✅ Image uploaded and ready to parse

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",["D",1749928873402],52,{"_108":427,"_155":139,"_152":280,"_100":279,"_162":428,"_160":202,"_105":327,"_154":265,"_110":429,"_156":430,"_164":-5},"b99723e2-4954-11f0-8b61-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'file' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'image':\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleImageUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n if (!file.type.startsWith('image/')) {\n setError('Please select an image file');\n return;\n }\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'image' && (\n

\n \n {parseInput && (\n

✅ Image uploaded and ready to parse

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",["D",1749928868813],51,{"_108":432,"_155":139,"_152":280,"_100":279,"_162":433,"_160":202,"_105":351,"_154":265,"_110":434,"_156":229,"_164":-5},"18e701a6-494f-11f0-9d74-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'image' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Note: backend expects 'url' type for text parsing\n break;\n case 'image':\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleImageUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n if (!file.type.startsWith('image/')) {\n setError('Please select an image file');\n return;\n }\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'image' && (\n

\n \n {parseInput && (\n

✅ Image uploaded and ready to parse

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",["D",1749926451740],{"_108":436,"_155":139,"_152":280,"_100":279,"_162":437,"_160":202,"_105":31,"_154":265,"_110":438,"_156":212,"_164":-5},"093b2a08-494e-11f0-8925-76b3cceeab13","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport type { Recipe, Ingredient, ParseRequest } from \"../../shared/types.ts\";\n\ninterface RecipeFormProps {\n recipe?: Recipe | null;\n onRecipeSaved: (recipe: Recipe) => void;\n onCancel: () => void;\n}\n\nexport default function RecipeForm({ recipe, onRecipeSaved, onCancel }: RecipeFormProps) {\n const [formData, setFormData] = useState>({\n title: recipe?.title || '',\n description: recipe?.description || '',\n ingredients: recipe?.ingredients || [{ name: '', amount: '', unit: '' }],\n steps: recipe?.steps || [''],\n servings: recipe?.servings || undefined,\n prepTime: recipe?.prepTime || undefined,\n cookTime: recipe?.cookTime || undefined,\n difficulty: recipe?.difficulty || undefined,\n tags: recipe?.tags || [],\n source: recipe?.source || ''\n });\n\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const [parseMode, setParseMode] = useState<'manual' | 'url' | 'image' | 'text'>('manual');\n const [parseInput, setParseInput] = useState('');\n const fileInputRef = useRef(null);\n\n const isEditing = !!recipe?.id;\n\n const handleInputChange = (field: keyof Recipe, value: any) => {\n setFormData(prev => ({ ...prev, [field]: value }));\n setError(null);\n };\n\n const handleIngredientChange = (index: number, field: keyof Ingredient, value: string) => {\n const newIngredients = [...(formData.ingredients || [])];\n newIngredients[index] = { ...newIngredients[index], [field]: value };\n handleInputChange('ingredients', newIngredients);\n };\n\n const addIngredient = () => {\n const newIngredients = [...(formData.ingredients || []), { name: '', amount: '', unit: '' }];\n handleInputChange('ingredients', newIngredients);\n };\n\n const removeIngredient = (index: number) => {\n const newIngredients = (formData.ingredients || []).filter((_, i) => i !== index);\n handleInputChange('ingredients', newIngredients);\n };\n\n const handleStepChange = (index: number, value: string) => {\n const newSteps = [...(formData.steps || [])];\n newSteps[index] = value;\n handleInputChange('steps', newSteps);\n };\n\n const addStep = () => {\n const newSteps = [...(formData.steps || []), ''];\n handleInputChange('steps', newSteps);\n };\n\n const removeStep = (index: number) => {\n const newSteps = (formData.steps || []).filter((_, i) => i !== index);\n handleInputChange('steps', newSteps);\n };\n\n const handleTagsChange = (value: string) => {\n const tags = value.split(',').map(tag => tag.trim()).filter(tag => tag);\n handleInputChange('tags', tags);\n };\n\n const parseRecipe = async () => {\n if (!parseInput.trim()) {\n setError('Please provide input to parse');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n let endpoint = '';\n let requestData: ParseRequest;\n\n switch (parseMode) {\n case 'url':\n endpoint = '/api/parse/url';\n requestData = { type: 'url', content: parseInput };\n break;\n case 'text':\n endpoint = '/api/parse/text';\n requestData = { type: 'url', content: parseInput }; // Using url type for text parsing\n break;\n case 'image':\n endpoint = '/api/parse/image';\n requestData = { type: 'image', content: parseInput };\n break;\n default:\n throw new Error('Invalid parse mode');\n }\n\n const response = await fetch(endpoint, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(requestData)\n });\n\n const data = await response.json();\n\n if (data.success && data.recipe) {\n setFormData(data.recipe);\n setParseMode('manual');\n setParseInput('');\n } else {\n setError(data.error || 'Failed to parse recipe');\n }\n } catch (error) {\n setError('Network error while parsing recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const handleImageUpload = (event: React.ChangeEvent) => {\n const file = event.target.files?.[0];\n if (!file) return;\n\n if (!file.type.startsWith('image/')) {\n setError('Please select an image file');\n return;\n }\n\n const reader = new FileReader();\n reader.onload = (e) => {\n const base64 = e.target?.result as string;\n setParseInput(base64);\n };\n reader.readAsDataURL(file);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validation\n if (!formData.title?.trim()) {\n setError('Recipe title is required');\n return;\n }\n\n if (!formData.ingredients?.length || formData.ingredients.every(ing => !ing.name.trim())) {\n setError('At least one ingredient is required');\n return;\n }\n\n if (!formData.steps?.length || formData.steps.every(step => !step.trim())) {\n setError('At least one cooking step is required');\n return;\n }\n\n setLoading(true);\n setError(null);\n\n try {\n const cleanedData = {\n ...formData,\n ingredients: formData.ingredients?.filter(ing => ing.name.trim()) || [],\n steps: formData.steps?.filter(step => step.trim()) || []\n };\n\n const url = isEditing ? `/api/recipes/${recipe.id}` : '/api/recipes';\n const method = isEditing ? 'PUT' : 'POST';\n\n const response = await fetch(url, {\n method,\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(cleanedData)\n });\n\n const data = await response.json();\n\n if (data.success) {\n onRecipeSaved(data.data);\n } else {\n setError(data.error || 'Failed to save recipe');\n }\n } catch (error) {\n setError('Network error while saving recipe');\n } finally {\n setLoading(false);\n }\n };\n\n const renderParseSection = () => (\n

🤖 Smart Recipe Parser

\n \n

\n\n {parseMode === 'url' && (\n

\n setParseInput(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'text' && (\n

\n setParseInput(e.target.value)}\n rows={4}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n )}\n\n {parseMode === 'image' && (\n

\n \n {parseInput && (\n

✅ Image uploaded and ready to parse

\n )}\n

\n )}\n\n \n {loading ? (\n <>\n

\n Parsing...\n \n ) : (\n '🔍 Parse Recipe'\n )}\n \n

\n );\n\n return (\n

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

\n \n ✕\n \n

\n\n {!isEditing && renderParseSection()}\n\n {error && (\n

⚠️

{error}

\n )}\n\n

\n {/* Basic Info */}\n

\n\n

\n\n {/* Ingredients */}\n

🥕 Ingredients *

\n \n + Add Ingredient\n \n

\n\n

\n {(formData.ingredients || []).map((ingredient, index) => (\n

\n ))}\n

\n\n {/* Steps */}\n

👩‍🍳 Cooking Steps *

\n \n + Add Step\n \n

\n\n

\n {(formData.steps || []).map((step, index) => (\n

\n {index + 1}\n

\n ))}\n

\n\n {/* Source */}\n

\n\n {/* Submit Buttons */}\n

\n \n {loading ? (\n <>\n

\n Saving...\n \n ) : (\n <>\n 💾 {isEditing ? 'Update Recipe' : 'Save Recipe'}\n \n )}\n \n \n Cancel\n \n

\n );\n}",["D",1749925995956],"versions",[441,443,444,445,446,447,448,449,450,451],{"_178":392,"_442":394},"previous",{"_178":394,"_442":399},{"_178":399,"_442":405},{"_178":405,"_442":410},{"_178":410,"_442":415},{"_178":415,"_442":421},{"_178":421,"_442":426},{"_178":426,"_442":431},{"_178":431,"_442":435},{"_178":435,"_442":-5},"versionNumber","page","hasNext","routes/_app","actionData","errors"]

Hi

Error

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

No recipes yet

onRecipeSelect(recipe)}\n >\n {recipe.title}\n

📚 My Recipes

No recipes found

Delete Recipe?

Recipe not found

{recipe.title}

🥕 Ingredients

👩‍🍳 Instructions

Delete Recipe?

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

🤖 Smart Recipe Parser

\n {isEditing ? '✏️ Edit Recipe' : '➕ Add New Recipe'}\n

🥕 Ingredients *

👩‍🍳 Cooking Steps *

History for RecipeForm.tsx