function Header1() { const { data: user, loading } = useUser(); const [isMenuOpen, setIsMenuOpen] = useState(false); const [profile, setProfile] = useState(null); useEffect(()=>{ const loadProfile = async ()=>{ if (!user?.id) return; try { const response = await fetch("/api/get-user-profile", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ userId: user.id }) }); const data = await response.json(); if (!data.error) { setProfile(data.profile); } } catch (error) { console.error("Error loading profile:", error); } }; loadProfile(); }, [ user?.id ]); const navigation = [ { name: "Home", href: "/home" }, { name: "News", href: "/news" }, { name: "Polls", href: "/polls" }, { name: "Conversations", href: "/conversations" } ]; const displayImageUrl = profile?.profile_image_url || user?.image || "https://www.gravatar.com/avatar/00000000000000000000000000000000?d=mp"; return /*#__PURE__*/ React.createElement("header", { className: "sticky top-0 z-50 bg-white shadow-md", __source: { fileName: "", lineNumber: 42, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex h-20 items-center justify-between", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-shrink-0", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { className: "h-16 w-auto", src: "https://ucarecdn.com/bcb892cd-d12a-4a4e-9c58-8090aeb02acb/-/format/auto/", alt: "PoliTalk Logo", __source: { fileName: "", lineNumber: 47, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("nav", { className: "hidden md:flex md:space-x-8", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, navigation.map((item)=>/*#__PURE__*/ React.createElement("a", { key: item.name, href: item.href, className: "inline-flex items-center px-1 pt-1 text-lg font-medium text-gray-700 hover:text-[#1E3A8A]", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this }, item.name))), /*#__PURE__*/ React.createElement("div", { className: "hidden md:flex md:items-center md:space-x-4", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("div", { className: "h-10 w-10 animate-pulse rounded-full bg-gray-200", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }) : user ? /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 71, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/profile", className: "group relative", __source: { fileName: "", lineNumber: 72, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: displayImageUrl, alt: "Profile", className: "h-10 w-10 rounded-full object-cover transition-transform group-hover:scale-110", __source: { fileName: "", lineNumber: 73, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute -bottom-2 left-1/2 hidden -translate-x-1/2 whitespace-nowrap rounded bg-gray-800 px-2 py-1 text-xs text-white group-hover:block", __source: { fileName: "", lineNumber: 78, columnNumber: 19 }, __self: this }, "View Profile")), /*#__PURE__*/ React.createElement("a", { href: "/account/logout", className: "rounded-lg border-2 border-[#1E3A8A] px-4 py-2 text-[#1E3A8A] hover:bg-[#1E3A8A] hover:text-white", __source: { fileName: "", lineNumber: 82, columnNumber: 17 }, __self: this }, "Sign Out")) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "rounded-lg px-4 py-2 text-[#1E3A8A] hover:bg-gray-100", __source: { fileName: "", lineNumber: 91, columnNumber: 17 }, __self: this }, "Sign In"), /*#__PURE__*/ React.createElement("a", { href: "/account/signup", className: "rounded-lg bg-[#FF4B4B] px-4 py-2 text-white hover:bg-[#E03E3E]", __source: { fileName: "", lineNumber: 97, columnNumber: 17 }, __self: this }, "Sign Up"))), /*#__PURE__*/ React.createElement("div", { className: "flex md:hidden", __source: { fileName: "", lineNumber: 107, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsMenuOpen(!isMenuOpen), className: "inline-flex items-center justify-center rounded-md p-2 text-gray-700 hover:bg-gray-100 hover:text-[#1E3A8A]", __source: { fileName: "", lineNumber: 108, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "sr-only", __source: { fileName: "", lineNumber: 112, columnNumber: 15 }, __self: this }, "Open main menu"), isMenuOpen ? /*#__PURE__*/ React.createElement("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", strokeWidth: "1.5", stroke: "currentColor", __source: { fileName: "", lineNumber: 114, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12", __source: { fileName: "", lineNumber: 121, columnNumber: 19 }, __self: this })) : /*#__PURE__*/ React.createElement("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", strokeWidth: "1.5", stroke: "currentColor", __source: { fileName: "", lineNumber: 128, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5", __source: { fileName: "", lineNumber: 135, columnNumber: 19 }, __self: this })))))), isMenuOpen && /*#__PURE__*/ React.createElement("div", { className: "md:hidden", __source: { fileName: "", lineNumber: 148, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-1 px-2 pb-3 pt-2", __source: { fileName: "", lineNumber: 149, columnNumber: 11 }, __self: this }, navigation.map((item)=>/*#__PURE__*/ React.createElement("a", { key: item.name, href: item.href, className: "block rounded-md px-3 py-2 text-base font-medium text-gray-700 hover:bg-gray-100 hover:text-[#1E3A8A]", __source: { fileName: "", lineNumber: 151, columnNumber: 15 }, __self: this }, item.name)), !user && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "block rounded-md px-3 py-2 text-base font-medium text-gray-700 hover:bg-gray-100 hover:text-[#1E3A8A]", __source: { fileName: "", lineNumber: 161, columnNumber: 17 }, __self: this }, "Sign In"), /*#__PURE__*/ React.createElement("a", { href: "/account/signup", className: "block rounded-md bg-[#FF4B4B] px-3 py-2 text-base font-medium text-white hover:bg-[#E03E3E]", __source: { fileName: "", lineNumber: 167, columnNumber: 17 }, __self: this }, "Sign Up")), user && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/profile", className: "block rounded-md px-3 py-2 text-base font-medium text-gray-700 hover:bg-gray-100 hover:text-[#1E3A8A]", __source: { fileName: "", lineNumber: 177, columnNumber: 17 }, __self: this }, "Profile"), /*#__PURE__*/ React.createElement("a", { href: "/account/logout", className: "block rounded-md px-3 py-2 text-base font-medium text-gray-700 hover:bg-gray-100 hover:text-[#1E3A8A]", __source: { fileName: "", lineNumber: 183, columnNumber: 17 }, __self: this }, "Sign Out"))))); } function Header1Story() { return /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 200, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 201, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-4 text-lg font-medium text-gray-600", __source: { fileName: "", lineNumber: 202, columnNumber: 9 }, __self: this }, "Header Component"), /*#__PURE__*/ React.createElement(Header1, { __source: { fileName: "", lineNumber: 205, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 207, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-4 text-lg font-medium text-gray-600", __source: { fileName: "", lineNumber: 208, columnNumber: 9 }, __self: this }, "Header with Scrolling Content"), /*#__PURE__*/ React.createElement("div", { className: "h-[400px] overflow-auto", __source: { fileName: "", lineNumber: 211, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(Header1, { __source: { fileName: "", lineNumber: 212, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 213, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-[800px] rounded-lg bg-gray-100 p-4", __source: { fileName: "", lineNumber: 214, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 215, columnNumber: 15 }, __self: this }, "Scroll down to see the header stick to the top")))))); } function MainComponent() { const [error, setError] = useState(null); const [loading, setLoading] = useState(false); const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); const { signUpWithCredentials } = useAuth(); const onSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setError(null); if (!email || !password) { setError("Please fill in all fields"); setLoading(false); return; } try { await signUpWithCredentials({ email, password, callbackUrl: "/", redirect: true }); } catch (err) { const errorMessages = { OAuthSignin: "Couldn't start sign-up. Please try again or use a different method.", OAuthCallback: "Sign-up failed after redirecting. Please try again.", OAuthCreateAccount: "Couldn't create an account with this sign-up option. Try another one.", EmailCreateAccount: "This email can't be used. It may already be registered.", Callback: "Something went wrong during sign-up. Please try again.", OAuthAccountNotLinked: "This account is linked to a different sign-in method. Try using that instead.", CredentialsSignin: "Invalid email or password. If you already have an account, try signing in instead.", AccessDenied: "You don't have permission to sign up.", Configuration: "Sign-up isn't working right now. Please try again later.", Verification: "Your sign-up link has expired. Request a new one." }; setError(errorMessages[err.message] || "Something went wrong. Please try again."); setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-blue-50 to-indigo-50", __source: { fileName: "", lineNumber: 55, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(Header1, { __source: { fileName: "", lineNumber: 56, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mx-auto flex min-h-[calc(100vh-80px)] max-w-7xl flex-col px-4", __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex min-h-full flex-col items-center justify-center py-12 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-md", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-2xl bg-white p-8 shadow-xl", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "mb-8 text-center text-3xl font-bold text-gray-800", __source: { fileName: "", lineNumber: 62, columnNumber: 17 }, __self: this }, "Join PoliTalk"), /*#__PURE__*/ React.createElement("form", { noValidate: true, onSubmit: onSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 66, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 67, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 68, columnNumber: 21 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("div", { className: "overflow-hidden rounded-lg border border-gray-200 bg-white px-4 py-3 focus-within:border-[#357AFF] focus-within:ring-1 focus-within:ring-[#357AFF]", __source: { fileName: "", lineNumber: 71, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("input", { required: true, name: "email", type: "email", value: email, onChange: (e)=>setEmail(e.target.value), placeholder: "Enter your email", className: "w-full bg-transparent text-lg outline-none", __source: { fileName: "", lineNumber: 72, columnNumber: 23 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 84, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 85, columnNumber: 21 }, __self: this }, "Password"), /*#__PURE__*/ React.createElement("div", { className: "overflow-hidden rounded-lg border border-gray-200 bg-white px-4 py-3 focus-within:border-[#357AFF] focus-within:ring-1 focus-within:ring-[#357AFF]", __source: { fileName: "", lineNumber: 88, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("input", { required: true, name: "password", type: "password", value: password, onChange: (e)=>setPassword(e.target.value), className: "w-full rounded-lg bg-transparent text-lg outline-none", placeholder: "Enter your password", __source: { fileName: "", lineNumber: 89, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "mt-1 text-xs text-gray-500", __source: { fileName: "", lineNumber: 99, columnNumber: 21 }, __self: this }, "Must be at least 8 characters")), error && /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-red-50 p-3 text-sm text-red-500", __source: { fileName: "", lineNumber: 105, columnNumber: 21 }, __self: this }, error), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: loading, className: "w-full rounded-lg bg-[#357AFF] px-4 py-3 text-base font-medium text-white transition-colors hover:bg-[#2E69DE] focus:outline-none focus:ring-2 focus:ring-[#357AFF] focus:ring-offset-2 disabled:opacity-50", __source: { fileName: "", lineNumber: 110, columnNumber: 19 }, __self: this }, loading ? "Creating Account..." : "Create Account"), /*#__PURE__*/ React.createElement("div", { className: "relative my-6", __source: { fileName: "", lineNumber: 118, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 flex items-center", __source: { fileName: "", lineNumber: 119, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full border-t border-gray-200", __source: { fileName: "", lineNumber: 120, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "relative flex justify-center text-sm", __source: { fileName: "", lineNumber: 122, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "bg-white px-2 text-gray-500", __source: { fileName: "", lineNumber: 123, columnNumber: 23 }, __self: this }, "Already have an account?"))), /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "flex w-full items-center justify-center rounded-lg border border-gray-300 bg-white px-4 py-3 text-base font-medium text-gray-700 transition-colors hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-[#357AFF] focus:ring-offset-2", __source: { fileName: "", lineNumber: 129, columnNumber: 19 }, __self: this }, "Sign In"))), /*#__PURE__*/ React.createElement("p", { className: "mt-6 text-center text-sm text-gray-600", __source: { fileName: "", lineNumber: 138, columnNumber: 15 }, __self: this }, "By signing up, you agree to our", " ", /*#__PURE__*/ React.createElement("a", { href: "/terms", className: "text-[#357AFF] hover:text-[#2E69DE]", __source: { fileName: "", lineNumber: 140, columnNumber: 17 }, __self: this }, "Terms of Service"), " ", "and", " ", /*#__PURE__*/ React.createElement("a", { href: "/privacy", className: "text-[#357AFF] hover:text-[#2E69DE]", __source: { fileName: "", lineNumber: 147, columnNumber: 17 }, __self: this }, "Privacy Policy"))))))); }