From 7f918374f43379b20e729996029d8e0db40b543b Mon Sep 17 00:00:00 2001 From: dwindown Date: Mon, 22 Dec 2025 18:57:55 +0700 Subject: [PATCH] Replace SMTP configuration with Mailketing API MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Remove SMTP host/port/username/TLS configuration - Add Mailkening API token configuration - Update email provider dropdown (Mailketing only) - Update test email function to use Mailketing API - Update help text and validation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 --- .../admin/settings/NotifikasiTab.tsx | 197 +++++++++--------- 1 file changed, 96 insertions(+), 101 deletions(-) diff --git a/src/components/admin/settings/NotifikasiTab.tsx b/src/components/admin/settings/NotifikasiTab.tsx index 1891239..99a7893 100644 --- a/src/components/admin/settings/NotifikasiTab.tsx +++ b/src/components/admin/settings/NotifikasiTab.tsx @@ -9,18 +9,16 @@ import { Textarea } from '@/components/ui/textarea'; import { Alert, AlertDescription } from '@/components/ui/alert'; import { RichTextEditor } from '@/components/RichTextEditor'; import { toast } from '@/hooks/use-toast'; -import { Mail, AlertTriangle, Send, ChevronDown, ChevronUp, Webhook } from 'lucide-react'; +import { Mail, AlertTriangle, Send, ChevronDown, ChevronUp, Webhook, Key } from 'lucide-react'; import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible'; +import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; -interface SmtpSettings { +interface EmailProviderSettings { id?: string; - smtp_host: string; - smtp_port: number; - smtp_username: string; - smtp_password: string; - smtp_from_name: string; - smtp_from_email: string; - smtp_use_tls: boolean; + provider: 'mailketing'; + api_token: string; + from_name: string; + from_email: string; } interface NotificationTemplate { @@ -86,18 +84,15 @@ const DEFAULT_TEMPLATES: { key: string; name: string; defaultSubject: string; de }, ]; -const emptySmtp: SmtpSettings = { - smtp_host: '', - smtp_port: 587, - smtp_username: '', - smtp_password: '', - smtp_from_name: '', - smtp_from_email: '', - smtp_use_tls: true, +const emptyEmailSettings: EmailProviderSettings = { + provider: 'mailketing', + api_token: '', + from_name: '', + from_email: '', }; export function NotifikasiTab() { - const [smtp, setSmtp] = useState(emptySmtp); + const [emailSettings, setEmailSettings] = useState(emptyEmailSettings); const [templates, setTemplates] = useState([]); const [loading, setLoading] = useState(true); const [saving, setSaving] = useState(false); @@ -110,9 +105,9 @@ export function NotifikasiTab() { }, []); const fetchData = async () => { - // Fetch SMTP settings - const { data: smtpData } = await supabase.from('notification_settings').select('*').single(); - if (smtpData) setSmtp(smtpData); + // Fetch email provider settings + const { data: emailData } = await supabase.from('notification_settings').select('*').single(); + if (emailData) setEmailSettings(emailData); // Fetch templates const { data: templatesData } = await supabase.from('notification_templates').select('*').order('key'); @@ -138,44 +133,49 @@ export function NotifikasiTab() { if (!error && data) setTemplates(data); }; - const saveSmtp = async () => { + const saveEmailSettings = async () => { setSaving(true); - const payload = { ...smtp }; + const payload = { ...emailSettings }; delete payload.id; - if (smtp.id) { - const { error } = await supabase.from('notification_settings').update(payload).eq('id', smtp.id); + if (emailSettings.id) { + const { error } = await supabase.from('notification_settings').update(payload).eq('id', emailSettings.id); if (error) toast({ title: 'Error', description: error.message, variant: 'destructive' }); - else toast({ title: 'Berhasil', description: 'Pengaturan SMTP disimpan' }); + else toast({ title: 'Berhasil', description: 'Pengaturan email disimpan' }); } else { const { data, error } = await supabase.from('notification_settings').insert(payload).select().single(); if (error) toast({ title: 'Error', description: error.message, variant: 'destructive' }); - else { setSmtp(data); toast({ title: 'Berhasil', description: 'Pengaturan SMTP disimpan' }); } + else { setEmailSettings(data); toast({ title: 'Berhasil', description: 'Pengaturan email disimpan' }); } } setSaving(false); }; const sendTestEmail = async () => { if (!testEmail) return toast({ title: 'Error', description: 'Masukkan email tujuan', variant: 'destructive' }); - if (!isSmtpConfigured) return toast({ title: 'Error', description: 'Lengkapi konfigurasi SMTP terlebih dahulu', variant: 'destructive' }); - + if (!isEmailConfigured) return toast({ title: 'Error', description: 'Lengkapi konfigurasi email provider terlebih dahulu', variant: 'destructive' }); + setSendingTest(true); try { const { data, error } = await supabase.functions.invoke('send-email-v2', { body: { to: testEmail, - smtp_host: smtp.smtp_host, - smtp_port: smtp.smtp_port, - smtp_username: smtp.smtp_username, - smtp_password: smtp.smtp_password, - smtp_from_name: smtp.smtp_from_name, - smtp_from_email: smtp.smtp_from_email, - smtp_use_tls: smtp.smtp_use_tls, + api_token: emailSettings.api_token, + from_name: emailSettings.from_name, + from_email: emailSettings.from_email, + subject: 'Test Email dari Access Hub', + html_body: ` +

