From 8743d37a7d5a17bf4c0eab85cf95c30f2443e0f5 Mon Sep 17 00:00:00 2001
From: Saghar Mohammadi <saghar.mohammadi010@gmail.com>
Date: Wed, 2 Sep 2026 14:19:51 +0430
Subject: [PATCH] fix: support onUploadProgress in useUploadMediaMutation

SessionFormPage now passes { formData, onUploadProgress } to mutateAsync
for progress tracking. Update uploadMediaMutationFn to destructure the
object and forward onUploadProgress to apiUploadMedia; update apiUploadMedia
to accept and pass the callback to axios.

[batch-1-hotfix]
---
 src/services/api/auth.js   |  9 +++++++--
 src/services/query/auth.js | 11 ++++++++++-
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/services/api/auth.js b/src/services/api/auth.js
index 66582f8..5690ffe 100644
--- a/src/services/api/auth.js
+++ b/src/services/api/auth.js
@@ -46,5 +46,10 @@ export const apiGetRegistrationQuestionVideo = () =>
 // Media uploads (especially course videos) can legitimately take several
 // minutes on slower connections. Keep the normal API timeout short, but give
 // this endpoint enough time to complete the backend's 300 MB upload contract.
-export const apiUploadMedia = (formData) =>
-  http.post(endpoints.uploadMedia, formData, { timeout: 10 * 60 * 1000 })
+// `onUploadProgress` is optional and forwarded straight to axios so callers
+// can render an upload progress bar (e.g. XHR progress events).
+export const apiUploadMedia = (formData, onUploadProgress) =>
+  http.post(endpoints.uploadMedia, formData, {
+    timeout: 10 * 60 * 1000,
+    ...(onUploadProgress ? { onUploadProgress } : {}),
+  })
diff --git a/src/services/query/auth.js b/src/services/query/auth.js
index c123830..67c0fae 100644
--- a/src/services/query/auth.js
+++ b/src/services/query/auth.js
@@ -79,7 +79,16 @@ export const useGetRegistrationVideoQuery = (options = {}) =>
     ...options,
   })
 
-export const useUploadMediaMutation = () => useMutation({ mutationFn: apiUploadMedia })
+// `mutateAsync` accepts either a raw FormData (existing call sites, no
+// progress tracking) or `{ formData, onUploadProgress }` for callers that
+// want to render upload progress (e.g. a video upload progress bar).
+const uploadMediaMutationFn = (variables) => {
+  if (variables instanceof FormData) return apiUploadMedia(variables)
+  const { formData, onUploadProgress } = variables
+  return apiUploadMedia(formData, onUploadProgress)
+}
+
+export const useUploadMediaMutation = () => useMutation({ mutationFn: uploadMediaMutationFn })
 
 // Register-data is a flat `{ field: value }` object; legacy responses were a
 // `[{ key, value }]` list. Normalize both into the object shape.