import { h } from 'vue';
import { ElNotification} from "element-plus";
import { IconClose } from "element-plus"
import Content from '@/components/Consultation/components/content.vue';
import Footer from '@/components/Consultation/components/footer.vue';
import { formatShowNameFin } from '@/components/Consultation/utils/format-show-name';

export default function handleCallingNotification(propsObj) {
  const { callInfo, text } = propsObj;
  const { calling, answer = 'answer', hangUp = 'hang up' } = text;
  ElNotification.info({
    id: callInfo.call_id,
    position: 'bottom-left',
    closable: true,
    closeIconElement: () => {
      return h(IconClose);
    },
    title: () =>h(Content, {
      callInfo,
      calling,
      getName: formatShowNameFin( callInfo.caller_alias, callInfo.caller_number),
    }),
    message: () =>h(Footer, { callInfo, answer, hangUp }),
    duration: 0,
    style: { width: '260px' },
  });
}