Footer.vue

<template>
  <footer class="tw-p-2 tw-bg-gray-800 tw-text-white/50">
    <div class="tw-flex tw-gap-2">
      <div class="tw-flex tw-gap-2 tw-mr-auto">
        <span> aura/<b>dashboard</b> v{{ version }}</span>
        <template v-if="authStore.isSuperuser">
          <span>|</span>
          <router-link :to="{ name: 'settings' }">{{ t('navigation.settings') }}</router-link>
        </template>
        <span>|</span>
        <router-link :to="{ name: 'help' }">{{ t('help.title') }}</router-link>
        <span>|</span>
        <router-link :to="{ name: 'credits' }">Credits</router-link>
      </div>
      {{ t('footer.tagline') }}
    </div>
  </footer>
</template>

<script lang="ts" setup>
import { useI18n } from '@/i18n'
import { useAuthStore } from '@/stores/auth'

const version = import.meta.env.VUE_APP_VERSION
const { t } = useI18n()
const authStore = useAuthStore()
</script>