<script setup lang="ts">
const { $i18n } = useNuxtApp()
const t = $i18n.t

interface ChangeEntry {
  type: 'nuevo' | 'mejora' | 'fix' | 'eliminado'
  text: string
}

interface Release {
  version: string
  date: string
  title: string
  description?: string
  changes: ChangeEntry[]
}

const releases: Release[] = [
  {
    version: '0.6',
    date: '31 de mayo, 2026',
    title: 'Feedback con traducciones, bloqueo de Entrelíneas y acceso desarrollador',
    changes: [
      { type: 'nuevo', text: 'Página de Feedback con traducciones completas en 4 idiomas' },
      { type: 'nuevo', text: 'Sistema de bloqueo por clave de desarrollador para secciones en desarrollo' },
      { type: 'nuevo', text: 'Acceso de desarrollador en Configuración con desbloqueo por clave' },
      { type: 'nuevo', text: 'Banner visual mejorado para Entrelíneas cuando está bloqueado' },
      { type: 'mejora', text: 'Traducciones añadidas al componente BugReportInput' },
      { type: 'mejora', text: 'Nombre del tab Feedback ahora usa traducciones' },
      { type: 'mejora', text: 'Textos del banner de Entrelíneas traducidos a 4 idiomas' }
    ]
  },
  {
    version: '0.5',
    date: '30 de mayo, 2026',
    title: 'Soporte de HTML en Entrelíneas',
    description: 'El visor de Entrelíneas ahora renderiza contenido en HTML además de texto plano.',
    changes: [
      { type: 'nuevo', text: 'Renderizado de contenido HTML en el detalle de Entrelíneas' },
      { type: 'mejora', text: 'Los fragmentos HTML se muestran con formato original preservado' },
      { type: 'fix', text: 'Corrección de errores de sintaxis en el componente de detalle' },
      { type: 'mejora', text: 'El historial ahora muestra correctamente documentos de Entrelíneas con HTML' }
    ]
  },
  {
    version: '0.4',
    date: '26 de mayo, 2026',
    title: 'Mejoras de interfaz y exploracion',
    changes: [
      { type: 'mejora', text: 'El código del documento aparece visible en la pantalla de detalle' },
      { type: 'mejora', text: 'El badge "Borrador" solo se muestra cuando el documento es borrador' },
      { type: 'mejora', text: 'Tooltip mejorado al copiar párrafos al portapapeles' },
      { type: 'mejora', text: 'El explorador filtra resultados mostrando solo ítems con párrafos' },
      { type: 'mejora', text: 'Panel lateral preparado para notas y resaltados (próximamente)' },
      { type: 'fix', text: 'Posicionamiento del panel lateral corregido en documentos cortos' },
      { type: 'fix', text: 'Corrección de traducciones en francés' },
      { type: 'fix', text: 'Ajustes visuales en múltiples vistas' }
    ]
  },
  {
    version: '0.3',
    date: '25 de mayo, 2026',
    title: 'Portapapeles y corrección de bugs',
    changes: [
      { type: 'nuevo', text: 'Panel de copiado mejorado al seleccionar párrafos' },
      { type: 'mejora', text: 'Función de copiar al portapapeles más robusta e independiente' },
      { type: 'fix', text: 'Corrección de bug al guardar y mostrar favoritos' },
      { type: 'fix', text: 'Corrección de bug en la carga de referencias' },
      { type: 'fix', text: 'Corrección de bug en el detalle de publicaciones de referencia' }
    ]
  },
  {
    version: '0.2',
    date: '21–24 de mayo, 2026',
    title: 'Conferencias, copiar párrafos y estabilidad',
    changes: [
      { type: 'nuevo', text: 'Soporte de documentos de Conferencias y Actividades' },
      { type: 'nuevo', text: 'Clic en párrafo para copiarlo directamente al portapapeles' },
      { type: 'nuevo', text: 'Zoom de imagen en el visor de Entrelíneas' },
      { type: 'mejora', text: 'Número de párrafo más discreto en el detalle del documento' },
      { type: 'mejora', text: 'Publicación del documento visible en todas las vistas y traducida' },
      { type: 'mejora', text: 'Corrección de estilos visuales para contenido antiguo' },
      { type: 'fix', text: 'Corrección de bug en favoritos (detalle)' },
      { type: 'fix', text: 'Badge "Borrador" agregado en lista y detalle de Estudios Bíblicos' },
      { type: 'fix', text: 'Rutas de navegación migradas correctamente a nuevo motor de búsqueda' },
      { type: 'fix', text: 'Corrección de scroll infinito en móvil para Entrelíneas' }
    ]
  },
  {
    version: '0.1',
    date: '10–12 de mayo, 2026',
    title: 'Historial, Favoritos y multilengua',
    description: 'Primera versión funcional con las secciones principales activas.',
    changes: [
      { type: 'nuevo', text: 'Historial de búsqueda y exploración' },
      { type: 'nuevo', text: 'Favoritos: guarda y accede a documentos desde Mi Listado' },
      { type: 'nuevo', text: 'Selector de idioma: Español, English, Français, Português' },
      { type: 'nuevo', text: 'Cantidad aproximada de resultados visible en los listados' },
      { type: 'mejora', text: 'Paginación configurable: scroll infinito o páginas numeradas' },
      { type: 'mejora', text: 'Ajuste de cantidad de resultados por página en Configuración' },
      { type: 'fix', text: 'Corrección de traducciones en el menú principal' },
      { type: 'fix', text: 'Ajustes de colores y badges en listas de resultados' }
    ]
  },
  {
    version: '0.0.1',
    date: '7 de mayo, 2026',
    title: 'Lanzamiento inicial',
    description: 'Primera versión del buscador con Estudios Bíblicos y Entrelíneas.',
    changes: [
      { type: 'nuevo', text: 'Búsqueda en Estudios Bíblicos' },
      { type: 'nuevo', text: 'Visor de Entrelíneas con imagen y texto' },
      { type: 'nuevo', text: 'Búsqueda por palabras o por frase exacta' },
      { type: 'nuevo', text: 'Estructura base de la aplicación' }
    ]
  }
]

