a

frontend/src/api/assignments.ts

@@ -67,18 +67,27 @@ export const assignmentsApi = {
   completeBonusAssignment: async (
     assignmentId: number,
     bonusId: number,
-    data: { proof_file?: File; proof_url?: string; comment?: string }
+    data: { proof_file?: File; proof_files?: File[]; proof_url?: string; comment?: string }
   ): Promise<BonusCompleteResult> => {
     const formData = new FormData()
+
+    // Support both single file (legacy) and multiple files
     if (data.proof_file) {
       formData.append('proof_file', data.proof_file)
     }
+    if (data.proof_files && data.proof_files.length > 0) {
+      data.proof_files.forEach(file => {
+        formData.append('proof_files', file)
+      })
+    }
+
     if (data.proof_url) {
       formData.append('proof_url', data.proof_url)
     }
     if (data.comment) {
       formData.append('comment', data.comment)
     }
+
     const response = await client.post<BonusCompleteResult>(
       `/assignments/${assignmentId}/bonus/${bonusId}/complete`,
       formData,
@@ -103,4 +112,39 @@ export const assignmentsApi = {
       type: isVideo ? 'video' : 'image',
     }
   },
+
+  // Get individual proof file media as blob URL (for multiple proofs support)
+  getProofFileMediaUrl: async (
+    assignmentId: number,
+    proofFileId: number
+  ): Promise<{ url: string; type: 'image' | 'video' }> => {
+    const response = await client.get(
+      `/assignments/${assignmentId}/proof-files/${proofFileId}/media`,
+      { responseType: 'blob' }
+    )
+    const contentType = response.headers['content-type'] || ''
+    const isVideo = contentType.startsWith('video/')
+    return {
+      url: URL.createObjectURL(response.data),
+      type: isVideo ? 'video' : 'image',
+    }
+  },
+
+  // Get individual bonus proof file media as blob URL (for multiple proofs support)
+  getBonusProofFileMediaUrl: async (
+    assignmentId: number,
+    bonusId: number,
+    proofFileId: number
+  ): Promise<{ url: string; type: 'image' | 'video' }> => {
+    const response = await client.get(
+      `/assignments/${assignmentId}/bonus/${bonusId}/proof-files/${proofFileId}/media`,
+      { responseType: 'blob' }
+    )
+    const contentType = response.headers['content-type'] || ''
+    const isVideo = contentType.startsWith('video/')
+    return {
+      url: URL.createObjectURL(response.data),
+      type: isVideo ? 'video' : 'image',
+    }
+  },
 }

frontend/src/api/wheel.ts

@@ -14,12 +14,19 @@ export const wheelApi = {
 
   complete: async (
     assignmentId: number,
-    data: { proof_url?: string; comment?: string; proof_file?: File }
+    data: { proof_url?: string; comment?: string; proof_file?: File; proof_files?: File[] }
   ): Promise<CompleteResult> => {
     const formData = new FormData()
     if (data.proof_url) formData.append('proof_url', data.proof_url)
     if (data.comment) formData.append('comment', data.comment)
+
+    // Support both single file (legacy) and multiple files
     if (data.proof_file) formData.append('proof_file', data.proof_file)
+    if (data.proof_files && data.proof_files.length > 0) {
+      data.proof_files.forEach(file => {
+        formData.append('proof_files', file)
+      })
+    }
 
     const response = await client.post<CompleteResult>(`/assignments/${assignmentId}/complete`, formData, {
       headers: { 'Content-Type': 'multipart/form-data' },