function MainComponent() { const [userInput, setUserInput] = React.useState(''); const [loading, setLoading] = React.useState(false); const [responses, setResponses] = React.useState({ chatGpt: '', googleGemini: '', anthropicClaude: '', groq: '' }); const updateInput = (e)=>{ setUserInput(e.target.value); }; const sendMessage = ()=>{ setLoading(true); const urls = [ '/integrations/chat-gpt/conversationgpt4', '/integrations/google-gemini/', '/integrations/anthropic-claude/', '/integrations/groq/' ]; const messages = [ { role: 'user', content: userInput } ]; const requests = urls.map((url)=>fetch(url, { method: 'POST', body: JSON.stringify({ messages, system_prompt: 'Explain this content' }), headers: { 'Content-Type': 'application/json' } }).then((response)=>response.json())); Promise.all(requests).then((data)=>{ setResponses({ chatGpt: data[0]?.choices[0]?.message?.content || 'No response', googleGemini: data[1]?.choices[0]?.message?.content || 'No response', anthropicClaude: data[2]?.choices[0]?.message?.content || 'No response', groq: data[3]?.choices[0]?.message?.content || 'No response' }); setLoading(false); }); }; return /*#__PURE__*/ React.createElement("div", { className: "w-full flex flex-col items-center justify-center p-4 space-y-4", __source: { fileName: "", lineNumber: 50, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { name: "userInput", className: "w-full h-24 p-2 border-2 border-gray-300 rounded-lg focus:outline-none focus:border-blue-500", placeholder: "Enter your message here...", value: userInput, onChange: updateInput, __source: { fileName: "", lineNumber: 51, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "w-[200px] p-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600", onClick: sendMessage, disabled: loading, __source: { fileName: "", lineNumber: 59, columnNumber: 7 }, __self: this }, loading ? 'Sending...' : 'Send Message'), /*#__PURE__*/ React.createElement("div", { className: "w-full flex flex-wrap justify-between items-start space-y-4", __source: { fileName: "", lineNumber: 67, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 lg:w-1/4 p-4 border-2 border-gray-300 rounded-lg", __source: { fileName: "", lineNumber: 68, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-semibold", __source: { fileName: "", lineNumber: 69, columnNumber: 11 }, __self: this }, "Chat GPT"), /*#__PURE__*/ React.createElement("div", { className: "h-48 overflow-auto p-2 bg-gray-100 rounded-lg mt-2", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, responses.chatGpt)), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 lg:w-1/4 p-4 border-2 border-gray-300 rounded-lg", __source: { fileName: "", lineNumber: 73, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-semibold", __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this }, "Google Gemini"), /*#__PURE__*/ React.createElement("div", { className: "h-48 overflow-auto p-2 bg-gray-100 rounded-lg mt-2", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, responses.googleGemini)), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 lg:w-1/4 p-4 border-2 border-gray-300 rounded-lg", __source: { fileName: "", lineNumber: 78, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-semibold", __source: { fileName: "", lineNumber: 79, columnNumber: 11 }, __self: this }, "Anthropic Claude"), /*#__PURE__*/ React.createElement("div", { className: "h-48 overflow-auto p-2 bg-gray-100 rounded-lg mt-2", __source: { fileName: "", lineNumber: 80, columnNumber: 11 }, __self: this }, responses.anthropicClaude)), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 lg:w-1/4 p-4 border-2 border-gray-300 rounded-lg", __source: { fileName: "", lineNumber: 83, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-semibold", __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, "Groq"), /*#__PURE__*/ React.createElement("div", { className: "h-48 overflow-auto p-2 bg-gray-100 rounded-lg mt-2", __source: { fileName: "", lineNumber: 85, columnNumber: 11 }, __self: this }, responses.groq)))); }