function MainComponent() { const [inputText, setInputText] = React.useState(''); const [translatedText, setTranslatedText] = React.useState(''); const [loading, setLoading] = React.useState(false); const [chatHistory, setChatHistory] = React.useState([]); const [chatInput, setChatInput] = React.useState(''); const translateText = async (text, targetLang)=>{ setLoading(true); try { const response = await fetch('/integrations/google-translate/language/translate/v2', { method: 'POST', body: new URLSearchParams({ q: text, target: targetLang }) }); const data = await response.json(); setTranslatedText(data.data.translations[0].translatedText); } catch (error) { console.error('Error translating text:', error); } setLoading(false); }; const handleTranslateSubmit = (e)=>{ e.preventDefault(); const targetLang = e.currentTarget.elements['target_language'].value; translateText(inputText, targetLang); }; const handleChatSubmit = async (e)=>{ e.preventDefault(); setLoading(true); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: JSON.stringify({ messages: [ { role: 'user', content: chatInput } ], system_prompt: 'Assistant response' }) }); const data = await response.json(); setChatHistory([ ...chatHistory, { role: 'user', content: chatInput }, { role: 'assistant', content: data.result } ]); } catch (error) { console.error('Error fetching chat response:', error); } setChatInput(''); setLoading(false); }; const chatMessages = chatHistory.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `my-2 p-2 ${message.role === 'assistant' ? 'bg-[#D1D5DB] rounded-l-lg' : 'bg-[#93C5FD] rounded-r-lg'}`, __source: { fileName: "", lineNumber: 54, columnNumber: 5 }, __self: this }, message.content)); return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 59, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row md:space-x-4", __source: { fileName: "", lineNumber: 60, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 md:w-1/2", __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleTranslateSubmit, className: "mb-4", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { className: "border p-2 w-full h-[100px] resize-none", placeholder: "Enter text to translate", value: inputText, name: "input_text", onChange: (e)=>setInputText(e.target.value), __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("select", { className: "border p-2 mt-2 w-full", name: "target_language", __source: { fileName: "", lineNumber: 70, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "en", __source: { fileName: "", lineNumber: 72, columnNumber: 15 }, __self: this }, "English"), /*#__PURE__*/ React.createElement("option", { value: "es", __source: { fileName: "", lineNumber: 73, columnNumber: 15 }, __self: this }, "Spanish")), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#60A5FA] text-white p-2 mt-2 w-full", disabled: loading, __source: { fileName: "", lineNumber: 76, columnNumber: 13 }, __self: this }, "Translate")), loading && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 84, columnNumber: 23 }, __self: this }, "Loading..."), translatedText && /*#__PURE__*/ React.createElement("div", { className: "p-2 bg-[#E5E7EB] mt-2", __source: { fileName: "", lineNumber: 86, columnNumber: 13 }, __self: this }, translatedText)), /*#__PURE__*/ React.createElement("div", { className: "flex-1 md:w-1/2", __source: { fileName: "", lineNumber: 89, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleChatSubmit, className: "mb-4", __source: { fileName: "", lineNumber: 90, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { className: "border p-2 w-full h-[100px] resize-none", placeholder: "Enter text for ChatGPT", value: chatInput, name: "chat_input", onChange: (e)=>setChatInput(e.target.value), __source: { fileName: "", lineNumber: 91, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#34D399] text-white p-2 mt-2 w-full", disabled: loading, __source: { fileName: "", lineNumber: 98, columnNumber: 13 }, __self: this }, "Send to ChatGPT")), loading && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 106, columnNumber: 23 }, __self: this }, "Loading..."), /*#__PURE__*/ React.createElement("div", { className: "bg-[#F3F4F6] p-2", __source: { fileName: "", lineNumber: 107, columnNumber: 11 }, __self: this }, chatMessages)))); }