function MainComponent() { const [imageURL, setImageURL] = React.useState(''); const [imageAnalysis, setImageAnalysis] = React.useState(''); const [audioSource, setAudioSource] = React.useState(''); const [loading, setLoading] = React.useState(true); const fetchImageAndAnalyze = ()=>{ fetch('/integrations/stable-diffusion/?prompt=interesting+free+AI+tools&batch_size=1', { method: 'GET' }).then((response)=>response.json()).then((data)=>{ const fetchedImageURL = data.data[0]; setImageURL(fetchedImageURL); return fetchedImageURL; }).then((fetchedImageURL)=>{ return fetch('/integrations/gpt-vision/', { method: 'POST', body: JSON.stringify({ messages: [ { role: "user", content: [ { type: "text", text: "Describe this image." }, { type: "image_url", image_url: { url: fetchedImageURL } } ] } ] }), headers: { 'Content-Type': 'application/json' } }); }).then((response)=>response.json()).then((data)=>{ const analysisText = data.choices[0].message.content; setImageAnalysis(analysisText); return analysisText; }).then((analysisText)=>{ return fetch(`/integrations/text-to-speech/speech?text=${encodeURIComponent(analysisText)}`, { method: 'GET' }); }).then((response)=>response.blob()).then((blob)=>{ const audioUrl = URL.createObjectURL(blob); setAudioSource(audioUrl); }).catch((error)=>console.error('Error:', error)).finally(()=>setLoading(false)); }; React.useEffect(()=>{ fetchImageAndAnalyze(); }, []); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[url('/images/ai-background.jpg')] bg-cover p-4", __source: { fileName: "", lineNumber: 69, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-4xl text-white mb-8", __source: { fileName: "", lineNumber: 70, columnNumber: 7 }, __self: this }, "Explore Free AI Tools"), loading ? /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-xl text-white", __source: { fileName: "", lineNumber: 72, columnNumber: 9 }, __self: this }, "Loading...") : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "mb-8 shadow-lg", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: imageURL, alt: "Illustration of free AI tools", className: "max-w-md rounded-lg", __source: { fileName: "", lineNumber: 76, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-xl text-white mb-8", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, imageAnalysis), /*#__PURE__*/ React.createElement("audio", { controls: true, src: audioSource, className: "mb-8", __source: { fileName: "", lineNumber: 79, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("form", { action: "https://www.google.com/search", method: "GET", target: "_blank", className: "w-full max-w-[400px]", __source: { fileName: "", lineNumber: 80, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "hidden", name: "q", value: "free AI tools", __source: { fileName: "", lineNumber: 81, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", name: "btnK", className: "w-full bg-[#3178c6] text-white font-roboto py-2 px-4 rounded-lg hover:bg-[#255a89]", __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }, "Search Google for AI Tools 🚀")))); }