first commit

frontend/src/api/hooks/useTraining.ts

@@ -0,0 +1,67 @@
+// frontend/dashboard/src/api/hooks/useTraining.ts
+/**
+ * Training-specific hooks
+ */
+
+import { useState, useEffect, useRef } from 'react';
+import { TrainingJobStatus, TrainingRequest } from '../../types/api';
+import { trainingApi } from '../index';
+import { useApi, useAsyncAction } from './useApi';
+
+export function useTraining() {
+  const { data: jobs, loading, error, refetch } = useApi(() => trainingApi.getTrainingJobs());
+  const { data: models, refetch: refetchModels } = useApi(() => trainingApi.getTrainedModels());
+  
+  const { execute: startTraining, loading: startingTraining } = useAsyncAction(
+    trainingApi.startTraining.bind(trainingApi)
+  );
+
+  return {
+    jobs: jobs || [],
+    models: models || [],
+    loading,
+    error,
+    startingTraining,
+    startTraining: async (request: TrainingRequest) => {
+      const job = await startTraining(request);
+      await refetch();
+      return job;
+    },
+    refresh: refetch,
+    refreshModels: refetchModels,
+  };
+}
+
+export function useTrainingProgress(jobId: string | null) {
+  const [progress, setProgress] = useState<TrainingJobStatus | null>(null);
+  const [error, setError] = useState<string | null>(null);
+  const wsRef = useRef<WebSocket | null>(null);
+
+  useEffect(() => {
+    if (!jobId) return;
+
+    // Initial status fetch
+    trainingApi.getTrainingStatus(jobId).then(setProgress).catch(setError);
+
+    // Set up WebSocket for real-time updates
+    wsRef.current = trainingApi.subscribeToTrainingProgress(
+      jobId,
+      (updatedProgress) => {
+        setProgress(updatedProgress);
+        setError(null);
+      },
+      (wsError) => {
+        setError(wsError.message);
+      }
+    );
+
+    return () => {
+      if (wsRef.current) {
+        wsRef.current.close();
+      }
+    };
+  }, [jobId]);
+
+  return { progress, error };
+}
+