app/components/Layout/AlertBar/SwitchUser.vue

<!--
Switch user

Barre qui s'affiche lorsque l'utilisateur possède un compte multi user
-->

<template>
  <UiSystemBar v-if="show" class="theme-info">
    <v-icon small icon="fas fa-info-circle" />
    <span>
      {{ $t('multi_account_alert_part1') }} <strong>{{ fullName }}</strong> {{ $t('multi_account_alert_part2') }}
    </span>

    <v-icon class="pl-1" small icon="fa fa-users"/> &nbsp;{{$t('multi_account_alert_part3')}}
  </UiSystemBar>
</template>

<script setup lang="ts">
  import {useAccessProfileStore} from "~/stores/accessProfile";
  import {useMenu} from "~/composables/layout/useMenu";

  const accessProfile = useAccessProfileStore()
  const { hasMenu } = useMenu()

  const show = computed(() => hasMenu('MyFamily'))

  const fullName = `${accessProfile.givenName} ${accessProfile.name}`
</script>

<style scoped lang="scss">
.v-system-bar {
  font-size: 14px;
}

.v-icon {
  height: 20px;
  margin: 0 6px;
}
</style>