Test Email

+

Ini adalah email uji coba dari aplikasi Access Hub Anda.

+

Jika Anda menerima email ini, konfigurasi Mailketing API sudah berfungsi dengan baik!

+

Kirim ke: ${testEmail}

+
+

Best regards,
Access Hub Team

+ `, }, }); if (error) throw error; - + if (data?.success) { toast({ title: 'Berhasil', description: data.message }); } else { @@ -205,98 +205,92 @@ export function NotifikasiTab() { }); }; - const isSmtpConfigured = smtp.smtp_host && smtp.smtp_username && smtp.smtp_password; + const isEmailConfigured = emailSettings.api_token && emailSettings.from_email; if (loading) return
; return (
- {/* SMTP Settings */} + {/* Email Provider Settings */} - Pengaturan SMTP + Pengaturan Email Provider - Konfigurasi server email untuk pengiriman notifikasi + Konfigurasi provider email untuk pengiriman notifikasi - {!isSmtpConfigured && ( + {!isEmailConfigured && ( - Konfigurasi SMTP belum lengkap. Email tidak akan terkirim. + Konfigurasi email provider belum lengkap. Email tidak akan terkirim. )} -
+
- - setSmtp({ ...smtp, smtp_host: e.target.value })} - placeholder="smtp.example.com" - className="border-2" - /> + +
+
- - setSmtp({ ...smtp, smtp_port: parseInt(e.target.value) || 587 })} - className="border-2" - /> -
-
- - setSmtp({ ...smtp, smtp_username: e.target.value })} - className="border-2" - /> -
-
- + setSmtp({ ...smtp, smtp_password: e.target.value })} + value={emailSettings.api_token} + onChange={(e) => setEmailSettings({ ...emailSettings, api_token: e.target.value })} + placeholder="Masukkan API token dari Mailketing" className="border-2" /> +

+ Dapatkan API token dari menu Integration di dashboard Mailketing +

-
- - setSmtp({ ...smtp, smtp_from_name: e.target.value })} - placeholder="Nama Bisnis" - className="border-2" - /> -
-
- - setSmtp({ ...smtp, smtp_from_email: e.target.value })} - placeholder="noreply@example.com" - className="border-2" - /> -
-
-
- setSmtp({ ...smtp, smtp_use_tls: checked })} - /> - +
+
+ + setEmailSettings({ ...emailSettings, from_name: e.target.value })} + placeholder="Nama Bisnis" + className="border-2" + /> +
+
+ + setEmailSettings({ ...emailSettings, from_email: e.target.value })} + placeholder="info@domain.com" + className="border-2" + /> +

+ Pastikan email sudah terdaftar di Mailketing +

+
+
-
@@ -342,9 +336,10 @@ export function NotifikasiTab() {

- Penting: Toggle "Aktifkan" hanya mengontrol pengiriman email. - Jika webhook_url diisi, sistem tetap akan mengirim payload ke URL tersebut - meskipun email dinonaktifkan. + Penting: Email dikirim melalui Mailketing API. Pastikan API token valid + dan domain pengirim sudah terdaftar di Mailketing. Toggle "Aktifkan" hanya mengontrol + pengiriman email. Jika webhook_url diisi, sistem tetap akan mengirim payload + ke URL tersebut meskipun email dinonaktifkan.