apiclient

frontend/src/settings/useCapabilities.ts

@@ -1,16 +1,12 @@
 import { useCallback, useEffect, useState } from 'react';
-
-interface CapabilitiesApi {
-  get: (path: string) => Promise<{ data: unknown }>; 
-}
+import { listCapabilities } from '../lib/apiClient';
 
 interface UseCapabilitiesOptions {
-  api: CapabilitiesApi;
   notifyApiError?: (error: unknown, fallbackMessage: string) => void;
   token?: string | null;
 }
 
-const useCapabilities = ({ api, notifyApiError, token }: UseCapabilitiesOptions) => {
+const useCapabilities = ({ notifyApiError, token }: UseCapabilitiesOptions) => {
   const [capabilities, setCapabilities] = useState<string[]>([]);
   const [capabilitiesLoading, setCapabilitiesLoading] = useState(false);
 
@@ -21,19 +17,15 @@ const useCapabilities = ({ api, notifyApiError, token }: UseCapabilitiesOptions)
     }
     setCapabilitiesLoading(true);
     try {
-      const { data } = await api.get('/capabilities');
-      if (Array.isArray(data)) {
-        setCapabilities(data as string[]);
-      } else {
-        setCapabilities([]);
-      }
+      const data = await listCapabilities();
+      setCapabilities(Array.isArray(data) ? data.map((item) => item.name) : []);
     } catch (error) {
       notifyApiError?.(error, 'Failed to load capabilities.');
       setCapabilities([]);
     } finally {
       setCapabilitiesLoading(false);
     }
-  }, [api, notifyApiError, token]);
+  }, [notifyApiError, token]);
 
   useEffect(() => {
     if (token) {

frontend/src/settings/useCapabilitySets.ts

@@ -1,4 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
+import { listCapabilitySets } from '../lib/apiClient';
 
 type Identifier = string | number;
 
@@ -51,14 +52,14 @@ const useCapabilitySets = ({ api, notifyApiError, setStatusMessage, token }: Use
     }
     setCapabilitySetsLoading(true);
     try {
-      const { data } = await api.get<CapabilitySet[]>('/capability-sets');
+      const data = await listCapabilitySets();
       applyCapabilitySets(Array.isArray(data) ? data : []);
     } catch (error) {
       notifyApiError?.(error, 'Failed to load capability sets.');
     } finally {
       setCapabilitySetsLoading(false);
     }
-  }, [api, applyCapabilitySets, notifyApiError, token]);
+  }, [applyCapabilitySets, notifyApiError, token]);
 
   useEffect(() => {
     if (token) {