<script setup>
import { useSnackbarStore } from "@/store/SnackbarStore";
import { storeToRefs } from "pinia";

const store = useSnackbarStore();
const { isSnackbarVisible, snackbarOptions, message, icon } =
  storeToRefs(store);
</script>
<template>
  <VSnackbar
    v-model="isSnackbarVisible"
    v-bind="snackbarOptions"
    location="top end"
    transition="scroll-y-reverse-transition"
    closable
  >
    <div class="d-flex gap-2 align-center">
      <VIcon size="25" :icon="icon" />
      <div>
        {{ message }}
      </div>
    </div>
    <template #actions>
      <VBtn
        size="x-small"
        color="white"
        icon="mdi-close"
        @click="isSnackbarVisible = false"
      />
    </template>
  </VSnackbar>
</template>
