function MainComponent() { const sampleConversations = [ { id: 1, user: 'User', message: 'Hello Matsuo GPT!' }, { id: 2, user: 'Matsuo GPT', message: 'Hi! How can I help you today?' }, { id: 3, user: 'User', message: 'What is the weather like today?' }, { id: 4, user: 'Matsuo GPT', message: 'The weather is sunny with a chance of rain.' } ]; return /*#__PURE__*/ React.createElement("div", { className: "flex h-screen", __source: { fileName: "", lineNumber: 10, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-green-100 w-1/3 p-4 overflow-y-auto", __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-lg text-green-700 mb-4", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, "Chat History"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, sampleConversations.map((conv)=>/*#__PURE__*/ React.createElement("div", { key: conv.id, className: "p-2 bg-white rounded shadow", __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-medium text-green-700", __source: { fileName: "", lineNumber: 16, columnNumber: 15 }, __self: this }, conv.user, ":"), /*#__PURE__*/ React.createElement("div", { className: "text-green-600", __source: { fileName: "", lineNumber: 17, columnNumber: 15 }, __self: this }, conv.message))))), /*#__PURE__*/ React.createElement("div", { className: "flex-grow flex flex-col justify-end bg-gray-100 p-4", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col-reverse flex-grow mb-4 overflow-y-auto", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, sampleConversations.map((conv)=>/*#__PURE__*/ React.createElement("div", { key: conv.id, className: "mb-2", __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `text-${conv.user === 'User' ? 'right' : 'left'} text-green-700 font-medium`, __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }, conv.user, ":"), /*#__PURE__*/ React.createElement("div", { className: `text-${conv.user === 'User' ? 'right' : 'left'} text-green-600`, __source: { fileName: "", lineNumber: 29, columnNumber: 15 }, __self: this }, conv.message)))), /*#__PURE__*/ React.createElement("div", { className: "flex", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "message", className: "flex-grow border border-green-300 rounded-l p-2", placeholder: "Type your message...", __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "bg-green-500 text-white p-2 rounded-r", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, "Send")))); }