with thumbnail!

src/routes/api/extract/+server.ts

@@ -3,8 +3,8 @@ import { createLLM } from '$lib/server/llm';
 import { json } from '@sveltejs/kit';
 import fs, { writeFileSync } from 'fs';
 import { zodResponseFormat } from 'openai/helpers/zod';
-import { z } from 'zod';
 import path from 'path';
+import { z } from 'zod';
 
 const RecipeSchema = z.object({
     name: z.string(),
@@ -15,7 +15,8 @@ const RecipeSchema = z.object({
         amount: z.string(),
         unit: z.string()
     })).nullable(),
-    steps: z.array(z.string()).nullable()
+    steps: z.array(z.string()).nullable(),
+    image: z.string().nullable().optional()
 });
 
 
@@ -34,18 +35,43 @@ export async function POST({ request }) {
 
     const context = await createBrowserContext(authPath);
     const page = await context.newPage();
+    
+    // Set a fixed viewport size (Instagram feed width)
+    await page.setViewportSize({ width: 1080, height: 1920 });
+    
     let bodyText = '';
+    let thumbnail: string | null = null;
 
     try {
         await page.goto(url, { waitUntil: 'domcontentloaded' });
-        // Extract HTML from the page
         bodyText = (await page.evaluate(() => document.body.innerText)).replace(/^(?:.*\n){6}/, '').split('More posts from')[0].trim();
-        
-        // Cleaning steps
-        // 1. Remove @tags and #hashtags
         bodyText = bodyText.replace(/@\w+/g, '').replace(/#\w+/g, '');
-        
+
         writeFileSync(path.resolve('debug_page.txt'), bodyText); // Save for debugging, overwriting if exists
+        const videoBounds = await page.evaluate(() => {
+            const video = document.querySelector('video');
+            if (!video) return null;
+            const rect = video.getBoundingClientRect();
+            return {
+                x: Math.max(0, rect.left),
+                y: Math.max(0, rect.top),
+                width: Math.min(rect.width, window.innerWidth),
+                height: Math.min(rect.height, window.innerHeight)
+            };
+        });
+
+        if (videoBounds && videoBounds.width > 0 && videoBounds.height > 0) {
+            const screenshotBuffer = await page.screenshot({ 
+                type: 'jpeg', 
+                quality: 85,
+                clip: videoBounds
+            });
+            thumbnail = `data:image/jpeg;base64,${screenshotBuffer.toString('base64')}`;
+        } else {
+            console.warn('Video element not found or has no size, taking full page screenshot');
+            const screenshotBuffer = await page.screenshot({ type: 'jpeg', quality: 85 });
+            thumbnail = `data:image/jpeg;base64,${screenshotBuffer.toString('base64')}`;
+        }  
     } catch (e) {
         console.error('Scraping error:', e);
         return json({ error: 'Failed to scrape URL' }, { status: 500 });
@@ -122,10 +148,15 @@ Extract ONLY what's explicitly in the text. Be accurate and literal.
         } else {
             recipe.description = `Link: ${url}`;
         }
+
+        // Add thumbnail to recipe
+        if (thumbnail) {
+            recipe.image = thumbnail;
+        }
         
-        return json({ recipe });
+        return json({ recipe, bodyText });
     } catch (e) {
          console.error('LLM error:', e);
-         return json({ error: 'Failed to parse recipe' }, { status: 500 });
+         return json({ error: 'Failed to parse recipe', bodyText }, { status: 500 });
     }
 }

src/routes/api/tandoor/+server.ts

@@ -1,5 +1,5 @@
 import { json } from '@sveltejs/kit';
-import { uploadRecipeWithIngredientsDTO } from '$lib/server/tandoor';
+import { uploadRecipeWithIngredientsDTO, uploadRecipeImage } from '$lib/server/tandoor';
 
 export async function POST({ request }) {
 	const { recipe } = await request.json();
@@ -15,10 +15,20 @@ export async function POST({ request }) {
 			return json({ error: result.error || 'Failed to upload recipe' }, { status: 500 });
 		}
 
+		// Upload image if available
+		let imageStatus = null;
+		if (result.recipeId && result.imageUrl) {
+			imageStatus = await uploadRecipeImage(result.recipeId, result.imageUrl);
+			if (!imageStatus.success) {
+				console.warn('Image upload failed, but recipe created:', imageStatus.error);
+			}
+		}
+
 		return json({
 			success: true,
 			message: 'Recipe successfully imported to Tandoor',
-			recipeId: result.recipeId
+			recipeId: result.recipeId,
+			imageUpload: imageStatus?.success ? 'successful' : 'failed'
 		});
 	} catch (error) {
 		console.error('Tandoor upload error:', error);