function MainComponent() { const [email, setEmail] = React.useState(""); const [user, setUser] = React.useState(""); const [users, setUsers] = React.useState([]); React.useEffect(()=>{ const randomUsers = [ "nedia", "charisma", "yahir", "agent", "caseoh", "slade", "mase", "lebron", "axo son", "daddy", "mommy", "slay queen", "yasss", "poop" ]; const intervalId = setInterval(()=>{ const randomUser = { user: randomUsers[Math.floor(Math.random() * randomUsers.length)] }; const updatedUsers = [ ...JSON.parse(localStorage.getItem("subscribedUsers") || "[]"), randomUser ]; localStorage.setItem("subscribedUsers", JSON.stringify(updatedUsers)); setUsers(updatedUsers); }, 10000); return ()=>{ clearInterval(intervalId); }; }, []); React.useEffect(()=>{ const updateUsers = JSON.parse(localStorage.getItem("subscribedUsers") || "[]"); setUsers(updateUsers); }, []); const handleSubscription = ()=>{ if (!email.trim()) { alert("Email is required."); return; } const newUser = { user: user || "Anonymous" }; const updatedUsers = [ ...JSON.parse(localStorage.getItem("subscribedUsers") || "[]"), newUser ]; localStorage.setItem("subscribedUsers", JSON.stringify(updatedUsers)); setUsers(updatedUsers); setEmail(""); setUser(""); }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#6441a5] min-h-screen flex items-center justify-center", __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-row items-start", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-lg m-4", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto mb-8", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, "mdiehard18 on Twitch"), /*#__PURE__*/ React.createElement("p", { className: "mb-4 font-roboto", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, "Enter your email for updates on Twitch stream"), /*#__PURE__*/ React.createElement("input", { type: "email", className: "p-2 w-full bg-gray-200 rounded-md mb-4 font-roboto text-sm", value: email, onChange: (e)=>setEmail(e.target.value), placeholder: "Enter your email...", name: "emailInput", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", className: "p-2 bg-gray-200 rounded-md w-full mb-4 font-roboto text-sm", value: user, onChange: (e)=>setUser(e.target.value), placeholder: "Enter your user... (Optional)", name: "userInput", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleSubscription, className: "bg-purple-500 text-white rounded-md px-6 py-2 font-roboto", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, "Subscribe"), /*#__PURE__*/ React.createElement("p", { className: "mt-4", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "Join the adventure on ", /*#__PURE__*/ React.createElement("a", { href: "https://www.twitch.tv/mdiehard18", className: "underline font-bold", __source: { fileName: "", lineNumber: 61, columnNumber: 53 }, __self: this }, "twitch.tv/mdiehard18"))), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-lg m-4 max-h-[500px] overflow-auto", __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, "Subscribed Users"), /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }, users.map((u, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "font-roboto", __source: { fileName: "", lineNumber: 67, columnNumber: 15 }, __self: this }, u.user)))))); }