function MainComponent() { const [url, setUrl] = React.useState(''); const [scrapedContent, setScrapedContent] = React.useState(''); const [imagePrompt, setImagePrompt] = React.useState(''); const [generatedImage, setGeneratedImage] = React.useState(''); const [loading, setLoading] = React.useState(false); const handleScrape = async ()=>{ setLoading(true); try { const response = await fetch('/integrations/web-scraping/post', { method: 'POST', body: JSON.stringify({ url: url, getText: true }), headers: { 'Content-Type': 'application/json' } }); const text = await response.text(); setScrapedContent(text); } catch (error) { console.error('Error scraping website:', error); } setLoading(false); }; const handleGenerateImage = async ()=>{ setLoading(true); try { const response = await fetch(`/integrations/dall-e-3/?prompt=${encodeURIComponent(imagePrompt)}`, { method: 'GET' }); const data = await response.json(); setGeneratedImage(data.data[0]); } catch (error) { console.error('Error generating image:', error); } setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 py-12 px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 44, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-3xl mx-auto", __source: { fileName: "", lineNumber: 45, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-center mb-8 font-roboto", __source: { fileName: "", lineNumber: 46, columnNumber: 9 }, __self: this }, "Web Scraping & Image Generation App"), /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-md rounded-lg p-6 mb-8", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-4 font-roboto", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, "Web Scraping"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col sm:flex-row gap-4 mb-4", __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: url, onChange: (e)=>setUrl(e.target.value), placeholder: "Enter URL to scrape", className: "flex-grow px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500", name: "scrape-url", __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleScrape, disabled: loading, className: "bg-blue-500 text-white px-4 py-2 rounded-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:opacity-50", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }, loading ? 'Scraping...' : 'Scrape')), scrapedContent && /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }, "Scraped Content:"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4 rounded-md overflow-auto max-h-60", __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("pre", { className: "whitespace-pre-wrap", __source: { fileName: "", lineNumber: 71, columnNumber: 17 }, __self: this }, scrapedContent)))), /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-md rounded-lg p-6", __source: { fileName: "", lineNumber: 77, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-4 font-roboto", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, "Image Generation"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col sm:flex-row gap-4 mb-4", __source: { fileName: "", lineNumber: 79, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: imagePrompt, onChange: (e)=>setImagePrompt(e.target.value), placeholder: "Enter image description", className: "flex-grow px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500", name: "image-prompt", __source: { fileName: "", lineNumber: 80, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleGenerateImage, disabled: loading, className: "bg-green-500 text-white px-4 py-2 rounded-md hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2 disabled:opacity-50", __source: { fileName: "", lineNumber: 88, columnNumber: 13 }, __self: this }, loading ? 'Generating...' : 'Generate Image')), generatedImage && /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 98, columnNumber: 15 }, __self: this }, "Generated Image:"), /*#__PURE__*/ React.createElement("img", { src: generatedImage, alt: "AI-generated image based on the provided description", className: "w-full h-auto rounded-md shadow-md", __source: { fileName: "", lineNumber: 99, columnNumber: 15 }, __self: this }))))); }