fix Analyse

This commit is contained in:
nadja
2026-08-26 18:29:39 +02:00
parent 797279f641
commit e60da3daf6
9 changed files with 18 additions and 127 deletions

View File

@@ -52,13 +52,6 @@ export async function extractFromTikTok(url) {
});
}
export async function extractFromInstagram(url) {
return apiFetch(`${API_BASE}/from-instagram`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ url }),
});
}
export async function fetchCategories() {
return apiFetch(`${API_BASE}/categories`);

View File

@@ -28,7 +28,7 @@ export default function RecipeCard({ recipe }) {
</p>
)}
<div className="flex items-center gap-4 text-xs text-gray-400">
{author && <span>@{author} ({source === 'instagram' ? 'IG' : 'TT'})</span>}
{author && <span>@{author} (TT)</span>}
<span>{recipe.ingredients?.length || 0} Zutaten</span>
<span>{recipe.steps?.length || 0} Schritte</span>
</div>

View File

@@ -1,6 +1,6 @@
import { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { extractFromTikTok, extractFromInstagram, saveRecipe } from '../api';
import { extractFromTikTok, saveRecipe } from '../api';
import { useAuth } from '../context/AuthContext';
import IngredientList from '../components/IngredientList';
import StepList from '../components/StepList';
@@ -8,7 +8,6 @@ import StepList from '../components/StepList';
const CATEGORIES = ['Frühstück', 'Hauptgericht', 'Dessert', 'Snack', 'Getränk', 'Sonstiges'];
function detectSource(url) {
if (/instagram\.com\/(p|reel)\//.test(url)) return 'instagram';
if (/tiktok\.com\//.test(url)) return 'tiktok';
return null;
}
@@ -37,7 +36,7 @@ export default function AddRecipe() {
if (!url.trim()) return;
const detected = detectSource(url);
if (!detected) {
setError('URL muss von TikTok oder Instagram sein.');
setError('URL muss von TikTok sein.');
return;
}
@@ -46,20 +45,11 @@ export default function AddRecipe() {
setAiStatus(null);
setAiMessage('');
try {
let data;
if (detected === 'instagram') {
data = await extractFromInstagram(url);
const ig = data.instagram;
setThumbnail(ig.thumbnail);
setSourceAuthor(ig.author);
setSource('instagram');
} else {
data = await extractFromTikTok(url);
const tt = data.tiktok;
setThumbnail(tt.thumbnail);
setSourceAuthor(tt.author);
setSource('tiktok');
}
const data = await extractFromTikTok(url);
const tt = data.tiktok;
setThumbnail(tt.thumbnail);
setSourceAuthor(tt.author);
setSource('tiktok');
if (data.extracted) {
setName(data.extracted.name || '');
@@ -68,7 +58,7 @@ export default function AddRecipe() {
setIngredients(data.extracted.ingredients || []);
setSteps(data.extracted.steps || []);
} else {
setName(detected === 'instagram' ? (data.instagram?.title || '') : (data.tiktok?.title || ''));
setName(data.tiktok?.title || '');
}
setAiStatus(data.aiStatus || (data.extracted ? 'success' : 'unavailable'));
setAiMessage(data.aiMessage || '');
@@ -106,14 +96,14 @@ export default function AddRecipe() {
<div className="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">
<label className="block text-sm font-medium text-gray-700 mb-2">
Video-URL (TikTok oder Instagram Reel)
Video-URL (TikTok)
</label>
<div className="flex gap-2">
<input
type="url"
value={url}
onChange={e => setUrl(e.target.value)}
placeholder="https://www.tiktok.com/@user/video/... oder https://www.instagram.com/reel/..."
placeholder="https://www.tiktok.com/@user/video/..."
className="flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
onKeyDown={e => e.key === 'Enter' && handleExtract()}
/>

View File

@@ -107,7 +107,7 @@ export default function Home() {
<div className="text-center py-12">
<p className="text-gray-400 text-lg mb-2">Keine Rezepte gefunden</p>
<p className="text-gray-400 text-sm">
Füge dein erstes Rezept über TikTok- oder Instagram-Links hinzu!
Füge dein erstes Rezept über TikTok-Links hinzu!
</p>
</div>
) : (

View File

@@ -53,18 +53,10 @@ export default function RecipeDetail() {
let videoId = null;
let embedUrl = null;
if (sourceUrl) {
if (sourceType === 'instagram') {
const igMatch = sourceUrl.match(/instagram\.com\/(?:p|reel)\/([A-Za-z0-9_-]+)/);
if (igMatch) {
videoId = igMatch[1];
embedUrl = `https://www.instagram.com/reel/${videoId}/embed/`;
}
} else {
const ttMatch = sourceUrl.match(/video\/(\d+)/);
if (ttMatch) {
videoId = ttMatch[1];
embedUrl = `https://www.tiktok.com/embed/v2/${videoId}`;
}
const ttMatch = sourceUrl.match(/video\/(\d+)/);
if (ttMatch) {
videoId = ttMatch[1];
embedUrl = `https://www.tiktok.com/embed/v2/${videoId}`;
}
}
@@ -78,7 +70,7 @@ export default function RecipeDetail() {
<div className="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
{embedUrl && (
<div className="w-full" style={{ paddingBottom: sourceType === 'instagram' ? '100%' : '177.78%', position: 'relative' }}>
<div className="w-full" style={{ paddingBottom: '177.78%', position: 'relative' }}>
<iframe
src={embedUrl}
className="absolute inset-0 w-full h-full"
@@ -153,7 +145,7 @@ export default function RecipeDetail() {
{author && (
<p className="text-xs text-gray-400">
Quelle: @{author} ({sourceType === 'instagram' ? 'Instagram' : 'TikTok'})
Quelle: @{author} (TikTok)
</p>
)}