Changes

src/components/admin/settings/NotifikasiTab.tsx

@@ -103,6 +103,7 @@ export function NotifikasiTab() {
   const [saving, setSaving] = useState(false);
   const [testEmail, setTestEmail] = useState('');
   const [expandedTemplates, setExpandedTemplates] = useState<Set<string>>(new Set());
+  const [sendingTest, setSendingTest] = useState(false);
 
   useEffect(() => {
     fetchData();
@@ -156,8 +157,36 @@ export function NotifikasiTab() {
 
   const sendTestEmail = async () => {
     if (!testEmail) return toast({ title: 'Error', description: 'Masukkan email tujuan', variant: 'destructive' });
-    console.log('Test email would be sent to:', testEmail, 'with SMTP config:', smtp);
-    toast({ title: 'Info', description: `Email uji coba akan dikirim ke ${testEmail} (fitur sedang dikembangkan)` });
+    if (!isSmtpConfigured) return toast({ title: 'Error', description: 'Lengkapi konfigurasi SMTP terlebih dahulu', variant: 'destructive' });
+    
+    setSendingTest(true);
+    try {
+      const { data, error } = await supabase.functions.invoke('send-test-email', {
+        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,
+        },
+      });
+
+      if (error) throw error;
+      
+      if (data?.success) {
+        toast({ title: 'Berhasil', description: data.message });
+      } else {
+        throw new Error(data?.message || 'Failed to send test email');
+      }
+    } catch (error: any) {
+      console.error('Test email error:', error);
+      toast({ title: 'Error', description: error.message || 'Gagal mengirim email uji coba', variant: 'destructive' });
+    } finally {
+      setSendingTest(false);
+    }
   };
 
   const updateTemplate = async (template: NotificationTemplate) => {
@@ -278,9 +307,9 @@ export function NotifikasiTab() {
                 placeholder="Email uji coba"
                 className="border-2 max-w-xs"
               />
-              <Button variant="outline" onClick={sendTestEmail} className="border-2">
+              <Button variant="outline" onClick={sendTestEmail} className="border-2" disabled={sendingTest}>
                 <Send className="w-4 h-4 mr-2" />
-                Kirim Email Uji Coba
+                {sendingTest ? 'Mengirim...' : 'Kirim Email Uji Coba'}
               </Button>
             </div>
           </div>