refactor: refactor report proff section

src/services/api/media.service.ts

@@ -1,10 +1,49 @@
 import axiosClient from '../axios/axios';
 
+const MIME_BY_EXTENSION: Record<string, string> = {
+  mp4: 'video/mp4',
+  webm: 'video/webm',
+  mov: 'video/quicktime',
+  m4v: 'video/mp4',
+  png: 'image/png',
+  jpg: 'image/jpeg',
+  jpeg: 'image/jpeg',
+  gif: 'image/gif',
+  webp: 'image/webp',
+};
+
+function normalizeMediaBlob(url: string, blob: Blob): Blob {
+  if (blob.type && blob.type !== 'application/octet-stream') {
+    return blob;
+  }
+
+  const extension = url.split('?')[0].split('.').pop()?.toLowerCase();
+  const mimeType = extension ? MIME_BY_EXTENSION[extension] : undefined;
+
+  if (!mimeType) {
+    return blob;
+  }
+
+  return new Blob([blob], { type: mimeType });
+}
+
 export const protectedMediaService = {
   getBlob: async (url: string): Promise<Blob> => {
     const response = await axiosClient.get<Blob>(url, {
       responseType: 'blob',
+      headers: {
+        Accept: '*/*',
+      },
+      transformRequest: [
+        (data, headers) => {
+          if (headers) {
+            delete headers['Content-Type'];
+          }
+          return data;
+        },
+      ],
     });
-    return response.data;
+
+    return normalizeMediaBlob(url, response.data);
   },
 };