<template>
  <div style="display: none" />
</template>

<script setup lang="ts">
import { onMounted, onUnmounted } from "vue";
import { useBuniChat } from "../composables/useBuniChat";
import type { BuniChatOptions } from "@buni.ai/chatbot-core";

interface Props {
  token?: string;
  config?: BuniChatOptions["config"];
  onReady?: BuniChatOptions["onReady"];
  onNewMessage?: BuniChatOptions["onNewMessage"];
  onVisibilityChanged?: BuniChatOptions["onVisibilityChanged"];
  onError?: BuniChatOptions["onError"];
}

const props = withDefaults(defineProps<Props>(), {
  token: "",
  config: () => ({}),
});

const { initialize, destroy } = useBuniChat();

onMounted(async () => {
  if (props.token) {
    await initialize({
      token: props.token,
      config: props.config,
      onReady: props.onReady,
      onNewMessage: props.onNewMessage,
      onVisibilityChanged: props.onVisibilityChanged,
      onError: props.onError,
    });
  }
});

onUnmounted(() => {
  destroy();
});
</script>
