function MainComponent() { const [input, setInput] = React.useState(''); const [loading, setLoading] = React.useState(false); const [messages, setMessages] = React.useState([ { role: 'user', content: 'Hello!' }, { role: 'assistant', content: 'Hi! How can I assist you today?' } ]); const handleSubmit = async (event)=>{ event.preventDefault(); if (input.trim()) { setMessages([ ...messages, { role: 'user', content: input } ]); setInput(''); setLoading(true); const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ ...messages, { role: 'user', content: input } ] }) }); const data = await response.json(); if (data.choices && data.choices.length > 0) { const newMessage = data.choices[0].message.content; setMessages([ ...messages, { role: 'user', content: input }, { role: 'assistant', content: newMessage } ]); } setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 p-8 font-roboto", __source: { fileName: "", lineNumber: 34, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-md rounded p-4", __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-semibold mb-6", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }, "Analytics Dashboard"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-gray-200 rounded h-[300px]", __source: { fileName: "", lineNumber: 38, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl mb-4", __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }, "Sales Analytics"), /*#__PURE__*/ React.createElement("div", { className: "w-full h-full bg-white rounded shadow-sm flex items-center justify-center", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-400", __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }, "Chart Placeholder"))), /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-gray-200 rounded h-[300px]", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl mb-4", __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this }, "User Analytics"), /*#__PURE__*/ React.createElement("div", { className: "w-full h-full bg-white rounded shadow-sm flex items-center justify-center", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-400", __source: { fileName: "", lineNumber: 47, columnNumber: 15 }, __self: this }, "Chart Placeholder")))), /*#__PURE__*/ React.createElement("div", { className: "mt-6", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(AiChatSection, { title: "ChatGPT Interaction", messages: messages, loading: loading, input: input, setInput: setInput, handleSubmit: handleSubmit, __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this })))); } function AiChatSection({ title, messages, loading, input, setInput, handleSubmit }) { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 68, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl mb-4", __source: { fileName: "", lineNumber: 69, columnNumber: 7 }, __self: this }, title), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-50 p-4 border rounded h-[300px] overflow-auto", __source: { fileName: "", lineNumber: 70, columnNumber: 7 }, __self: this }, messages.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `mb-2 ${message.role === 'assistant' ? 'text-blue-500' : ''}`, __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 73, columnNumber: 13 }, __self: this }, message.role === 'assistant' ? 'Assistant' : 'You', ":"), " ", message.content)), loading && /*#__PURE__*/ React.createElement("div", { className: "text-gray-500", __source: { fileName: "", lineNumber: 76, columnNumber: 21 }, __self: this }, "Loading...")), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "mt-4 flex", __source: { fileName: "", lineNumber: 78, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "chat-input", value: input, onChange: (e)=>setInput(e.target.value), className: "flex-1 border rounded p-2", placeholder: "Type a message...", __source: { fileName: "", lineNumber: 79, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "ml-2 bg-blue-500 text-white p-2 rounded", __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }, "Send"))); }