app/components/Layout/AlertBar/OnlineRegistration.vue

<!--
Barre d'alerte sur l'ouverture ou non de l'inscription en ligne

-->

<template>
  <UiSystemBar
    v-if="show"
    :text="$t(message)"
    icon="fas fa-id-card"
    class="theme-secondary-alt"
  />
</template>

<script setup lang="ts">
import type { ComputedRef } from 'vue'
import { useEntityFetch } from '~/composables/data/useEntityFetch'
import { useAccessProfileStore } from '~/stores/accessProfile'
import RegistrationAvailability from '~/models/OnlineRegistration/RegistrationAvailability'

const { fetch } = useEntityFetch()

const accessProfile = useAccessProfileStore()

const { data: registrationAvailability, pending } = fetch(
  RegistrationAvailability,
  accessProfile.id ?? 0,
)

const show: ComputedRef<boolean> = computed(() => {
  return (
    !pending &&
    (registrationAvailability.value as RegistrationAvailability).available
  )
})

const message: ComputedRef<string> = computed(() => {
  return (registrationAvailability.value as RegistrationAvailability).message
})
</script>

<style scoped lang="scss"></style>