function MainComponent() { const [currentPage, setCurrentPage] = React.useState('himaHima'); const [rows, setRows] = React.useState(5); const [expanded, setExpanded] = React.useState(false); const handleNavigation = (page)=>{ setCurrentPage(page); }; const toggleRows = ()=>{ const newRowCount = expanded ? 5 : 7; setRows(newRowCount); setExpanded(!expanded); }; const gridTemplateRows = `repeat(${rows}, minmax(0, 1fr))`; let content; if (currentPage === 'timetable') { content = /*#__PURE__*/ React.createElement("div", { className: "flex flex-col flex-1 p-4", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-5 gap-2 mb-16", style: { gridTemplateRows }, __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, Array.from({ length: rows * 5 }).map((_, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-yellow-100 rounded-lg flex justify-center items-center", style: { aspectRatio: '1' }, __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("button", { onClick: toggleRows, className: "absolute left-1/2 bottom-4 bg-gray-200 rounded-full p-3 w-16 h-16 flex items-center justify-center transform -translate-x-1/2", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, expanded ? '−' : '+')); } else { content = /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-auto px-2 py-2", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex w-full my-2 items-center px-4 py-4 bg-yellow-100 rounded-3xl cursor-pointer", onClick: ()=>handleNavigation('timetable'), __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "./icons/himaHima-icon-1.png", alt: "User icon", className: "w-12 h-12 rounded-full mr-4", __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-lg", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }, "himaHima")))); } return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-screen bg-white", __source: { fileName: "", lineNumber: 65, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between px-4 py-2", __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this }, currentPage !== 'himaHima' && /*#__PURE__*/ React.createElement("button", { onClick: ()=>setCurrentPage('himaHima'), className: "p-2", __source: { fileName: "", lineNumber: 68, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-left text-xl", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "font-roboto font-bold text-green-400 text-xl", __source: { fileName: "", lineNumber: 72, columnNumber: 9 }, __self: this }, currentPage === 'himaHima' ? 'himaHima' : 'Timetable'), currentPage === 'himaHima' && /*#__PURE__*/ React.createElement("img", { src: "./icons/user-icon.png", alt: "User icon", className: "w-10 h-10 rounded-full", __source: { fileName: "", lineNumber: 76, columnNumber: 11 }, __self: this }), currentPage !== 'timetable' && /*#__PURE__*/ React.createElement("i", { className: "block p-2 fas fa-cog text-xl", __source: { fileName: "", lineNumber: 83, columnNumber: 11 }, __self: this })), content); }