chore(app): update sentry

Author: luke-h1

app.config.ts

@@ -157,6 +157,7 @@ const config: ExpoConfig = {
         note: 'Use SENTRY_AUTH_TOKEN env to authenticate with Sentry.',
         project: 'foam',
         organization: 'luke-howsam',
+        useNativeInit: true,
       },
     ],
     [

bun.lock

@@ -103,7 +103,7 @@
     "@react-navigation/native": "^7.1.26",
     "@react-navigation/native-stack": "^7.9.0",
     "@react-navigation/stack": "^7.6.13",
-    "@sentry/react-native": "~7.2.0",
+    "@sentry/react-native": "^8.7.0",
     "@shopify/flash-list": "2.0.2",
     "@svgr/core": "^8.1.0",
     "@svgr/plugin-jsx": "^8.1.0",

package.json

@@ -1,9 +1,12 @@
 /* eslint-disable no-restricted-imports */
+import * as Sentry from '@sentry/react-native';
 import { Image as ExpoImage, ImageProps as ExpoImageProps } from 'expo-image';
 import { View, ViewStyle, StyleProp } from 'react-native';
 import { NitroImage } from 'react-native-nitro-image';
 import { StyleSheet } from 'react-native-unistyles';
 
+Sentry.wrapExpoImage(ExpoImage);
+
 export interface ImageProps extends Omit<ExpoImageProps, 'source'> {
   containerStyle?: ViewStyle;
   /**

src/components/Image/Image.tsx

@@ -2,7 +2,7 @@ import { Button } from '@app/components/Button/Button';
 import { Icon } from '@app/components/Icon/Icon';
 import { PressableArea } from '@app/components/PressableArea/PressableArea';
 import { Text } from '@app/components/Text/Text';
-import { sentryService } from '@app/services/sentry-service';
+import { countMetric, sentryService } from '@app/services/sentry-service';
 import * as Haptics from 'expo-haptics';
 import { LinearGradient } from 'expo-linear-gradient';
 import {
@@ -945,18 +945,10 @@ export const StreamPlayer = forwardRef<StreamPlayerRef, StreamPlayerProps>(
             case 'ready': {
               const readyAt = Date.now();
               setReadyTimestamp(readyAt);
-              const streamReadyElapsedMs =
-                readyAt - overlayStartTimeRef.current;
-              sentryService.captureMessage('stream.ready', {
-                level: 'info',
-                tags: { component: 'StreamPlayer' },
-                extra: {
-                  channel: channel ?? undefined,
-                  stream_ready_elapsed_ms: streamReadyElapsedMs,
-                  stream_ready_elapsed_seconds: Math.round(
-                    streamReadyElapsedMs / 1000,
-                  ),
-                },
+              countMetric('stream.ready', {
+                autoplay,
+                component: 'StreamPlayer',
+                defer_overlay_until_user_unmute: deferOverlayUntilUserUnmute,
               });
               setPlayerState(prev => ({
                 ...prev,
@@ -1065,7 +1057,6 @@ export const StreamPlayer = forwardRef<StreamPlayerRef, StreamPlayerProps>(
         }
       },
       [
-        channel,
         autoplay,
         deferOverlayUntilUserUnmute,
         initialMuted,