@blario/react-native 0.1.6 → 0.1.7

package/src/blar.ts

@@ -1,6 +1,7 @@
 import type { BackendTransport } from './backend/backend-transport.ts';
 import type { BlarIdentity } from './backend/identity.ts';
 import type { MessageMetadata } from './backend/message-metadata.ts';
+import { attempt } from './telemetry/contain.ts';
 
 export interface MessageMetadataOptions {
   includeTextDom: boolean;
@@ -49,19 +50,19 @@ class BlarClient {
   }
 
   open(): void {
-    this.chat?.open();
+    attempt('Blar.open', () => this.chat?.open());
   }
 
   close(): void {
-    this.chat?.close();
+    attempt('Blar.close', () => this.chat?.close());
   }
 
   getUnreadCount(): number {
-    return this.chat?.getUnread() ?? 0;
+    return attempt('Blar.getUnreadCount', () => this.chat?.getUnread()) ?? 0;
   }
 
   isChatOpen(): boolean {
-    return this.chat?.isOpen() ?? false;
+    return attempt('Blar.isChatOpen', () => this.chat?.isOpen()) ?? false;
   }
 
   async setUser(identity: BlarIdentity): Promise<void> {
@@ -81,15 +82,15 @@ class BlarClient {
   }
 
   isConnected(): boolean {
-    return this.transport?.isConnected() ?? false;
+    return attempt('Blar.isConnected', () => this.transport?.isConnected()) ?? false;
   }
 
   getTabId(): string | null {
-    return this.transport?.getTabId() ?? null;
+    return attempt('Blar.getTabId', () => this.transport?.getTabId()) ?? null;
   }
 
   getSessionState(): ReturnType<BackendTransport['getState']> | null {
-    return this.transport?.getState() ?? null;
+    return attempt('Blar.getSessionState', () => this.transport?.getState()) ?? null;
   }
 
   getMessageMetadata(options: MessageMetadataOptions = { includeTextDom: false }): Promise<MessageMetadata | null> {

package/src/chat/ChatSheet.tsx

@@ -1,9 +1,10 @@
 import React, { useEffect, useRef } from 'react';
-import { Animated, BackHandler, Dimensions, Easing, Keyboard, Platform, Pressable, StyleSheet, View } from 'react-native';
+import { Animated, BackHandler, Dimensions, Easing, Keyboard, type KeyboardEvent, Platform, Pressable, StyleSheet, View } from 'react-native';
 
 import { useInsets } from '../ui/useInsets.ts';
 import type { UiStrings } from '../ui/strings.ts';
 import type { SheetMode } from './chat-state.ts';
+import { attempt, contain } from '../telemetry/contain.ts';
 
 export interface ChatSheetProps {
   mode: SheetMode;
@@ -26,7 +27,7 @@ function useKeyboardInset(active: boolean, homeIndicator: number): Animated.Valu
       inset.setValue(0);
       return undefined;
     }
-    const subscription = Keyboard.addListener('keyboardWillChangeFrame', (event) => {
+    const subscription = Keyboard.addListener('keyboardWillChangeFrame', contain('ChatSheet.keyboard', (event: KeyboardEvent) => {
       const covered = Dimensions.get('window').height - event.endCoordinates.screenY;
       Animated.timing(inset, {
         // The keyboard covers the home-indicator inset, so the sheet's bottom padding sits under it, not above it.
@@ -35,7 +36,7 @@ function useKeyboardInset(active: boolean, homeIndicator: number): Animated.Valu
         easing: Easing.out(Easing.cubic),
         useNativeDriver: false,
       }).start();
-    });
+    }));
     return () => subscription.remove();
   }, [active, homeIndicator, inset]);
   return inset;
@@ -58,7 +59,7 @@ export function ChatSheet({ mode, mounted, strings, onClose, children }: ChatShe
       return undefined;
     }
     const subscription = BackHandler.addEventListener('hardwareBackPress', () => {
-      onClose();
+      attempt('ChatSheet.back', onClose);
       return true;
     });
     return () => subscription.remove();
@@ -72,7 +73,7 @@ export function ChatSheet({ mode, mounted, strings, onClose, children }: ChatShe
   return (
     <View style={StyleSheet.absoluteFill} pointerEvents={isOpen ? 'auto' : 'none'}>
       <Animated.View style={[styles.backdrop, { opacity: backdropOpacity }]}>
-        <Pressable accessibilityLabel={strings.chatClose} style={StyleSheet.absoluteFill} onPress={onClose} />
+        <Pressable accessibilityLabel={strings.chatClose} style={StyleSheet.absoluteFill} onPress={contain('ChatSheet.backdrop', onClose)} />
       </Animated.View>
       <Animated.View style={[styles.container, { paddingTop: insets.top + TOP_GAP, paddingBottom: keyboardInset }]} pointerEvents="box-none">
         <Animated.View

package/src/chat/ChatView.tsx

@@ -10,6 +10,7 @@ import type { SessionRequest } from './chat-coordinator.ts';
 import { type ChatNavigation, leavesChat } from './navigation.ts';
 import { buildWidgetShell, type WidgetShellOptions } from './widget-shell.ts';
 import { loadWebView, type WebViewHandle } from './webview.ts';
+import { attempt, contain } from '../telemetry/contain.ts';
 
 export interface ChatViewProps {
   shell: WidgetShellOptions;
@@ -58,7 +59,7 @@ export function ChatView({ shell, unavailableText, getMetadata, getProof, onClos
   );
 
   const onMessage = useCallback(
-    (event: WebViewMessageEvent) => {
+    contain('ChatView.message', (event: WebViewMessageEvent) => {
       const message = parsePageMessage(event.nativeEvent.data);
       if (message === null) {
         return;
@@ -74,18 +75,19 @@ export function ChatView({ shell, unavailableText, getMetadata, getProof, onClos
       } else {
         log?.('webview ready');
       }
-    },
+    }),
     [handleCall, log, onClosed, onSessionChanged],
   );
 
   const onNavigation = useCallback(
-    (navigation: ChatNavigation) => {
-      if (!leavesChat(navigation, shell.apiBaseUrl)) {
-        return true;
-      }
-      Linking.openURL(navigation.url).catch(() => log?.('chat link could not be opened'));
-      return false;
-    },
+    (navigation: ChatNavigation) =>
+      attempt('ChatView.navigation', () => {
+        if (!leavesChat(navigation, shell.apiBaseUrl)) {
+          return true;
+        }
+        Linking.openURL(navigation.url).catch(() => log?.('chat link could not be opened'));
+        return false;
+      }) ?? false,
     [log, shell.apiBaseUrl],
   );
 

package/src/chat/Launcher.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { Pressable, StyleSheet, Text, View } from 'react-native';
 
 import { useInsets } from '../ui/useInsets.ts';
+import { contain } from '../telemetry/contain.ts';
 
 export interface LauncherPlacement {
   side: 'left' | 'right';
@@ -26,7 +27,7 @@ export function Launcher({ unread, label, color, placement, onPress }: LauncherP
     <Pressable
       accessibilityRole="button"
       accessibilityLabel={label}
-      onPress={onPress}
+      onPress={contain('Launcher.press', onPress)}
       style={[styles.button, horizontal, { bottom: insets.bottom + placement.offsetY, backgroundColor: color }]}
     >
       <View style={styles.bubble}>