RepoDructor/composables/useAuth.ts

import { ref, computed, onUnmounted } from 'vue'

// Estado global compartido para auth
const authChecked = ref(false)
const isAuthenticated = ref(false)
const isCheckingAuth = ref(false)
const lastCheckTime = ref(0)

// Listener para cambios de autenticación desde otras tabs/ventanas
let visibilityChangeListener: (() => void) | null = null
let focusListener: (() => void) | null = null

export const useAuth = () => {
  const checkAuth = async (force = false) => {
    // Evitar chequeos duplicados (cache de 10 segundos, reducido)
    const now = Date.now()
    if (!force && isCheckingAuth.value) return
    if (!force && authChecked.value && now - lastCheckTime.value < 10000) {
      return
    }

    isCheckingAuth.value = true

    try {
      // Intenta hacer fetch a un endpoint protegido
      const response = await fetch('/api/music', {
        method: 'HEAD', // Solo headers, no body
        credentials: 'include', // Include cookies for auth
        cache: 'no-store', // No cachear la respuesta
        signal: AbortSignal.timeout(5000) // 5s timeout
      })

      const wasAuthenticated = isAuthenticated.value
      isAuthenticated.value = response.ok
      authChecked.value = true
      lastCheckTime.value = now

      // Log cambios de estado
      if (wasAuthenticated !== isAuthenticated.value) {
        console.log('[Auth] Status changed:', isAuthenticated.value ? 'authenticated' : 'unauthenticated')
      }
    } catch (error) {
      console.warn('[Auth] Failed to check authentication status:', error)
      // En caso de error de red, marcamos como no autenticado
      isAuthenticated.value = false
      authChecked.value = true
      lastCheckTime.value = now
    } finally {
      isCheckingAuth.value = false
    }
  }

  const triggerAuth = async () => {
    console.log('[Auth] Triggering authentication flow...')

    // Primero, hacemos una request al endpoint protegido para forzar
    // que Authentik nos redirija a su página de login
    try {
      const response = await fetch('/api/music', {
        method: 'GET',
        credentials: 'include',
        redirect: 'manual' // No seguir redirects automáticamente
      })

      if (!response.ok && (response.status === 401 || response.status === 403)) {
        // Si obtenemos 401/403, forzamos un reload completo de la página
        // para que Traefik + Authentik intercepten y redirijan al login
        console.log('[Auth] Unauthorized - forcing full page reload to trigger auth')
        window.location.href = window.location.href
      } else if (response.ok) {
        // Si la respuesta es OK, ya estamos autenticados
        console.log('[Auth] Already authenticated')
        await checkAuth(true)
      }
    } catch (error) {
      console.error('[Auth] Error triggering auth:', error)
      // En caso de error, forzamos reload de todas formas
      window.location.href = window.location.href
    }
  }

  const markUnauthenticated = () => {
    // Helper para marcar como no autenticado (útil cuando detectamos 401/403)
    console.log('[Auth] Marking as unauthenticated')
    isAuthenticated.value = false
    authChecked.value = true
    lastCheckTime.value = Date.now()
  }

  const setupVisibilityListener = () => {
    // Re-chequea auth cuando la pestaña vuelve a ser visible
    // (útil si el usuario se autentica en otra pestaña)
    if (typeof document !== 'undefined' && !visibilityChangeListener) {
      visibilityChangeListener = () => {
        if (!document.hidden) {
          console.log('[Auth] Tab visible again, checking auth...')
          checkAuth(true)
        }
      }
      document.addEventListener('visibilitychange', visibilityChangeListener)
    }

    // También chequea cuando la ventana recibe foco
    if (typeof window !== 'undefined' && !focusListener) {
      focusListener = () => {
        console.log('[Auth] Window focused, checking auth...')
        checkAuth(true)
      }
      window.addEventListener('focus', focusListener)
    }
  }

  const cleanupListeners = () => {
    if (visibilityChangeListener) {
      document.removeEventListener('visibilitychange', visibilityChangeListener)
      visibilityChangeListener = null
    }
    if (focusListener) {
      window.removeEventListener('focus', focusListener)
      focusListener = null
    }
  }

  const authStatus = computed(() => {
    if (!authChecked.value) return 'unknown'
    return isAuthenticated.value ? 'authenticated' : 'unauthenticated'
  })

  return {
    isAuthenticated,
    authChecked,
    isCheckingAuth,
    authStatus,
    checkAuth,
    triggerAuth,
    markUnauthenticated,
    setupVisibilityListener,
    cleanupListeners
  }
}