Refactor invoice loading and search functionality for improved performance and user experience

src/pages/Facturas.js

@@ -67,7 +67,7 @@ export function renderFacturasPage() {
   // Función para renderizar la página actual
   function renderPage(page = 1) {
     const invoicesList = container.querySelector('.invoices-list');
-    
+
     currentPage = page;
     totalPages = Math.ceil(filteredInvoices.length / pageSize);
 
@@ -100,23 +100,23 @@ export function renderFacturasPage() {
   // Función para cargar todas las facturas
   async function loadAllInvoices() {
     const invoicesList = container.querySelector('.invoices-list');
-    
+
     try {
       invoicesList.innerHTML = '<div class="loading">Cargando facturas...</div>';
-      
+
       const token = localStorage.getItem('token');
-      
+
       // Construir URL con parámetros
       let url = `${import.meta.env.VITE_API_BASE_URL}/api/Invoices?limit=1000`;
-      
+
       if (currentFilter) {
         url += `&status=${currentFilter}`;
       }
-      
+
       if (searchTerm) {
         url += `&search=${encodeURIComponent(searchTerm)}`;
       }
-      
+
       const response = await fetch(url, {
         method: 'GET',
         headers: {
@@ -130,13 +130,13 @@ export function renderFacturasPage() {
       }
 
       const data = await response.json();
-      
+
       // Manejo de respuesta - obtener todas las facturas
       allInvoices = Array.isArray(data) ? data : data.data || data.invoices || [];
       filteredInvoices = [...allInvoices];
-      
+
       console.log(`Total de facturas cargadas: ${allInvoices.length}`);
-      
+
       // Renderizar la primera página
       renderPage(1);
 
@@ -183,16 +183,15 @@ export function renderFacturasPage() {
 
   const searchInput = container.querySelector('.search-input');
   searchInput.addEventListener('input', (e) => {
-    const inputValue = e.target.value;
+    const inputValue = e.target.value.trim();
     // Debounce para no hacer muchas llamadas
     clearTimeout(searchInput.debounceTimer);
     searchInput.debounceTimer = setTimeout(() => {
-      // Solo aplicar búsqueda si contiene al menos un número
+      // Validación mínima: al menos 2 caracteres para activar búsqueda
-      const hasNumber = /\d/.test(inputValue);
+      if (inputValue.length >= 2) {
-      if (hasNumber && inputValue !== 'I' && inputValue !== 'IN' && inputValue !== 'N') {
         searchTerm = inputValue;
       } else {
-        searchTerm = ''; // Si no tiene número, mostrar todas
+        searchTerm = ''; // Si es muy corto, mostrar todas
       }
       applyFilters();
     }, 500); // Espera 500ms después de que el usuario deja de escribir