const typeConfig: Record<ChangeEntry['type'], { label: string; color: string }> = {
  nuevo: { label: 'Nuevo', color: 'success' },
  mejora: { label: 'Mejora', color: 'info' },
  fix: { label: 'Fix', color: 'warning' },
  eliminado: { label: 'Eliminado', color: 'error' }
}
</script>

<template>
  <UDashboardPanel id="changelog-panel" grow>
    <UDashboardNavbar :title="t('nav.changelog')">
      <template #leading>
        <UDashboardSidebarCollapse />
      </template>
    </UDashboardNavbar>

    <div class="overflow-y-auto flex-1">
      <div class="max-w-2xl mx-auto p-6 space-y-10">
        <div v-for="release in releases" :key="release.version" class="relative pl-6 border-l-2 border-default">
          <!-- Dot en la línea de tiempo -->
          <div class="absolute -left-[5px] top-1 w-2 h-2 rounded-full bg-primary" />

          <!-- Cabecera del release -->
          <div class="mb-3">
            <div class="flex items-center gap-2 flex-wrap">
              <UBadge color="primary" variant="soft" size="sm">
                v{{ release.version }}
              </UBadge>
              <span class="text-xs text-muted">{{ release.date }}</span>
            </div>
            <h2 class="text-base font-semibold text-highlighted mt-1">
              {{ release.title }}
            </h2>
            <p v-if="release.description" class="text-sm text-muted mt-0.5">
              {{ release.description }}
            </p>
          </div>

          <!-- Lista de cambios -->
          <ul class="space-y-2">
            <li
              v-for="(change, i) in release.changes"
              :key="i"
              class="flex items-start gap-2 text-sm"
            >
              <UBadge
                :color="typeConfig[change.type].color as any"
                variant="subtle"
                size="xs"
                class="mt-0.5 shrink-0"
              >
                {{ typeConfig[change.type].label }}
              </UBadge>
              <span class="text-default">{{ change.text }}</span>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </UDashboardPanel>
</template>
