fix: add error handling and empty state to chat conversation list

- loadConvs: try/catch shows error message instead of silent empty list
- loadConvs: shows "Sin conversaciones aún" when array is empty
- loadConvs: checks r.ok before parsing JSON to catch 4xx/5xx
- loadMessages: shows loading indicator and catches network/parse errors

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

admin/DashboardController.php

@@ -1920,20 +1920,31 @@ let activePhone = '';
 
 // ─── Load conversations ──────────────────────────────────────────────────────
 async function loadConvs() {
-  const r = await fetch('/admin/chat/conversations');
-  const data = await r.json();
   const list = document.getElementById('convList');
-  list.innerHTML = data.conversations.map(c => {
+  try {
+    const r = await fetch('/admin/chat/conversations');
+    if (!r.ok) {
+      list.innerHTML = \`<div style="padding:16px;color:#e53e3e;font-size:13px">Error \${r.status} al cargar conversaciones</div>\`;
+      return;
+    }
+    const data = await r.json();
+    const convs = data.conversations || [];
+    if (convs.length === 0) {
+      list.innerHTML = '<div style="padding:24px 16px;text-align:center;color:#a0a8b8;font-size:13px">Sin conversaciones aún</div>';
+      return;
+    }
+    list.innerHTML = convs.map(c => {
       const time = formatTime(c.last_time);
-    const avatar = (c.contact_name || c.phone).charAt(0).toUpperCase();
+      const name = c.contact_name || c.phone || '';
+      const avatar = name.charAt(0).toUpperCase() || '?';
       const unread = c.unread_count > 0 ? \`<div class="conv-unread">\${c.unread_count}</div>\` : '';
       const active = c.phone === activePhone ? ' active' : '';
       const company = c.company_name ? \`<span class="conv-company">\${esc(c.company_name)}</span>\` : '';
-    return \`<div class="conv-item\${active}" onclick="selectConv('\${c.phone}','\${esc(c.contact_name||c.phone)}','\${esc(c.company_name||'')}')">
+      return \`<div class="conv-item\${active}" onclick="selectConv('\${esc(c.phone)}','\${esc(c.contact_name||c.phone)}','\${esc(c.company_name||'')}')">
         <div class="conv-avatar">\${avatar}</div>
         <div class="conv-info">
-        <div class="conv-name">\${esc(c.contact_name || 'Desconocido')} \${company}</div>
+          <div class="conv-name">\${esc(name || 'Desconocido')} \${company}</div>
-        <div class="conv-phone">\${c.phone}</div>
+          <div class="conv-phone">\${esc(c.phone)}</div>
           <div class="conv-last">\${esc(c.last_message || '')}</div>
         </div>
         <div class="conv-meta">
@@ -1942,6 +1953,10 @@ async function loadConvs() {
         </div>
       </div>\`;
     }).join('');
+  } catch (e) {
+    console.error('loadConvs error:', e);
+    list.innerHTML = '<div style="padding:16px;color:#e53e3e;font-size:13px">Error al cargar conversaciones. Revisa la consola.</div>';
+  }
 }
 
 // ─── Select conversation ─────────────────────────────────────────────────────
@@ -1973,9 +1988,21 @@ function closeMobileChat() {
 
 // ─── Load messages ───────────────────────────────────────────────────────────
 async function loadMessages(phone) {
-  const r = await fetch('/admin/chat/messages?phone=' + encodeURIComponent(phone));
-  const data = await r.json();
   const msgsDiv = document.getElementById('chatMessages');
+  msgsDiv.innerHTML = '<div style="text-align:center;padding:20px;color:#a0a8b8">Cargando...</div>';
+  let data;
+  try {
+    const r = await fetch('/admin/chat/messages?phone=' + encodeURIComponent(phone));
+    if (!r.ok) {
+      msgsDiv.innerHTML = \`<div style="text-align:center;padding:20px;color:#e53e3e">Error \${r.status}</div>\`;
+      return;
+    }
+    data = await r.json();
+  } catch (e) {
+    console.error('loadMessages error:', e);
+    msgsDiv.innerHTML = '<div style="text-align:center;padding:20px;color:#e53e3e">Error de conexión</div>';
+    return;
+  }
   if (!data.messages || data.messages.length === 0) {
     msgsDiv.innerHTML = '<div style="text-align:center;padding:20px;color:#a0a8b8">No hay mensajes</div>';
     return;