api monitors

frontend/src/pages/Settings/Account.tsx

@@ -3,6 +3,7 @@ import PageMeta from '../../components/common/PageMeta';
 import { useToast } from '../../components/ui/toast/ToastContainer';
 import { fetchAPI } from '../../services/api';
 import { Card } from '../../components/ui/card';
+import ApiStatusMonitor from '../../components/debug/ApiStatusMonitor';
 
 export default function AccountSettings() {
   const toast = useToast();
@@ -42,6 +43,14 @@ export default function AccountSettings() {
           <p className="text-gray-600 dark:text-gray-400">Account settings management interface coming soon.</p>
         </Card>
       )}
+
+      {/* API Status Monitor - Only shows when debug toggle is enabled */}
+      <ApiStatusMonitor
+        title="System"
+        endpoints={[
+          { name: 'Get Account Settings', method: 'GET', endpoint: '/v1/system/settings/account/' },
+        ]}
+      />
     </div>
   );
 }