Implement job metadata extraction and task management features. Add validation for frame range limits, enhance job and task data structures, and introduce new API endpoints for metadata and task retrieval. Update client-side components to handle metadata extraction and display task statuses. Improve error handling in API responses.

web/src/utils/api.js

@@ -4,7 +4,9 @@ export const api = {
   async get(endpoint) {
     const response = await fetch(`${API_BASE}${endpoint}`);
     if (!response.ok) {
-      throw new Error(`API error: ${response.statusText}`);
+      const errorData = await response.json().catch(() => null);
+      const errorMessage = errorData?.error || response.statusText;
+      throw new Error(errorMessage);
     }
     return response.json();
   },
@@ -16,7 +18,9 @@ export const api = {
       body: JSON.stringify(data),
     });
     if (!response.ok) {
-      throw new Error(`API error: ${response.statusText}`);
+      const errorData = await response.json().catch(() => null);
+      const errorMessage = errorData?.error || response.statusText;
+      throw new Error(errorMessage);
     }
     return response.json();
   },
@@ -26,7 +30,9 @@ export const api = {
       method: 'DELETE',
     });
     if (!response.ok) {
-      throw new Error(`API error: ${response.statusText}`);
+      const errorData = await response.json().catch(() => null);
+      const errorMessage = errorData?.error || response.statusText;
+      throw new Error(errorMessage);
     }
     return response.json();
   },
@@ -39,7 +45,9 @@ export const api = {
       body: formData,
     });
     if (!response.ok) {
-      throw new Error(`API error: ${response.statusText}`);
+      const errorData = await response.json().catch(() => null);
+      const errorMessage = errorData?.error || response.statusText;
+      throw new Error(errorMessage);
     }
     return response.json();
   },
@@ -112,6 +120,14 @@ export const jobs = {
   async retryTask(jobId, taskId) {
     return api.post(`/jobs/${jobId}/tasks/${taskId}/retry`);
   },
+
+  async getMetadata(jobId) {
+    return api.get(`/jobs/${jobId}/metadata`);
+  },
+
+  async getTasks(jobId) {
+    return api.get(`/jobs/${jobId}/tasks`);
+  },
 };
 
 export const runners = {