app/components/Layout/AlertBar/SuperAdmin.vue

<!--
Super Admin bar

Barre d'alerte qui s'affiche lorsque l'utilisateur est un super admin en mode switch
-->

<template>
  <!-- TODO : fonctionnement à valider -->
  <UiSystemBar v-if="show" color="ot-danger">
    <template #bar.text>
      <v-icon small>
        fas fa-exclamation-triangle
      </v-icon>

      <span>{{ $t('super_admin_switch_account') }}</span>

      <a v-if="url" :href="url" class="text-ot-black text-decoration-none">
        <strong>{{ $t('click_here') }}</strong>
      </a>
    </template>
  </UiSystemBar>
</template>

<script setup lang="ts">
  import {useAccessProfileStore} from "~/stores/accessProfile";
  import Url from "~/services/utils/url";
  import {ComputedRef} from "@vue/reactivity";

  const runtimeConfig = useRuntimeConfig()

  const baseLegacyUrl: string = runtimeConfig.baseUrlAdminLegacy

  const accessProfile = useAccessProfileStore()

  const show: ComputedRef<boolean> = computed(() =>
      accessProfile.originalAccess !== null && accessProfile.originalAccess.isSuperAdminAccess
  )

  const url: ComputedRef<string> = computed(() => {
    const orgId = accessProfile.originalAccess ? accessProfile.originalAccess.organization.id : null
    const originalAccessId = accessProfile.originalAccess ? accessProfile.originalAccess.id : null

    if (show && orgId && originalAccessId) {
      return Url.join(baseLegacyUrl, 'switch_user', orgId, originalAccessId, 'exit')
    }
    return ''
  })
</script>

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

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