import { defineStore } from 'pinia'
import { ref } from 'vue'
import type { Ref } from 'vue'
import type { TYPE_ALERT } from '~/types/enum/enums'
import type { Alert } from '~/types/interfaces'

export const usePageStore = defineStore('page', () => {
  const alerts: Ref<Array<Alert>> = ref([])
  const loading: Ref<boolean> = ref(false)
  let timeoutId: ReturnType<typeof setTimeout> | null = null

  const removeSlowlyAlert = () => {
    clearAlertTimeout()
    timeoutId = setTimeout(() => {
      alerts.value.shift()
      timeoutId = null
    }, 300)
  }

  const clearAlertTimeout = () => {
    if (timeoutId !== null) {
      clearTimeout(timeoutId)
      timeoutId = null
    }
  }

  /**
   * Ajout des alerts dans le store
   * @param type
   * @param messages
   */
  const addAlert = (type: TYPE_ALERT, messages: Array<string>) => {
    const alert: Alert = {
      type,
      messages,
    }
    alerts.value.push(alert)
  }

  return {
    alerts,
    loading,
    removeSlowlyAlert,
    addAlert,
    clearAlertTimeout,
  }
})