\n {/* Header */}\n

Message History

View all incoming messages and auto-replies

\n \n \n \n Refresh\n \n

\n\n {/* Filters */}\n

\n Filter:\n

\n {[\n { key: 'all', label: 'All Messages', count: messages.length },\n { key: 'replied', label: 'Replied', count: messages.filter(m => m.reply_sent).length },\n { key: 'no_reply', label: 'No Reply', count: messages.filter(m => !m.reply_sent).length }\n ].map(({ key, label, count }) => (\n setFilter(key as any)}\n className={`inline-flex items-center px-3 py-1.5 rounded-full text-sm font-medium ${\n filter === key\n ? 'bg-blue-100 text-blue-800'\n : 'bg-gray-100 text-gray-700 hover:bg-gray-200'\n }`}\n >\n {label} ({count})\n \n ))}\n

\n\n {/* Messages List */}\n

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

📭

No messages found

\n {filter === 'all' \n ? \"No messages have been received yet.\"\n : `No messages match the \"${filter.replace('_', ' ')}\" filter.`\n }\n

\n ) : (\n

\n {filteredMessages.map((message) => (\n

\n {/* Message Header */}\n

\n \n {formatPhoneNumber(message.from_number)}\n \n \n {message.reply_sent ? '✅ Replied' : '⏳ No Reply'}\n \n

\n \n {formatTimestamp(message.timestamp)}\n \n

\n\n {/* Incoming Message */}\n

{message.message_text}

\n\n {/* Auto Reply */}\n {message.reply_sent && message.reply_text && (\n

{message.reply_text}

Auto-reply

\n )}\n

\n\n {/* Message Actions */}\n

\n navigator.clipboard.writeText(message.message_text)}\n className=\"text-gray-400 hover:text-gray-600\"\n title=\"Copy message\"\n >\n \n \n

\n ))}\n

\n )}\n\n {/* Load More Button */}\n {hasMore && filteredMessages.length > 0 && (\n

\n \n {loading ? (\n <>\n \n Loading...\n \n ) : (\n 'Load More Messages'\n )}\n \n

\n )}\n

\n\n {/* Summary Stats */}\n {filteredMessages.length > 0 && (\n

{filteredMessages.length}

Total Messages

\n {filteredMessages.filter(m => m.reply_sent).length}\n

Auto-Replies Sent

\n {Math.round((filteredMessages.filter(m => m.reply_sent).length / filteredMessages.length) * 100)}%\n

Reply Rate

\n )}\n

\n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/Lyte/untitled-3191/code/frontend/components/MessageHistory.tsx","extension","actionData","errors"]