function MainComponent() { const [message, setMessage] = React.useState(""); const [confessions, setConfessions] = React.useState([]); const [isSubmitting, setIsSubmitting] = React.useState(false); const [error, setError] = React.useState(null); const [success, setSuccess] = React.useState(false); const [showRules, setShowRules] = React.useState(false); const [replyingTo, setReplyingTo] = React.useState(null); const [expandedConfessions, setExpandedConfessions] = React.useState({}); const [replies, setReplies] = React.useState({}); const [loadingReplies, setLoadingReplies] = React.useState({}); const [reportingConfession, setReportingConfession] = React.useState(null); const [reportReason, setReportReason] = React.useState(""); const [reportSuccess, setReportSuccess] = React.useState(false); const [sharingConfession, setSharingConfession] = React.useState(null); const [shareUrl, setShareUrl] = React.useState(""); const [shareSuccess, setShareSuccess] = React.useState(false); const [sharedConfession, setSharedConfession] = React.useState(null); const [showSharedConfessionPopup, setShowSharedConfessionPopup] = React.useState(false); const [copySuccess, setCopySuccess] = React.useState(false); const [darkMode, setDarkMode] = React.useState(true); React.useEffect(()=>{ fetchConfessions(); const urlParams = new URLSearchParams(window.location.search); const shareId = urlParams.get("share"); if (shareId) { fetchSharedConfession(shareId); } }, []); const fetchSharedConfession = async (shareId)=>{ try { const response = await fetch("/api/confessions", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ method: "GET_SHARED_CONFESSION", share_id: shareId }) }); if (!response.ok) { throw new Error(`Error fetching shared confession: ${response.status}`); } const data = await response.json(); if (data.success) { setSharedConfession(data.confession); setShowSharedConfessionPopup(true); } } catch (error) { console.error(error); setError("Failed to load the shared confession. It may have been removed."); } }; const fetchConfessions = async ()=>{ try { const response = await fetch("/api/confessions", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ method: "GET" }) }); if (!response.ok) { throw new Error(`Error fetching confessions: ${response.status}`); } const data = await response.json(); if (data.success) { setConfessions(data.confessions); } else { setError(data.error || "Failed to load confessions"); } } catch (error) { console.error(error); setError("Failed to load confessions. Please try again later."); } }; const fetchReplies = async (confessionId)=>{ setLoadingReplies((prev)=>({ ...prev, [confessionId]: true })); try { const response = await fetch("/api/confessions", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ method: "GET_REPLIES", parent_id: confessionId }) }); if (!response.ok) { throw new Error(`Error fetching replies: ${response.status}`); } const data = await response.json(); if (data.success) { setReplies((prev)=>({ ...prev, [confessionId]: data.replies })); } else { console.error(data.error || "Failed to load replies"); } } catch (error) { console.error(error); } finally{ setLoadingReplies((prev)=>({ ...prev, [confessionId]: false })); } }; const toggleReplies = async (confessionId)=>{ const newExpandedState = !expandedConfessions[confessionId]; setExpandedConfessions((prev)=>({ ...prev, [confessionId]: newExpandedState })); if (newExpandedState && !replies[confessionId]) { await fetchReplies(confessionId); } }; const handleSubmit = async (e)=>{ e.preventDefault(); if (!message.trim()) { setError("Please enter a confession"); return; } setIsSubmitting(true); setError(null); try { const response = await fetch("/api/confessions", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ method: "POST", message, parent_id: replyingTo ? replyingTo.id : null }) }); if (!response.ok) { throw new Error(`Error submitting confession: ${response.status}`); } const data = await response.json(); if (data.success) { setMessage(""); setSuccess(true); if (replyingTo) { await fetchReplies(replyingTo.id); setReplyingTo(null); } else { fetchConfessions(); } setTimeout(()=>{ setSuccess(false); }, 3000); } else { setError(data.error || "Failed to submit confession"); } } catch (error) { console.error(error); setError("Failed to submit confession. Please try again later."); } finally{ setIsSubmitting(false); } }; const handleReport = async (e)=>{ e.preventDefault(); if (!reportReason.trim()) { setError("Please provide a reason for reporting"); return; } setIsSubmitting(true); setError(null); try { const response = await fetch("/api/confessions", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ method: "REPORT", confession_id: reportingConfession.id, report_reason: reportReason }) }); if (!response.ok) { throw new Error(`Error reporting confession: ${response.status}`); } const data = await response.json(); if (data.success) { setReportReason(""); setReportSuccess(true); setTimeout(()=>{ setReportingConfession(null); setReportSuccess(false); }, 3000); } else { setError(data.error || "Failed to report confession"); } } catch (error) { console.error(error); setError("Failed to report confession. Please try again later."); } finally{ setIsSubmitting(false); } }; const formatDate = (dateString)=>{ const date = new Date(dateString); return date.toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric", hour: "2-digit", minute: "2-digit" }); }; const toggleRules = ()=>{ setShowRules(!showRules); }; const handleReply = (confession)=>{ setReplyingTo(confession); window.scrollTo({ top: 0, behavior: "smooth" }); }; const cancelReply = ()=>{ setReplyingTo(null); setMessage(""); }; const openReportModal = (confession)=>{ setReportingConfession(confession); setReportReason(""); setReportSuccess(false); setError(null); }; const closeReportModal = ()=>{ setReportingConfession(null); setReportReason(""); setError(null); }; const closeShareModal = ()=>{ setSharingConfession(null); setShareUrl(""); setError(null); }; const generateShareLink = async (confession)=>{ setSharingConfession(confession); setShareSuccess(false); setCopySuccess(false); setError(null); try { const response = await fetch("/api/confessions", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ method: "GENERATE_SHARE_LINK", confession_id: confession.id }) }); if (!response.ok) { throw new Error(`Error generating share link: ${response.status}`); } const data = await response.json(); if (data.success) { setShareUrl(window.location.origin + data.share_url); setShareSuccess(true); } else { setError(data.error || "Failed to generate share link"); } } catch (error) { console.error(error); setError("Failed to generate share link. Please try again later."); } }; const copyToClipboard = async ()=>{ try { await navigator.clipboard.writeText(shareUrl); setCopySuccess(true); setTimeout(()=>{ setCopySuccess(false); }, 3000); } catch (error) { console.error("Failed to copy: ", error); setError("Failed to copy to clipboard. Please try manually."); } }; const closeSharedConfessionPopup = ()=>{ setShowSharedConfessionPopup(false); }; const toggleDarkMode = ()=>{ setDarkMode(!darkMode); }; return /*#__PURE__*/ React.createElement("div", { className: `min-h-screen ${darkMode ? "bg-gray-900" : "bg-gray-100"} ${darkMode ? "text-white" : "text-gray-800"} flex flex-col items-center p-4 relative transition-colors duration-300`, __source: { fileName: "", lineNumber: 336, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: toggleDarkMode, className: "fixed right-4 top-4 bg-transparent p-2 rounded-full z-10 hover:bg-gray-800 transition-colors duration-200", "aria-label": darkMode ? "Switch to light mode" : "Switch to dark mode", __source: { fileName: "", lineNumber: 339, columnNumber: 7 }, __self: this }, darkMode ? /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-6 w-6 text-yellow-300", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 345, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z", __source: { fileName: "", lineNumber: 352, columnNumber: 13 }, __self: this })) : /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-6 w-6 text-gray-700", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 360, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z", __source: { fileName: "", lineNumber: 367, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("button", { onClick: toggleRules, className: "fixed right-4 top-1/2 transform -translate-y-1/2 bg-gradient-to-r from-blue-500 to-purple-600 text-white font-bold py-2 px-4 rounded-full shadow-lg z-10 flex items-center hover:from-blue-600 hover:to-purple-700 transition-all duration-300", __source: { fileName: "", lineNumber: 377, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5 mr-1", viewBox: "0 0 20 20", fill: "currentColor", __source: { fileName: "", lineNumber: 381, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd", __source: { fileName: "", lineNumber: 387, columnNumber: 11 }, __self: this })), "Rules"), /*#__PURE__*/ React.createElement("a", { href: "/chat", className: "fixed left-4 top-1/2 transform -translate-y-1/2 bg-gradient-to-r from-pink-500 to-purple-600 text-white font-bold py-2 px-4 rounded-full shadow-lg z-10 flex items-center hover:from-pink-600 hover:to-purple-700 transition-all duration-300", __source: { fileName: "", lineNumber: 396, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5 mr-1", viewBox: "0 0 20 20", fill: "currentColor", __source: { fileName: "", lineNumber: 400, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("path", { d: "M2 5a2 2 0 012-2h7a2 2 0 012 2v4a2 2 0 01-2 2H9l-3 3v-3H4a2 2 0 01-2-2V5z", __source: { fileName: "", lineNumber: 406, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("path", { d: "M15 7v2a4 4 0 01-4 4H9.828l-1.766 1.767c.28.149.599.233.938.233h2l3 3v-3h2a2 2 0 002-2V9a2 2 0 00-2-2h-1z", __source: { fileName: "", lineNumber: 407, columnNumber: 11 }, __self: this })), "Chat Groups"), showRules && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 413, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-black bg-opacity-50 backdrop-blur-sm", onClick: toggleRules, __source: { fileName: "", lineNumber: 414, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: `${darkMode ? "bg-gray-800" : "bg-white"} p-8 rounded-lg shadow-2xl max-w-md w-full mx-4 relative z-10 rules-modal border border-blue-500/30 animate-fade-in`, __source: { fileName: "", lineNumber: 418, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: toggleRules, className: `absolute top-4 right-4 ${darkMode ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-800"} transition-colors duration-200`, __source: { fileName: "", lineNumber: 421, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 425, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12", __source: { fileName: "", lineNumber: 432, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-blue-400 to-purple-500", __source: { fileName: "", lineNumber: 440, columnNumber: 13 }, __self: this }, "Whisperwall Rules"), /*#__PURE__*/ React.createElement("div", { className: "space-y-3", __source: { fileName: "", lineNumber: 443, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: darkMode ? "text-white" : "text-gray-800", __source: { fileName: "", lineNumber: 444, columnNumber: 15 }, __self: this }, "1. All confessions are completely anonymous."), /*#__PURE__*/ React.createElement("p", { className: darkMode ? "text-white" : "text-gray-800", __source: { fileName: "", lineNumber: 447, columnNumber: 15 }, __self: this }, "2. Be respectful to others - no hate speech or harassment."), /*#__PURE__*/ React.createElement("p", { className: darkMode ? "text-white" : "text-gray-800", __source: { fileName: "", lineNumber: 450, columnNumber: 15 }, __self: this }, "3. Do not post illegal content or promote illegal activities."), /*#__PURE__*/ React.createElement("p", { className: darkMode ? "text-white" : "text-gray-800", __source: { fileName: "", lineNumber: 453, columnNumber: 15 }, __self: this }, "4. No spam or advertising."), /*#__PURE__*/ React.createElement("p", { className: darkMode ? "text-white" : "text-gray-800", __source: { fileName: "", lineNumber: 456, columnNumber: 15 }, __self: this }, "5. Personal information (yours or others') is not allowed."), /*#__PURE__*/ React.createElement("p", { className: darkMode ? "text-white" : "text-gray-800", __source: { fileName: "", lineNumber: 459, columnNumber: 15 }, __self: this }, "6. Think before you post - once submitted, confessions cannot be edited.")))), reportingConfession && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 469, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-black bg-opacity-50 backdrop-blur-sm", onClick: closeReportModal, __source: { fileName: "", lineNumber: 470, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: `${darkMode ? "bg-gray-800" : "bg-white"} p-8 rounded-lg shadow-2xl max-w-md w-full mx-4 relative z-10 report-modal border border-red-500/30 animate-fade-in`, __source: { fileName: "", lineNumber: 474, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: closeReportModal, className: `absolute top-4 right-4 ${darkMode ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-800"} transition-colors duration-200`, __source: { fileName: "", lineNumber: 477, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 481, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12", __source: { fileName: "", lineNumber: 488, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-red-400 to-pink-500", __source: { fileName: "", lineNumber: 496, columnNumber: 13 }, __self: this }, "Report Confession"), reportSuccess ? /*#__PURE__*/ React.createElement("div", { className: "text-center py-6", __source: { fileName: "", lineNumber: 501, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-12 w-12 mx-auto text-green-500 mb-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 502, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7", __source: { fileName: "", lineNumber: 509, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-lg font-medium text-white", __source: { fileName: "", lineNumber: 516, columnNumber: 17 }, __self: this }, "Thank you for your report"), /*#__PURE__*/ React.createElement("p", { className: `mt-2 ${darkMode ? "text-gray-400" : "text-gray-500"}`, __source: { fileName: "", lineNumber: 519, columnNumber: 17 }, __self: this }, "Our moderators will review this confession soon."), /*#__PURE__*/ React.createElement("button", { onClick: closeReportModal, className: `mt-6 ${darkMode ? "bg-gray-700 hover:bg-gray-600" : "bg-gray-200 hover:bg-gray-300"} ${darkMode ? "text-white" : "text-gray-800"} font-bold py-2 px-4 rounded-md transition-all duration-300 transform hover:scale-[1.02] active:scale-[0.98]`, __source: { fileName: "", lineNumber: 524, columnNumber: 17 }, __self: this }, "Close")) : /*#__PURE__*/ React.createElement("form", { onSubmit: handleReport, __source: { fileName: "", lineNumber: 532, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `mb-4 ${darkMode ? "bg-gray-700" : "bg-gray-100"} p-3 rounded-md`, __source: { fileName: "", lineNumber: 533, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `${darkMode ? "text-gray-400" : "text-gray-500"} text-sm`, __source: { fileName: "", lineNumber: 536, columnNumber: 19 }, __self: this }, "Reported confession:"), /*#__PURE__*/ React.createElement("p", { className: darkMode ? "text-white" : "text-gray-800", className: "mt-1", __source: { fileName: "", lineNumber: 541, columnNumber: 19 }, __self: this }, reportingConfession.message)), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 549, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block ${darkMode ? "text-gray-300" : "text-gray-600"} mb-2 font-medium`, __source: { fileName: "", lineNumber: 550, columnNumber: 19 }, __self: this }, "Why are you reporting this?"), /*#__PURE__*/ React.createElement("select", { value: reportReason, onChange: (e)=>setReportReason(e.target.value), className: `w-full p-3 ${darkMode ? "bg-gray-700 text-white" : "bg-gray-100 text-gray-800"} rounded-md focus:outline-none focus:ring-2 focus:ring-red-500 transition-colors duration-300`, required: true, __source: { fileName: "", lineNumber: 555, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 561, columnNumber: 21 }, __self: this }, "Select a reason"), /*#__PURE__*/ React.createElement("option", { value: "Hate speech or harassment", __source: { fileName: "", lineNumber: 562, columnNumber: 21 }, __self: this }, "Hate speech or harassment"), /*#__PURE__*/ React.createElement("option", { value: "Illegal content", __source: { fileName: "", lineNumber: 565, columnNumber: 21 }, __self: this }, "Illegal content"), /*#__PURE__*/ React.createElement("option", { value: "Personal information", __source: { fileName: "", lineNumber: 566, columnNumber: 21 }, __self: this }, "Personal information"), /*#__PURE__*/ React.createElement("option", { value: "Spam or advertising", __source: { fileName: "", lineNumber: 569, columnNumber: 21 }, __self: this }, "Spam or advertising"), /*#__PURE__*/ React.createElement("option", { value: "Other", __source: { fileName: "", lineNumber: 572, columnNumber: 21 }, __self: this }, "Other"))), reportReason === "Other" && /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 577, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block ${darkMode ? "text-gray-300" : "text-gray-600"} mb-2 font-medium`, __source: { fileName: "", lineNumber: 578, columnNumber: 21 }, __self: this }, "Please specify:"), /*#__PURE__*/ React.createElement("textarea", { value: reportReason === "Other" ? reportReason : "", onChange: (e)=>setReportReason(e.target.value), placeholder: "Describe why you're reporting this confession...", className: `w-full p-3 ${darkMode ? "bg-gray-700 text-white" : "bg-gray-100 text-gray-800"} rounded-md focus:outline-none focus:ring-2 focus:ring-red-500 min-h-[80px] transition-colors duration-300`, required: true, __source: { fileName: "", lineNumber: 583, columnNumber: 21 }, __self: this })), error && /*#__PURE__*/ React.createElement("div", { className: "mb-4 text-red-400 text-sm", __source: { fileName: "", lineNumber: 594, columnNumber: 19 }, __self: this }, error), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end space-x-3 mt-6", __source: { fileName: "", lineNumber: 597, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: closeReportModal, className: `${darkMode ? "bg-gray-700 hover:bg-gray-600" : "bg-gray-200 hover:bg-gray-300"} ${darkMode ? "text-white" : "text-gray-800"} font-bold py-2 px-4 rounded-md transition-all duration-300 transform hover:scale-[1.02] active:scale-[0.98]`, __source: { fileName: "", lineNumber: 598, columnNumber: 19 }, __self: this }, "Cancel"), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmitting || !reportReason, className: "bg-gradient-to-r from-red-500 to-pink-500 hover:from-red-600 hover:to-pink-600 text-white font-bold py-2 px-4 rounded-md transition-all duration-300 disabled:opacity-50 transform hover:scale-[1.02] active:scale-[0.98]", __source: { fileName: "", lineNumber: 605, columnNumber: 19 }, __self: this }, isSubmitting ? "Submitting..." : "Submit Report"))))), sharingConfession && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 620, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-black bg-opacity-50 backdrop-blur-sm", onClick: closeShareModal, __source: { fileName: "", lineNumber: 621, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: `${darkMode ? "bg-gray-800" : "bg-white"} p-8 rounded-lg shadow-2xl max-w-md w-full mx-4 relative z-10 share-modal border border-green-500/30 animate-fade-in`, __source: { fileName: "", lineNumber: 625, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: closeShareModal, className: `absolute top-4 right-4 ${darkMode ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-800"} transition-colors duration-200`, __source: { fileName: "", lineNumber: 628, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 632, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12", __source: { fileName: "", lineNumber: 639, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-green-400 to-blue-500", __source: { fileName: "", lineNumber: 647, columnNumber: 13 }, __self: this }, "Share Confession"), /*#__PURE__*/ React.createElement("div", { className: `mb-4 ${darkMode ? "bg-gray-700" : "bg-gray-100"} p-3 rounded-md`, __source: { fileName: "", lineNumber: 651, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `${darkMode ? "text-gray-400" : "text-gray-500"} text-sm`, __source: { fileName: "", lineNumber: 654, columnNumber: 15 }, __self: this }, "Confession to share:"), /*#__PURE__*/ React.createElement("p", { className: darkMode ? "text-white" : "text-gray-800", className: "mt-1", __source: { fileName: "", lineNumber: 659, columnNumber: 15 }, __self: this }, sharingConfession.message)), shareSuccess ? /*#__PURE__*/ React.createElement("div", { className: "mt-6", __source: { fileName: "", lineNumber: 668, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block ${darkMode ? "text-gray-300" : "text-gray-600"} mb-2 font-medium`, __source: { fileName: "", lineNumber: 669, columnNumber: 17 }, __self: this }, "Share this link:"), /*#__PURE__*/ React.createElement("div", { className: "flex", __source: { fileName: "", lineNumber: 674, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: shareUrl, readOnly: true, className: `flex-grow p-3 ${darkMode ? "bg-gray-700 text-white" : "bg-gray-100 text-gray-800"} rounded-l-md focus:outline-none transition-colors duration-300`, __source: { fileName: "", lineNumber: 675, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: copyToClipboard, className: "bg-gradient-to-r from-green-500 to-blue-500 hover:from-green-600 hover:to-blue-600 text-white font-bold py-3 px-4 rounded-r-md transition-all duration-300 transform hover:scale-[1.02] active:scale-[0.98]", __source: { fileName: "", lineNumber: 681, columnNumber: 19 }, __self: this }, copySuccess ? /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5", viewBox: "0 0 20 20", fill: "currentColor", __source: { fileName: "", lineNumber: 686, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("path", { fillRule: "evenodd", d: "M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z", clipRule: "evenodd", __source: { fileName: "", lineNumber: 692, columnNumber: 25 }, __self: this })) : "Copy")), copySuccess && /*#__PURE__*/ React.createElement("p", { className: "text-green-400 text-sm mt-2 animate-pulse", __source: { fileName: "", lineNumber: 704, columnNumber: 19 }, __self: this }, "Copied to clipboard!")) : /*#__PURE__*/ React.createElement("div", { className: "text-center py-4", __source: { fileName: "", lineNumber: 710, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "inline-block animate-spin rounded-full h-8 w-8 border-t-2 border-green-500 border-r-2 border-green-500 border-b-2 border-transparent", __source: { fileName: "", lineNumber: 711, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: `mt-2 ${darkMode ? "text-gray-400" : "text-gray-500"}`, __source: { fileName: "", lineNumber: 712, columnNumber: 17 }, __self: this }, "Generating share link...")), error && /*#__PURE__*/ React.createElement("div", { className: "mt-4 text-red-400 text-sm", __source: { fileName: "", lineNumber: 720, columnNumber: 23 }, __self: this }, error))), showSharedConfessionPopup && sharedConfession && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 726, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-black bg-opacity-50 backdrop-blur-sm", onClick: closeSharedConfessionPopup, __source: { fileName: "", lineNumber: 727, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: `${darkMode ? "bg-gray-800" : "bg-white"} p-8 rounded-lg shadow-2xl max-w-md w-full mx-4 relative z-10 animate-fade-in border border-purple-500/30`, __source: { fileName: "", lineNumber: 731, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: closeSharedConfessionPopup, className: `absolute top-4 right-4 ${darkMode ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-800"} transition-colors duration-200`, __source: { fileName: "", lineNumber: 734, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 738, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12", __source: { fileName: "", lineNumber: 745, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "text-center mb-6", __source: { fileName: "", lineNumber: 753, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `inline-block p-3 rounded-full ${darkMode ? "bg-gray-700" : "bg-gray-200"} mb-4`, __source: { fileName: "", lineNumber: 754, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: `h-8 w-8 ${darkMode ? "text-blue-400" : "text-blue-500"}`, viewBox: "0 0 20 20", fill: "currentColor", __source: { fileName: "", lineNumber: 757, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("path", { d: "M15 8a3 3 0 10-2.977-2.63l-4.94 2.47a3 3 0 100 4.319l4.94 2.47a3 3 0 10.895-1.789l-4.94-2.47a3.027 3.027 0 000-.74l4.94-2.47C13.456 7.68 14.19 8 15 8z", __source: { fileName: "", lineNumber: 763, columnNumber: 19 }, __self: this }))), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-blue-400 to-purple-500", __source: { fileName: "", lineNumber: 766, columnNumber: 15 }, __self: this }, "Shared Confession"), /*#__PURE__*/ React.createElement("p", { className: `${darkMode ? "text-gray-400" : "text-gray-500"} text-sm mt-1`, __source: { fileName: "", lineNumber: 769, columnNumber: 15 }, __self: this }, "Someone shared this confession with you")), /*#__PURE__*/ React.createElement("div", { className: `${darkMode ? "bg-gray-700" : "bg-gray-100"} p-5 rounded-md border-l-4 ${darkMode ? "border-blue-500" : "border-blue-400"}`, __source: { fileName: "", lineNumber: 776, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-lg italic", __source: { fileName: "", lineNumber: 779, columnNumber: 15 }, __self: this }, sharedConfession.message), /*#__PURE__*/ React.createElement("div", { className: `${darkMode ? "text-gray-400" : "text-gray-500"} text-sm mt-4 flex items-center`, __source: { fileName: "", lineNumber: 780, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4 mr-1", viewBox: "0 0 20 20", fill: "currentColor", __source: { fileName: "", lineNumber: 783, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm1-12a1 1 0 10-2 0v4a1 1 0 00.293.707l2.828 2.829a1 1 0 101.415-1.415L11 9.586V6z", clipRule: "evenodd", __source: { fileName: "", lineNumber: 789, columnNumber: 19 }, __self: this })), formatDate(sharedConfession.created_at))), /*#__PURE__*/ React.createElement("div", { className: "mt-6 flex justify-center", __source: { fileName: "", lineNumber: 799, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: closeSharedConfessionPopup, className: "bg-gradient-to-r from-blue-500 to-purple-600 hover:from-blue-600 hover:to-purple-700 text-white font-bold py-2 px-6 rounded-md transition-all duration-300 transform hover:scale-[1.02] active:scale-[0.98]", __source: { fileName: "", lineNumber: 800, columnNumber: 15 }, __self: this }, "Continue to Whisperwall")))), /*#__PURE__*/ React.createElement("header", { className: "w-full max-w-2xl text-center mb-8 mt-16", __source: { fileName: "", lineNumber: 811, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-5xl font-black mb-2 bg-clip-text text-transparent bg-gradient-to-r from-blue-400 to-pink-500", __source: { fileName: "", lineNumber: 812, columnNumber: 9 }, __self: this }, "Whisperwall"), /*#__PURE__*/ React.createElement("p", { className: `${darkMode ? "text-gray-400" : "text-gray-500"} font-medium`, __source: { fileName: "", lineNumber: 815, columnNumber: 9 }, __self: this }, "Share your thoughts anonymously")), /*#__PURE__*/ React.createElement("main", { className: "w-full max-w-2xl", __source: { fileName: "", lineNumber: 822, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: `mb-12 ${darkMode ? "bg-gray-800" : "bg-white"} p-6 rounded-lg shadow-lg border border-transparent ${darkMode ? "hover:border-blue-500/30" : "hover:border-blue-500/20"} transition-all duration-300`, __source: { fileName: "", lineNumber: 823, columnNumber: 9 }, __self: this }, replyingTo && /*#__PURE__*/ React.createElement("div", { className: `mb-4 ${darkMode ? "bg-gray-700" : "bg-gray-100"} p-3 rounded-md flex justify-between items-center`, __source: { fileName: "", lineNumber: 828, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 831, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-blue-400 font-medium", __source: { fileName: "", lineNumber: 832, columnNumber: 17 }, __self: this }, "Replying to:"), /*#__PURE__*/ React.createElement("p", { className: `text-sm ${darkMode ? "text-gray-300" : "text-gray-600"} mt-1`, __source: { fileName: "", lineNumber: 833, columnNumber: 17 }, __self: this }, replyingTo.message.length > 60 ? `${replyingTo.message.substring(0, 60)}...` : replyingTo.message)), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: cancelReply, className: `${darkMode ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-800"} transition-colors duration-200`, __source: { fileName: "", lineNumber: 841, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5", viewBox: "0 0 20 20", fill: "currentColor", __source: { fileName: "", lineNumber: 846, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("path", { fillRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 100-2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd", __source: { fileName: "", lineNumber: 852, columnNumber: 19 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 862, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: message, onChange: (e)=>setMessage(e.target.value), placeholder: replyingTo ? "Type your reply here..." : "Type your confession here...", className: `w-full p-4 ${darkMode ? "bg-gray-700 text-white" : "bg-gray-100 text-gray-800"} rounded-md focus:outline-none focus:ring-2 ${darkMode ? "focus:ring-blue-500" : "focus:ring-blue-400"} min-h-[120px] transition-colors duration-300`, __source: { fileName: "", lineNumber: 863, columnNumber: 13 }, __self: this })), error && /*#__PURE__*/ React.createElement("div", { className: "mb-4 text-red-400 text-sm", __source: { fileName: "", lineNumber: 875, columnNumber: 21 }, __self: this }, error), success && /*#__PURE__*/ React.createElement("div", { className: "mb-4 text-green-400 text-sm animate-pulse", __source: { fileName: "", lineNumber: 878, columnNumber: 13 }, __self: this }, replyingTo ? "Your reply has been posted!" : "Your confession has been posted!"), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmitting, className: "w-full bg-gradient-to-r from-blue-500 to-pink-500 hover:from-blue-600 hover:to-pink-600 text-white font-bold py-3 px-4 rounded-md transition-all duration-300 disabled:opacity-50 transform hover:scale-[1.02] active:scale-[0.98]", __source: { fileName: "", lineNumber: 885, columnNumber: 11 }, __self: this }, isSubmitting ? replyingTo ? "Posting reply..." : "Posting..." : replyingTo ? "Post Reply" : "Post Confession")), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 900, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-6 border-b-2 border-blue-500 pb-2 inline-block", __source: { fileName: "", lineNumber: 901, columnNumber: 11 }, __self: this }, "Recent Confessions"), confessions.length === 0 ? /*#__PURE__*/ React.createElement("div", { className: `text-center ${darkMode ? "text-gray-400" : "text-gray-500"} py-8`, __source: { fileName: "", lineNumber: 906, columnNumber: 13 }, __self: this }, "No confessions yet. Be the first to share!") : confessions.map((confession)=>/*#__PURE__*/ React.createElement("div", { key: confession.id, className: `${darkMode ? "bg-gray-800" : "bg-white"} p-6 rounded-lg shadow-md mb-4 border border-transparent hover:border-pink-500/30 transition-all duration-300 transform hover:translate-y-[-2px]`, __source: { fileName: "", lineNumber: 913, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-lg mb-3", __source: { fileName: "", lineNumber: 917, columnNumber: 17 }, __self: this }, confession.message), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 918, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `${darkMode ? "text-gray-400" : "text-gray-500"} text-sm`, __source: { fileName: "", lineNumber: 919, columnNumber: 19 }, __self: this }, formatDate(confession.created_at)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-3", __source: { fileName: "", lineNumber: 924, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleReply(confession), className: `${darkMode ? "text-gray-400 hover:text-blue-400" : "text-gray-500 hover:text-blue-500"} text-sm flex items-center transition-colors duration-200`, "aria-label": "Reply to confession", title: "Reply to this confession", __source: { fileName: "", lineNumber: 925, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4 mr-1", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 931, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 10h10a8 8 0 100-16 8 8 0 018 8v2M3 10l6 6m-6-6l6-6", __source: { fileName: "", lineNumber: 938, columnNumber: 25 }, __self: this })), "Reply"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>openReportModal(confession), className: `${darkMode ? "text-gray-400 hover:text-red-400" : "text-gray-500 hover:text-red-500"} text-sm flex items-center transition-colors duration-200`, "aria-label": "Report confession", title: "Report this confession", __source: { fileName: "", lineNumber: 948, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4 mr-1", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 954, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z", __source: { fileName: "", lineNumber: 961, columnNumber: 25 }, __self: this })), "Report"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>generateShareLink(confession), className: `${darkMode ? "text-gray-400 hover:text-green-400" : "text-gray-500 hover:text-green-500"} text-sm flex items-center transition-colors duration-200`, "aria-label": "Share confession", title: "Share this confession", __source: { fileName: "", lineNumber: 971, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4 mr-1", viewBox: "0 0 20 20", fill: "currentColor", __source: { fileName: "", lineNumber: 977, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("path", { d: "M15 8a3 3 0 10-2.977-2.63l-4.94 2.47a3 3 0 100 4.319l4.94 2.47a3 3 0 10.895-1.789l-4.94-2.47a3.027 3.027 0 000-.74l4.94-2.47C13.456 7.68 14.19 8 15 8z", __source: { fileName: "", lineNumber: 983, columnNumber: 25 }, __self: this })), "Share"), confession.parent_id === null && /*#__PURE__*/ React.createElement("button", { onClick: ()=>toggleReplies(confession.id), className: `${darkMode ? "text-gray-400 hover:text-purple-400" : "text-gray-500 hover:text-purple-500"} text-sm flex items-center transition-colors duration-200`, "aria-label": "View replies", title: "View replies to this confession", __source: { fileName: "", lineNumber: 988, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4 mr-1", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 994, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 8h10M7 12h4m1 8l-4-4H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-3l-4 4z", __source: { fileName: "", lineNumber: 1001, columnNumber: 27 }, __self: this })), expandedConfessions[confession.id] ? "Hide" : "Replies", !expandedConfessions[confession.id] && replies[confession.id] && replies[confession.id].length > 0 && ` (${replies[confession.id].length})`))), confession.parent_id === null && expandedConfessions[confession.id] && /*#__PURE__*/ React.createElement("div", { className: `mt-4 pl-4 border-l-2 ${darkMode ? "border-gray-700" : "border-gray-200"} transition-colors duration-300`, __source: { fileName: "", lineNumber: 1022, columnNumber: 21 }, __self: this }, loadingReplies[confession.id] ? /*#__PURE__*/ React.createElement("div", { className: "text-center py-4", __source: { fileName: "", lineNumber: 1026, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "inline-block animate-spin rounded-full h-6 w-6 border-t-2 border-blue-500 border-r-2 border-blue-500 border-b-2 border-transparent", __source: { fileName: "", lineNumber: 1027, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: `mt-2 ${darkMode ? "text-gray-400" : "text-gray-500"}`, __source: { fileName: "", lineNumber: 1028, columnNumber: 27 }, __self: this }, "Loading replies...")) : replies[confession.id] && replies[confession.id].length > 0 ? /*#__PURE__*/ React.createElement("div", { className: "space-y-3", __source: { fileName: "", lineNumber: 1036, columnNumber: 25 }, __self: this }, replies[confession.id].map((reply)=>/*#__PURE__*/ React.createElement("div", { key: reply.id, className: `${darkMode ? "bg-gray-700" : "bg-gray-100"} p-4 rounded-md transform transition-all duration-300 hover:translate-x-1`, __source: { fileName: "", lineNumber: 1038, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 1042, columnNumber: 31 }, __self: this }, reply.message), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mt-2", __source: { fileName: "", lineNumber: 1043, columnNumber: 31 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `${darkMode ? "text-gray-400" : "text-gray-500"} text-xs`, __source: { fileName: "", lineNumber: 1044, columnNumber: 33 }, __self: this }, formatDate(reply.created_at)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-3", __source: { fileName: "", lineNumber: 1049, columnNumber: 33 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>openReportModal(reply), className: `${darkMode ? "text-gray-400 hover:text-red-400" : "text-gray-500 hover:text-red-500"} text-xs flex items-center transition-colors duration-200`, "aria-label": "Report reply", title: "Report this reply", __source: { fileName: "", lineNumber: 1050, columnNumber: 35 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-3 w-3 mr-1", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", __source: { fileName: "", lineNumber: 1056, columnNumber: 37 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z", __source: { fileName: "", lineNumber: 1063, columnNumber: 39 }, __self: this })), "Report"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>generateShareLink(reply), className: `${darkMode ? "text-gray-400 hover:text-green-400" : "text-gray-500 hover:text-green-500"} text-xs flex items-center transition-colors duration-200`, "aria-label": "Share reply", title: "Share this reply", __source: { fileName: "", lineNumber: 1073, columnNumber: 35 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-3 w-3 mr-1", viewBox: "0 0 20 20", fill: "currentColor", __source: { fileName: "", lineNumber: 1079, columnNumber: 37 }, __self: this }, /*#__PURE__*/ React.createElement("path", { d: "M15 8a3 3 0 10-2.977-2.63l-4.94 2.47a3 3 0 100 4.319l4.94 2.47a3 3 0 10.895-1.789l-4.94-2.47a3.027 3.027 0 000-.74l4.94-2.47C13.456 7.68 14.19 8 15 8z", __source: { fileName: "", lineNumber: 1085, columnNumber: 39 }, __self: this })), "Share")))))) : /*#__PURE__*/ React.createElement("div", { className: `text-center py-4 ${darkMode ? "text-gray-400" : "text-gray-500"}`, __source: { fileName: "", lineNumber: 1095, columnNumber: 25 }, __self: this }, "No replies yet. Be the first to reply!"))))))); } /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 1112, columnNumber: 1 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in { animation: fadeIn 0.3s ease-out forwards; } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } } .animate-pulse { animation: pulse 1.5s ease-in-out infinite; } h1, h2, h3, button { font-weight: 700; letter-spacing: -0.02em; } button, a, div { transition: all 0.2s ease-in-out; } .neon-blue { text-shadow: 0 0 5px rgba(59, 130, 246, 0.5), 0 0 20px rgba(59, 130, 246, 0.3); } .neon-pink { text-shadow: 0 0 5px rgba(236, 72, 153, 0.5), 0 0 20px rgba(236, 72, 153, 0.3); } button:hover:not(:disabled), a:hover { transform: translateY(-2px); filter: brightness(1.1); } button:active:not(:disabled), a:active { transform: translateY(0); } `);