function MainComponent() { const [searchParams, setSearchParams] = useState({ niche: "", platform: "", followerRange: "", objectives: [], countries: [] }); const [results, setResults] = useState(null); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [selectedInfluencer, setSelectedInfluencer] = useState(null); const [briefingMessage, setBriefingMessage] = useState(null); const [briefingLoading, setBriefingLoading] = useState(false); const niches = [ "Beauty & Cosmetics", "Technology & Gadgets", "Fashion & Style", "Fitness & Health", "Gaming & Esports", "Food & Cooking", "Travel & Adventure", "Business & Finance", "Education & Learning", "Entertainment", "Lifestyle & Vlogs", "Music & Dance", "Pets & Animals", "Sports", "Art & Design", "Books & Literature", "Cars & Automotive", "DIY & Crafts", "Parenting & Family", "Photography" ]; const platforms = [ { id: "instagram", name: "Instagram", icon: "📸" }, { id: "tiktok", name: "TikTok", icon: "🎵" }, { id: "youtube", name: "YouTube", icon: "▶️" }, { id: "twitter", name: "X (Twitter)", icon: "🐦" }, { id: "twitch", name: "Twitch", icon: "🎮" } ]; const objectives = [ "Brand Awareness", "Product Launch", "Sales & Conversions", "Community Building", "Content Creation", "Event Promotion", "App Downloads", "Lead Generation", "Educational Content", "Customer Testimonials" ]; const countries = [ { code: "US", name: "United States", flag: "🇺🇸" }, { code: "GB", name: "United Kingdom", flag: "🇬🇧" }, { code: "CA", name: "Canada", flag: "🇨🇦" }, { code: "AU", name: "Australia", flag: "🇦🇺" }, { code: "DE", name: "Germany", flag: "🇩🇪" }, { code: "FR", name: "France", flag: "🇫🇷" }, { code: "BR", name: "Brazil", flag: "🇧🇷" }, { code: "JP", name: "Japan", flag: "🇯🇵" }, { code: "IN", name: "India", flag: "🇮🇳" }, { code: "ES", name: "Spain", flag: "🇪🇸" } ]; const handleStreamResponse = useHandleStreamResponse({ onChunk: ()=>{}, onFinish: (message)=>{ const data = JSON.parse(message); setResults(data); setLoading(false); } }); const searchInfluencers = async ()=>{ setLoading(true); setError(null); try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "system", content: "Você é um especialista em marketing de influência que fornece dados realistas sobre influenciadores. Gere perfis que correspondam aos critérios fornecidos, usando dados plausíveis e coerentes com o mercado atual." }, { role: "user", content: `Por favor, gere ${searchParams.platform ? `influenciadores do ${searchParams.platform}` : "influenciadores"} que atendam aos seguintes critérios: ${searchParams.niche ? `\nNicho: ${searchParams.niche}` : ""} ${searchParams.followerRange ? `\nFaixa de seguidores: ${searchParams.followerRange}` : ""} ${searchParams.objectives.length > 0 ? `\nObjetivos da campanha: ${searchParams.objectives.join(", ")}` : ""} ${searchParams.countries.length > 0 ? `\nPaíses: ${searchParams.countries.map((c)=>c.name).join(", ")}` : ""}` } ], json_schema: { name: "influencer_recommendations", schema: { type: "object", properties: { recommendations: { type: "array", items: { type: "object", properties: { name: { type: "string" }, platform: { type: "string" }, followerCount: { type: "string" }, niche: { type: "string" }, contentStyle: { type: "string" }, engagementRate: { type: "string" }, audienceDemo: { type: "string" }, country: { type: "string" }, profileUrl: { type: "string" }, profilePicture: { type: "string", default: "https://via.placeholder.com/80" }, isPublic: { type: "boolean" }, isVerified: { type: "boolean" }, lastPostDate: { type: "string" } }, required: [ "name", "platform", "followerCount", "niche", "contentStyle", "engagementRate", "audienceDemo", "country", "profileUrl", "isPublic", "isVerified", "lastPostDate" ], additionalProperties: false }, minItems: 6, maxItems: 6 } }, required: [ "recommendations" ], additionalProperties: false } } }) }); if (!response.ok) { const errorText = await response.text(); throw new Error(`Erro na API: ${response.status} - ${errorText}`); } const data = await response.json(); if (!data.choices?.[0]?.message?.content) { throw new Error("Resposta da API inválida ou vazia"); } let parsedData; try { parsedData = JSON.parse(data.choices[0].message.content); } catch (parseError) { console.error("Erro ao processar resposta:", data.choices[0].message.content); throw new Error("Erro ao processar dados dos influenciadores"); } if (!parsedData.recommendations?.length) { throw new Error("Nenhum influenciador encontrado com os critérios especificados"); } const validatedRecommendations = parsedData.recommendations.map((influencer)=>{ try { let url = (influencer.profileUrl || "").toLowerCase().trim(); if (!url.startsWith("http")) { url = "https://" + url.replace(/^(https?:\/\/)?(www\.)?/, ""); } const platformUrls = { instagram: /^https:\/\/(www\.)?instagram\.com\/[a-zA-Z0-9._]+\/?$/, tiktok: /^https:\/\/(www\.)?tiktok\.com\/@[a-zA-Z0-9._]+\/?$/, youtube: /^https:\/\/(www\.)?youtube\.com\/@[a-zA-Z0-9._]+\/?$/, twitter: /^https:\/\/(www\.)?twitter\.com\/[a-zA-Z0-9._]+\/?$/, twitch: /^https:\/\/(www\.)?twitch\.tv\/[a-zA-Z0-9._]+\/?$/ }; const platform = influencer.platform.toLowerCase(); if (!platformUrls[platform]?.test(url)) { const username = influencer.name.toLowerCase().replace(/[^a-z0-9]/g, ""); switch(platform){ case "instagram": url = `https://instagram.com/${username}`; break; case "tiktok": url = `https://tiktok.com/@${username}`; break; case "youtube": url = `https://youtube.com/@${username}`; break; case "twitter": url = `https://twitter.com/${username}`; break; case "twitch": url = `https://twitch.tv/${username}`; break; default: url = `https://instagram.com/${username}`; } } let lastPost = new Date(influencer.lastPostDate); if (isNaN(lastPost.getTime())) { lastPost = new Date(); lastPost.setDate(lastPost.getDate() - Math.floor(Math.random() * 30)); influencer.lastPostDate = lastPost.toISOString(); } return { ...influencer, profileUrl: url, isPublic: true, profilePicture: influencer.profilePicture || "https://via.placeholder.com/80" }; } catch (error) { console.error(`Erro ao processar influenciador ${influencer.name}:`, error); return null; } }).filter(Boolean); if (validatedRecommendations.length === 0) { throw new Error("Nenhum influenciador válido encontrado com os critérios especificados"); } setResults({ recommendations: validatedRecommendations }); setLoading(false); } catch (err) { console.error("Erro detalhado:", err); setError(err.message); setLoading(false); } }; const generateBriefing = async (influencer)=>{ setSelectedInfluencer(influencer); setBriefingLoading(true); setError(null); try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "user", content: `Generate a detailed campaign briefing for collaborating with this influencer: Name: ${influencer.name} Platform: ${influencer.platform} Niche: ${influencer.niche} Followers: ${influencer.followerCount} Engagement Rate: ${influencer.engagementRate} Content Style: ${influencer.contentStyle} Audience: ${influencer.audienceDemo} Include specific content ideas, best practices for the platform, and potential campaign structures.` } ], json_schema: { name: "briefing", schema: { type: "object", properties: { title: { type: "string" }, summary: { type: "string" }, contentIdeas: { type: "array", items: { type: "string" } }, bestPractices: { type: "array", items: { type: "string" } }, metrics: { type: "array", items: { type: "string" } } }, required: [ "title", "summary", "contentIdeas", "bestPractices", "metrics" ], additionalProperties: false } } }) }); if (!response.ok) { throw new Error("Failed to generate briefing"); } const data = await response.json(); setBriefingMessage(JSON.parse(data.choices[0].message.content)); } catch (err) { console.error(err); setError("Could not generate the campaign briefing"); } finally{ setBriefingLoading(false); } }; const renderInfluencerCard = (influencer)=>/*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 343, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-start gap-4 mb-4", __source: { fileName: "", lineNumber: 344, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: influencer.profilePicture, alt: `Foto de perfil de ${influencer.name}`, className: "w-20 h-20 rounded-full object-cover", onError: (e)=>{ e.target.src = "https://via.placeholder.com/80"; e.target.onerror = null; }, __source: { fileName: "", lineNumber: 345, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 354, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start", __source: { fileName: "", lineNumber: 355, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 356, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-gray-900", __source: { fileName: "", lineNumber: 357, columnNumber: 15 }, __self: this }, influencer.name, influencer.isVerified && /*#__PURE__*/ React.createElement("span", { className: "ml-1 text-blue-500", title: "Perfil Verificado", __source: { fileName: "", lineNumber: 360, columnNumber: 19 }, __self: this }, "✓")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 text-sm text-gray-600 mt-1", __source: { fileName: "", lineNumber: 368, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 369, columnNumber: 17 }, __self: this }, influencer.country), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 370, columnNumber: 17 }, __self: this }, "•"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 371, columnNumber: 17 }, __self: this }, influencer.platform), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 372, columnNumber: 17 }, __self: this }, "•"), /*#__PURE__*/ React.createElement("span", { className: "text-green-600", __source: { fileName: "", lineNumber: 373, columnNumber: 17 }, __self: this }, "Perfil Público"))), /*#__PURE__*/ React.createElement("a", { href: influencer.profileUrl, target: "_blank", rel: "noopener noreferrer", className: "text-blue-600 hover:text-blue-800 flex items-center", __source: { fileName: "", lineNumber: 376, columnNumber: 13 }, __self: this }, "Ver Perfil", /*#__PURE__*/ React.createElement("span", { className: "ml-1", __source: { fileName: "", lineNumber: 383, columnNumber: 15 }, __self: this }, "↗"))))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 389, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 390, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 391, columnNumber: 11 }, __self: this }, "Followers:"), " ", influencer.followerCount), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 394, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 395, columnNumber: 11 }, __self: this }, "Niche:"), " ", influencer.niche), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 397, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 398, columnNumber: 11 }, __self: this }, "Content Style:"), " ", influencer.contentStyle), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 401, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 402, columnNumber: 11 }, __self: this }, "Engagement Rate:"), " ", influencer.engagementRate), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 405, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 406, columnNumber: 11 }, __self: this }, "Audience:"), " ", influencer.audienceDemo)), /*#__PURE__*/ React.createElement("button", { onClick: ()=>generateBriefing(influencer), className: "mt-4 w-full bg-blue-600 text-white py-2 px-4 rounded hover:bg-blue-700 transition-colors", __source: { fileName: "", lineNumber: 411, columnNumber: 7 }, __self: this }, "Generate Briefing")); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50 p-4", __source: { fileName: "", lineNumber: 421, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto", __source: { fileName: "", lineNumber: 422, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-center mb-8 text-gray-900", __source: { fileName: "", lineNumber: 423, columnNumber: 9 }, __self: this }, "AI Influencer Finder"), selectedInfluencer ? /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6 mb-8", __source: { fileName: "", lineNumber: 428, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-6", __source: { fileName: "", lineNumber: 429, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-gray-900", __source: { fileName: "", lineNumber: 430, columnNumber: 15 }, __self: this }, "Campaign Briefing"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setSelectedInfluencer(null); setBriefingMessage(null); }, className: "text-gray-600 hover:text-gray-800", __source: { fileName: "", lineNumber: 433, columnNumber: 15 }, __self: this }, "✕")), briefingLoading ? /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center py-12", __source: { fileName: "", lineNumber: 445, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 border-4 border-blue-600 border-t-transparent rounded-full animate-spin", __source: { fileName: "", lineNumber: 446, columnNumber: 17 }, __self: this })) : briefingMessage && /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 450, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 451, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-gray-900 mb-2", __source: { fileName: "", lineNumber: 452, columnNumber: 21 }, __self: this }, briefingMessage.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700", __source: { fileName: "", lineNumber: 455, columnNumber: 21 }, __self: this }, briefingMessage.summary)), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 458, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-semibold text-gray-900 mb-2", __source: { fileName: "", lineNumber: 459, columnNumber: 21 }, __self: this }, "Content Ideas"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside space-y-1", __source: { fileName: "", lineNumber: 462, columnNumber: 21 }, __self: this }, briefingMessage.contentIdeas.map((idea, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-gray-700", __source: { fileName: "", lineNumber: 464, columnNumber: 25 }, __self: this }, idea)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 471, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-semibold text-gray-900 mb-2", __source: { fileName: "", lineNumber: 472, columnNumber: 21 }, __self: this }, "Best Practices"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside space-y-1", __source: { fileName: "", lineNumber: 475, columnNumber: 21 }, __self: this }, briefingMessage.bestPractices.map((practice, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-gray-700", __source: { fileName: "", lineNumber: 477, columnNumber: 25 }, __self: this }, practice)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 484, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-semibold text-gray-900 mb-2", __source: { fileName: "", lineNumber: 485, columnNumber: 21 }, __self: this }, "Key Metrics to Track"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside space-y-1", __source: { fileName: "", lineNumber: 488, columnNumber: 21 }, __self: this }, briefingMessage.metrics.map((metric, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-gray-700", __source: { fileName: "", lineNumber: 490, columnNumber: 25 }, __self: this }, metric)))))) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6 mb-8", __source: { fileName: "", lineNumber: 502, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 503, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 504, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 505, columnNumber: 19 }, __self: this }, "Niche"), /*#__PURE__*/ React.createElement("select", { className: "w-full p-2 border rounded", value: searchParams.niche, onChange: (e)=>setSearchParams({ ...searchParams, niche: e.target.value }), __source: { fileName: "", lineNumber: 508, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 518, columnNumber: 21 }, __self: this }, "Select a niche"), niches.map((niche)=>/*#__PURE__*/ React.createElement("option", { key: niche, value: niche, __source: { fileName: "", lineNumber: 520, columnNumber: 23 }, __self: this }, niche)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 527, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 528, columnNumber: 19 }, __self: this }, "Platform"), /*#__PURE__*/ React.createElement("select", { className: "w-full p-2 border rounded", value: searchParams.platform, onChange: (e)=>setSearchParams({ ...searchParams, platform: e.target.value }), __source: { fileName: "", lineNumber: 531, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 541, columnNumber: 21 }, __self: this }, "Select a platform"), platforms.map((platform)=>/*#__PURE__*/ React.createElement("option", { key: platform.id, value: platform.id, __source: { fileName: "", lineNumber: 543, columnNumber: 23 }, __self: this }, platform.icon, " ", platform.name)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 550, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 551, columnNumber: 19 }, __self: this }, "Follower Range"), /*#__PURE__*/ React.createElement("select", { className: "w-full p-2 border rounded", value: searchParams.followerRange, onChange: (e)=>setSearchParams({ ...searchParams, followerRange: e.target.value }), __source: { fileName: "", lineNumber: 554, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 564, columnNumber: 21 }, __self: this }, "Select range"), /*#__PURE__*/ React.createElement("option", { value: "nano", __source: { fileName: "", lineNumber: 565, columnNumber: 21 }, __self: this }, "Nano (1K-10K)"), /*#__PURE__*/ React.createElement("option", { value: "micro", __source: { fileName: "", lineNumber: 566, columnNumber: 21 }, __self: this }, "Micro (10K-100K)"), /*#__PURE__*/ React.createElement("option", { value: "macro", __source: { fileName: "", lineNumber: 567, columnNumber: 21 }, __self: this }, "Macro (100K-1M)"), /*#__PURE__*/ React.createElement("option", { value: "mega", __source: { fileName: "", lineNumber: 568, columnNumber: 21 }, __self: this }, "Mega (1M+)"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 572, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 573, columnNumber: 19 }, __self: this }, "Campaign Objectives"), /*#__PURE__*/ React.createElement("select", { className: "w-full p-2 border rounded", value: searchParams.objectives, onChange: (e)=>{ const options = Array.from(e.target.selectedOptions, (option)=>option.value); setSearchParams({ ...searchParams, objectives: options }); }, multiple: true, __source: { fileName: "", lineNumber: 576, columnNumber: 19 }, __self: this }, objectives.map((objective)=>/*#__PURE__*/ React.createElement("option", { key: objective, value: objective, __source: { fileName: "", lineNumber: 589, columnNumber: 23 }, __self: this }, objective)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 596, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2", __source: { fileName: "", lineNumber: 597, columnNumber: 19 }, __self: this }, "Countries"), /*#__PURE__*/ React.createElement("select", { className: "w-full p-2 border rounded", value: searchParams.countries.map((c)=>c.code), onChange: (e)=>{ const selectedCountries = Array.from(e.target.selectedOptions, (option)=>countries.find((c)=>c.code === option.value)); setSearchParams({ ...searchParams, countries: selectedCountries }); }, multiple: true, __source: { fileName: "", lineNumber: 600, columnNumber: 19 }, __self: this }, countries.map((country)=>/*#__PURE__*/ React.createElement("option", { key: country.code, value: country.code, __source: { fileName: "", lineNumber: 617, columnNumber: 23 }, __self: this }, country.flag, " ", country.name))))), /*#__PURE__*/ React.createElement("button", { className: "mt-6 w-full bg-blue-600 text-white py-3 px-4 rounded-lg hover:bg-blue-700 disabled:opacity-50 transition-colors", onClick: searchInfluencers, disabled: loading, __source: { fileName: "", lineNumber: 625, columnNumber: 15 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 631, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-6 h-6 border-2 border-white border-t-transparent rounded-full animate-spin mr-2", __source: { fileName: "", lineNumber: 632, columnNumber: 21 }, __self: this }), "Searching...") : "Find Influencers")), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4", __source: { fileName: "", lineNumber: 642, columnNumber: 15 }, __self: this }, error), results && results.recommendations && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-8", __source: { fileName: "", lineNumber: 649, columnNumber: 17 }, __self: this }, results.recommendations.map((influencer, index)=>/*#__PURE__*/ React.createElement("div", { key: index, __source: { fileName: "", lineNumber: 651, columnNumber: 21 }, __self: this }, renderInfluencerCard(influencer)))), results.recommendations.length >= 6 && /*#__PURE__*/ React.createElement("div", { className: "text-center p-8 bg-gradient-to-r from-blue-500 to-purple-600 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 656, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 657, columnNumber: 21 }, __self: this }, "Want to see more influencers?"), /*#__PURE__*/ React.createElement("p", { className: "text-white mb-6", __source: { fileName: "", lineNumber: 660, columnNumber: 21 }, __self: this }, "Upgrade to our Pro plan to access our full database of verified influencers"), /*#__PURE__*/ React.createElement("button", { className: "bg-white text-blue-600 px-8 py-3 rounded-lg font-semibold hover:bg-blue-50 transition-colors", __source: { fileName: "", lineNumber: 664, columnNumber: 21 }, __self: this }, "Upgrade Now")))))); }