<template>
  <div @click="redirect" class="link">
    <slot></slot>
  </div>
</template>

<script setup>
import {useRouter} from "vue-router";
import {DEFAULT_LOCALE, LOCALE_STORAGE_LOCALE_KEY} from "@/config/index.js";

const router = useRouter()

const props = defineProps({
  routeName: String
})

const redirect = () => {
  if (props.routeName) {
    router.push({
      name: props.routeName,
      params: {
        locale: localStorage.getItem(LOCALE_STORAGE_LOCALE_KEY) || DEFAULT_LOCALE
      }
    })
  }
}
</script>

<style lang="scss" scoped>
.link {
  width: fit-content;
  transition: 0.2s;
  cursor: pointer;
  color: $accent;
  font-size: 12px;
  font-weight: 500;
  
  @include hover {
    color: #5539ce;
  }
}
</style>