import { ref } from 'vue';
import { RenderMessage, Annotation } from "@/types/message/index";

const messages = ref(new Map());

const messagesKey = "CRIMATA_MESSAGES";

const messagesString = window.localStorage.getItem(messagesKey);

if (messagesString) {
  // parse stored messages.
  const parsed = JSON.parse(messagesString);
  // set messages.
  messages.value = new Map(Object.entries(parsed));
}

export default function useMessages() {

    // Add new message and update previous message if nessesary.
    const addMessage = (m: RenderMessage) => {
      console.log(`Adding message: ${m.content.text}`)
      messages.value.set(m.uid, m);
    }

    const updateMessage = (a: Annotation) => {
        console.log("Updating message...")

        const m = messages.value.get(a.uid)
        m.context = a.context
        m.text = a.text

        return m
    }

    const saveMessages = () => {
        // de-reactivate message data before saving.
        const messageData = Object.fromEntries(messages.value);
        window.localStorage.setItem(messagesKey, JSON.stringify(messageData));
    }

    return {
      messages,
      saveMessages,
      addMessage,
      updateMessage
    }
}