function MainComponent() { const [trendingPlants, setTrendingPlants] = useState([]); const [recommendations, setRecommendations] = useState([]); const [isLoading, setIsLoading] = useState(true); const [currentTrendingIndex, setCurrentTrendingIndex] = useState(0); const [currentRecommendationIndex, setCurrentRecommendationIndex] = useState(0); const { data: user } = useUser(); useEffect(()=>{ const fetchData = async ()=>{ setIsLoading(true); try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "user", content: "Generate 6 trending plants for 2025 and 6 gardening recommendations. For each plant and recommendation, include: name, description (50-70 words), care difficulty (easy/medium/hard), and an appropriate image search term for Pexels." } ], json_schema: { name: "gardening_content", schema: { type: "object", properties: { trendingPlants: { type: "array", items: { type: "object", properties: { name: { type: "string" }, description: { type: "string" }, difficulty: { type: "string", enum: [ "Easy", "Medium", "Hard" ] }, imageSearchTerm: { type: "string" } }, required: [ "name", "description", "difficulty", "imageSearchTerm" ] } }, gardeningRecommendations: { type: "array", items: { type: "object", properties: { title: { type: "string" }, description: { type: "string" }, difficulty: { type: "string", enum: [ "Easy", "Medium", "Hard" ] }, imageSearchTerm: { type: "string" } }, required: [ "title", "description", "difficulty", "imageSearchTerm" ] } } }, required: [ "trendingPlants", "gardeningRecommendations" ] } } }) }); if (!response.ok) { throw new Error("Failed to fetch gardening content"); } const data = await response.json(); if (data.choices && data.choices[0]?.message?.content) { try { const parsedContent = JSON.parse(data.choices[0].message.content); const plantsWithImages = await Promise.all(parsedContent.trendingPlants.map(async (plant)=>{ const imageUrl = await fetchImageUrl(plant.imageSearchTerm); return { ...plant, imageUrl }; })); const recommendationsWithImages = await Promise.all(parsedContent.gardeningRecommendations.map(async (rec)=>{ const imageUrl = await fetchImageUrl(rec.imageSearchTerm); return { ...rec, imageUrl }; })); setTrendingPlants(plantsWithImages); setRecommendations(recommendationsWithImages); } catch (error) { console.error("Error parsing content:", error); setFallbackData(); } } else { setFallbackData(); } } catch (error) { console.error("Error fetching gardening content:", error); setFallbackData(); } finally{ setIsLoading(false); } }; fetchData(); const trendingInterval = setInterval(()=>{ setCurrentTrendingIndex((prevIndex)=>prevIndex === 5 ? 0 : prevIndex + 1); }, 8000); const recommendationInterval = setInterval(()=>{ setCurrentRecommendationIndex((prevIndex)=>prevIndex === 5 ? 0 : prevIndex + 1); }, 10000); return ()=>{ clearInterval(trendingInterval); clearInterval(recommendationInterval); }; }, []); const fetchImageUrl = async (searchTerm)=>{ try { const response = await fetch("/api/pexels-image-generator", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: searchTerm }) }); if (!response.ok) { throw new Error("Failed to fetch image"); } const data = await response.json(); return data.imageUrl || "/placeholder-plant.jpg"; } catch (error) { console.error(`Error fetching image for ${searchTerm}:`, error); return "/placeholder-plant.jpg"; } }; const setFallbackData = ()=>{ setTrendingPlants([ { name: "Monstera Deliciosa", description: "The Swiss Cheese Plant continues to trend with its distinctive perforated leaves. Easy to care for and dramatic in appearance, it's perfect for adding a tropical touch to any room.", difficulty: "Easy", imageUrl: "https://images.pexels.com/photos/3097770/pexels-photo-3097770.jpeg" }, { name: "Calathea Orbifolia", description: "Known for its stunning round striped leaves, this plant brings elegance to any space. While requiring more attention with humidity needs, its beauty makes it worth the effort.", difficulty: "Medium", imageUrl: "https://images.pexels.com/photos/2123482/pexels-photo-2123482.jpeg" }, { name: "String of Pearls", description: "This succulent with its bead-like leaves creates a beautiful cascading effect. Perfect for hanging planters and requires minimal watering, making it ideal for busy plant lovers.", difficulty: "Easy", imageUrl: "https://images.pexels.com/photos/4505161/pexels-photo-4505161.jpeg" }, { name: "Fiddle Leaf Fig", description: "With its large, violin-shaped leaves, this statement plant remains a designer favorite. It adds height and drama to any room but requires consistent care to thrive.", difficulty: "Medium", imageUrl: "https://images.pexels.com/photos/6208087/pexels-photo-6208087.jpeg" }, { name: "Pilea Peperomioides", description: "The Chinese Money Plant features unique round leaves on thin stems. Easy to propagate and share with friends, it's perfect for minimalist decor and brings good fortune.", difficulty: "Easy", imageUrl: "https://images.pexels.com/photos/4751978/pexels-photo-4751978.jpeg" }, { name: "Alocasia Polly", description: "This compact Alocasia variety features dramatic arrow-shaped leaves with striking white veins. It adds an exotic touch to any space but requires attention to humidity and watering.", difficulty: "Hard", imageUrl: "https://images.pexels.com/photos/6208086/pexels-photo-6208086.jpeg" } ]); setRecommendations([ { title: "Create a Vertical Herb Garden", description: "Maximize space by growing herbs vertically using wall planters or tiered stands. Perfect for kitchens, balconies, or small spaces, providing fresh herbs year-round while adding greenery.", difficulty: "Easy", imageUrl: "https://images.pexels.com/photos/6231753/pexels-photo-6231753.jpeg" }, { title: "Start Composting", description: "Transform kitchen scraps and yard waste into nutrient-rich soil. Use a compact bin for apartments or a larger system for yards. Reduces waste while creating free, high-quality fertilizer.", difficulty: "Medium", imageUrl: "https://images.pexels.com/photos/4505170/pexels-photo-4505170.jpeg" }, { title: "Plant a Pollinator Garden", description: "Support local ecosystems by planting native flowers that attract bees, butterflies, and hummingbirds. Creates a vibrant, colorful garden while helping essential pollinators thrive.", difficulty: "Medium", imageUrl: "https://images.pexels.com/photos/2422915/pexels-photo-2422915.jpeg" }, { title: "Try Microgreens", description: "Grow nutrient-dense microgreens indoors year-round. Ready to harvest in just 7-14 days, they're perfect for adding fresh flavor to salads, sandwiches, and smoothies.", difficulty: "Easy", imageUrl: "https://images.pexels.com/photos/7728082/pexels-photo-7728082.jpeg" }, { title: "Install a Rain Barrel", description: "Collect rainwater from your roof to use in your garden. Conserves water, reduces runoff, and provides chemical-free water that plants love. An eco-friendly addition to any garden.", difficulty: "Medium", imageUrl: "https://images.pexels.com/photos/2249959/pexels-photo-2249959.jpeg" }, { title: "Create a Succulent Arrangement", description: "Combine different succulent varieties in a shallow container for a stunning, low-maintenance display. Perfect for beginners, drought-resistant, and adds a modern touch to any space.", difficulty: "Easy", imageUrl: "https://images.pexels.com/photos/1470171/pexels-photo-1470171.jpeg" } ]); }; const handlePlantClick = async (plantName)=>{ try { window.location.href = `/?query=${encodeURIComponent(plantName)}`; } catch (error) { console.error("Error navigating to plant:", error); } }; const handleRecommendationClick = (title)=>{ try { window.location.href = `/?query=${encodeURIComponent(title)}`; } catch (error) { console.error("Error navigating to recommendation:", error); } }; const getDifficultyColor = (difficulty)=>{ switch(difficulty){ case "Easy": return "text-green-600"; case "Medium": return "text-yellow-600"; case "Hard": return "text-red-600"; default: return "text-gray-600"; } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#F5F5F0]", __source: { fileName: "", lineNumber: 296, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-[#2F5233] text-white p-4 flex justify-between items-center", __source: { fileName: "", lineNumber: 297, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 298, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center", __source: { fileName: "", lineNumber: 299, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-leaf text-[#F2D785] mr-2", __source: { fileName: "", lineNumber: 300, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-crimson-text text-xl", __source: { fileName: "", lineNumber: 301, columnNumber: 13 }, __self: this }, "Ecopedia"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 304, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/plant-identifier", className: "text-white hover:text-[#F2D785] transition-colors text-sm font-inter mr-4", __source: { fileName: "", lineNumber: 305, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-camera mr-1", __source: { fileName: "", lineNumber: 309, columnNumber: 13 }, __self: this }), " Plant Identifier"), user ? /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 312, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-inter text-sm hidden md:inline", __source: { fileName: "", lineNumber: 313, columnNumber: 15 }, __self: this }, "Welcome, ", user.email), /*#__PURE__*/ React.createElement("a", { href: "/account/logout", className: "bg-[#F2D785] text-[#2F5233] px-3 py-1 rounded-lg text-sm font-inter hover:bg-[#E5C876] transition-colors", __source: { fileName: "", lineNumber: 316, columnNumber: 15 }, __self: this }, "Sign Out")) : /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 324, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "text-white hover:text-[#F2D785] transition-colors text-sm font-inter", __source: { fileName: "", lineNumber: 325, columnNumber: 15 }, __self: this }, "Sign In"), /*#__PURE__*/ React.createElement("a", { href: "/account/signup", className: "bg-[#F2D785] text-[#2F5233] px-3 py-1 rounded-lg text-sm font-inter hover:bg-[#E5C876] transition-colors", __source: { fileName: "", lineNumber: 331, columnNumber: 15 }, __self: this }, "Sign Up")))), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2F5233] py-12 relative overflow-hidden", __source: { fileName: "", lineNumber: 342, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 opacity-20", __source: { fileName: "", lineNumber: 343, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute top-0 left-0 w-full h-full", __source: { fileName: "", lineNumber: 344, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-leaf text-[#F2D785] text-6xl absolute top-10 left-10 transform rotate-45", __source: { fileName: "", lineNumber: 345, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fas fa-seedling text-[#F2D785] text-5xl absolute top-20 right-20", __source: { fileName: "", lineNumber: 346, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fas fa-leaf text-[#F2D785] text-7xl absolute bottom-10 left-1/4 transform -rotate-12", __source: { fileName: "", lineNumber: 347, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fas fa-leaf text-[#F2D785] text-5xl absolute bottom-20 right-1/3 transform rotate-90", __source: { fileName: "", lineNumber: 348, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 relative z-10", __source: { fileName: "", lineNumber: 351, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 352, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-crimson-text text-4xl md:text-5xl text-white mb-4", __source: { fileName: "", lineNumber: 353, columnNumber: 13 }, __self: this }, "Discover Green Inspirations"), /*#__PURE__*/ React.createElement("p", { className: "font-inter text-lg text-[#F2D785] max-w-2xl mx-auto", __source: { fileName: "", lineNumber: 356, columnNumber: 13 }, __self: this }, "Explore trending plants and expert gardening recommendations to transform your space into a thriving oasis")))), /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 py-12", __source: { fileName: "", lineNumber: 364, columnNumber: 7 }, __self: this }, isLoading ? /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center py-12", __source: { fileName: "", lineNumber: 366, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-16 h-16 relative", __source: { fileName: "", lineNumber: 367, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-0 w-full", __source: { fileName: "", lineNumber: 368, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-seedling text-4xl text-[#2F5233] animate-grow", __source: { fileName: "", lineNumber: 369, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("p", { className: "font-inter text-[#2F5233] mt-4", __source: { fileName: "", lineNumber: 372, columnNumber: 13 }, __self: this }, "Growing inspirations...")) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("section", { className: "mb-16", __source: { fileName: "", lineNumber: 378, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-8", __source: { fileName: "", lineNumber: 379, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-crimson-text text-3xl text-[#2F5233]", __source: { fileName: "", lineNumber: 380, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-star text-[#F2D785] mr-2", __source: { fileName: "", lineNumber: 381, columnNumber: 19 }, __self: this }), "Trending Plants"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 384, columnNumber: 17 }, __self: this }, [ 0, 1, 2, 3, 4, 5 ].map((index)=>/*#__PURE__*/ React.createElement("button", { key: index, onClick: ()=>setCurrentTrendingIndex(index), className: `w-3 h-3 rounded-full ${currentTrendingIndex === index ? "bg-[#2F5233]" : "bg-gray-300"}`, "aria-label": `View trending plant ${index + 1}`, __source: { fileName: "", lineNumber: 386, columnNumber: 21 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8", __source: { fileName: "", lineNumber: 400, columnNumber: 15 }, __self: this }, trendingPlants.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "md:col-span-2 bg-white rounded-xl shadow-md overflow-hidden transition-all duration-500 transform hover:shadow-lg", __source: { fileName: "", lineNumber: 402, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative h-80 overflow-hidden", __source: { fileName: "", lineNumber: 403, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: trendingPlants[currentTrendingIndex]?.imageUrl || "/placeholder-plant.jpg", alt: trendingPlants[currentTrendingIndex]?.name || "Trending plant", className: "w-full h-full object-cover transition-transform duration-700 hover:scale-105", __source: { fileName: "", lineNumber: 404, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/70 to-transparent p-4", __source: { fileName: "", lineNumber: 415, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `inline-block px-3 py-1 rounded-full text-xs font-bold ${getDifficultyColor(trendingPlants[currentTrendingIndex]?.difficulty)} bg-white/90 mb-2`, __source: { fileName: "", lineNumber: 416, columnNumber: 25 }, __self: this }, trendingPlants[currentTrendingIndex]?.difficulty || "Easy"), /*#__PURE__*/ React.createElement("h3", { className: "font-crimson-text text-2xl text-white", __source: { fileName: "", lineNumber: 422, columnNumber: 25 }, __self: this }, trendingPlants[currentTrendingIndex]?.name || "Loading..."))), /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 428, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-inter text-gray-700 mb-4", __source: { fileName: "", lineNumber: 429, columnNumber: 23 }, __self: this }, trendingPlants[currentTrendingIndex]?.description || "Loading plant description..."), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handlePlantClick(trendingPlants[currentTrendingIndex]?.name), className: "bg-[#2F5233] text-white px-4 py-2 rounded-lg font-inter hover:bg-[#3A6340] transition-colors inline-flex items-center", __source: { fileName: "", lineNumber: 433, columnNumber: 23 }, __self: this }, "Learn More", /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-right ml-2", __source: { fileName: "", lineNumber: 442, columnNumber: 25 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-4", __source: { fileName: "", lineNumber: 448, columnNumber: 17 }, __self: this }, [ (currentTrendingIndex + 1) % 6, (currentTrendingIndex + 2) % 6 ].map((index)=>trendingPlants[index] && /*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white rounded-xl shadow-sm overflow-hidden flex h-[160px] transition-all duration-300 hover:shadow-md cursor-pointer", onClick: ()=>handlePlantClick(trendingPlants[index]?.name), __source: { fileName: "", lineNumber: 455, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-1/3 overflow-hidden", __source: { fileName: "", lineNumber: 462, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: trendingPlants[index]?.imageUrl || "/placeholder-plant.jpg", alt: trendingPlants[index]?.name || "Trending plant", className: "w-full h-full object-cover transition-transform duration-500 hover:scale-110", __source: { fileName: "", lineNumber: 463, columnNumber: 29 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-2/3 p-4", __source: { fileName: "", lineNumber: 474, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-1", __source: { fileName: "", lineNumber: 475, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-crimson-text text-lg text-[#2F5233] line-clamp-1", __source: { fileName: "", lineNumber: 476, columnNumber: 31 }, __self: this }, trendingPlants[index]?.name || "Loading..."), /*#__PURE__*/ React.createElement("span", { className: `inline-block px-2 py-0.5 rounded-full text-xs font-bold ${getDifficultyColor(trendingPlants[index]?.difficulty)} bg-gray-100`, __source: { fileName: "", lineNumber: 479, columnNumber: 31 }, __self: this }, trendingPlants[index]?.difficulty || "Easy")), /*#__PURE__*/ React.createElement("p", { className: "font-inter text-sm text-gray-600 line-clamp-3", __source: { fileName: "", lineNumber: 485, columnNumber: 29 }, __self: this }, trendingPlants[index]?.description || "Loading plant description..."))))))), /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 497, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-8", __source: { fileName: "", lineNumber: 498, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-crimson-text text-3xl text-[#2F5233]", __source: { fileName: "", lineNumber: 499, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-lightbulb text-[#F2D785] mr-2", __source: { fileName: "", lineNumber: 500, columnNumber: 19 }, __self: this }), "Gardening Recommendations"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 503, columnNumber: 17 }, __self: this }, [ 0, 1, 2, 3, 4, 5 ].map((index)=>/*#__PURE__*/ React.createElement("button", { key: index, onClick: ()=>setCurrentRecommendationIndex(index), className: `w-3 h-3 rounded-full ${currentRecommendationIndex === index ? "bg-[#2F5233]" : "bg-gray-300"}`, "aria-label": `View recommendation ${index + 1}`, __source: { fileName: "", lineNumber: 505, columnNumber: 21 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8", __source: { fileName: "", lineNumber: 519, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-4", __source: { fileName: "", lineNumber: 520, columnNumber: 17 }, __self: this }, [ (currentRecommendationIndex + 1) % 6, (currentRecommendationIndex + 2) % 6 ].map((index)=>recommendations[index] && /*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white rounded-xl shadow-sm overflow-hidden flex h-[160px] transition-all duration-300 hover:shadow-md cursor-pointer", onClick: ()=>handleRecommendationClick(recommendations[index]?.title), __source: { fileName: "", lineNumber: 527, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-1/3 overflow-hidden", __source: { fileName: "", lineNumber: 536, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: recommendations[index]?.imageUrl || "/placeholder-garden.jpg", alt: recommendations[index]?.title || "Gardening recommendation", className: "w-full h-full object-cover transition-transform duration-500 hover:scale-110", __source: { fileName: "", lineNumber: 537, columnNumber: 29 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-2/3 p-4", __source: { fileName: "", lineNumber: 549, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-1", __source: { fileName: "", lineNumber: 550, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-crimson-text text-lg text-[#2F5233] line-clamp-1", __source: { fileName: "", lineNumber: 551, columnNumber: 31 }, __self: this }, recommendations[index]?.title || "Loading..."), /*#__PURE__*/ React.createElement("span", { className: `inline-block px-2 py-0.5 rounded-full text-xs font-bold ${getDifficultyColor(recommendations[index]?.difficulty)} bg-gray-100`, __source: { fileName: "", lineNumber: 554, columnNumber: 31 }, __self: this }, recommendations[index]?.difficulty || "Easy")), /*#__PURE__*/ React.createElement("p", { className: "font-inter text-sm text-gray-600 line-clamp-3", __source: { fileName: "", lineNumber: 560, columnNumber: 29 }, __self: this }, recommendations[index]?.description || "Loading recommendation..."))))), recommendations.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "md:col-span-2 bg-white rounded-xl shadow-md overflow-hidden transition-all duration-500 transform hover:shadow-lg", __source: { fileName: "", lineNumber: 571, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative h-80 overflow-hidden", __source: { fileName: "", lineNumber: 572, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: recommendations[currentRecommendationIndex]?.imageUrl || "/placeholder-garden.jpg", alt: recommendations[currentRecommendationIndex]?.title || "Gardening recommendation", className: "w-full h-full object-cover transition-transform duration-700 hover:scale-105", __source: { fileName: "", lineNumber: 573, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/70 to-transparent p-4", __source: { fileName: "", lineNumber: 584, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `inline-block px-3 py-1 rounded-full text-xs font-bold ${getDifficultyColor(recommendations[currentRecommendationIndex]?.difficulty)} bg-white/90 mb-2`, __source: { fileName: "", lineNumber: 585, columnNumber: 25 }, __self: this }, recommendations[currentRecommendationIndex]?.difficulty || "Easy"), /*#__PURE__*/ React.createElement("h3", { className: "font-crimson-text text-2xl text-white", __source: { fileName: "", lineNumber: 591, columnNumber: 25 }, __self: this }, recommendations[currentRecommendationIndex]?.title || "Loading..."))), /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 597, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-inter text-gray-700 mb-4", __source: { fileName: "", lineNumber: 598, columnNumber: 23 }, __self: this }, recommendations[currentRecommendationIndex]?.description || "Loading recommendation..."), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleRecommendationClick(recommendations[currentRecommendationIndex]?.title), className: "bg-[#2F5233] text-white px-4 py-2 rounded-lg font-inter hover:bg-[#3A6340] transition-colors inline-flex items-center", __source: { fileName: "", lineNumber: 602, columnNumber: 23 }, __self: this }, "Learn More", /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-right ml-2", __source: { fileName: "", lineNumber: 611, columnNumber: 25 }, __self: this })))))))), /*#__PURE__*/ React.createElement("footer", { className: "bg-[#2F5233] text-white py-8 mt-12", __source: { fileName: "", lineNumber: 622, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4", __source: { fileName: "", lineNumber: 623, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row justify-between items-center", __source: { fileName: "", lineNumber: 624, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6 md:mb-0", __source: { fileName: "", lineNumber: 625, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-crimson-text text-xl mb-2", __source: { fileName: "", lineNumber: 626, columnNumber: 15 }, __self: this }, "Ecopedia"), /*#__PURE__*/ React.createElement("p", { className: "font-inter text-sm text-gray-300", __source: { fileName: "", lineNumber: 627, columnNumber: 15 }, __self: this }, "Your AI-Powered Guide to Nature's Wisdom")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row gap-4 md:gap-8", __source: { fileName: "", lineNumber: 631, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "font-inter text-sm text-gray-300 hover:text-[#F2D785] transition-colors", __source: { fileName: "", lineNumber: 632, columnNumber: 15 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("a", { href: "/plant-identifier", className: "font-inter text-sm text-gray-300 hover:text-[#F2D785] transition-colors", __source: { fileName: "", lineNumber: 638, columnNumber: 15 }, __self: this }, "Plant Identifier"), /*#__PURE__*/ React.createElement("a", { href: "/discover", className: "font-inter text-sm text-gray-300 hover:text-[#F2D785] transition-colors", __source: { fileName: "", lineNumber: 644, columnNumber: 15 }, __self: this }, "Discover"), !user && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "font-inter text-sm text-gray-300 hover:text-[#F2D785] transition-colors", __source: { fileName: "", lineNumber: 652, columnNumber: 19 }, __self: this }, "Sign In"), /*#__PURE__*/ React.createElement("a", { href: "/account/signup", className: "font-inter text-sm text-gray-300 hover:text-[#F2D785] transition-colors", __source: { fileName: "", lineNumber: 658, columnNumber: 19 }, __self: this }, "Sign Up")))), /*#__PURE__*/ React.createElement("div", { className: "border-t border-gray-700 mt-6 pt-6 text-center", __source: { fileName: "", lineNumber: 668, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-inter text-xs text-gray-400", __source: { fileName: "", lineNumber: 669, columnNumber: 13 }, __self: this }, "© 2025 Ecopedia. All rights reserved.")))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 676, columnNumber: 7 }, __self: this }, ` @keyframes grow { 0% { transform: scale(0.5) translateY(0); opacity: 0.5; } 100% { transform: scale(1.2) translateY(-20px); opacity: 1; } } .animate-grow { animation: grow 1.5s ease-in-out infinite alternate; } `)); }