function MainComponent() { const [notificationSent, setNotificationSent] = React.useState(false); const [welcomeMessage, setWelcomeMessage] = React.useState(''); React.useEffect(()=>{ const hour = new Date().getHours(); let message = 'Good morning'; if (hour >= 12 && hour < 18) message = 'Good afternoon'; else if (hour >= 18) message = 'Good evening'; setWelcomeMessage(message); const now = new Date(); const startTime = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 8, 0, 0, 0); const millisecondsUntilStart = startTime - now; if (millisecondsUntilStart >= 0) { setTimeout(()=>{ setNotificationSent(true); }, millisecondsUntilStart); } else { setNotificationSent(true); } }, []); const currentTime = new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }); const newsHeadline = "Global Markets Rally on Tech Growth"; const temperature = "18°C"; const stockMarketTrend = "↑ 1.24%"; const newsContentElement = /*#__PURE__*/ React.createElement("div", { className: "h-[200px] p-6 border-b border-gray-200", __source: { fileName: "", lineNumber: 33, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold mb-3", __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this }, "Today's Headlines"), /*#__PURE__*/ React.createElement("p", { className: "text-sm", __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, newsHeadline)); const weatherContentElement = /*#__PURE__*/ React.createElement("div", { className: "h-[150px] p-6 border-b border-gray-200", __source: { fileName: "", lineNumber: 40, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold mb-3", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, "Weather"), /*#__PURE__*/ React.createElement("p", { className: "text-sm", __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this }, "Current temperature: ", temperature)); const stockContentElement = /*#__PURE__*/ React.createElement("div", { className: "h-[150px] p-6", __source: { fileName: "", lineNumber: 47, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold mb-3", __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this }, "Stock Market"), /*#__PURE__*/ React.createElement("p", { className: "text-sm", __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this }, "S&P 500: ", stockMarketTrend)); const headerElement = /*#__PURE__*/ React.createElement("div", { className: "bg-[#FFCC00] px-6 py-4 flex justify-between items-center", __source: { fileName: "", lineNumber: 54, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 55, columnNumber: 7 }, __self: this }, welcomeMessage), notificationSent && /*#__PURE__*/ React.createElement("span", { className: "text-xs font-medium bg-red-600 text-white py-1 px-3 rounded-full", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, "New!")); const navigationElement = /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center p-4 bg-white border-t border-gray-200", __source: { fileName: "", lineNumber: 65, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-cog fa-2x text-gray-600", name: "settings", __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fa fa-home fa-2x text-gray-600", name: "home", __source: { fileName: "", lineNumber: 67, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fa fa-user fa-2x text-gray-600", name: "profile", __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this })); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 p-4", __source: { fileName: "", lineNumber: 73, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-md mx-auto bg-white rounded-lg overflow-hidden shadow-lg", __source: { fileName: "", lineNumber: 74, columnNumber: 7 }, __self: this }, headerElement, newsContentElement, weatherContentElement, stockContentElement), navigationElement, /*#__PURE__*/ React.createElement("p", { className: "text-center mt-4 text-sm", __source: { fileName: "", lineNumber: 81, columnNumber: 7 }, __self: this }, "Last updated at ", currentTime), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 82, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fade-in { animation: fadeIn 1s ease-in-out; } `)); }