import './bootstrap'; import Alpine from 'alpinejs'; import collapse from '@alpinejs/collapse'; Alpine.plugin(collapse); // Afia — Ladill Email's AI assistant (slide-over chat). Opened via the topbar AI button // which dispatches a window 'afia-open' event. Alpine.data('afia', (config = {}) => ({ open: false, input: '', loading: false, messages: [ { role: 'assistant', text: "Hi, I'm Afia 👋 Ask me anything about email — setting up a domain, verifying DNS, creating mailboxes, IMAP/SMTP settings or billing…" }, ], suggestions: [ 'How do I set up email for my domain?', 'What DNS records do I need to verify?', 'How do I create a mailbox?', 'What are my IMAP and SMTP settings?', ], init() { window.addEventListener('afia-open', () => { this.open = true; this.$nextTick(() => this.$refs.input && this.$refs.input.focus()); }); }, close() { this.open = false; }, useSuggestion(s) { this.input = s; this.send(); }, scrollDown() { this.$nextTick(() => { const el = this.$refs.scroll; if (el) el.scrollTop = el.scrollHeight; }); }, async send() { const text = this.input.trim(); if (!text || this.loading) return; const history = this.messages.map((m) => ({ role: m.role, text: m.text })); this.messages.push({ role: 'user', text }); this.input = ''; this.loading = true; this.scrollDown(); try { const res = await fetch(config.chatUrl, { method: 'POST', headers: { 'Content-Type': 'application/json', 'X-CSRF-TOKEN': config.csrf, 'Accept': 'application/json' }, body: JSON.stringify({ message: text, history }), }); const data = await res.json(); this.messages.push({ role: 'assistant', text: data.reply || data.message || 'Sorry, I could not respond.' }); } catch (e) { this.messages.push({ role: 'assistant', text: 'Network error — please try again.' }); } this.loading = false; this.scrollDown(); }, })); window.Alpine = Alpine; Alpine.start();