function MainComponent() { const [activePage, setActivePage] = React.useState('dashboard'); const navItems = [ { name: 'Dashboard', icon: 'fa fa-home', page: 'dashboard' }, { name: 'Prediction', icon: 'fa fa-chart-line', page: 'prediction' }, { name: 'Data & Charts', icon: 'fa fa-chart-bar', page: 'dataAndCharts' }, { name: 'Settings', icon: 'fa fa-cog', page: 'settings' }, { name: 'Stocks', icon: 'fa fa-briefcase', page: 'stocks' }, { name: 'Forex', icon: 'fa fa-exchange-alt', page: 'forex' }, { name: 'Crypto', icon: 'fa fa-bitcoin', page: 'crypto' }, { name: 'Sports Betting', icon: 'fa fa-football-ball', page: 'sportsBetting' } ]; const renderContent = ()=>{ switch(activePage){ case 'dashboard': return /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }); case 'prediction': return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 24, columnNumber: 16 }, __self: this }, "Prediction interface will be implemented here"); case 'dataAndCharts': return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 26, columnNumber: 16 }, __self: this }, "Data & Charts interface will be implemented here"); case 'settings': return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 28, columnNumber: 16 }, __self: this }, "Settings interface will be implemented here"); case 'stocks': return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 30, columnNumber: 16 }, __self: this }, "Stocks Trading interface will be implemented here"); case 'forex': return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 32, columnNumber: 16 }, __self: this }, "Forex Trading interface will be implemented here"); case 'crypto': return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 34, columnNumber: 16 }, __self: this }, "Crypto Trading interface will be implemented here"); case 'sportsBetting': return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 36, columnNumber: 16 }, __self: this }, "Sports Betting interface will be implemented here"); } }; const pageTitles = { dashboard: 'Dashboard', prediction: 'Prediction', dataAndCharts: 'Data & Charts', settings: 'Settings', stocks: 'Stocks', forex: 'Forex', crypto: 'Crypto', sportsBetting: 'Sports Betting' }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col min-h-screen bg-[#181c20] text-[#f1f5f9] font-roboto", __source: { fileName: "", lineNumber: 50, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "fixed inset-x-0 top-0 bg-[#111827] p-3 z-10", __source: { fileName: "", lineNumber: 51, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-4xl", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, "10:23"), /*#__PURE__*/ React.createElement("span", { className: "text-3xl iconify", "data-icon": "mdi:wifi", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("h1", { className: "text-4xl my-4", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, pageTitles[activePage]), activePage === 'dashboard' && /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#1f2937] p-4 rounded-lg flex items-center justify-between", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 60, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#22c55e]", __source: { fileName: "", lineNumber: 61, columnNumber: 17 }, __self: this }, "AAPL"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 62, columnNumber: 17 }, __self: this }, "Prediction for next trading session: PREDICTED PRICE 420"), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 63, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 64, columnNumber: 19 }, __self: this }, "PREDICTED CHANGE +284.55"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 65, columnNumber: 19 }, __self: this }, "RELIABILITY GOOD"))), /*#__PURE__*/ React.createElement("div", { className: "ml-4", __source: { fileName: "", lineNumber: 68, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-arrow-up text-3xl text-[#22c55e]", __source: { fileName: "", lineNumber: 69, columnNumber: 17 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-y-auto p-4", __source: { fileName: "", lineNumber: 75, columnNumber: 7 }, __self: this }, renderContent()), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 78, columnNumber: 7 }, __self: this }, ` @keyframes fadeInUp { from { transform: translate3d(0, 100%, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } } .animated { animation-duration: 1s; animation-fill-mode: both; animation-name: fadeInUp; } `), /*#__PURE__*/ React.createElement("div", { className: "fixed inset-x-0 bottom-0 bg-[#111827] py-3", __source: { fileName: "", lineNumber: 94, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-around text-center", __source: { fileName: "", lineNumber: 95, columnNumber: 9 }, __self: this }, navItems.map((item)=>/*#__PURE__*/ React.createElement("button", { key: item.name, onClick: ()=>setActivePage(item.page), className: `flex flex-col items-center animated`, style: { animationDelay: `${navItems.indexOf(item) * 0.1}s` }, __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${item.icon} text-xl`, __source: { fileName: "", lineNumber: 103, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 104, columnNumber: 15 }, __self: this }, item.name)))))); }