\n {/* Chat Header */}\n

💬 Public Chatroom

\n Discuss job opportunities and connect with others\n

\n \n {isConnected ? 'Connected' : 'Disconnected'}\n \n

\n\n {/* Username Input */}\n {!username && (\n

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

\n )}\n\n {/* Messages */}\n

\n {messages.length === 0 ? (\n

💬

No messages yet. Start the conversation!

\n ) : (\n messages.map((message) => (\n

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

\n \n {message.username}\n \n \n {formatTime(message.timestamp)}\n \n

{message.message}

\n ))\n )}\n

\n\n {/* Message Input */}\n {username && (\n

\n )}\n

\n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/deebons/DERICK/code/frontend/components/Chatroom.tsx","extension","actionData","errors"]