function MainComponent() { const [messages, setMessages] = React.useState([]); const [input, setInput] = React.useState(""); const [loading, setLoading] = React.useState(false); const sendMessage = async ()=>{ if (input.trim()) { const newMessages = [ ...messages, { role: "user", content: input } ]; setMessages(newMessages); setInput(""); setLoading(true); const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: newMessages }) }); const data = await response.json(); if (data.choices && data.choices.length > 0) { setMessages([ ...newMessages, data.choices[0].message ]); } setLoading(false); } }; const addStamp = (stamp)=>{ const newMessages = [ ...messages, { role: "user", content: stamp } ]; setMessages(newMessages); }; return /*#__PURE__*/ React.createElement("div", { className: "h-screen bg-[#000000] text-white font-roboto", __source: { fileName: "", lineNumber: 35, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-full w-full flex flex-col justify-end p-4", __source: { fileName: "", lineNumber: 36, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-grow overflow-y-auto mb-4", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }, messages.map((msg, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `mb-2 ${msg.role === 'user' ? 'text-right' : 'text-left'}`, __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `inline-block p-2 rounded ${msg.role === 'user' ? 'bg-blue-500' : 'bg-green-500'}`, __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this }, msg.content))), loading && /*#__PURE__*/ React.createElement("div", { className: "text-center text-gray-500", __source: { fileName: "", lineNumber: 45, columnNumber: 23 }, __self: this }, "Loading...")), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-2 mb-4", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>addStamp("🚀"), className: "p-2 rounded bg-yellow-500", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, "🚀"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>addStamp("🔥"), className: "p-2 rounded bg-yellow-500", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, "🔥"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>addStamp("😊"), className: "p-2 rounded bg-yellow-500", __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, "😊")), /*#__PURE__*/ React.createElement("div", { className: "flex", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: input, onChange: (e)=>setInput(e.target.value), className: "flex-grow p-2 rounded bg-gray-800 text-white", placeholder: "Type a message...", name: "message", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: sendMessage, className: "p-2 bg-blue-600 rounded mx-2", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "Send")))); }