function MainComponent() { const [imageError, setImageError] = useState(false); const [coolThing, setCoolThing] = useState(""); const [submitStatus, setSubmitStatus] = useState(""); const links = [ { emoji: "💼", text: "Go to Market Expert", link: "https://getradicle.nl", delay: "0" }, { emoji: "🤝", text: "Startup Coach & Angel investor", link: "https://caempus.nl", delay: "100" }, { emoji: "🍕", text: "Pizzamaker", link: "https://instagram.com/depizzagalerij", delay: "200" }, { emoji: "🐕", text: "Dachshund enthusiast", link: "http://instagram.com/oh__my__george", delay: "300" } ]; const socialIcons = [ { icon: "phone", link: "https://cal.com/minnebo/20min", delay: "0" }, { icon: "envelope", link: "mailto:dirk@minnebo.co", delay: "0.1", isRegular: true }, { icon: "linkedin", link: "https://linkedin.com/in/dirkminnebo", delay: "0.2" }, { icon: "instagram", link: "https://instagram.com/dirkminnebo", delay: "0.3" } ]; useEffect(()=>{ const link = document.querySelector("link[rel~='icon']") || document.createElement("link"); link.type = "image/jpeg"; link.rel = "icon"; link.href = "https://ucarecdn.com/3f72f5d4-b4e4-4bf2-9f30-803257719281/-/format/auto/"; document.getElementsByTagName("head")[0].appendChild(link); }, []); const handleSubmit = async (e)=>{ e.preventDefault(); if (!coolThing.trim()) return; try { setSubmitStatus("sending"); const response = await fetch("/api/submit-cool", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ content: coolThing }) }); if (!response.ok) { const errorDetails = await response.json().catch(()=>({ error: "Could not parse error response" })); const errorMessage = errorDetails.error || `HTTP error! status: ${response.status}`; throw new Error(errorMessage); } setCoolThing(""); setSubmitStatus("success"); setTimeout(()=>setSubmitStatus(""), 3000); } catch (error) { console.error("Submission error:", error); setSubmitStatus("error"); setTimeout(()=>setSubmitStatus(""), 3000); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-b from-[#faf7f2] via-[#fff5ea] to-[#f5f2ed] animate-gradient bg-[length:200%_200%] flex items-center justify-center font-roboto cursor-dachshund", __source: { fileName: "", lineNumber: 96, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center p-8 max-w-xl w-full mx-4", __source: { fileName: "", lineNumber: 97, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-[180px] h-[180px] mx-auto mb-6 transform transition-all duration-300 hover:scale-105 group perspective", __source: { fileName: "", lineNumber: 98, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative transform-gpu transition-all duration-300 group-hover:rotate-y-12 group-hover:rotate-x-12", __source: { fileName: "", lineNumber: 99, columnNumber: 11 }, __self: this }, !imageError ? /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/f196d500-edd0-4b45-a0b8-39851d7039d6/-/format/auto/", alt: "Dirk Minnebo profile picture", className: "w-[180px] h-[180px] rounded-full object-cover shadow-lg ring-4 ring-[#ff6b2b]/10 transition-all duration-300 group-hover:shadow-xl group-hover:ring-[#ff6b2b]/30", onError: ()=>setImageError(true), __source: { fileName: "", lineNumber: 101, columnNumber: 15 }, __self: this }) : /*#__PURE__*/ React.createElement("span", { className: "text-4xl text-[#666666]", __source: { fileName: "", lineNumber: 108, columnNumber: 15 }, __self: this }, "DM"), /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 rounded-full bg-gradient-to-tr from-white/10 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300", __source: { fileName: "", lineNumber: 110, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("h1", { className: "text-4xl text-[#666666] mb-6", __source: { fileName: "", lineNumber: 113, columnNumber: 9 }, __self: this }, "Dirk Minnebo"), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center gap-8 mb-4", __source: { fileName: "", lineNumber: 114, columnNumber: 9 }, __self: this }, socialIcons.map((item, index)=>/*#__PURE__*/ React.createElement("a", { key: index, href: item.link, target: "_blank", rel: "noopener noreferrer", className: "text-[#666666] hover:text-[#666666] p-2 rounded-lg transition-all duration-300 hover:bg-[#ff6b2b]/5 hover:shadow-md transform hover:scale-105", style: { animationDelay: `${item.delay}s` }, __source: { fileName: "", lineNumber: 116, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${item.isRegular || item.icon === "phone" ? "fas" : "fab"} fa-${item.icon} text-2xl`, __source: { fileName: "", lineNumber: 124, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "space-y-0.5 text-lg text-[#666666]", __source: { fileName: "", lineNumber: 130, columnNumber: 9 }, __self: this }, links.map((item, index)=>/*#__PURE__*/ React.createElement("p", { key: index, className: "group animate-fade-in-up", style: { animationDelay: `${item.delay}ms` }, __source: { fileName: "", lineNumber: 132, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: item.link, target: "_blank", rel: "noopener noreferrer", className: "hover:text-[#666666] flex items-center justify-center gap-3 p-2 relative overflow-hidden rounded-lg transition-all duration-300 hover:bg-[#ff6b2b]/5 hover:shadow-md w-full group-hover:translate-x-1", __source: { fileName: "", lineNumber: 137, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-2xl relative z-10 transform group-hover:scale-110 transition-transform duration-300", __source: { fileName: "", lineNumber: 143, columnNumber: 17 }, __self: this }, item.emoji), /*#__PURE__*/ React.createElement("span", { className: "relative z-10", __source: { fileName: "", lineNumber: 146, columnNumber: 17 }, __self: this }, item.text))))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 pt-8 border-t border-[#666666]/5", __source: { fileName: "", lineNumber: 152, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-4", __source: { fileName: "", lineNumber: 153, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 154, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: coolThing, onChange: (e)=>setCoolThing(e.target.value), placeholder: "Share something inspiring...", className: "flex-1 p-3 rounded-lg bg-white/20 border border-[#ff6b2b]/10 focus:border-[#ff6b2b]/20 focus:ring-2 focus:ring-[#ff6b2b]/10 outline-none transition-all duration-300 placeholder-[#666666]/40 text-[#666666]", __source: { fileName: "", lineNumber: 155, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: submitStatus === "sending", className: "px-6 py-3 bg-[#ff6b2b]/5 hover:bg-[#ff6b2b]/10 text-[#666666] rounded-lg transition-all duration-300 hover:shadow-md disabled:opacity-50 disabled:cursor-not-allowed whitespace-nowrap", __source: { fileName: "", lineNumber: 162, columnNumber: 15 }, __self: this }, submitStatus === "sending" ? "Sending..." : "Send")), submitStatus === "success" && /*#__PURE__*/ React.createElement("p", { className: "text-green-600/50 animate-fade-in-up", __source: { fileName: "", lineNumber: 171, columnNumber: 15 }, __self: this }, "Thanks for the inspiration!"), submitStatus === "error" && /*#__PURE__*/ React.createElement("p", { className: "text-red-600/50 animate-fade-in-up", __source: { fileName: "", lineNumber: 176, columnNumber: 15 }, __self: this }, "Oops! Something went wrong. Please try again later.")))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 183, columnNumber: 7 }, __self: this }, ` @keyframes gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } .animate-gradient { animation: gradient 15s ease infinite; } @keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in-up { animation: fadeInUp 0.6s ease-out forwards; opacity: 0; } .perspective { perspective: 1000px; } @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } } .animate-float { animation: float 3s ease-in-out infinite; } .cursor-dachshund { cursor: url("data:image/svg+xml;utf8,"), auto; } .cursor-dachshund a, .cursor-dachshund a:active { cursor: url("data:image/svg+xml;utf8,"), pointer; } `)); }