Feature: Cargar historial de WhatsApp desde la UI

- Agregar endpoint oldest.get.ts para obtener mensaje mas antiguo de un chat
- Agregar boton 'Cargar historial de WhatsApp' en vista de mensajes
- Mejorar HistorySection.vue con selector de chats y auto-deteccion

app/pages/messages/index.vue

@@ -188,6 +188,32 @@
               </button>
             </div>
 
+            <!-- Load from WhatsApp when local DB is exhausted -->
+            <div
+              v-else-if="!hasMoreMessages && !loadingWhatsAppHistory"
+              class="flex flex-col items-center py-3 gap-2"
+            >
+              <span class="text-xs text-[var(--wa-text-muted)]">
+                No hay mas mensajes en la base de datos
+              </span>
+              <button
+                class="text-xs px-3 py-1.5 rounded bg-[var(--wa-green)] text-white hover:opacity-90 transition-opacity"
+                @click="fetchWhatsAppHistory"
+              >
+                Cargar historial de WhatsApp
+              </button>
+            </div>
+
+            <div
+              v-else-if="loadingWhatsAppHistory"
+              class="flex flex-col items-center py-3 gap-2"
+            >
+              <UIcon name="i-lucide-loader-2" class="w-5 h-5 animate-spin text-[var(--wa-green)]" />
+              <span class="text-xs text-[var(--wa-text-muted)]">
+                Solicitando historial de WhatsApp...
+              </span>
+            </div>
+
             <MessagesMessageBubble
               v-for="message in reversedMessages"
               :key="message.id"
@@ -244,6 +270,7 @@ const messages = ref<any[]>([])
 const loadingChats = ref(false)
 const loadingMessages = ref(false)
 const loadingMore = ref(false)
+const loadingWhatsAppHistory = ref(false)
 const hasMoreMessages = ref(true)
 const showDebugPanel = ref(false)
 const showChatsDebug = ref(false)
@@ -360,6 +387,56 @@ const handleScroll = () => {
   }
 }
 
+// Fetch message history from WhatsApp (when local DB is exhausted)
+const fetchWhatsAppHistory = async () => {
+  if (!selectedInstance.value?.value || !selectedChat.value) return
+
+  loadingWhatsAppHistory.value = true
+  try {
+    const instanceId = selectedInstance.value.value
+    const chatId = selectedChat.value.id
+
+    // Get the oldest message from local DB
+    const oldest = await $fetch<{
+      hasMessages: boolean
+      messageKey: { remoteJid: string; id: string; fromMe: boolean } | null
+      timestamp: number | null
+    }>(`/api/messages/${instanceId}/${chatId}/oldest`)
+
+    // Request history from WhatsApp
+    if (!oldest.hasMessages) {
+      // No messages in DB, request without reference
+      await $fetch('/api/debug/history/fetch', {
+        method: 'POST',
+        body: {
+          instanceId,
+          count: 100
+        }
+      })
+    } else {
+      // Request messages older than the oldest in DB
+      await $fetch('/api/debug/history/fetch', {
+        method: 'POST',
+        body: {
+          instanceId,
+          count: 100,
+          oldestMsgKey: oldest.messageKey,
+          oldestMsgTimestamp: oldest.timestamp
+        }
+      })
+    }
+
+    // Wait for history sync to complete and reload
+    await new Promise(r => setTimeout(r, 3000))
+    await reloadMessages()
+    hasMoreMessages.value = true
+  } catch (e) {
+    console.error('Error fetching WhatsApp history:', e)
+  } finally {
+    loadingWhatsAppHistory.value = false
+  }
+}
+
 // Computed presence text for current chat
 const currentChatPresence = computed(() => {
   if (!selectedChat.value?.jid) return null