<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount } from 'vue'
import queueNotifService from '@/services/QueueNotifService'
import notif from '@/utils/notif'

const newVersion = ref(false)

onMounted(() => {
  queueNotifService.subscribe((notification) => {
    if (notification.type === 'success') {
      notif.success(notification.message)
    } else if (notification.type === 'error') {
      notif.error(notification.message)
    }
  })
  queueNotifService.subscribeToNewVersion((hasNew: boolean) => {
    newVersion.value = hasNew
  })
})

onBeforeUnmount(() => {
  queueNotifService.unsubscribe()
})

const reloadApp = () => {
  location.reload()
}
</script>

<template>
  <a
    v-if="newVersion"
    href="#"
    class="queue-notif alert alert-info"
    @click.prevent="reloadApp"
  >
    nouvelle version disponible
  </a>
</template>
