feat: add account deletion functionality with double confirmation, API call, loading state, and automatic sign-out to the PrivacyForm.

src/components/settings/PrivacyForm.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useState, useEffect, useCallback } from 'react';
-import { useSession } from 'next-auth/react';
+import { useSession, signOut } from 'next-auth/react';
 import api from '@/services/api';
 
 interface PrivacySetting {
@@ -71,6 +71,7 @@ export function PrivacyForm({ onSave, onDeleteAccount }: PrivacyFormProps) {
   const { data: session } = useSession();
   const [isLoading, setIsLoading] = useState(true);
   const [isSaving, setIsSaving] = useState(false);
+  const [isDeleting, setIsDeleting] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [success, setSuccess] = useState<string | null>(null);
 
@@ -165,13 +166,36 @@ export function PrivacyForm({ onSave, onDeleteAccount }: PrivacyFormProps) {
     }
   };
 
-  const handleDeleteAccount = () => {
+  const handleDeleteAccount = async () => {
-    if (confirm('Are you sure you want to delete your account? This action cannot be undone.')) {
+    if (!confirm('Are you sure you want to delete your account? This action cannot be undone.')) {
+      return;
+    }
+
+    // Double confirmation for safety
+    if (!confirm('This will permanently delete all your data. Are you absolutely sure?')) {
+      return;
+    }
+
+    setIsDeleting(true);
+    setError(null);
+
+    try {
+      const role = (session?.user as any)?.role;
+      const endpoint = role === 'AGENT' ? '/agents/account' : '/users/account';
+
+      await api.delete(endpoint);
+
+      // Call the optional callback
       if (onDeleteAccount) {
         onDeleteAccount();
-      } else {
-        console.log('Deleting account');
       }
+
+      // Sign out and redirect to home page
+      await signOut({ callbackUrl: '/' });
+    } catch (err: unknown) {
+      const error = err as { response?: { data?: { message?: string } } };
+      setError(error.response?.data?.message || 'Failed to delete account. Please try again.');
+      setIsDeleting(false);
     }
   };
 
@@ -344,9 +368,10 @@ export function PrivacyForm({ onSave, onDeleteAccount }: PrivacyFormProps) {
           </div>
           <button
             onClick={handleDeleteAccount}
-            className="px-6 py-2 border border-red-500 text-red-500 rounded-[15px] font-serif text-[12px] hover:bg-red-50 transition-colors"
+            disabled={isDeleting}
+            className="px-6 py-2 border border-red-500 text-red-500 rounded-[15px] font-serif text-[12px] hover:bg-red-50 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
           >
-            Delete Account
+            {isDeleting ? 'Deleting...' : 'Delete Account'}
           </button>
         </div>
       </div>