\n {!isOwnMessage && (\n

\n {message.authorName}\n

\n )}\n \n

{message.content}

\n \n {message.fileUrl && (\n

\n {message.messageType === \"video\" && (\n

\n )}\n \n {message.messageType === \"audio\" && (\n

\n )}\n \n {message.messageType === \"file\" && (\n \n 📎\n {message.fileName}\n \n )}\n

\n )}\n \n

\n {new Date(message.timestamp).toLocaleTimeString()}\n

\n \n );\n };\n\n const pendingInvitations = invitations.filter(inv => inv.status === \"pending\");\n\n return (\n

\n 💬\n Peace Discussion Room\n {user.isWLPMember && (\n \n WLP Member ⭐\n \n )}\n

\n \n {user.isWLPMember && (\n setShowInviteForm(!showInviteForm)}\n className=\"bg-gradient-to-r from-yellow-500 to-orange-500 text-white px-4 py-2 rounded-lg hover:from-yellow-600 hover:to-orange-600 transition-all text-sm\"\n >\n Invite to WLP\n \n )}\n

\n\n {/* WLP Invitations */}\n {pendingInvitations.length > 0 && (\n

\n {pendingInvitations.map((invitation) => (\n

\n 🌟 WLP Invitation from {invitation.invitedBy}\n

\n You've been invited to join \"We Love Peace\" international group!\n

\n handleInvitationResponse(invitation.id, \"accepted\")}\n className=\"bg-green-500 text-white px-3 py-1 rounded text-sm hover:bg-green-600\"\n >\n Accept\n \n handleInvitationResponse(invitation.id, \"declined\")}\n className=\"bg-gray-500 text-white px-3 py-1 rounded text-sm hover:bg-gray-600\"\n >\n Decline\n \n

\n ))}\n

\n )}\n\n {/* Invite Form */}\n {showInviteForm && (\n

Invite Someone to WLP

\n setInviteeName(e.target.value)}\n placeholder=\"Enter their name...\"\n className=\"flex-1 px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-yellow-500 focus:border-transparent\"\n />\n \n Send Invite\n \n

\n )}\n\n {/* Chat Container */}\n

\n {isLoading ? (\n

\n ) : messages.length === 0 ? (\n

🕊️

Start the conversation about peace!

\n ) : (\n messages.map(renderMessage)\n )}\n

\n\n {/* Message Input */}\n

\n setMessageType(e.target.value as any)}\n className=\"px-3 py-1 border border-gray-300 rounded text-sm\"\n >\n \n \n \n \n \n \n {messageType !== \"text\" && (\n \n )}\n

\n\n {selectedFile && (\n

\n Selected: {selectedFile.name}\n

\n )}\n\n

\n setNewMessage(e.target.value)}\n placeholder={messageType === \"text\" ? \"Share your thoughts on peace...\" : \"Add a message (optional)...\"}\n className=\"flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n required={messageType === \"text\" && !selectedFile}\n />\n \n {isSending ? \"Sending...\" : \"Send\"}\n \n

\n );\n}","deleted","label",[167,168,149],"frontend","components","permalink","https://www.val.town/x/amarereta/Peace/code/frontend/components/ChatRoom.tsx","extension","actionData","errors"]