function MainComponent() { const [selectedModel, setSelectedModel] = React.useState('CHAT_GPT'); const [inputText, setInputText] = React.useState(''); const [chatHistory, setChatHistory] = React.useState([]); const [isLoading, setIsLoading] = React.useState(false); const [generatedImage, setGeneratedImage] = React.useState(null); const handleModelChange = (event)=>{ setSelectedModel(event.target.value); setChatHistory([]); setGeneratedImage(null); }; const handleInputChange = (event)=>{ setInputText(event.target.value); }; const handleSend = async ()=>{ setIsLoading(true); const messages = [ { role: 'user', content: inputText } ]; let response; if (selectedModel === 'CHAT_GPT') { response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: JSON.stringify({ messages }), headers: { 'Content-Type': 'application/json' } }); } else if (selectedModel.startsWith('GOOGLE_GEMINI')) { const endpoint = selectedModel === 'GOOGLE_GEMINI' ? '/integrations/google-gemini/' : selectedModel === 'GOOGLE_GEMINI_1_5' ? '/integrations/google-gemini-1-5/' : '/integrations/google-gemini-1-5-flash/'; response = await fetch(endpoint, { method: 'POST', body: JSON.stringify({ messages }), headers: { 'Content-Type': 'application/json' } }); } else if (selectedModel === 'DALL_E_3') { response = await fetch(`/integrations/dall-e-3/?prompt=${encodeURIComponent(inputText)}`, { method: 'GET' }); } const data = await response.json(); if (selectedModel === 'DALL_E_3') { setGeneratedImage(data.data[0]); } else { const assistantMessage = data.choices[0].message.content; setChatHistory((prev)=>[ ...prev, { role: 'user', content: inputText }, { role: 'assistant', content: assistantMessage } ]); } setInputText(''); setIsLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen p-8 bg-[#0a0a0a] text-white font-roboto", __source: { fileName: "", lineNumber: 60, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 61, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("select", { value: selectedModel, onChange: handleModelChange, className: "mb-4 p-2 bg-[#222] text-white rounded", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "CHAT_GPT", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, "Chat GPT"), /*#__PURE__*/ React.createElement("option", { value: "GOOGLE_GEMINI", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, "Google Gemini"), /*#__PURE__*/ React.createElement("option", { value: "GOOGLE_GEMINI_1_5", __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }, "Google Gemini 1.5"), /*#__PURE__*/ React.createElement("option", { value: "GOOGLE_GEMINI_1_5_FLASH", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, "Google Gemini 1.5 Flash"), /*#__PURE__*/ React.createElement("option", { value: "DALL_E_3", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, "DALL-E 3")), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[600px] bg-[#222] p-4 rounded", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-[300px] overflow-y-scroll mb-4 p-2 bg-[#333] rounded", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, chatHistory.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `mb-2 ${message.role === 'user' ? 'text-right' : 'text-left'}`, __source: { fileName: "", lineNumber: 72, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `${message.role === 'user' ? 'text-blue-400' : 'text-yellow-400'}`, __source: { fileName: "", lineNumber: 73, columnNumber: 17 }, __self: this }, message.content)))), generatedImage && /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 80, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: generatedImage, alt: "Generated visual representation", __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex", __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "chatInput", value: inputText, onChange: handleInputChange, className: "flex-grow p-2 rounded-l bg-[#444] text-white", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleSend, disabled: isLoading, className: "p-2 bg-blue-500 rounded-r text-white", __source: { fileName: "", lineNumber: 92, columnNumber: 13 }, __self: this }, isLoading ? 'Loading...' : 'Send'))))); }