\n {/* Quick Message Buttons */}\n

Quick messages:

\n {quickMessages.map((quickMsg, index) => (\n insertQuickMessage(quickMsg)}\n className=\"text-xs bg-gray-100 hover:bg-gray-200 px-2 py-1 rounded-full transition-colors\"\n disabled={disabled || isSending}\n >\n {quickMsg}\n \n ))}\n

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

\n setMessage(e.target.value)}\n onKeyPress={handleKeyPress}\n placeholder={disabled ? \"Connecting...\" : \"Share your guitar thoughts... (Press Enter to send, Shift+Enter for new line)\"}\n className=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent resize-none\"\n rows={2}\n maxLength={500}\n disabled={disabled || isSending}\n />\n

\n \n {message.length}/500 characters\n \n {disabled && (\n \n Reconnecting...\n \n )}\n

\n \n \n {isSending ? (\n <>\n

\n Sending...\n \n ) : (\n <>\n Send\n 🎸\n \n )}\n \n \n \n

\n 💡 Tip: Mention \"guitar\", \"rock\", \"music\" and other keywords to get automatic emoji reactions!\n

\n );\n}","deleted","label",[169,170,152],"frontend","components","permalink","https://www.val.town/x/kyei94/GuitarBoard/code/frontend/components/MessageInput.tsx","extension","actionData","errors"]