import { computed } from 'vue';
import { useStore } from '@/store';
import { MessageDispatcher } from '@/store/dispatchers';
import { useRouter } from 'vue-router';
import router from '@/router';

export const useMessage = () => {
  const store = useStore();
  const route = useRouter();

  const messageList = computed(() => store.state.message.messageList);

  const handleMessageChange = (messageIndex: number) => {
    MessageDispatcher.clickMessage(messageIndex);
    router.push(messageList.value[messageIndex].linkTo);
  };

  return {
    messageList,
    handleMessageChange,
  };
};