Merge pull request #131 from ente-io/better-error-logging

Better error logging

src/components/SetPasswordForm.tsx

@@ -32,10 +32,7 @@ function SetPasswordForm(props: Props) {
                 setFieldError('confirm', constants.PASSPHRASE_MATCH_ERROR);
             }
         } catch (e) {
-            setFieldError(
-                'passphrase',
-                `${constants.UNKNOWN_ERROR} ${e.message}`
-            );
+            setFieldError('confirm', `${constants.UNKNOWN_ERROR} ${e.message}`);
         } finally {
             setLoading(false);
         }

src/components/SignUp.tsx

@@ -41,11 +41,16 @@ export default function SignUp(props: SignUpProps) {
         { setFieldError }: FormikHelpers<FormValues>
     ) => {
         setLoading(true);
+        try {
             try {
                 setData(LS_KEYS.USER, { email });
                 await getOtt(email);
             } catch (e) {
-            setFieldError('email', `${constants.UNKNOWN_ERROR} ${e.message}`);
+                setFieldError(
+                    'confirm',
+                    `${constants.UNKNOWN_ERROR} ${e.message}`
+                );
+                throw e;
             }
             try {
                 if (passphrase === confirm) {
@@ -68,8 +73,14 @@ export default function SignUp(props: SignUpProps) {
                     setFieldError('confirm', constants.PASSPHRASE_MATCH_ERROR);
                 }
             } catch (e) {
-            logError(e);
-            setFieldError('passphrase', constants.PASSWORD_GENERATION_FAILED);
+                setFieldError(
+                    'passphrase',
+                    constants.PASSWORD_GENERATION_FAILED
+                );
+                throw e;
+            }
+        } catch (err) {
+            logError(err, 'signup failed');
         }
         setLoading(false);
     };

src/pages/_app.tsx

@@ -472,7 +472,7 @@ export default function App({ Component, err }) {
         HTTPService.getInterceptors().response.use(
             (resp) => resp,
             (error) => {
-                logError(error);
+                logError(error, 'Network Error');
                 return Promise.reject(error);
             }
         );

src/pages/credentials/index.tsx

@@ -57,7 +57,7 @@ export default function Credentials() {
                     keyAttributes.memLimit
                 );
             } catch (e) {
-                console.error('failed to deriveKey ', e.message);
+                logError(e, 'failed to derive key');
                 throw e;
             }
             try {
@@ -78,7 +78,7 @@ export default function Credentials() {
 
                 router.push(PAGES.GALLERY);
             } catch (e) {
-                logError(e);
+                logError(e, 'user entered a wrong password');
                 setFieldError('passphrase', constants.INCORRECT_PASSPHRASE);
             }
         } catch (e) {
@@ -86,7 +86,6 @@ export default function Credentials() {
                 'passphrase',
                 `${constants.UNKNOWN_ERROR} ${e.message}`
             );
-            console.error('failed to verifyPassphrase ', e.message);
         }
     };
 

src/pages/recover/index.tsx

@@ -63,7 +63,7 @@ export default function Recover() {
             setData(LS_KEYS.SHOW_BACK_BUTTON, { value: false });
             router.push(PAGES.CHANGE_PASSWORD);
         } catch (e) {
-            logError(e);
+            logError(e, 'password recovery failed');
             setFieldError('passphrase', constants.INCORRECT_RECOVERY_KEY);
         }
     };

src/pages/two-factor/recover/index.tsx

@@ -65,7 +65,7 @@ export default function Recover() {
             });
             router.push(PAGES.CREDENTIALS);
         } catch (e) {
-            logError(e);
+            logError(e, 'two factor recovery failed');
             setFieldError('passphrase', constants.INCORRECT_RECOVERY_KEY);
         }
     };

src/services/billingService.ts

@@ -107,7 +107,7 @@ class billingService {
             const { subscription } = response.data;
             setData(LS_KEYS.SUBSCRIPTION, subscription);
         } catch (e) {
-            logError(e);
+            logError(e, 'subscription cancel failed');
             throw e;
         }
     }
@@ -125,7 +125,7 @@ class billingService {
             const { subscription } = response.data;
             setData(LS_KEYS.SUBSCRIPTION, subscription);
         } catch (e) {
-            logError(e);
+            logError(e, 'failed to activate subscription');
             throw e;
         }
     }

src/services/collectionService.ts

@@ -114,10 +114,9 @@ const getCollections = async (
                         key
                     );
                 } catch (e) {
-                    logError(
-                        e,
-                        `decryption failed for collection with id=${collection.id}`
-                    );
+                    logError(e, `decryption failed for collection`, {
+                        collectionID: collection.id,
+                    });
                 }
                 return collectionWithSecrets;
             }

