import type { PropType } from 'vue';
import { computed, defineComponent, ref } from 'vue';

import type { IOperators } from '@model';
import { tools } from '@tools';


import axios from 'axios'
import { useMessageStore, useUserStore } from 'app/src/store';

export default defineComponent({
  name: 'ChatBot',
  props: {},
  setup(props) {
    const userMessage = ref<string>('');
    const messageStore = useMessageStore()
    const messages = ref<Array<{ sender: string; text: string }>>([]);

    const sendMessage = async () => {
      if (userMessage.value.trim()) {
        messages.value.push({ sender: 'user', text: userMessage.value });

        try {
          const response = await messageStore.chatBot({
            message: userMessage.value,
          })
          const botMessage = response[0]?.text || 'Non ho capito';
          messages.value.push({ sender: 'bot', text: botMessage });
        } catch (error) {
          console.error('Errore nella comunicazione con il backend', error);
          messages.value.push({ sender: 'bot', text: 'Errore di comunicazione' });
        }

        userMessage.value = '';
      }
    };

    return {
      tools,
      userMessage,
      messages,
      sendMessage,
    };
  },
});