Community Chat

Discuss opportunities and connect with others

\n \n setAutoRefresh(e.target.checked)}\n className=\"rounded\"\n />\n Auto-refresh\n \n \n 🔄 Refresh\n \n

\n\n {/* Chat Messages */}\n

\n {error && (\n

⚠️ {error}

\n )}\n\n {Object.keys(groupedMessages).length === 0 ? (\n

💬

No messages yet

Be the first to start the conversation!

\n ) : (\n

\n {Object.entries(groupedMessages).map(([date, dateMessages]) => (\n

\n {/* Date separator */}\n

\n {date}\n

\n \n {/* Messages for this date */}\n {dateMessages.map((message, index) => (\n

\n \n {message.username.charAt(0).toUpperCase()}\n \n

\n \n {message.username}\n \n \n {message.created_at && formatTime(message.created_at)}\n \n

\n {message.message}\n

\n ))}\n

\n )}\n

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

\n {!username && (\n

\n \n Choose a username to start chatting:\n \n setUsername(e.target.value)}\n placeholder=\"Enter your username\"\n maxLength={50}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500\"\n />\n

\n )}\n \n

\n setNewMessage(e.target.value)}\n placeholder={username ? \"Type your message...\" : \"Set a username first\"}\n disabled={!username || sending}\n maxLength={500}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100\"\n />\n

\n \n {sending ? '⏳' : '📤'}\n \n

\n \n {username && (\n

\n Chatting as: {username}\n {newMessage.length}/500\n

\n )}\n

\n );\n}","deleted","label",[175,176,157],"frontend","components","permalink","https://www.val.town/x/yolandar_m/untitled-7858/code/frontend/components/ChatRoom.tsx","extension","actionData","errors"]