improved error logs for failure during thumbnail generation

src/services/upload/thumbnailService.ts

@@ -4,6 +4,8 @@ import { logError } from 'utils/sentry';
 import { BLACK_THUMBNAIL_BASE64 } from '../../../public/images/black-thumbnail-b64';
 import FFmpegService from 'services/ffmpegService';
 import { convertToHumanReadable } from 'utils/billingUtil';
+import { fileIsHEIC } from 'utils/file';
+import { FileTypeInfo } from './readFileService';
 
 const MAX_THUMBNAIL_DIMENSION = 720;
 const MIN_COMPRESSION_PERCENTAGE_SIZE_DIFF = 10;
@@ -21,15 +23,15 @@ interface Dimension {
 export async function generateThumbnail(
     worker,
     file: globalThis.File,
-    fileType: FILE_TYPE,
-    isHEIC: boolean
+    fileTypeInfo: FileTypeInfo
 ): Promise<{ thumbnail: Uint8Array; hasStaticThumbnail: boolean }> {
     try {
         let hasStaticThumbnail = false;
         let canvas = document.createElement('canvas');
         let thumbnail: Uint8Array;
         try {
-            if (fileType === FILE_TYPE.IMAGE) {
+            if (fileTypeInfo.fileType === FILE_TYPE.IMAGE) {
+                const isHEIC = fileIsHEIC(fileTypeInfo.exactType);
                 canvas = await generateImageThumbnail(worker, file, isHEIC);
             } else {
                 try {
@@ -38,9 +40,12 @@ export async function generateThumbnail(
                     canvas = await generateImageThumbnail(
                         worker,
                         dummyImageFile,
-                        isHEIC
+                        false
                     );
                 } catch (e) {
+                    logError(e, 'failed to generate thumbnail using ffmpeg', {
+                        type: fileTypeInfo.exactType,
+                    });
                     canvas = await generateVideoThumbnail(file);
                 }
             }
@@ -50,7 +55,9 @@ export async function generateThumbnail(
                 throw Error('EMPTY THUMBNAIL');
             }
         } catch (e) {
-            logError(e, 'uploading static thumbnail');
+            logError(e, 'uploading static thumbnail', {
+                type: fileTypeInfo.exactType,
+            });
             thumbnail = Uint8Array.from(atob(BLACK_THUMBNAIL_BASE64), (c) =>
                 c.charCodeAt(0)
             );
@@ -116,14 +123,7 @@ export async function generateImageThumbnail(
             }
         };
         timeout = setTimeout(
-            () =>
-                reject(
-                    Error(
-                        `wait time exceeded for format ${
-                            file.name.split('.').slice(-1)[0]
-                        }`
-                    )
-                ),
+            () => reject(Error(CustomError.WAIT_TIME_EXCEEDED)),
             WAIT_TIME_THUMBNAIL_GENERATION
         );
     });
@@ -176,14 +176,7 @@ export async function generateVideoThumbnail(file: globalThis.File) {
         video.preload = 'metadata';
         video.src = videoURL;
         timeout = setTimeout(
-            () =>
-                reject(
-                    Error(
-                        `wait time exceeded for format ${
-                            file.name.split('.').slice(-1)[0]
-                        }`
-                    )
-                ),
+            () => reject(Error(CustomError.WAIT_TIME_EXCEEDED)),
             WAIT_TIME_THUMBNAIL_GENERATION
         );
     });

src/services/upload/uploadService.ts

@@ -19,7 +19,6 @@ import { uploadStreamUsingMultipart } from './multiPartUploadService';
 import UIService from './uiService';
 import { handleUploadError } from 'utils/common/errorUtil';
 import { MetadataMap } from './uploadManager';
-import { fileIsHEIC } from 'utils/file';
 
 // this is the chunk size of the un-encrypted file which is read and encrypted before uploading it as a single part.
 export const MULTIPART_PART_SIZE = 20 * 1024 * 1024;
@@ -108,13 +107,10 @@ class UploadService {
         rawFile: globalThis.File,
         fileTypeInfo: FileTypeInfo
     ): Promise<FileInMemory> {
-        const isHEIC = fileIsHEIC(fileTypeInfo.exactType);
-
         const { thumbnail, hasStaticThumbnail } = await generateThumbnail(
             worker,
             rawFile,
-            fileTypeInfo.fileType,
-            isHEIC
+            fileTypeInfo
         );
 
         const filedata = await getFileData(worker, rawFile);

src/utils/common/errorUtil.ts

@@ -27,6 +27,7 @@ export enum CustomError {
     SIGNUP_FAILED = 'signup failed',
     FAV_COLLECTION_MISSING = 'favorite collection missing',
     INVALID_COLLECTION_OPERATION = 'invalid collection operation',
+    WAIT_TIME_EXCEEDED = 'thumbnail generation wait time exceeded',
 }
 
 function parseUploadError(error: AxiosResponse) {