function MainComponent() { const [tempEmail, setTempEmail] = useState(""); const [emails, setEmails] = useState([]); const [loading, setLoading] = useState(false); const generateEmail = async ()=>{ setLoading(true); // Suggest creating a Function for email generation setLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50 p-8", __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-3xl mx-auto space-y-8", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-roboto mb-6 text-gray-800", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, "Temporary Email Generator"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4 items-center", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: generateEmail, disabled: loading, className: "bg-blue-500 hover:bg-blue-600 text-white px-6 py-2 rounded-md font-roboto transition-colors", __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin", __source: { fileName: "", lineNumber: 27, columnNumber: 17 }, __self: this }) : "Generate Email"), /*#__PURE__*/ React.createElement("div", { className: "flex-1 bg-gray-100 p-3 rounded-md", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-mono text-gray-700", __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this }, tempEmail || "No email generated yet")))), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-roboto mb-4 text-gray-800", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, "Inbox"), /*#__PURE__*/ React.createElement("div", { className: "border rounded-md min-h-[300px] bg-gray-50", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, emails.length === 0 ? /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center h-[300px] text-gray-500 font-roboto", __source: { fileName: "", lineNumber: 46, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 47, columnNumber: 17 }, __self: this }, "No messages yet")) : /*#__PURE__*/ React.createElement("div", { className: "divide-y", __source: { fileName: "", lineNumber: 50, columnNumber: 15 }, __self: this }, emails.map((email, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "p-4", __source: { fileName: "", lineNumber: 52, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 53, columnNumber: 21 }, __self: this }, email)))))))); }