function MainComponent() { const [isPlaying, setIsPlaying] = useState(false); const [formData, setFormData] = useState({ firstName: "", lastName: "", email: "", message: "" }); const [contactError, setContactError] = useState(null); const [contactSuccess, setContactSuccess] = useState(false); const handleContactSubmit = async (e)=>{ e.preventDefault(); setContactError(null); setContactSuccess(false); try { const response = await fetch("/api/contact", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(formData) }); if (!response.ok) { throw new Error("Failed to send message"); } setContactSuccess(true); setFormData({ firstName: "", lastName: "", email: "", message: "" }); } catch (err) { setContactError("Oops! Something went wrong sending the message"); console.error(err); } }; const handleContactChange = (e)=>{ setFormData({ ...formData, [e.target.name]: e.target.value }); }; const scrollToContact = ()=>{ document.querySelector("footer").scrollIntoView({ behavior: "smooth" }); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-white dark:bg-gray-900 flex flex-col", __source: { fileName: "", lineNumber: 55, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "bg-white dark:bg-gray-900 shadow-md p-4 sticky top-0 z-50", __source: { fileName: "", lineNumber: 56, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto flex items-center justify-between", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/5f1ce6ab-de9a-4c74-baab-34e62ef457dd/-/format/auto/", alt: "Rick Astley Logo", className: "w-16 h-16 object-cover", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-2xl font-bold text-gray-900 dark:text-white font-inter", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, "Rickroll Link Generator")), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-8", __source: { fileName: "", lineNumber: 69, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/generador-enlaces", className: "text-gray-900 dark:text-white font-inter font-bold hover:text-gray-700 dark:hover:text-gray-300", __source: { fileName: "", lineNumber: 70, columnNumber: 13 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("a", { href: "/video-trailer", className: "text-gray-900 dark:text-white font-inter font-bold hover:text-gray-700 dark:hover:text-gray-300", __source: { fileName: "", lineNumber: 76, columnNumber: 13 }, __self: this }, "Video Trailer"), /*#__PURE__*/ React.createElement("a", { href: "/contact", className: "text-gray-900 dark:text-white font-inter font-bold hover:text-gray-700 dark:hover:text-gray-300", __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("a", { href: "/about-us", className: "text-gray-900 dark:text-white font-inter font-bold hover:text-gray-700 dark:hover:text-gray-300", __source: { fileName: "", lineNumber: 88, columnNumber: 13 }, __self: this }, "About Us")))), /*#__PURE__*/ React.createElement("div", { className: "p-4 md:p-8 flex-grow", __source: { fileName: "", lineNumber: 98, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl mx-auto", __source: { fileName: "", lineNumber: 99, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl md:text-6xl font-bold text-gray-900 dark:text-white mb-8 text-center font-inter", __source: { fileName: "", lineNumber: 100, columnNumber: 11 }, __self: this }, "Video Trailer 🎬"), /*#__PURE__*/ React.createElement("div", { className: "relative w-full aspect-video bg-gray-800 rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 104, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 flex items-center justify-center", __source: { fileName: "", lineNumber: 105, columnNumber: 13 }, __self: this }, !isPlaying ? /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsPlaying(true), className: "bg-gray-900 hover:bg-gray-700 text-white font-inter px-8 py-4 rounded-md text-lg transition-colors flex items-center gap-2", __source: { fileName: "", lineNumber: 107, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-play", __source: { fileName: "", lineNumber: 111, columnNumber: 19 }, __self: this }), "Play Trailer") : /*#__PURE__*/ React.createElement("div", { className: "w-full h-full", __source: { fileName: "", lineNumber: 115, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("iframe", { src: "https://www.youtube.com/embed/trKmOeDLD7Y?autoplay=1&controls=1&modestbranding=1", className: "w-full h-full", allow: "autoplay; fullscreen", style: { border: "none" }, __source: { fileName: "", lineNumber: 116, columnNumber: 19 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 text-center", __source: { fileName: "", lineNumber: 127, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 dark:text-gray-300 text-lg font-inter", __source: { fileName: "", lineNumber: 128, columnNumber: 13 }, __self: this }, "Click play to watch the trailer!")))), /*#__PURE__*/ React.createElement("footer", { className: "bg-black py-16", __source: { fileName: "", lineNumber: 135, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-2xl mx-auto px-4", __source: { fileName: "", lineNumber: 136, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-white mb-8 font-inter text-center", __source: { fileName: "", lineNumber: 137, columnNumber: 11 }, __self: this }, "Contact Us"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleContactSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 141, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 142, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 143, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "firstName", className: "block text-white mb-2 font-inter", __source: { fileName: "", lineNumber: 144, columnNumber: 17 }, __self: this }, "First Name"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "firstName", name: "firstName", value: formData.firstName, onChange: handleContactChange, required: true, className: "w-full px-4 py-2 rounded-md border border-gray-600 bg-gray-800 text-white font-inter", placeholder: "John", __source: { fileName: "", lineNumber: 150, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 162, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "lastName", className: "block text-white mb-2 font-inter", __source: { fileName: "", lineNumber: 163, columnNumber: 17 }, __self: this }, "Last Name"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "lastName", name: "lastName", value: formData.lastName, onChange: handleContactChange, required: true, className: "w-full px-4 py-2 rounded-md border border-gray-600 bg-gray-800 text-white font-inter", placeholder: "Doe", __source: { fileName: "", lineNumber: 169, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 182, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "block text-white mb-2 font-inter", __source: { fileName: "", lineNumber: 183, columnNumber: 15 }, __self: this }, "Email Address"), /*#__PURE__*/ React.createElement("input", { type: "email", id: "email", name: "email", value: formData.email, onChange: handleContactChange, required: true, className: "w-full px-4 py-2 rounded-md border border-gray-600 bg-gray-800 text-white font-inter", placeholder: "john@example.com", __source: { fileName: "", lineNumber: 189, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 201, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "message", className: "block text-white mb-2 font-inter", __source: { fileName: "", lineNumber: 202, columnNumber: 15 }, __self: this }, "Message"), /*#__PURE__*/ React.createElement("textarea", { id: "message", name: "message", value: formData.message, onChange: handleContactChange, required: true, rows: "4", className: "w-full px-4 py-2 rounded-md border border-gray-600 bg-gray-800 text-white font-inter", placeholder: "Your message here...", __source: { fileName: "", lineNumber: 208, columnNumber: 15 }, __self: this })), contactError && /*#__PURE__*/ React.createElement("div", { className: "text-red-400 text-center font-inter", __source: { fileName: "", lineNumber: 221, columnNumber: 15 }, __self: this }, contactError), contactSuccess && /*#__PURE__*/ React.createElement("div", { className: "text-green-400 text-center font-inter", __source: { fileName: "", lineNumber: 227, columnNumber: 15 }, __self: this }, "Thank you for your message! We'll get back to you soon."), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-black text-white font-inter px-8 py-4 rounded-md text-lg border border-white hover:bg-gray-900 transition-colors", __source: { fileName: "", lineNumber: 232, columnNumber: 13 }, __self: this }, "Send"))))); }