📋 Lista y Filtrado de Archivos

Vista de Lista

La sección Files muestra todos tus archivos en formato de tabla con las siguientes columnas:

🖥️ Vista de Monitor

• ☑️ Checkbox: Para selección múltiple
• ▶️ Preview: Botón de reproducción/vista previa
• 📁 Type: Tipo MIME del archivo (ej. image/png, audio/mp3)
• 🏷️ Format: Categoría del archivo (image, audio, video, text)
• 📄 File name: Nombre completo del archivo
• 🔍 Detection: Estado del proceso de detección
• 🔗 Traceability: Estado del proceso de trazabilidad
• 📅 Created: Fecha de creación
• ⬇️ Download: Botón de descarga individual
• ☰ Results: Botón de detalles (hamburguesa roja)

📱 Vista de Móvil

La vista se simplifica mostrando:

• Checkbox de selección
• Icono del tipo de archivo
• Nombre del archivo
• Estados de los dos procesos (Detection, Traceability)
• Botón de detalles (hamburguesa roja)

Acciones en Mobile

En pantallas pequeñas, debes entrar en Detalles para poder descargar el archivo.

🔍 Búsqueda y Filtros

Búsqueda por Nombre

Campo "Search files" en la parte superior (fuera del panel de filtros):

1. Escribe el nombre o parte del nombre del archivo
2. La lista se filtrará en tiempo real
3. Borra el texto para ver todos los archivos

🔻 Botón de Mostrar/Ocultar Filtros

En todas las pantallas (desktop y mobile) verás un botón rojo con icono de embudo:

• Haz clic para abrir/cerrar el panel de filtros
• Muestra una burbuja con número indicando filtros activos
• Permite mostrar u ocultar todos los filtros de forma compacta

Filtros Disponibles

1️⃣ Format (Formato)

Filtra por categoría de archivo:

• audio 🎵
• image 🖼️

2️⃣ Type (Tipo MIME)

Filtra por tipo MIME específico. Opciones según formato:

Imágenes:

• image/png
• image/jpeg
• image/bpm
• image/gif

Audio:

• audio/ogg
• audio/opus
• audio/mp4
• audio/mpeg
• audio/wav
• audio/x-wav
• audio/x-m4a

3️⃣ Detection y Traceability (Estados de Procesos)

Filtra por el estado de cada proceso (Detection o Traceability).

Estados disponibles:

• created 🆕: Archivo creado, proceso no iniciado
• queued ⏳: En cola de espera para procesamiento
• processing ⚙️: Procesando actualmente
• ready ✔️: Listo para ser procesado o descargado
• error ❌: Error durante el proceso
• alert ⚠️: Alerta detectada durante el proceso
• ok ✅: Proceso completado exitosamente

4️⃣ Created (Fecha de Creación)

Filtra por rango de fechas:

• Start date: Fecha de inicio (formato: DD/MM/YYYY)
• End date: Fecha de fin (formato: DD/MM/YYYY)
• Se abre un selector de calendario al hacer clic

Persistencia de Filtros

Los filtros permanecen activos mientras navegas por la plataforma. Se eliminan al cerrar sesión o cuando los eliminas manualmente. Ten cuidado de no dejar filtros activos sin darte cuenta.

🔄 Ordenar Archivos

Haz clic en los encabezados de columna para ordenar:

• Type: Orden alfabético por tipo MIME (ascendente/descendente)
• Format: Orden alfabético por formato (ascendente/descendente)
• File name: Orden alfabético por nombre (A-Z / Z-A)
• Created: Orden cronológico por fecha (recientes primero / antiguos primero)

El icono ⬆️⬇️ indica la columna activa y la dirección del orden.

☑️ Selección Múltiple

Seleccionar Archivos

1. Marca la casilla de verificación junto a cada archivo que desees
2. Usa el checkbox del encabezado para seleccionar/deseleccionar todos los archivos de la página
3. Los archivos seleccionados se resaltarán visualmente

🔧 Acciones en Lote

Con archivos seleccionados, se activan las acciones disponibles en la parte superior:

En Desktop:

• 🔍 ANALYZE FILES: Ejecutar detección en archivos seleccionados
• 🔗 TRACE FILES: Ejecutar trazabilidad en archivos seleccionados
• 🗑️ Eliminar: Eliminar archivos seleccionados

En Mobile:

• Los mismos botones pero solo con iconos (sin texto)

📄 Paginación

En la parte inferior de la lista:

• Items per page: Selector para cambiar elementos por página
  • Opciones: 5, 10, 15, 25, 100
• Indicador: Muestra "1 - 10 of 13" (ejemplo)
• Navegación: Botones para primera página ⏮️, anterior ◀️, siguiente ▶️, última página ⏭️

🔴 Acciones Individuales

Cada archivo tiene tres botones de acción:

▶️ Botón de Preview (Desktop)

• Botón rojo con icono de play/flecha
• Abre una previsualización del archivo en un panel lateral izquierdo
• Muestra una vista rápida del contenido sin entrar en detalles completos
• Solo visible en pantallas grandes

⬇️ Botón de Descarga

• Botón rojo con icono de descarga
• Descarga el archivo directamente a tu dispositivo
• Visible en desktop; en mobile está dentro de Detalles

☰ Botón de Detalles (Hamburguesa Roja)

• Abre la vista detallada completa del archivo
• Muestra:
  • Previsualización del archivo (imagen, reproductor de audio)
  • Resultados detallados de cada proceso:
    • 🔍 Detection (Detección)
    • 🔗 Traceability (Trazabilidad)
  • Opción de descarga
  • Acciones adicionales según el tipo de archivo

📊 Estados de los Procesos

Cada archivo puede tener diferentes estados para cada uno de los tres procesos:

Estado	Icono	Descripción
created	🆕	Archivo creado, proceso no iniciado
queued	⏳	En cola de espera para procesamiento
processing	⚙️	Procesando actualmente
ready	✔️ Gris	Listo para ser procesado o descargado
error	❌ Amarillo	Error durante el proceso
alert	⚠️ Naranja	Se detectó una alerta o advertencia
ok	✅ Morado	Proceso completado exitosamente

Ver Detalles

Haz clic en el botón de detalles (hamburguesa roja) para ver información completa sobre cada estado y sus resultados específicos.

💡 Consejos de Uso

• Limpia tus filtros: Revisa regularmente los filtros activos para asegurarte de ver todos tus archivos
• Usa la búsqueda: Es más rápido buscar por nombre que navegar por páginas
• Ordena estratégicamente: Ordena por fecha para ver archivos recientes o por nombre para encontrar archivos específicos
• Selección eficiente: Usa filtros primero para reducir la lista, luego selecciona todos con el checkbox del encabezado
• Mobile vs Desktop: En mobile, recuerda que necesitas entrar en detalles para descargar