<script setup>
import { defineAsyncComponent } from 'vue';
import MelissaConfigPage from './MelissaConfigPage.vue';

const ConfiguracoesWhatsappChooserPage = defineAsyncComponent(
    () => import('@/layout/configuracoes/ConfiguracoesWhatsappChooserPage.vue')
);

const emit = defineEmits(['close']);

const faq = [
    { icon: 'pi pi-check-circle', label: 'Oficial',  text: 'AgenciaPSI envia em nome da plataforma — maior taxa de entrega.' },
    { icon: 'pi pi-mobile',       label: 'Pessoal',  text: 'Você envia do seu próprio número, sob sua reputação.' },
    { icon: 'pi pi-history',      label: 'Trocar',   text: 'Histórico das conversas anteriores é mantido ao alternar.' }
];
</script>

<template>
    <MelissaConfigPage
        title="Canal WhatsApp"
        icon="pi pi-whatsapp"
        subtitle="Escolha o canal de envio: oficial AgenciaPSI (pela plataforma) ou pessoal (seu próprio número)."
        faq-sub="Canal de envio"
        :faq="faq"
        @close="emit('close')"
    >
        <ConfiguracoesWhatsappChooserPage />
    </MelissaConfigPage>
</template>
