Replace window.confirm() with themed ConfirmModal across dashboard

frontend/src/components/KnowledgeBaseModal.js

@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { X, Loader, AlertCircle, CheckCircle, Upload as UploadIcon, Download, FileText, Trash2 } from 'lucide-react';
+import ConfirmModal from './ConfirmModal';
 
 const API_BASE = process.env.REACT_APP_API_BASE || 'http://localhost:3001/api';
 
@@ -12,7 +13,7 @@ export default function KnowledgeBaseModal({ onClose, onUpdate }) {
   const [result, setResult] = useState(null);
   const [existingArticles, setExistingArticles] = useState([]);
   const [error, setError] = useState('');
-
+  const [pendingConfirm, setPendingConfirm] = useState(null);
   // Fetch existing articles on mount
   useEffect(() => {
     fetchExistingArticles();
@@ -117,27 +118,31 @@ export default function KnowledgeBaseModal({ onClose, onUpdate }) {
   };
 
   const handleDelete = async (id, articleTitle) => {
-    if (!window.confirm(`Are you sure you want to delete "${articleTitle}"?`)) {
-      return;
-    }
+    setPendingConfirm({
+      title: 'Delete Article',
+      message: `Are you sure you want to delete "${articleTitle}"?`,
+      confirmText: 'Delete',
+      onConfirm: async () => {
+        setPendingConfirm(null);
+        try {
+          const response = await fetch(`${API_BASE}/knowledge-base/${id}`, {
+            method: 'DELETE',
+            credentials: 'include'
+          });
 
-    try {
-      const response = await fetch(`${API_BASE}/knowledge-base/${id}`, {
-        method: 'DELETE',
-        credentials: 'include'
-      });
+          if (!response.ok) throw new Error('Delete failed');
 
-      if (!response.ok) throw new Error('Delete failed');
+          // Refresh the list
+          await fetchExistingArticles();
 
-      // Refresh the list
-      await fetchExistingArticles();
-
-      // Notify parent to refresh
-      if (onUpdate) onUpdate();
-    } catch (err) {
-      console.error('Error deleting article:', err);
-      setError('Failed to delete article');
-    }
+          // Notify parent to refresh
+          if (onUpdate) onUpdate();
+        } catch (err) {
+          console.error('Error deleting article:', err);
+          setError('Failed to delete article');
+        }
+      },
+    });
   };
 
   const resetForm = () => {
@@ -379,6 +384,17 @@ export default function KnowledgeBaseModal({ onClose, onUpdate }) {
           )}
         </div>
       </div>
+
+      {/* Confirmation Modal */}
+      <ConfirmModal
+        open={!!pendingConfirm}
+        title={pendingConfirm?.title}
+        message={pendingConfirm?.message}
+        confirmText={pendingConfirm?.confirmText}
+        variant="danger"
+        onConfirm={pendingConfirm?.onConfirm}
+        onCancel={() => setPendingConfirm(null)}
+      />
     </div>
   );
 }