Catch crop cancelled errors (#9451)

src/lib/strings/errors.ts

@@ -52,3 +52,15 @@ export function isErrorMaybeAppPasswordPermissions(e: unknown) {
   const str = String(e)
   return str.includes('Bad token scope') || str.includes('Bad token method')
 }
+
+/**
+ * Intended to capture "User cancelled" or "Crop cancelled" errors
+ * that we often get from expo modules such expo-image-crop-tool
+ *
+ * The exact name has changed in the past so let's just see if the string
+ * contains "cancel"
+ */
+export function isCancelledError(e: unknown) {
+  const str = String(e).toLowerCase()
+  return str.includes('cancel')
+}

src/screens/Onboarding/StepProfile/index.tsx

@@ -15,6 +15,8 @@ import {openCropper} from '#/lib/media/picker'
 import {getDataUriSize} from '#/lib/media/util'
 import {useRequestNotificationsPermission} from '#/lib/notifications/notifications'
 import {logEvent, useGate} from '#/lib/statsig/statsig'
+import {isCancelledError} from '#/lib/strings/errors'
+import {logger} from '#/logger'
 import {isNative, isWeb} from '#/platform/detection'
 import {
   DescriptionText,
@@ -184,11 +186,17 @@ export function StepProfile() {
     if (!image) return
 
     if (!isWeb) {
+      try {
         image = await openCropper({
           imageUri: image.path,
           shape: 'circle',
           aspectRatio: 1 / 1,
         })
+      } catch (e) {
+        if (!isCancelledError(e)) {
+          logger.error('Failed to crop avatar in onboarding', {error: e})
+        }
+      }
     }
     image = await compressIfNeeded(image, 1000000)
 

src/state/gallery.ts

@@ -17,6 +17,7 @@ import {getImageDim} from '#/lib/media/manip'
 import {openCropper} from '#/lib/media/picker'
 import {type PickerImage} from '#/lib/media/picker.shared'
 import {getDataUriSize} from '#/lib/media/util'
+import {isCancelledError} from '#/lib/strings/errors'
 import {isNative} from '#/platform/detection'
 
 export type ImageTransformation = {
@@ -143,7 +144,7 @@ export async function cropImage(img: ComposerImage): Promise<ComposerImage> {
       },
     }
   } catch (e) {
-    if (e instanceof Error && e.message.includes('User cancelled')) {
+    if (!isCancelledError(e)) {
       return img
     }
 

src/view/com/util/UserAvatar.tsx

@@ -26,6 +26,7 @@ import {openCamera, openCropper, openPicker} from '#/lib/media/picker'
 import {type PickerImage} from '#/lib/media/picker.shared'
 import {makeProfileLink} from '#/lib/routes/links'
 import {sanitizeDisplayName} from '#/lib/strings/display-names'
+import {isCancelledError} from '#/lib/strings/errors'
 import {sanitizeHandle} from '#/lib/strings/handles'
 import {logger} from '#/logger'
 import {isAndroid, isNative, isWeb} from '#/platform/detection'
@@ -407,10 +408,10 @@ let EditableUserAvatar = ({
         setRawImage(await createComposerImage(item))
         editImageDialogControl.open()
       }
-    } catch (e: any) {
+    } catch (e) {
       // Don't log errors for cancelling selection to sentry on ios or android
-      if (!String(e).toLowerCase().includes('cancel')) {
+      if (!isCancelledError(e)) {
-        logger.error('Failed to crop banner', {error: e})
+        logger.error('Failed to crop avatar', {error: e})
       }
     }
   }, [

src/view/com/util/UserBanner.tsx

@@ -12,6 +12,7 @@ import {
 import {compressIfNeeded} from '#/lib/media/manip'
 import {openCamera, openCropper, openPicker} from '#/lib/media/picker'
 import {type PickerImage} from '#/lib/media/picker.shared'
+import {isCancelledError} from '#/lib/strings/errors'
 import {logger} from '#/logger'
 import {isAndroid, isNative} from '#/platform/detection'
 import {
@@ -87,8 +88,9 @@ export function UserBanner({
         setRawImage(await createComposerImage(items[0]))
         editImageDialogControl.open()
       }
-    } catch (e: any) {
+    } catch (e) {
-      if (!String(e).includes('Canceled')) {
+      // Don't log errors for cancelling selection to sentry on ios or android
+      if (!isCancelledError(e)) {
         logger.error('Failed to crop banner', {error: e})
       }
     }