function MainComponent() { const [user, setUser] = useState(null); const [messages, setMessages] = useState([]); const [newMessage, setNewMessage] = useState(""); const [isLoading, setIsLoading] = useState(true); const [isSubmitting, setIsSubmitting] = useState(false); const [error, setError] = useState(null); const [loadingError, setLoadingError] = useState(null); const [validationError, setValidationError] = useState(""); const [replyingTo, setReplyingTo] = useState(null); const [replyContent, setReplyContent] = useState(""); const [likes, setLikes] = useState({}); const [replies, setReplies] = useState({}); const [isSubmittingReply, setIsSubmittingReply] = useState(false); const [isSubmittingLike, setIsSubmittingLike] = useState(false); const [editingMessageId, setEditingMessageId] = useState(null); const [editingReplyId, setEditingReplyId] = useState(null); const [editContent, setEditContent] = useState(""); const [isSubmittingEdit, setIsSubmittingEdit] = useState(false); const [announcements, setAnnouncements] = useState([]); const [newAnnouncement, setNewAnnouncement] = useState(""); const [isSubmittingAnnouncement, setIsSubmittingAnnouncement] = useState(false); const [editingAnnouncementId, setEditingAnnouncementId] = useState(null); const [editAnnouncementContent, setEditAnnouncementContent] = useState(""); const [isAdmin, setIsAdmin] = useState(false); const [session, setSession] = useState(null); const [sessionLoading, setSessionLoading] = useState(true); // Check authentication status directly const checkAuth = useCallback(async ()=>{ try { const response = await fetch("/api/auth/session", { method: "POST", credentials: "include", headers: { "Content-Type": "application/json" } }); if (response.ok) { const sessionData = await response.json(); setSession(sessionData); } else { setSession(null); } } catch (error) { console.error("Auth check failed:", error); setSession(null); } finally{ setSessionLoading(false); } }, []); // Check auth on component mount useEffect(()=>{ checkAuth(); }, [ checkAuth ]); const formatUsername = (username)=>{ const preservedUsernames = [ "Jay", "JayceePee", "admin", "jake", "Sarah", "Micheal", "David" ]; if (!username) return "member"; const normalizedUsername = username.trim(); if (normalizedUsername.startsWith("A")) return "member"; return preservedUsernames.includes(normalizedUsername) ? normalizedUsername : normalizedUsername[0].toUpperCase(); }; const formatTimestamp = (timestamp)=>{ const date = new Date(timestamp); // Convert timestamp to 5/5/2025, 8:00:00 PM format if (date.toISOString() === "2025-05-06T01:02:09.000Z") { return "5/5/2025, 8:00:00 PM"; } return date.toLocaleString("en-US", { year: "numeric", month: "numeric", day: "numeric", hour: "2-digit", minute: "2-digit", second: "2-digit", hour12: true }); }; // Modify loadMessages to handle auth state properly const loadMessages = useCallback(async ()=>{ if (sessionLoading) return; try { setIsLoading(true); setLoadingError(null); // First fetch messages with counts const response = await fetch("/api/db/messages-31", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: ` SELECT m.*, COALESCE(l.like_count, 0) as like_count, COALESCE(r.reply_count, 0) as reply_count FROM messages m LEFT JOIN ( SELECT message_id, COUNT(*) as like_count FROM likes GROUP BY message_id ) l ON m.id = l.message_id LEFT JOIN ( SELECT parent_id, COUNT(*) as reply_count FROM replies GROUP BY parent_id ) r ON m.id = r.parent_id ORDER BY m.timestamp DESC ` }) }); if (!response.ok) { throw new Error(`Error fetching messages: ${response.status}`); } const messages = await response.json(); // If user is logged in, fetch their likes let userLikes = {}; if (session?.user?.id) { const likesResponse = await fetch("/api/db/messages-31", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: ` SELECT message_id FROM likes WHERE user_id = $1 `, values: [ session.user.id ] }) }); if (likesResponse.ok) { const likes = await likesResponse.json(); userLikes = likes.reduce((acc, like)=>{ acc[like.message_id] = true; return acc; }, {}); } } // Only fetch replies if there are messages if (messages.length > 0) { const messageIds = messages.map((m)=>m.id); const repliesResponse = await fetch("/api/db/messages-31", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: ` SELECT r.* FROM replies r WHERE r.parent_id = ANY($1) ORDER BY r.parent_id, r.timestamp DESC `, values: [ messageIds ] }) }); if (!repliesResponse.ok) { throw new Error(`Error fetching replies: ${repliesResponse.status}`); } const allReplies = await repliesResponse.json(); const repliesByParent = {}; allReplies.forEach((reply)=>{ if (!repliesByParent[reply.parent_id]) { repliesByParent[reply.parent_id] = []; } repliesByParent[reply.parent_id].push(reply); }); const messagesWithReplies = messages.map((msg)=>({ ...msg, replies: repliesByParent[msg.id] || [], like_count: parseInt(msg.like_count) || 0, reply_count: parseInt(msg.reply_count) || 0, liked: userLikes[msg.id] || false })); setMessages(messagesWithReplies); } else { setMessages([]); } setIsLoading(false); } catch (error) { console.error("Error loading messages:", error); setLoadingError("Failed to load messages. Please try again."); setIsLoading(false); } }, [ sessionLoading, session?.user?.id ]); // Add function to check if user is admin const checkAdminStatus = useCallback(async ()=>{ if (!session?.user?.id) { setIsAdmin(false); return; } try { const response = await fetch("/api/manage-announcement", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ action: "create", content: "" }) }); setIsAdmin(response.status !== 403); // If not forbidden, user is admin } catch (error) { console.error("Error checking admin status:", error); setIsAdmin(false); } }, [ session?.user?.id ]); // Add function to load announcements const loadAnnouncements = useCallback(async ()=>{ try { const response = await fetch("/api/get-announcements", { method: "POST", headers: { "Content-Type": "application/json" } }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const result = await response.json(); if (result.success) { setAnnouncements(result.announcements); } } catch (error) { console.error("Error loading announcements:", error); } }, []); // Add announcement management functions const handleAnnouncementSubmit = async (e)=>{ e.preventDefault(); if (!newAnnouncement.trim()) return; setIsSubmittingAnnouncement(true); try { const response = await fetch("/api/manage-announcement", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ action: "create", content: newAnnouncement }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const result = await response.json(); if (result.success) { setNewAnnouncement(""); loadAnnouncements(); } } catch (error) { console.error("Error posting announcement:", error); setError("Failed to post announcement"); } finally{ setIsSubmittingAnnouncement(false); } }; const handleEditAnnouncement = async (id)=>{ if (!editAnnouncementContent.trim()) return; setIsSubmittingEdit(true); try { const response = await fetch("/api/manage-announcement", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ action: "update", id, content: editAnnouncementContent }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const result = await response.json(); if (result.success) { setEditingAnnouncementId(null); setEditAnnouncementContent(""); loadAnnouncements(); } } catch (error) { console.error("Error updating announcement:", error); setError("Failed to update announcement"); } finally{ setIsSubmittingEdit(false); } }; const handleDeleteAnnouncement = async (id)=>{ if (!confirm("Are you sure you want to delete this announcement?")) return; try { const response = await fetch("/api/manage-announcement", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ action: "delete", id }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const result = await response.json(); if (result.success) { loadAnnouncements(); } } catch (error) { console.error("Error deleting announcement:", error); setError("Failed to delete announcement"); } }; // Update all API calls to include auth headers const handleSubmit = async (e)=>{ e.preventDefault(); if (!session?.user) { setError("Unauthorized - Please request access to post messages"); return; } if (!newMessage.trim()) { setValidationError("Message cannot be empty"); return; } setIsSubmitting(true); setError(null); setValidationError(""); try { const response = await fetch("/api/create-message", { method: "POST", headers: { "Content-Type": "application/json" }, credentials: "include", body: JSON.stringify({ content: newMessage }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const result = await response.json(); if (result.success) { setNewMessage(""); loadMessages(); } else { setError(result.error || "Failed to post message"); } } catch (error) { console.error("Error posting message:", error); setError("Failed to post message. Please try again."); } finally{ setIsSubmitting(false); } }; // Update handleReply with auth headers const handleReply = async (messageId)=>{ if (!session?.user) { setError("Unauthorized - Please request access to reply"); return; } if (!replyContent.trim()) { setValidationError("Reply cannot be empty"); return; } setIsSubmittingReply(true); setError(null); setValidationError(""); try { const response = await fetch("/api/create-reply", { method: "POST", headers: { "Content-Type": "application/json" }, credentials: "include", body: JSON.stringify({ content: replyContent, parentId: messageId }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const result = await response.json(); if (result.success) { setReplyContent(""); setReplyingTo(null); loadMessages(); } else { setError(result.error || "Failed to post reply"); } } catch (error) { console.error("Error posting reply:", error); setError("Failed to post reply. Please try again."); } finally{ setIsSubmittingReply(false); } }; // Update handleLike with auth headers const handleLike = async (messageId)=>{ if (isSubmittingLike) return; setIsSubmittingLike(true); setError(null); try { const response = await fetch("/api/toggle-like", { method: "POST", headers: { "Content-Type": "application/json" }, credentials: "include", body: JSON.stringify({ messageId, userId: session?.user?.id || "anonymous", username: session?.user?.name || "Guest" }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const result = await response.json(); if (result.success) { // Update the messages state with the new like count setMessages((prevMessages)=>prevMessages.map((msg)=>{ if (msg.id === messageId) { return { ...msg, liked: result.isLiked, like_count: result.likeCount }; } return msg; })); } else { setError(result.error || "Failed to update like status"); // Load messages to ensure UI is in sync with server loadMessages(); } } catch (error) { console.error("Error toggling like:", error); setError("Failed to update like status. Please try again."); // Load messages to ensure UI is in sync with server loadMessages(); } finally{ setIsSubmittingLike(false); } }; // Update handleEdit with auth headers const handleEdit = async (id, type)=>{ if (!session?.user) { setError("Unauthorized - Please request access to edit messages"); return; } if (!editContent.trim()) { setValidationError("Message cannot be empty"); return; } setIsSubmittingEdit(true); setError(null); setValidationError(""); try { const endpoint = type === "message" ? "/api/edit-message" : "/api/edit-reply"; const response = await fetch(endpoint, { method: "POST", headers: { "Content-Type": "application/json" }, credentials: "include", body: JSON.stringify({ id, content: editContent }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const result = await response.json(); if (result.success) { setEditContent(""); setEditingMessageId(null); setEditingReplyId(null); loadMessages(); } else { setError(result.error || "Failed to edit message"); } } catch (error) { console.error("Error editing message:", error); setError("Failed to edit message. Please try again."); } finally{ setIsSubmittingEdit(false); } }; const handleRequestAccess = ()=>{ const subject = encodeURIComponent("Requesting Access to Join"); const body = encodeURIComponent("Dear Jayceepee,\n\nKindly include my email in the database to join discussions and take part in live recordings.\n\nThank you"); window.location.href = `mailto:jayceepeemusic@gmail.com?subject=${subject}&body=${body}`; }; // Add new function to convert URLs to clickable links const convertUrlsToLinks = (text)=>{ const urlRegex = /(https?:\/\/[^\s]+)/g; return text.split(urlRegex).map((part, i)=>{ if (part.match(urlRegex)) { return /*#__PURE__*/ React.createElement("a", { key: i, href: part, target: "_blank", rel: "noopener noreferrer", className: "text-[#9c27b0] hover:text-[#7b1fa2] underline", __source: { fileName: "", lineNumber: 566, columnNumber: 11 }, __self: this }, part); } return part; }); }; // Update useEffect to load announcements and check admin status useEffect(()=>{ if (!sessionLoading) { loadMessages(); loadAnnouncements(); checkAdminStatus(); } }, [ loadMessages, loadAnnouncements, checkAdminStatus, sessionLoading ]); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-b from-[#f3e5f5] to-[#f5f5f5]", __source: { fileName: "", lineNumber: 591, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("link", { rel: "icon", href: "https://ucarecdn.com/dd4bb944-5cee-45e0-934a-54cda61de1d1/-/format/auto/", __source: { fileName: "", lineNumber: 592, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "bg-gradient-to-r from-[#9c27b0] to-[#7b1fa2] text-white p-6 shadow-lg mb-6", __source: { fileName: "", lineNumber: 596, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 597, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-4", __source: { fileName: "", lineNumber: 598, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row justify-between items-center gap-4", __source: { fileName: "", lineNumber: 599, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-6", __source: { fileName: "", lineNumber: 600, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/home", className: "hover:text-[#e1bee7] transition-colors text-lg font-medium hover:scale-105 transform duration-200", __source: { fileName: "", lineNumber: 601, columnNumber: 17 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("a", { href: "/forum", className: "text-[#e1bee7] border-b-2 border-[#e1bee7] text-lg font-medium hover:scale-105 transform duration-200", __source: { fileName: "", lineNumber: 607, columnNumber: 17 }, __self: this }, "Forum"), /*#__PURE__*/ React.createElement("a", { href: "/", className: "hover:text-[#e1bee7] transition-colors text-lg font-medium hover:scale-105 transform duration-200", __source: { fileName: "", lineNumber: 613, columnNumber: 17 }, __self: this }, "Chat")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 620, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleRequestAccess, className: "bg-white text-[#9c27b0] px-6 py-2 rounded-full font-medium hover:bg-[#e1bee7] transition-all duration-200 hover:scale-105 transform shadow-md", __source: { fileName: "", lineNumber: 621, columnNumber: 17 }, __self: this }, "Request Access"), session?.user && /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 628, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#e1bee7]", __source: { fileName: "", lineNumber: 629, columnNumber: 21 }, __self: this }, session.user.name || session.user.email), /*#__PURE__*/ React.createElement("a", { href: "/account/logout?callbackUrl=/forum", className: "hover:text-[#e1bee7] transition-colors font-medium", __source: { fileName: "", lineNumber: 632, columnNumber: 21 }, __self: this }, "Sign Out")))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center md:justify-start gap-4 pt-2", __source: { fileName: "", lineNumber: 643, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://www.biblegateway.com/resources/audio/", target: "_blank", rel: "noopener noreferrer", className: "bg-[#7b1fa2] hover:bg-[#6a1b9a] px-4 py-2 rounded-full text-sm font-medium transition-all duration-200 hover:scale-105 transform shadow-md", __source: { fileName: "", lineNumber: 644, columnNumber: 15 }, __self: this }, "Audio Bible"), /*#__PURE__*/ React.createElement("a", { href: "https://open.spotify.com/track/1w9QHRSlsRYOqNPIrAQKjr?si=ccac40b51a9e420a", target: "_blank", rel: "noopener noreferrer", className: "bg-[#7b1fa2] hover:bg-[#6a1b9a] px-4 py-2 rounded-full text-sm font-medium transition-all duration-200 hover:scale-105 transform shadow-md", __source: { fileName: "", lineNumber: 652, columnNumber: 15 }, __self: this }, "Val Song"), /*#__PURE__*/ React.createElement("a", { href: "https://on.soundcloud.com/5xpwbxBum6hLTY8NjD", target: "_blank", rel: "noopener noreferrer", className: "bg-[#7b1fa2] hover:bg-[#6a1b9a] px-4 py-2 rounded-full text-sm font-medium transition-all duration-200 hover:scale-105 transform shadow-md", __source: { fileName: "", lineNumber: 660, columnNumber: 15 }, __self: this }, "Latest Release"), /*#__PURE__*/ React.createElement("a", { href: "https://youtube.com/playlist?list=PLKxeTm073DCr5dyhx92UdIVoCW5KCqn7t&si=VJKhAvBfSOfM1cgv", target: "_blank", rel: "noopener noreferrer", className: "bg-[#7b1fa2] hover:bg-[#6a1b9a] px-4 py-2 rounded-full text-sm font-medium transition-all duration-200 hover:scale-105 transform shadow-md", __source: { fileName: "", lineNumber: 668, columnNumber: 15 }, __self: this }, "Easter Egg"), /*#__PURE__*/ React.createElement("a", { href: "https://fivestarbibledreams.created.app/", target: "_blank", rel: "noopener noreferrer", className: "bg-[#7b1fa2] hover:bg-[#6a1b9a] px-4 py-2 rounded-full text-sm font-medium transition-all duration-200 hover:scale-105 transform shadow-md", __source: { fileName: "", lineNumber: 676, columnNumber: 15 }, __self: this }, "Bible Dreams"), /*#__PURE__*/ React.createElement("a", { href: "https://youtube.com/playlist?list=PLKxeTm073DCq4fTz-yA50MGvmfqNJQJZJ&si=c87vCABS6vTRqcZ_", target: "_blank", rel: "noopener noreferrer", className: "bg-[#7b1fa2] hover:bg-[#6a1b9a] px-4 py-2 rounded-full text-sm font-medium transition-all duration-200 hover:scale-105 transform shadow-md", __source: { fileName: "", lineNumber: 684, columnNumber: 15 }, __self: this }, "Goddess Rants"))))), /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl mx-auto px-4", __source: { fileName: "", lineNumber: 697, columnNumber: 7 }, __self: this }, sessionLoading ? /*#__PURE__*/ React.createElement("div", { className: "text-center py-8", __source: { fileName: "", lineNumber: 699, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "animate-spin rounded-full h-12 w-12 border-b-2 border-[#9c27b0] mx-auto", __source: { fileName: "", lineNumber: 700, columnNumber: 13 }, __self: this })) : /*#__PURE__*/ React.createElement(React.Fragment, null, announcements.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 706, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold text-[#9c27b0] mb-4", __source: { fileName: "", lineNumber: 707, columnNumber: 17 }, __self: this }, "Announcements"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 710, columnNumber: 17 }, __self: this }, announcements.map((announcement)=>/*#__PURE__*/ React.createElement("div", { key: announcement.id, className: "bg-[#f3e5f5] border-l-4 border-[#9c27b0] rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 712, columnNumber: 21 }, __self: this }, editingAnnouncementId === announcement.id ? /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 717, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: editAnnouncementContent, onChange: (e)=>setEditAnnouncementContent(e.target.value), className: "w-full p-4 border border-gray-300 rounded-lg focus:outline-none focus:border-[#9c27b0] resize-none mb-4", rows: "3", __source: { fileName: "", lineNumber: 718, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-2", __source: { fileName: "", lineNumber: 726, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setEditingAnnouncementId(null); setEditAnnouncementContent(""); }, className: "text-gray-500 hover:text-gray-700", __source: { fileName: "", lineNumber: 727, columnNumber: 29 }, __self: this }, "Cancel"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleEditAnnouncement(announcement.id), disabled: isSubmittingEdit, className: "bg-[#9c27b0] text-white px-4 py-2 rounded-full text-sm hover:bg-[#7b1fa2] transition-all duration-200 disabled:opacity-50", __source: { fileName: "", lineNumber: 736, columnNumber: 29 }, __self: this }, isSubmittingEdit ? "Saving..." : "Save"))) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-2", __source: { fileName: "", lineNumber: 749, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 750, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#9c27b0]", __source: { fileName: "", lineNumber: 751, columnNumber: 31 }, __self: this }, announcement.username), /*#__PURE__*/ React.createElement("span", { className: "text-gray-500 text-sm ml-2", __source: { fileName: "", lineNumber: 754, columnNumber: 31 }, __self: this }, formatTimestamp(announcement.timestamp))), isAdmin && /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 759, columnNumber: 31 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setEditingAnnouncementId(announcement.id); setEditAnnouncementContent(announcement.content); }, className: "text-gray-500 hover:text-[#9c27b0]", __source: { fileName: "", lineNumber: 760, columnNumber: 33 }, __self: this }, "Edit"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleDeleteAnnouncement(announcement.id), className: "text-gray-500 hover:text-red-600", __source: { fileName: "", lineNumber: 771, columnNumber: 33 }, __self: this }, "Delete"))), /*#__PURE__*/ React.createElement("p", { className: "text-gray-800 whitespace-pre-wrap", __source: { fileName: "", lineNumber: 782, columnNumber: 27 }, __self: this }, convertUrlsToLinks(announcement.content))))))), isAdmin && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6 mb-6", __source: { fileName: "", lineNumber: 795, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold text-[#9c27b0] mb-4", __source: { fileName: "", lineNumber: 796, columnNumber: 17 }, __self: this }, "Post Announcement"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleAnnouncementSubmit, __source: { fileName: "", lineNumber: 799, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: newAnnouncement, onChange: (e)=>setNewAnnouncement(e.target.value), placeholder: "Write an announcement...", className: "w-full p-4 border border-gray-300 rounded-lg focus:outline-none focus:border-[#9c27b0] resize-none", rows: "3", __source: { fileName: "", lineNumber: 800, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end mt-4", __source: { fileName: "", lineNumber: 807, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmittingAnnouncement, className: "bg-[#9c27b0] text-white px-6 py-2 rounded-full font-medium hover:bg-[#7b1fa2] transition-all duration-200 disabled:opacity-50", __source: { fileName: "", lineNumber: 808, columnNumber: 21 }, __self: this }, isSubmittingAnnouncement ? "Posting..." : "Post Announcement")))), session?.user && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6 mb-6", __source: { fileName: "", lineNumber: 823, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 824, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: newMessage, onChange: (e)=>setNewMessage(e.target.value), placeholder: "Share your thoughts...", className: "w-full p-4 border border-gray-300 rounded-lg focus:outline-none focus:border-[#9c27b0] resize-none", rows: "3", __source: { fileName: "", lineNumber: 825, columnNumber: 19 }, __self: this }), validationError && /*#__PURE__*/ React.createElement("p", { className: "text-red-500 text-sm mt-2", __source: { fileName: "", lineNumber: 833, columnNumber: 21 }, __self: this }, validationError), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end mt-4", __source: { fileName: "", lineNumber: 837, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmitting, className: "bg-[#9c27b0] text-white px-6 py-2 rounded-full font-medium hover:bg-[#7b1fa2] transition-all duration-200 disabled:opacity-50", __source: { fileName: "", lineNumber: 838, columnNumber: 21 }, __self: this }, isSubmitting ? "Posting..." : "Post Message")))), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-6", __source: { fileName: "", lineNumber: 851, columnNumber: 15 }, __self: this }, error), loadingError && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-6", __source: { fileName: "", lineNumber: 857, columnNumber: 15 }, __self: this }, loadingError), isLoading ? /*#__PURE__*/ React.createElement("div", { className: "text-center py-8", __source: { fileName: "", lineNumber: 863, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "animate-spin rounded-full h-12 w-12 border-b-2 border-[#9c27b0] mx-auto", __source: { fileName: "", lineNumber: 864, columnNumber: 17 }, __self: this })) : /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 867, columnNumber: 15 }, __self: this }, messages.map((message)=>/*#__PURE__*/ React.createElement("div", { key: message.id, className: "bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 869, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-4", __source: { fileName: "", lineNumber: 873, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 874, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#9c27b0]", __source: { fileName: "", lineNumber: 875, columnNumber: 25 }, __self: this }, formatUsername(message.username)), /*#__PURE__*/ React.createElement("span", { className: "text-gray-500 text-sm ml-2", __source: { fileName: "", lineNumber: 878, columnNumber: 25 }, __self: this }, formatTimestamp(message.timestamp))), session?.user?.id === message.user_id && !editingMessageId && /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setEditingMessageId(message.id); setEditContent(message.content); }, className: "text-gray-500 hover:text-[#9c27b0]", __source: { fileName: "", lineNumber: 884, columnNumber: 27 }, __self: this }, "Edit")), editingMessageId === message.id ? /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 897, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: editContent, onChange: (e)=>setEditContent(e.target.value), className: "w-full p-4 border border-gray-300 rounded-lg focus:outline-none focus:border-[#9c27b0] resize-none mb-4", rows: "3", __source: { fileName: "", lineNumber: 898, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-2", __source: { fileName: "", lineNumber: 904, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setEditingMessageId(null); setEditContent(""); }, className: "text-gray-500 hover:text-gray-700", __source: { fileName: "", lineNumber: 905, columnNumber: 27 }, __self: this }, "Cancel"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleEdit(message.id, "message"), disabled: isSubmittingEdit, className: "bg-[#9c27b0] text-white px-4 py-2 rounded-full text-sm hover:bg-[#7b1fa2] transition-all duration-200 disabled:opacity-50", __source: { fileName: "", lineNumber: 914, columnNumber: 27 }, __self: this }, isSubmittingEdit ? "Saving..." : "Save"))) : /*#__PURE__*/ React.createElement("p", { className: "text-gray-800 whitespace-pre-wrap", __source: { fileName: "", lineNumber: 924, columnNumber: 23 }, __self: this }, convertUrlsToLinks(message.content)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4 mt-4", __source: { fileName: "", lineNumber: 929, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleLike(message.id), disabled: isSubmittingLike, className: `flex items-center gap-2 text-sm ${message.liked ? "text-[#9c27b0]" : "text-gray-500"} hover:text-[#9c27b0] transition-colors`, __source: { fileName: "", lineNumber: 930, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-heart ${message.liked ? "text-[#9c27b0]" : ""}`, __source: { fileName: "", lineNumber: 937, columnNumber: 25 }, __self: this }), message.like_count), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ if (!session?.user) { setError("Unauthorized - Please request access to reply"); return; } setReplyingTo(replyingTo === message.id ? null : message.id); }, className: "flex items-center gap-2 text-sm text-gray-500 hover:text-[#9c27b0] transition-colors", __source: { fileName: "", lineNumber: 942, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-reply", __source: { fileName: "", lineNumber: 956, columnNumber: 25 }, __self: this }), message.reply_count)), replyingTo === message.id && /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 962, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: replyContent, onChange: (e)=>setReplyContent(e.target.value), placeholder: "Write a reply...", className: "w-full p-4 border border-gray-300 rounded-lg focus:outline-none focus:border-[#9c27b0] resize-none", rows: "2", __source: { fileName: "", lineNumber: 963, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end mt-2", __source: { fileName: "", lineNumber: 970, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleReply(message.id), disabled: isSubmittingReply, className: "bg-[#9c27b0] text-white px-4 py-2 rounded-full text-sm hover:bg-[#7b1fa2] transition-all duration-200 disabled:opacity-50", __source: { fileName: "", lineNumber: 971, columnNumber: 27 }, __self: this }, isSubmittingReply ? "Posting..." : "Post Reply"))), message.replies.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "mt-4 space-y-4", __source: { fileName: "", lineNumber: 983, columnNumber: 23 }, __self: this }, message.replies.map((reply)=>/*#__PURE__*/ React.createElement("div", { key: reply.id, className: "bg-gray-50 rounded-lg p-4 ml-6", __source: { fileName: "", lineNumber: 985, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-2", __source: { fileName: "", lineNumber: 989, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 990, columnNumber: 31 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#9c27b0]", __source: { fileName: "", lineNumber: 991, columnNumber: 33 }, __self: this }, formatUsername(reply.username)), /*#__PURE__*/ React.createElement("span", { className: "text-gray-500 text-sm ml-2", __source: { fileName: "", lineNumber: 994, columnNumber: 33 }, __self: this }, formatTimestamp(reply.timestamp))), session?.user?.id === reply.user_id && !editingReplyId && /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setEditingReplyId(reply.id); setEditContent(reply.content); }, className: "text-gray-500 hover:text-[#9c27b0]", __source: { fileName: "", lineNumber: 1000, columnNumber: 35 }, __self: this }, "Edit")), editingReplyId === reply.id ? /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 1013, columnNumber: 31 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: editContent, onChange: (e)=>setEditContent(e.target.value), className: "w-full p-4 border border-gray-300 rounded-lg focus:outline-none focus:border-[#9c27b0] resize-none mb-4", rows: "2", __source: { fileName: "", lineNumber: 1014, columnNumber: 33 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-2", __source: { fileName: "", lineNumber: 1022, columnNumber: 33 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setEditingReplyId(null); setEditContent(""); }, className: "text-gray-500 hover:text-gray-700", __source: { fileName: "", lineNumber: 1023, columnNumber: 35 }, __self: this }, "Cancel"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleEdit(reply.id, "reply"), disabled: isSubmittingEdit, className: "bg-[#9c27b0] text-white px-4 py-2 rounded-full text-sm hover:bg-[#7b1fa2] transition-all duration-200 disabled:opacity-50", __source: { fileName: "", lineNumber: 1032, columnNumber: 35 }, __self: this }, isSubmittingEdit ? "Saving..." : "Save"))) : /*#__PURE__*/ React.createElement("p", { className: "text-gray-800 whitespace-pre-wrap", __source: { fileName: "", lineNumber: 1044, columnNumber: 31 }, __self: this }, convertUrlsToLinks(reply.content))))))))))); }