function MainComponent() { const [chat, setChat] = React.useState({ messages: [], system_prompt: '', max_tokens: 2000 }); const [gallery, setGallery] = React.useState([]); const [searchQuery, setSearchQuery] = React.useState(''); const [searchResults, setSearchResults] = React.useState([]); const [scrapingResults, setScrapingResults] = React.useState(''); const [pdfSource, setPdfSource] = React.useState(''); const [audioTranscription, setAudioTranscription] = React.useState(''); const [loading, setLoading] = React.useState({ chat: false, image: false, search: false, scrape: false, pdf: false, audio: false }); const handleSearchChange = (event)=>{ setSearchQuery(event.target.value); }; const performSearch = async ()=>{ setLoading((prev)=>({ ...prev, search: true })); const response = await fetch(`/integrations/google-search/search?q=${encodeURIComponent(searchQuery)}`, { method: 'GET' }); const data = await response.json(); setSearchResults(data.items || []); setLoading((prev)=>({ ...prev, search: false })); }; const performScraping = async (url)=>{ setLoading((prev)=>({ ...prev, scrape: true })); const response = await fetch('/integrations/web-scraping/post', { method: 'POST', body: JSON.stringify({ url }) }); const data = await response.text(); setScrapingResults(data); setLoading((prev)=>({ ...prev, scrape: false })); }; const generateImage = async (prompt)=>{ setLoading((prev)=>({ ...prev, image: true })); const response = await fetch(`/integrations/stable-diffusion/?prompt=${encodeURIComponent(prompt)}&batch_size=1`, { method: 'GET' }); const data = await response.json(); setGallery(data.data); setLoading((prev)=>({ ...prev, image: false })); }; const generatePDF = async (htmlContent)=>{ setLoading((prev)=>({ ...prev, pdf: true })); const response = await fetch('/integrations/pdf-generation/pdf', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ source: { html: htmlContent } }) }); const blob = await response.blob(); const pdfUrl = URL.createObjectURL(blob); setPdfSource(pdfUrl); setLoading((prev)=>({ ...prev, pdf: false })); }; const transcribeAudio = async (file)=>{ const data = new FormData(); data.append('file', file); setLoading((prev)=>({ ...prev, audio: true })); const response = await fetch('/integrations/transcribe-audio/whisperv3', { method: 'POST', body: data }); const result = await response.json(); setAudioTranscription(result.text || ''); setLoading((prev)=>({ ...prev, audio: false })); }; const sendMessageToChatGPT = async (messages, system_prompt, max_tokens)=>{ setLoading((prev)=>({ ...prev, chat: true })); const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages, system_prompt, max_tokens }) }); const data = await response.json(); setChat((prev)=>({ ...prev, messages: [ ...prev.messages, ...messages ], result: data.result })); setLoading((prev)=>({ ...prev, chat: false })); }; const handleSearchSubmit = (event)=>{ event.preventDefault(); performSearch(); }; const handleImageRequestSubmit = (event)=>{ event.preventDefault(); generateImage('jewelry, elegant, high quality'); }; const handleAudioSubmit = (event)=>{ event.preventDefault(); const input = event.target.elements.audioFile; if (input.files.length > 0) { const file = input.files[0]; transcribeAudio(file); } }; const jewelryShopTitle = 'JewelGallery'; const promptImageGallery = `Product images for a jewelry shop named ${jewelryShopTitle}`; return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-4", __source: { fileName: "", lineNumber: 128, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "text-center my-4", __source: { fileName: "", lineNumber: 129, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold font-roboto", __source: { fileName: "", lineNumber: 130, columnNumber: 9 }, __self: this }, jewelryShopTitle)), /*#__PURE__*/ React.createElement("section", { className: "my-8", __source: { fileName: "", lineNumber: 133, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold font-roboto mb-4", __source: { fileName: "", lineNumber: 134, columnNumber: 9 }, __self: this }, "Explore Our Gallery"), /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-[#6D28D9] text-white rounded-md mb-4", onClick: handleImageRequestSubmit, __source: { fileName: "", lineNumber: 135, columnNumber: 9 }, __self: this }, "Show me jewelry"), loading.image && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 138, columnNumber: 27 }, __self: this }, "Loading images..."), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 139, columnNumber: 9 }, __self: this }, gallery.map((imageUrl, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "overflow-hidden rounded-md", __source: { fileName: "", lineNumber: 141, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: imageUrl, alt: `Jewelry item ${index + 1}`, className: "object-cover w-full h-[300px]", __source: { fileName: "", lineNumber: 142, columnNumber: 15 }, __self: this }))))), /*#__PURE__*/ React.createElement("section", { className: "my-8", __source: { fileName: "", lineNumber: 148, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold font-roboto mb-4", __source: { fileName: "", lineNumber: 149, columnNumber: 9 }, __self: this }, "Customer Queries"), /*#__PURE__*/ React.createElement("form", { onSubmit: sendMessageToChatGPT, __source: { fileName: "", lineNumber: 150, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 151, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "chatMessage", className: "block mb-2 text-sm font-medium font-roboto", __source: { fileName: "", lineNumber: 152, columnNumber: 13 }, __self: this }, "Ask us anything about our products"), /*#__PURE__*/ React.createElement("textarea", { id: "chatMessage", className: "block p-2.5 w-full text-sm border rounded-lg focus:ring-blue-500 focus:border-blue-500", rows: "3", placeholder: "Type your message here...", __source: { fileName: "", lineNumber: 155, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-4 py-2 bg-[#6D28D9] text-white rounded-md mb-4", __source: { fileName: "", lineNumber: 162, columnNumber: 11 }, __self: this }, "Send")), loading.chat && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 166, columnNumber: 26 }, __self: this }, "Sending message...")), /*#__PURE__*/ React.createElement("section", { className: "my-8", __source: { fileName: "", lineNumber: 169, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold font-roboto mb-4", __source: { fileName: "", lineNumber: 170, columnNumber: 9 }, __self: this }, "Search for Jewelry"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSearchSubmit, __source: { fileName: "", lineNumber: 171, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex gap-2 mb-4", __source: { fileName: "", lineNumber: 172, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "search", placeholder: "Search for jewelry items...", className: "block p-2.5 w-full text-sm border rounded-lg focus:ring-blue-500 focus:border-blue-500", value: searchQuery, onChange: handleSearchChange, __source: { fileName: "", lineNumber: 173, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-4 py-2 bg-[#6D28D9] text-white rounded-md", __source: { fileName: "", lineNumber: 181, columnNumber: 13 }, __self: this }, "Search"))), loading.search && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 186, columnNumber: 28 }, __self: this }, "Searching..."), /*#__PURE__*/ React.createElement("ul", { className: "list-disc pl-5", __source: { fileName: "", lineNumber: 187, columnNumber: 9 }, __self: this }, searchResults.map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, __source: { fileName: "", lineNumber: 189, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: item.link, target: "_blank", className: "text-blue-600 hover:underline", __source: { fileName: "", lineNumber: 190, columnNumber: 15 }, __self: this }, item.title))))), /*#__PURE__*/ React.createElement("section", { className: "my-8", __source: { fileName: "", lineNumber: 198, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold font-roboto mb-4", __source: { fileName: "", lineNumber: 199, columnNumber: 9 }, __self: this }, "Ask for Assistance"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleAudioSubmit, __source: { fileName: "", lineNumber: 200, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 201, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "audioFile", className: "block mb-2 text-sm font-medium font-roboto", __source: { fileName: "", lineNumber: 202, columnNumber: 13 }, __self: this }, "Upload your voice message (max 3MB)"), /*#__PURE__*/ React.createElement("input", { type: "file", id: "audioFile", name: "audioFile", className: "block w-full text-sm text-gray-900", accept: "audio/*", __source: { fileName: "", lineNumber: 205, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-4 py-2 bg-[#6D28D9] text-white rounded-md mb-4", __source: { fileName: "", lineNumber: 207, columnNumber: 11 }, __self: this }, "Transcribe")), loading.audio && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 211, columnNumber: 27 }, __self: this }, "Transcribing..."), audioTranscription && /*#__PURE__*/ React.createElement("div", { className: "p-4 mb-4 border rounded-md bg-[#f9f9f9]", __source: { fileName: "", lineNumber: 213, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm font-medium font-roboto", __source: { fileName: "", lineNumber: 214, columnNumber: 11 }, __self: this }, "Transcription:"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 215, columnNumber: 11 }, __self: this }, audioTranscription))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 220, columnNumber: 7 }, __self: this }, ` // Add any necessary animations here `)); }