<script setup lang="ts">
import { useRouteLookups } from "@/utils/route";
import { useTranslation } from "i18next-vue";
const { isInCourse } = useRouteLookups();

const { t } = useTranslation();
</script>

<template>
  <div class="flex flex-shrink-0 items-center">
    <template v-if="isInCourse">
      <div class="flex h-full items-center border-r border-slate-500">
        <router-link to="/" class="flex items-center pr-3">
          <it-icon-arrow-left class="fill-current text-slate-500" />
          <span class="hidden text-slate-500 lg:inline">
            {{ t("a.Dashboard") }}
          </span>
        </router-link>
      </div>
    </template>
    <template v-else>
      <router-link to="/" class="flex">
        <it-icon-vbv class="-ml-3 -mt-6 mr-3 h-8 w-16" />
      </router-link>
      <router-link to="/" class="flex">
        <div class="ml-1 border-l border-white pl-3 pr-10 text-2xl text-white">
          {{ t("general.title") }}
        </div>
      </router-link>
    </template>
  </div>
</template>
