function MainComponent() { const [isVisible, setIsVisible] = useState(false); const [isMobile, setIsMobile] = useState(false); const [data, setData] = useState({ experience: [], legal_initiatives: [], articles: [], certifications: [], areas_of_interest: [] }); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); useEffect(()=>{ setIsVisible(true); // Detect if device is mobile const checkMobile = ()=>{ if (typeof window !== "undefined") { const userAgent = navigator.userAgent || navigator.vendor || window.opera; const mobileRegex = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i; setIsMobile(mobileRegex.test(userAgent)); } }; checkMobile(); // Fetch law experiences data const fetchData = async ()=>{ try { setLoading(true); const response = await fetch("/api/law-experiences", { method: "POST" }); if (!response.ok) { throw new Error(`Error fetching law experiences: ${response.status}`); } const result = await response.json(); setData(result); } catch (err) { console.error("Failed to fetch law experiences:", err); setError("Failed to load data. Please try again later."); } finally{ setLoading(false); } }; fetchData(); }, []); // Email configuration const emailAddress = "purusharth.gandhi@gmail.com"; const emailSubject = "Let's connect"; // Device-specific email links const mailtoLink = `mailto:${emailAddress}?subject=${encodeURIComponent(emailSubject)}`; const gmailLink = `https://mail.google.com/mail/?view=cm&fs=1&to=${emailAddress}&su=${encodeURIComponent(emailSubject)}`; // Use Gmail on desktop/tablet and default mail app on mobile const emailLink = isMobile ? mailtoLink : gmailLink; // Format year display for timeline items const formatYearDisplay = (item)=>{ if (item.start_year && item.end_year) { return `${item.start_year} - ${item.end_year}`; } else if (item.start_year) { return item.start_year; } else if (item.year) { return item.year; } return ""; }; // Function to render description as bullet points or paragraph const renderDescription = (item)=>{ // If description_points array exists and has items, render as bullet points if (item.description_points && item.description_points.length > 0) { return /*#__PURE__*/ React.createElement("ul", { className: "list-disc pl-5 space-y-2 text-gray-400", __source: { fileName: "", lineNumber: 83, columnNumber: 9 }, __self: this }, item.description_points.map((point, i)=>/*#__PURE__*/ React.createElement("li", { key: i, className: "leading-relaxed", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }, point))); } // Otherwise render as regular paragraph return /*#__PURE__*/ React.createElement("p", { className: "text-gray-400", __source: { fileName: "", lineNumber: 93, columnNumber: 12 }, __self: this }, item.description); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#0A0A0A]", __source: { fileName: "", lineNumber: 97, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "fixed w-full p-6 backdrop-blur-lg bg-black/30 flex justify-between items-center z-50", __source: { fileName: "", lineNumber: 98, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "text-[#00FFB2] text-2xl font-space-mono", __source: { fileName: "", lineNumber: 99, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-left mr-2", __source: { fileName: "", lineNumber: 100, columnNumber: 11 }, __self: this }), "Back to Home"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-6", __source: { fileName: "", lineNumber: 102, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://www.linkedin.com/in/purusharth-gandhi-bb7867252/", target: "_blank", rel: "noopener noreferrer", className: "text-[#00FFB2] hover:text-white transition-colors", "aria-label": "LinkedIn", __source: { fileName: "", lineNumber: 103, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-linkedin text-xl", __source: { fileName: "", lineNumber: 110, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: "https://x.com/Purusharth_G", target: "_blank", rel: "noopener noreferrer", className: "text-[#00FFB2] hover:text-white transition-colors", "aria-label": "X (formerly Twitter)", __source: { fileName: "", lineNumber: 112, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl font-bold", __source: { fileName: "", lineNumber: 119, columnNumber: 13 }, __self: this }, "𝕏")), /*#__PURE__*/ React.createElement("a", { href: emailLink, target: "_blank", rel: "noopener noreferrer", className: "text-[#00FFB2] hover:text-white transition-colors cursor-pointer", "aria-label": "Email", __source: { fileName: "", lineNumber: 121, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-envelope text-xl", __source: { fileName: "", lineNumber: 128, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("main", { className: "pt-32 px-6 md:px-20", __source: { fileName: "", lineNumber: 133, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-white max-w-4xl mx-auto", __source: { fileName: "", lineNumber: 134, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-[#00FFB2] mb-4 font-space-mono", __source: { fileName: "", lineNumber: 135, columnNumber: 11 }, __self: this }, "Legal Experience"), /*#__PURE__*/ React.createElement("h1", { className: "text-6xl md:text-8xl font-space-mono mb-4 tracking-tighter", __source: { fileName: "", lineNumber: 138, columnNumber: 11 }, __self: this }, "Pursuits in Law"), /*#__PURE__*/ React.createElement("h2", { className: "text-4xl md:text-6xl text-gray-400 font-space-mono mb-8", __source: { fileName: "", lineNumber: 141, columnNumber: 11 }, __self: this }, "Merging Legal Theory with Business Reality"), /*#__PURE__*/ React.createElement("div", { className: "h-[2px] w-24 bg-[#00FFB2] mb-8", __source: { fileName: "", lineNumber: 144, columnNumber: 11 }, __self: this })), loading ? /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-64", __source: { fileName: "", lineNumber: 148, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-[#00FFB2] text-xl", __source: { fileName: "", lineNumber: 149, columnNumber: 13 }, __self: this }, "Loading...")) : error ? /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-64", __source: { fileName: "", lineNumber: 152, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-red-500 text-xl", __source: { fileName: "", lineNumber: 153, columnNumber: 13 }, __self: this }, error)) : /*#__PURE__*/ React.createElement(React.Fragment, null, data.experience && data.experience.length > 0 && /*#__PURE__*/ React.createElement("section", { className: "mt-20 max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 159, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl text-white font-space-mono mb-8", __source: { fileName: "", lineNumber: 160, columnNumber: 17 }, __self: this }, "Professional Experience"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-[#00FFB2] font-space-mono mb-4", __source: { fileName: "", lineNumber: 163, columnNumber: 17 }, __self: this }, "Building Practical Legal Skills"), /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 166, columnNumber: 17 }, __self: this }, data.experience.map((item, index)=>/*#__PURE__*/ React.createElement("div", { key: item.id, className: "border-l-2 border-[#00FFB2] pl-8 text-gray-400 timeline-item", style: { animationDelay: `${0.1 * index}s` }, __source: { fileName: "", lineNumber: 168, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-[#00FFB2] font-space-mono", __source: { fileName: "", lineNumber: 173, columnNumber: 23 }, __self: this }, formatYearDisplay(item)), /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-white font-space-mono", __source: { fileName: "", lineNumber: 176, columnNumber: 23 }, __self: this }, item.title), item.organization && /*#__PURE__*/ React.createElement("h4", { className: "text-lg text-gray-300 font-space-mono mb-2", __source: { fileName: "", lineNumber: 180, columnNumber: 25 }, __self: this }, item.organization), renderDescription(item))))), data.legal_initiatives && data.legal_initiatives.length > 0 && /*#__PURE__*/ React.createElement("section", { className: "mt-20 max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 193, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl text-white font-space-mono mb-8", __source: { fileName: "", lineNumber: 194, columnNumber: 17 }, __self: this }, "Legal Initiatives"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-[#00FFB2] font-space-mono mb-4", __source: { fileName: "", lineNumber: 197, columnNumber: 17 }, __self: this }, "Applying Legal Principles to Real-World Challenges"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8", __source: { fileName: "", lineNumber: 200, columnNumber: 17 }, __self: this }, data.legal_initiatives.map((initiative, index)=>/*#__PURE__*/ React.createElement("div", { key: initiative.id, className: "border border-[#00FFB2]/20 p-6 rounded-sm case-study-card", style: { animationDelay: `${0.2 + 0.1 * index}s` }, __source: { fileName: "", lineNumber: 202, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-white font-space-mono mb-4", __source: { fileName: "", lineNumber: 207, columnNumber: 23 }, __self: this }, initiative.title), renderDescription(initiative))))), data.articles && data.articles.length > 0 && /*#__PURE__*/ React.createElement("section", { className: "mt-20 max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 219, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl text-white font-space-mono mb-8", __source: { fileName: "", lineNumber: 220, columnNumber: 17 }, __self: this }, "Published Articles"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-[#00FFB2] font-space-mono mb-4", __source: { fileName: "", lineNumber: 223, columnNumber: 17 }, __self: this }, "Exploring Legal Concepts Through Writing"), data.articles.map((article, index)=>/*#__PURE__*/ React.createElement("div", { key: article.id, className: "border border-[#00FFB2]/20 p-6 rounded-sm article-card mb-4", style: { animationDelay: `${0.3 + 0.1 * index}s` }, __source: { fileName: "", lineNumber: 227, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-[#00FFB2] font-space-mono mb-2", __source: { fileName: "", lineNumber: 232, columnNumber: 21 }, __self: this }, article.year), /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-white font-space-mono mb-4", __source: { fileName: "", lineNumber: 235, columnNumber: 21 }, __self: this }, article.title), renderDescription(article), article.link && /*#__PURE__*/ React.createElement("a", { href: article.link, target: "_blank", rel: "noopener noreferrer", className: "inline-block mt-4 text-[#00FFB2] hover:underline", __source: { fileName: "", lineNumber: 240, columnNumber: 23 }, __self: this }, "Read Article", " ", /*#__PURE__*/ React.createElement("i", { className: "fas fa-external-link-alt ml-1", __source: { fileName: "", lineNumber: 247, columnNumber: 25 }, __self: this }))))), data.areas_of_interest && data.areas_of_interest.length > 0 && /*#__PURE__*/ React.createElement("section", { className: "mt-20 max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 257, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl text-white font-space-mono mb-8", __source: { fileName: "", lineNumber: 258, columnNumber: 17 }, __self: this }, "Areas of Interest"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-[#00FFB2] font-space-mono mb-4", __source: { fileName: "", lineNumber: 261, columnNumber: 17 }, __self: this }, "Legal Domains I'm Exploring"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 264, columnNumber: 17 }, __self: this }, data.areas_of_interest.map((area, index)=>/*#__PURE__*/ React.createElement("div", { key: area.id, className: "border border-[#00FFB2]/20 p-4 rounded-sm text-center text-white font-space-mono expertise-card", style: { animationDelay: `${0.1 * index}s` }, __source: { fileName: "", lineNumber: 266, columnNumber: 21 }, __self: this }, area.name)))), data.certifications && data.certifications.length > 0 && /*#__PURE__*/ React.createElement("section", { className: "mt-20 max-w-6xl mx-auto mb-20", __source: { fileName: "", lineNumber: 280, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl text-white font-space-mono mb-8", __source: { fileName: "", lineNumber: 281, columnNumber: 17 }, __self: this }, "Certifications"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-[#00FFB2] font-space-mono mb-4", __source: { fileName: "", lineNumber: 284, columnNumber: 17 }, __self: this }, "Formal Education & Professional Development"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8", __source: { fileName: "", lineNumber: 287, columnNumber: 17 }, __self: this }, data.certifications.map((cert, index)=>/*#__PURE__*/ React.createElement("div", { key: cert.id, className: "border border-[#00FFB2]/20 p-6 rounded-sm cert-card", style: { animationDelay: `${0.4 + 0.1 * index}s` }, __source: { fileName: "", lineNumber: 289, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-2", __source: { fileName: "", lineNumber: 294, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-[#00FFB2] font-space-mono", __source: { fileName: "", lineNumber: 295, columnNumber: 25 }, __self: this }, cert.year), cert.status && /*#__PURE__*/ React.createElement("span", { className: `px-2 py-1 rounded text-xs ${cert.status === "Completed" ? "bg-green-500/20 text-green-300" : cert.status === "Ongoing" ? "bg-[#FFC107]/20 text-[#FFC107]" : "bg-gray-500/20 text-gray-300"}`, __source: { fileName: "", lineNumber: 299, columnNumber: 27 }, __self: this }, cert.status)), /*#__PURE__*/ React.createElement("h3", { className: "text-xl text-white font-space-mono mb-4", __source: { fileName: "", lineNumber: 312, columnNumber: 23 }, __self: this }, cert.title), cert.organization && /*#__PURE__*/ React.createElement("h4", { className: "text-lg text-gray-300 font-space-mono mb-2", __source: { fileName: "", lineNumber: 316, columnNumber: 25 }, __self: this }, cert.organization), renderDescription(cert))))))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 330, columnNumber: 7 }, __self: this }, ` html, body { background: #0A0A0A; } @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } @keyframes slideIn { from { transform: translateX(-100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } } @keyframes fadeInUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeInRight { from { opacity: 0; transform: translateX(-40px); } to { opacity: 1; transform: translateX(0); } } main { animation: fadeIn 1s ease-out; } .border { animation: slideIn 0.8s ease-out; } .timeline-item { animation: fadeInRight 0.8s ease-out forwards; opacity: 0; } .case-study-card { animation: fadeInUp 1s ease-out forwards; opacity: 0; } .article-card { animation: fadeInUp 1s ease-out forwards; opacity: 0; } .expertise-card { animation: fadeIn 0.8s ease-out forwards; opacity: 0; } .cert-card { animation: fadeInUp 1s ease-out forwards; opacity: 0; } `)); }