src/services/exportService.ts

@@ -227,7 +227,7 @@ class ExportService {
             }
             return { paused: false };
         } catch (e) {
-            logError(e);
+            logError(e, 'export failed ');
         }
     }
     async addFilesQueuedRecord(folder: string, files: File[]) {

src/services/upload/metadataService.ts

@@ -111,7 +111,7 @@ export async function parseMetadataJSON(receivedFile: globalThis.File) {
         }
         return { title, parsedMetaDataJSON } as ParsedMetaDataJSONWithTitle;
     } catch (e) {
-        logError(e);
+        logError(e, 'parseMetadataJSON failed');
         // ignore
     }
 }

src/services/upload/thumbnailService.ts

@@ -1,5 +1,5 @@
 import { FILE_TYPE } from 'services/fileService';
-import { CustomError } from 'utils/common/errorUtil';
+import { CustomError, errorWithContext } from 'utils/common/errorUtil';
 import { convertHEIC2JPEG } from 'utils/file';
 import { logError } from 'utils/sentry';
 import { BLACK_THUMBNAIL_BASE64 } from '../../../public/images/black-thumbnail-b64';
@@ -85,13 +85,11 @@ export async function generateImageThumbnail(
                 clearTimeout(timeout);
                 resolve(null);
             } catch (e) {
-                reject(e);
-                logError(e);
-                reject(
-                    Error(
+                const err = errorWithContext(
+                    e,
                     `${CustomError.THUMBNAIL_GENERATION_FAILED} err: ${e}`
-                    )
                 );
+                reject(err);
             }
         };
         timeout = setTimeout(
@@ -142,7 +140,7 @@ export async function generateVideoThumbnail(file: globalThis.File) {
                 const err = Error(
                     `${CustomError.THUMBNAIL_GENERATION_FAILED} err: ${e}`
                 );
-                logError(err);
+                logError(e, CustomError.THUMBNAIL_GENERATION_FAILED);
                 reject(err);
             }
         });

src/services/upload/uploadHttpClient.ts

@@ -123,7 +123,7 @@ class UploadHttpClient {
                 );
                 if (!resp?.headers?.etag) {
                     const err = Error(CustomError.ETAG_MISSING);
-                    logError(err);
+                    logError(err, 'putFile in parts failed');
                     throw err;
                 }
                 return resp;

src/utils/billingUtil.ts

@@ -230,7 +230,7 @@ function handleFailureReason(
     setDialogMessage: SetDialogMessage,
     setLoading: SetLoading
 ): void {
-    logError(Error(`subscription purchase failed with reason- ${reason}`));
+    logError(Error(reason), 'subscription purchase failed');
     switch (reason) {
         case FAILURE_REASON.CANCELED:
             setDialogMessage({

src/utils/common/errorUtil.ts

@@ -24,6 +24,7 @@ export enum CustomError {
     STORAGE_QUOTA_EXCEEDED = 'storage quota exceeded',
     SESSION_EXPIRED_MESSAGE = 'session expired',
     TYPE_DETECTION_FAILED = 'type detection failed',
+    SIGNUP_FAILED = 'signup failed',
 }
 
 function parseUploadError(error: AxiosResponse) {
@@ -88,3 +89,12 @@ export function getUserFacingErrorMessage(
             return constants.UNKNOWN_ERROR;
     }
 }
+
+export function errorWithContext(originalError: Error, context: string) {
+    const errorWithContext = new Error(context);
+    errorWithContext.stack =
+        errorWithContext.stack.split('\n').slice(2, 4).join('\n') +
+        '\n' +
+        originalError.stack;
+    return errorWithContext;
+}

src/utils/sentry/index.ts

@@ -1,20 +1,17 @@
 import * as Sentry from '@sentry/nextjs';
+import { errorWithContext } from 'utils/common/errorUtil';
 import { getUserAnonymizedID } from 'utils/user';
 
 export const logError = (
     e: any,
-    msg?: string,
+    msg: string,
     info?: Record<string, unknown>
 ) => {
-    Sentry.captureException(e, {
+    const err = errorWithContext(e, msg);
+    Sentry.captureException(err, {
         level: Sentry.Severity.Info,
         user: { id: getUserAnonymizedID() },
         contexts: {
-            ...(msg && {
-                context: {
-                    message: msg,
-                },
-            }),
             ...(info && {
                 info: info,
             }),