tacel-chat 1.2.0

package/utils/format.js

@@ -0,0 +1,133 @@
+/**
+ * Formatting utilities for tacel-chat
+ */
+
+/**
+ * Format a timestamp for display in the chat list
+ * Today: "3:45 PM", Yesterday: "Yesterday", Older: "Jan 5"
+ */
+function formatChatListTime(timestamp) {
+  if (!timestamp) return '';
+  const date = new Date(timestamp);
+  if (isNaN(date.getTime())) return '';
+
+  const now = new Date();
+  const today = new Date(now.getFullYear(), now.getMonth(), now.getDate());
+  const yesterday = new Date(today);
+  yesterday.setDate(yesterday.getDate() - 1);
+  const msgDate = new Date(date.getFullYear(), date.getMonth(), date.getDate());
+
+  if (msgDate.getTime() === today.getTime()) {
+    return formatTime(date);
+  } else if (msgDate.getTime() === yesterday.getTime()) {
+    return 'Yesterday';
+  } else {
+    return formatShortDate(date);
+  }
+}
+
+/**
+ * Format time as "3:45 PM"
+ */
+function formatTime(date) {
+  if (!date) return '';
+  const d = new Date(date);
+  if (isNaN(d.getTime())) return '';
+  let hours = d.getHours();
+  const minutes = d.getMinutes().toString().padStart(2, '0');
+  const ampm = hours >= 12 ? 'PM' : 'AM';
+  hours = hours % 12 || 12;
+  return `${hours}:${minutes} ${ampm}`;
+}
+
+/**
+ * Format date as "Jan 5"
+ */
+function formatShortDate(date) {
+  if (!date) return '';
+  const d = new Date(date);
+  if (isNaN(d.getTime())) return '';
+  const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+  return `${months[d.getMonth()]} ${d.getDate()}`;
+}
+
+/**
+ * Format date as "January 5, 2026" for date dividers
+ */
+function formatFullDate(date) {
+  if (!date) return '';
+  const d = new Date(date);
+  if (isNaN(d.getTime())) return '';
+  const months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
+  return `${months[d.getMonth()]} ${d.getDate()}, ${d.getFullYear()}`;
+}
+
+/**
+ * Format relative time for presence: "5 min ago", "2 hrs ago", "yesterday", "Jan 5"
+ */
+function formatRelativeTime(timestamp) {
+  if (!timestamp) return 'Offline';
+  const date = new Date(timestamp);
+  if (isNaN(date.getTime())) return 'Offline';
+
+  const now = new Date();
+  const diffMs = now - date;
+  const diffSec = Math.floor(diffMs / 1000);
+  const diffMin = Math.floor(diffSec / 60);
+  const diffHr = Math.floor(diffMin / 60);
+  const diffDay = Math.floor(diffHr / 24);
+
+  if (diffSec < 60) return 'Just now';
+  if (diffMin < 60) return `${diffMin} min ago`;
+  if (diffHr < 24) return `${diffHr} hr${diffHr > 1 ? 's' : ''} ago`;
+  if (diffDay === 1) return 'yesterday';
+  return formatShortDate(date);
+}
+
+/**
+ * Get the date key for grouping messages (YYYY-MM-DD)
+ */
+function getDateKey(timestamp) {
+  const d = new Date(timestamp);
+  if (isNaN(d.getTime())) return '';
+  return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
+}
+
+/**
+ * Truncate text to a max length with ellipsis
+ */
+function truncate(text, maxLen = 30) {
+  if (!text) return '';
+  if (text.length <= maxLen) return text;
+  return text.substring(0, maxLen) + '…';
+}
+
+/**
+ * Format a date for date dividers: "Today", "Yesterday", or "February 5, 2026"
+ */
+function formatDateDivider(date) {
+  if (!date) return '';
+  const d = new Date(date);
+  if (isNaN(d.getTime())) return '';
+
+  const now = new Date();
+  const today = new Date(now.getFullYear(), now.getMonth(), now.getDate());
+  const yesterday = new Date(today);
+  yesterday.setDate(yesterday.getDate() - 1);
+  const msgDate = new Date(d.getFullYear(), d.getMonth(), d.getDate());
+
+  if (msgDate.getTime() === today.getTime()) return 'Today';
+  if (msgDate.getTime() === yesterday.getTime()) return 'Yesterday';
+  return formatFullDate(d);
+}
+
+module.exports = {
+  formatChatListTime,
+  formatTime,
+  formatShortDate,
+  formatFullDate,
+  formatDateDivider,
+  formatRelativeTime,
+  getDateKey,
+  truncate
+};

package/utils/linkify.js

@@ -0,0 +1,80 @@
+/**
+ * URL linkification and @mention highlighting for tacel-chat
+ */
+
+const { escapeHtml } = require('./dom');
+
+/**
+ * Process message text: escape HTML, convert newlines, linkify URLs, highlight @mentions
+ * @param {string} text - Raw message text
+ * @param {string} currentUsername - Current user's username (for self-mention highlighting)
+ * @param {boolean} enableMentions - Whether to highlight @mentions
+ * @param {boolean} enableLinks - Whether to linkify URLs
+ * @returns {string} Processed HTML string
+ */
+function processMessageText(text, currentUsername = '', enableMentions = false, enableLinks = true) {
+  if (!text) return '';
+
+  let html = escapeHtml(text);
+
+  // Convert newlines to <br>
+  html = html.replace(/\n/g, '<br>');
+
+  // Linkify URLs
+  if (enableLinks) {
+    html = linkifyUrls(html);
+  }
+
+  // Highlight @mentions
+  if (enableMentions) {
+    html = highlightMentions(html, currentUsername);
+  }
+
+  return html;
+}
+
+/**
+ * Convert URLs in text to clickable links
+ */
+function linkifyUrls(html) {
+  // Match http://, https://, and www. URLs
+  const urlRegex = /(https?:\/\/[^\s<]+|www\.[^\s<]+)/gi;
+  return html.replace(urlRegex, (match) => {
+    const href = match.startsWith('www.') ? 'https://' + match : match;
+    return `<a class="tc-chat-link" href="${escapeHtml(href)}" target="_blank" rel="noopener noreferrer">${escapeHtml(match)}</a>`;
+  });
+}
+
+/**
+ * Highlight @mentions in processed HTML
+ */
+function highlightMentions(html, currentUsername = '') {
+  const mentionRegex = /@(\w+)/g;
+  const normalizedCurrent = (currentUsername || '').toLowerCase().trim();
+
+  return html.replace(mentionRegex, (match, username) => {
+    const isself = username.toLowerCase() === normalizedCurrent;
+    const cls = isself ? 'tc-mention tc-mention-self' : 'tc-mention';
+    return `<span class="${cls}">${match}</span>`;
+  });
+}
+
+/**
+ * Extract @mention usernames from raw text
+ * @returns {string[]} Array of mentioned usernames (lowercase)
+ */
+function extractMentions(text) {
+  if (!text) return [];
+  const regex = /@(\w+)/g;
+  const mentions = [];
+  let match;
+  while ((match = regex.exec(text)) !== null) {
+    const username = match[1].toLowerCase();
+    if (!mentions.includes(username)) {
+      mentions.push(username);
+    }
+  }
+  return mentions;
+}
+
+module.exports = { processMessageText, linkifyUrls, highlightMentions, extractMentions };