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

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'
import queueNotifService from '@/services/QueueNotifService'
import notif from '@/utils/notif'

@Component
export default class QueueNotif extends Vue {
  private newVersion = queueNotifService.getNewVersion

  private mounted() {
    queueNotifService.subscribe((notification) => {
      switch (notification.type) {
        case 'success':
          notif.success(notification.message)
          break
        case 'error':
          notif.error(notification.message)
          break
      }
    })
    queueNotifService.subscribeToNewVersion((newVersion: boolean) => {
      this.newVersion = newVersion
    })
  }

  private beforeDestroy() {
    queueNotifService.unsubscribe()
  }

  private reloadApp() {
    location.reload(true)
  }
}
</script>
