@bbearai/react-native 0.3.8 → 0.3.10

package/README.md

@@ -34,6 +34,7 @@ function App() {
         getCurrentUser: async () => ({
           id: user.id,
           email: user.email,
+          name: user.name, // Optional, shown on reports
         }),
       }}
     >
@@ -44,6 +45,138 @@ function App() {
 }
 ```
 
+## Configuration Options
+
+```tsx
+<BugBearProvider
+  config={{
+    // Required
+    projectId: 'your-project-id',
+    getCurrentUser: async () => ({ id: user.id, email: user.email }),
+
+    // Optional — rich context for bug reports
+    getAppContext: () => ({
+      currentRoute: currentScreenName,           // Current screen name
+      userRole: currentUser?.role,                // 'owner', 'manager', 'guest', etc.
+      propertyId: selectedProperty?.id,           // App-specific context
+      custom: { theme: 'dark' },                 // Any additional data
+    }),
+
+    // Optional — callbacks
+    dashboardUrl: 'https://app.bugbear.ai',              // Web dashboard link in widget
+    onNavigate: (route) => navigation.navigate(route),   // Deep link handler for test cases
+    onReportSubmitted: (report) => { ... },               // After report submission
+    getNavigationHistory: () => [...recentScreens],       // Custom nav tracking
+
+    // Optional — self-hosted
+    supabaseUrl: '...',
+    supabaseAnonKey: '...',
+  }}
+  enabled={isAuthReady} // Delay init until auth is ready (default: true)
+>
+```
+
+### Why use `getAppContext`?
+
+When a tester reports a bug, BugBear attaches the app context to the report. This tells the developer fixing the bug:
+- **Which screen** the bug is on
+- **What role** the user has (critical for role-dependent bugs)
+- **App-specific state** like selected property, active filters, etc.
+
+The bug report form also includes a **"Which screen?"** field so testers can specify the affected screen manually.
+
+## Automatic Context Capture
+
+BugBearProvider automatically captures debugging context with zero configuration:
+
+| Data | Details |
+|------|---------|
+| **Console logs** | Last 50 `console.log/warn/error/info` calls |
+| **Network requests** | Last 20 `fetch()` calls with method, URL, status, duration |
+| **Failed response bodies** | First 500 chars of 4xx/5xx response bodies |
+| **Performance** | Page load time, memory usage |
+| **Environment** | Language, timezone, online status |
+
+This data is attached to every bug report and available to the MCP server's `get_report_context` tool for AI-assisted debugging.
+
+> **Note:** For React Native, navigation history is not auto-captured (no `pushState`). Use `getNavigationHistory` or React Navigation integration below for screen tracking.
+
+## Navigation Tracking
+
+### React Navigation integration
+
+```tsx
+import { useNavigationContainerRef } from '@react-navigation/native';
+
+function App() {
+  const navigationRef = useNavigationContainerRef();
+  const routeHistory = useRef<string[]>([]);
+
+  return (
+    <BugBearProvider
+      config={{
+        projectId: 'your-project-id',
+        getCurrentUser: async () => ({ id: user.id, email: user.email }),
+        getNavigationHistory: () => routeHistory.current,
+        getAppContext: () => ({
+          currentRoute: navigationRef.getCurrentRoute()?.name || 'unknown',
+          userRole: currentUser?.role,
+        }),
+      }}
+    >
+      <NavigationContainer
+        ref={navigationRef}
+        onStateChange={() => {
+          const name = navigationRef.getCurrentRoute()?.name;
+          if (name) {
+            routeHistory.current.push(name);
+            // Keep last 20
+            if (routeHistory.current.length > 20) routeHistory.current.shift();
+          }
+        }}
+      >
+        {/* Your navigation */}
+      </NavigationContainer>
+      <BugBearButton />
+    </BugBearProvider>
+  );
+}
+```
+
+## Widget Architecture
+
+The widget uses a navigation stack pattern with 10 screens:
+
+| Screen | Purpose |
+|--------|---------|
+| **Home** | Smart hero banner + 2x2 action grid + progress bar + web dashboard link |
+| **Test Detail** | One-test-at-a-time execution with pass/fail/skip actions |
+| **Test List** | All assignments grouped by folder with filter bar |
+| **Test Feedback** | Star rating + quality flags after pass/fail |
+| **Report** | Bug/feedback submission with type, severity, description, affected screen |
+| **Report Success** | Confirmation with auto-return to home |
+| **Message List** | Thread list with unread badges + compose button |
+| **Thread Detail** | Chat bubbles + reply composer |
+| **Compose Message** | New thread form with subject + message |
+| **Profile** | Tester info, stats, and editable fields |
+
+## Button Configuration
+
+The BugBear button is draggable by default with edge-snapping behavior:
+
+```tsx
+<BugBearButton
+  draggable={true}           // Enable/disable dragging (default: true)
+  position="bottom-right"    // Initial position: 'bottom-right' | 'bottom-left'
+  initialX={100}             // Custom initial X position (optional)
+  initialY={500}             // Custom initial Y position (optional)
+  minY={100}                 // Minimum Y from top (default: 100)
+  maxYOffset={160}           // Max Y offset from bottom (default: 160)
+/>
+```
+
+The button automatically snaps to the nearest screen edge when released.
+
 ## Monorepo Setup
 
 When using BugBear in a monorepo (e.g., with Turborepo, Nx, or Yarn Workspaces), you may encounter React duplicate instance errors like:
@@ -105,90 +238,6 @@ If you're using Yarn workspaces, you can also configure hoisting to ensure a sin
 }
 ```
 
-## Configuration Options
-
-```tsx
-<BugBearProvider
-  config={{
-    projectId: 'your-project-id',           // Required: Your BugBear project ID
-    getCurrentUser: async () => {...},       // Required: Return current user info
-    dashboardUrl: 'https://app.bugbear.ai', // Optional: Web dashboard link in widget
-    getNavigationHistory: () => [...],       // Optional: Custom navigation tracking
-    onNavigate: (route) => {...},            // Optional: Deep link handler for test cases
-    onReportSubmitted: (report) => {...},    // Optional: Callback after report submission
-  }}
->
-```
-
-## Widget Architecture
-
-The widget uses a navigation stack pattern with 10 screens:
-
-| Screen | Purpose |
-|--------|---------|
-| **Home** | Smart hero banner + 2x2 action grid + progress bar + web dashboard link |
-| **Test Detail** | One-test-at-a-time execution with pass/fail/skip actions |
-| **Test List** | All assignments grouped by folder with filter bar |
-| **Test Feedback** | Star rating + quality flags after pass/fail |
-| **Report** | Bug/feedback submission with type, severity, description |
-| **Report Success** | Confirmation with auto-return to home |
-| **Message List** | Thread list with unread badges + compose button |
-| **Thread Detail** | Chat bubbles + reply composer |
-| **Compose Message** | New thread form with subject + message |
-| **Profile** | Tester info, stats, and editable fields |
-
-## Navigation Tracking
-
-BugBear can automatically track navigation history for better bug context. If you're using React Navigation:
-
-```tsx
-import { useNavigationContainerRef } from '@react-navigation/native';
-
-function App() {
-  const navigationRef = useNavigationContainerRef();
-  const routeNameRef = useRef<string>();
-
-  return (
-    <BugBearProvider
-      projectId="your-project-id"
-      getCurrentUser={...}
-      getNavigationHistory={() => routeNameRef.current ? [routeNameRef.current] : []}
-    >
-      <NavigationContainer
-        ref={navigationRef}
-        onReady={() => {
-          routeNameRef.current = navigationRef.getCurrentRoute()?.name;
-        }}
-        onStateChange={() => {
-          const currentRouteName = navigationRef.getCurrentRoute()?.name;
-          routeNameRef.current = currentRouteName;
-        }}
-      >
-        {/* Your navigation */}
-      </NavigationContainer>
-      <BugBearWidget />
-    </BugBearProvider>
-  );
-}
-```
-
-## Button Configuration
-
-The BugBear button is draggable by default with edge-snapping behavior:
-
-```tsx
-<BugBearButton
-  draggable={true}           // Enable/disable dragging (default: true)
-  position="bottom-right"    // Initial position: 'bottom-right' | 'bottom-left'
-  initialX={100}             // Custom initial X position (optional)
-  initialY={500}             // Custom initial Y position (optional)
-  minY={100}                 // Minimum Y from top (default: 100)
-  maxYOffset={160}           // Max Y offset from bottom (default: 160)
-/>
-```
-
-The button automatically snaps to the nearest screen edge when released.
-
 ## Troubleshooting
 
 ### Widget not showing
@@ -203,10 +252,12 @@ If you're using your own Supabase instance, provide the credentials:
 
 ```tsx
 <BugBearProvider
-  projectId="your-project-id"
-  supabaseUrl="https://your-instance.supabase.co"
-  supabaseAnonKey="your-anon-key"
-  getCurrentUser={...}
+  config={{
+    projectId: 'your-project-id',
+    supabaseUrl: 'https://your-instance.supabase.co',
+    supabaseAnonKey: 'your-anon-key',
+    getCurrentUser: async () => ({ id: user.id, email: user.email }),
+  }}
 >
 ```
 
@@ -216,15 +267,11 @@ If you're using your own Supabase instance, provide the credentials:
 
 The BugBear button renders within the normal React Native view hierarchy using absolute positioning. When your app displays modals, bottom sheets, or the keyboard, the button may be hidden behind them.
 
-This is a platform limitation - React Native doesn't provide a built-in way to render views above all modals without using a Modal component (which would block touch events on the underlying app).
-
 **Workarounds:**
 - Accept that the button won't be accessible when modals are open
 - Consider dismissing the modal to access BugBear
 - For testing flows that involve modals, provide an alternative way to trigger the BugBear widget
 
-We're investigating solutions using `react-native-portal` or similar libraries for future releases.
-
 ## License
 
 MIT

package/dist/index.js

@@ -11982,19 +11982,40 @@ var BugBearClient = class {
       return { success: false, error: message };
     }
   }
+  /**
+   * Pass a test assignment — convenience wrapper around updateAssignmentStatus
+   */
+  async passAssignment(assignmentId) {
+    return this.updateAssignmentStatus(assignmentId, "passed");
+  }
+  /**
+   * Fail a test assignment — convenience wrapper around updateAssignmentStatus
+   */
+  async failAssignment(assignmentId) {
+    return this.updateAssignmentStatus(assignmentId, "failed");
+  }
   /**
    * Skip a test assignment with a required reason
    * Marks the assignment as 'skipped' and records why it was skipped
    */
   async skipAssignment(assignmentId, reason, notes) {
+    let actualReason;
+    let actualNotes;
+    if (typeof reason === "object") {
+      actualReason = reason.reason;
+      actualNotes = reason.notes;
+    } else {
+      actualReason = reason;
+      actualNotes = notes;
+    }
     try {
       const updateData = {
         status: "skipped",
-        skip_reason: reason,
+        skip_reason: actualReason,
         completed_at: (/* @__PURE__ */ new Date()).toISOString()
       };
-      if (notes) {
-        updateData.notes = notes;
+      if (actualNotes) {
+        updateData.notes = actualNotes;
       }
       const { error } = await this.supabase.from("test_assignments").update(updateData).eq("id", assignmentId);
       if (error) {
@@ -12634,6 +12655,7 @@ var BugBearClient = class {
         return false;
       }
       await this.supabase.from("discussion_threads").update({ last_message_at: (/* @__PURE__ */ new Date()).toISOString() }).eq("id", threadId);
+      await this.markThreadAsRead(threadId);
       return true;
     } catch (err) {
       console.error("BugBear: Error sending message", err);
@@ -13478,7 +13500,7 @@ function HomeScreen({ nav }) {
     import_react_native3.TouchableOpacity,
     {
       style: styles.actionCard,
-      onPress: () => nav.push({ name: "TEST_DETAIL" }),
+      onPress: () => nav.push({ name: "TEST_LIST" }),
       activeOpacity: 0.7
     },
     /* @__PURE__ */ import_react3.default.createElement(import_react_native3.Text, { style: styles.actionIcon }, "\u2705"),
@@ -13746,12 +13768,14 @@ function TestDetailScreen({ testId, nav }) {
   const currentIndex = displayedAssignment ? assignments.indexOf(displayedAssignment) : -1;
   const handlePass = (0, import_react4.useCallback)(async () => {
     if (!client || !displayedAssignment) return;
+    import_react_native4.Keyboard.dismiss();
     await client.passAssignment(displayedAssignment.id);
     await refreshAssignments();
     nav.replace({ name: "TEST_FEEDBACK", status: "passed", assignmentId: displayedAssignment.id });
   }, [client, displayedAssignment, refreshAssignments, nav]);
   const handleFail = (0, import_react4.useCallback)(async () => {
     if (!client || !displayedAssignment) return;
+    import_react_native4.Keyboard.dismiss();
     await client.failAssignment(displayedAssignment.id);
     await refreshAssignments();
     nav.replace({
@@ -13765,6 +13789,7 @@ function TestDetailScreen({ testId, nav }) {
   }, [client, displayedAssignment, refreshAssignments, nav]);
   const handleSkip = (0, import_react4.useCallback)(async () => {
     if (!client || !displayedAssignment || !selectedSkipReason) return;
+    import_react_native4.Keyboard.dismiss();
     setSkipping(true);
     await client.skipAssignment(displayedAssignment.id, {
       reason: selectedSkipReason,
@@ -13775,11 +13800,14 @@ function TestDetailScreen({ testId, nav }) {
     setSelectedSkipReason(null);
     setSkipNotes("");
     setSkipping(false);
-    const remaining = assignments.filter(
+    const currentIdx = assignments.indexOf(displayedAssignment);
+    const pending = assignments.filter(
       (a) => (a.status === "pending" || a.status === "in_progress") && a.id !== displayedAssignment.id
     );
-    if (remaining.length > 0) {
-      nav.replace({ name: "TEST_DETAIL", testId: remaining[0].id });
+    if (pending.length > 0) {
+      const nextAfterCurrent = pending.find((a) => assignments.indexOf(a) > currentIdx);
+      const nextTest = nextAfterCurrent || pending[0];
+      nav.replace({ name: "TEST_DETAIL", testId: nextTest.id });
     } else {
       nav.reset();
     }
@@ -13833,7 +13861,9 @@ function TestDetailScreen({ testId, nav }) {
     {
       style: styles2.navigateButton,
       onPress: () => {
+        import_react_native4.Keyboard.dismiss();
         onNavigate(testCase.targetRoute);
+        nav.closeWidget?.();
       }
     },
     /* @__PURE__ */ import_react4.default.createElement(import_react_native4.Text, { style: styles2.navigateText }, "\u{1F9ED} Go to test location")
@@ -13975,6 +14005,9 @@ function TestListScreen({ nav }) {
   const { assignments, currentAssignment, refreshAssignments } = useBugBear();
   const [filter, setFilter] = (0, import_react5.useState)("all");
   const [collapsedFolders, setCollapsedFolders] = (0, import_react5.useState)(/* @__PURE__ */ new Set());
+  (0, import_react5.useEffect)(() => {
+    refreshAssignments();
+  }, []);
   const groupedAssignments = (0, import_react5.useMemo)(() => {
     const groups = /* @__PURE__ */ new Map();
     for (const assignment of assignments) {
@@ -14307,9 +14340,12 @@ function TestFeedbackScreen({ status, assignmentId, nav }) {
     if (status === "failed") {
       nav.replace({ name: "REPORT", prefill: { type: "test_fail", assignmentId, testCaseId: assignment?.testCase.id } });
     } else {
-      const remaining = assignments.filter((a) => (a.status === "pending" || a.status === "in_progress") && a.id !== assignmentId);
-      if (remaining.length > 0) {
-        nav.replace({ name: "TEST_DETAIL", testId: remaining[0].id });
+      const currentIdx = assignments.findIndex((a) => a.id === assignmentId);
+      const pending = assignments.filter((a) => (a.status === "pending" || a.status === "in_progress") && a.id !== assignmentId);
+      if (pending.length > 0) {
+        const nextAfterCurrent = pending.find((a) => assignments.indexOf(a) > currentIdx);
+        const nextTest = nextAfterCurrent || pending[0];
+        nav.replace({ name: "TEST_DETAIL", testId: nextTest.id });
       } else {
         nav.reset();
       }
@@ -14319,9 +14355,12 @@ function TestFeedbackScreen({ status, assignmentId, nav }) {
     if (status === "failed") {
       nav.replace({ name: "REPORT", prefill: { type: "test_fail", assignmentId, testCaseId: assignment?.testCase.id } });
     } else {
-      const remaining = assignments.filter((a) => (a.status === "pending" || a.status === "in_progress") && a.id !== assignmentId);
-      if (remaining.length > 0) {
-        nav.replace({ name: "TEST_DETAIL", testId: remaining[0].id });
+      const currentIdx = assignments.findIndex((a) => a.id === assignmentId);
+      const pending = assignments.filter((a) => (a.status === "pending" || a.status === "in_progress") && a.id !== assignmentId);
+      if (pending.length > 0) {
+        const nextAfterCurrent = pending.find((a) => assignments.indexOf(a) > currentIdx);
+        const nextTest = nextAfterCurrent || pending[0];
+        nav.replace({ name: "TEST_DETAIL", testId: nextTest.id });
       } else {
         nav.reset();
       }
@@ -14974,10 +15013,29 @@ function BugBearButton({
     }
   };
   const handleClose = () => {
+    import_react_native15.Keyboard.dismiss();
     setModalVisible(false);
-    reset();
   };
-  const nav = { push, pop, replace, reset, canGoBack };
+  const nav = {
+    push: (screen) => {
+      import_react_native15.Keyboard.dismiss();
+      push(screen);
+    },
+    pop: () => {
+      import_react_native15.Keyboard.dismiss();
+      pop();
+    },
+    replace: (screen) => {
+      import_react_native15.Keyboard.dismiss();
+      replace(screen);
+    },
+    reset: () => {
+      import_react_native15.Keyboard.dismiss();
+      reset();
+    },
+    canGoBack,
+    closeWidget: handleClose
+  };
   const renderScreen = () => {
     switch (currentScreen.name) {
       case "HOME":
@@ -15034,7 +15092,7 @@ function BugBearButton({
         behavior: import_react_native15.Platform.OS === "ios" ? "padding" : "height",
         style: styles13.modalOverlay
       },
-      /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.modalContainer }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.header }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.headerLeft }, canGoBack ? /* @__PURE__ */ import_react16.default.createElement(import_react_native15.TouchableOpacity, { onPress: pop, style: styles13.backButton }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.backText }, "\u2190 Back")) : /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.headerTitleRow }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.headerTitle }, "BugBear"), testerInfo && /* @__PURE__ */ import_react16.default.createElement(import_react_native15.TouchableOpacity, { onPress: () => push({ name: "PROFILE" }) }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.headerName }, testerInfo.name, " \u270E")))), getHeaderTitle() ? /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.headerScreenTitle, numberOfLines: 1 }, getHeaderTitle()) : null, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.TouchableOpacity, { onPress: handleClose, style: styles13.closeButton }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.closeText }, "\u2715"))), /* @__PURE__ */ import_react16.default.createElement(
+      /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.modalContainer }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.header }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.headerLeft }, canGoBack ? /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.headerNavRow }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.TouchableOpacity, { onPress: () => nav.pop(), style: styles13.backButton }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.backText }, "\u2190 Back")), /* @__PURE__ */ import_react16.default.createElement(import_react_native15.TouchableOpacity, { onPress: () => nav.reset(), style: styles13.homeButton }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.homeText }, "\u{1F3E0}"))) : /* @__PURE__ */ import_react16.default.createElement(import_react_native15.View, { style: styles13.headerTitleRow }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.headerTitle }, "BugBear"), testerInfo && /* @__PURE__ */ import_react16.default.createElement(import_react_native15.TouchableOpacity, { onPress: () => push({ name: "PROFILE" }) }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.headerName }, testerInfo.name, " \u270E")))), getHeaderTitle() ? /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.headerScreenTitle, numberOfLines: 1 }, getHeaderTitle()) : null, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.TouchableOpacity, { onPress: handleClose, style: styles13.closeButton }, /* @__PURE__ */ import_react16.default.createElement(import_react_native15.Text, { style: styles13.closeText }, "\u2715"))), /* @__PURE__ */ import_react16.default.createElement(
         import_react_native15.ScrollView,
         {
           style: styles13.content,
@@ -15135,15 +15193,27 @@ var styles13 = import_react_native15.StyleSheet.create({
     flex: 1,
     textAlign: "center"
   },
+  headerNavRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 8
+  },
   backButton: {
     paddingVertical: 2,
-    paddingRight: 12
+    paddingRight: 4
   },
   backText: {
     fontSize: 15,
     color: colors.blue,
     fontWeight: "500"
   },
+  homeButton: {
+    paddingVertical: 2,
+    paddingHorizontal: 6
+  },
+  homeText: {
+    fontSize: 16
+  },
   closeButton: {
     width: 32,
     height: 32,

package/dist/index.mjs

@@ -11951,19 +11951,40 @@ var BugBearClient = class {
       return { success: false, error: message };
     }
   }
+  /**
+   * Pass a test assignment — convenience wrapper around updateAssignmentStatus
+   */
+  async passAssignment(assignmentId) {
+    return this.updateAssignmentStatus(assignmentId, "passed");
+  }
+  /**
+   * Fail a test assignment — convenience wrapper around updateAssignmentStatus
+   */
+  async failAssignment(assignmentId) {
+    return this.updateAssignmentStatus(assignmentId, "failed");
+  }
   /**
    * Skip a test assignment with a required reason
    * Marks the assignment as 'skipped' and records why it was skipped
    */
   async skipAssignment(assignmentId, reason, notes) {
+    let actualReason;
+    let actualNotes;
+    if (typeof reason === "object") {
+      actualReason = reason.reason;
+      actualNotes = reason.notes;
+    } else {
+      actualReason = reason;
+      actualNotes = notes;
+    }
     try {
       const updateData = {
         status: "skipped",
-        skip_reason: reason,
+        skip_reason: actualReason,
         completed_at: (/* @__PURE__ */ new Date()).toISOString()
       };
-      if (notes) {
-        updateData.notes = notes;
+      if (actualNotes) {
+        updateData.notes = actualNotes;
       }
       const { error } = await this.supabase.from("test_assignments").update(updateData).eq("id", assignmentId);
       if (error) {
@@ -12603,6 +12624,7 @@ var BugBearClient = class {
         return false;
       }
       await this.supabase.from("discussion_threads").update({ last_message_at: (/* @__PURE__ */ new Date()).toISOString() }).eq("id", threadId);
+      await this.markThreadAsRead(threadId);
       return true;
     } catch (err) {
       console.error("BugBear: Error sending message", err);
@@ -13204,7 +13226,8 @@ import {
   Platform as Platform4,
   PanResponder,
   Animated,
-  ActivityIndicator as ActivityIndicator2
+  ActivityIndicator as ActivityIndicator2,
+  Keyboard as Keyboard2
 } from "react-native";
 
 // src/widget/logo.ts
@@ -13461,7 +13484,7 @@ function HomeScreen({ nav }) {
     TouchableOpacity,
     {
       style: styles.actionCard,
-      onPress: () => nav.push({ name: "TEST_DETAIL" }),
+      onPress: () => nav.push({ name: "TEST_LIST" }),
       activeOpacity: 0.7
     },
     /* @__PURE__ */ React2.createElement(Text, { style: styles.actionIcon }, "\u2705"),
@@ -13694,7 +13717,7 @@ var styles = StyleSheet2.create({
 
 // src/widget/screens/TestDetailScreen.tsx
 import React3, { useState as useState2, useEffect as useEffect3, useCallback as useCallback2 } from "react";
-import { View as View2, Text as Text2, TouchableOpacity as TouchableOpacity2, StyleSheet as StyleSheet3, Modal, TextInput } from "react-native";
+import { View as View2, Text as Text2, TouchableOpacity as TouchableOpacity2, StyleSheet as StyleSheet3, Modal, TextInput, Keyboard } from "react-native";
 function TestDetailScreen({ testId, nav }) {
   const { client, assignments, currentAssignment, refreshAssignments, getDeviceInfo, onNavigate } = useBugBear();
   const displayedAssignment = testId ? assignments.find((a) => a.id === testId) || currentAssignment : currentAssignment;
@@ -13729,12 +13752,14 @@ function TestDetailScreen({ testId, nav }) {
   const currentIndex = displayedAssignment ? assignments.indexOf(displayedAssignment) : -1;
   const handlePass = useCallback2(async () => {
     if (!client || !displayedAssignment) return;
+    Keyboard.dismiss();
     await client.passAssignment(displayedAssignment.id);
     await refreshAssignments();
     nav.replace({ name: "TEST_FEEDBACK", status: "passed", assignmentId: displayedAssignment.id });
   }, [client, displayedAssignment, refreshAssignments, nav]);
   const handleFail = useCallback2(async () => {
     if (!client || !displayedAssignment) return;
+    Keyboard.dismiss();
     await client.failAssignment(displayedAssignment.id);
     await refreshAssignments();
     nav.replace({
@@ -13748,6 +13773,7 @@ function TestDetailScreen({ testId, nav }) {
   }, [client, displayedAssignment, refreshAssignments, nav]);
   const handleSkip = useCallback2(async () => {
     if (!client || !displayedAssignment || !selectedSkipReason) return;
+    Keyboard.dismiss();
     setSkipping(true);
     await client.skipAssignment(displayedAssignment.id, {
       reason: selectedSkipReason,
@@ -13758,11 +13784,14 @@ function TestDetailScreen({ testId, nav }) {
     setSelectedSkipReason(null);
     setSkipNotes("");
     setSkipping(false);
-    const remaining = assignments.filter(
+    const currentIdx = assignments.indexOf(displayedAssignment);
+    const pending = assignments.filter(
       (a) => (a.status === "pending" || a.status === "in_progress") && a.id !== displayedAssignment.id
     );
-    if (remaining.length > 0) {
-      nav.replace({ name: "TEST_DETAIL", testId: remaining[0].id });
+    if (pending.length > 0) {
+      const nextAfterCurrent = pending.find((a) => assignments.indexOf(a) > currentIdx);
+      const nextTest = nextAfterCurrent || pending[0];
+      nav.replace({ name: "TEST_DETAIL", testId: nextTest.id });
     } else {
       nav.reset();
     }
@@ -13816,7 +13845,9 @@ function TestDetailScreen({ testId, nav }) {
     {
       style: styles2.navigateButton,
       onPress: () => {
+        Keyboard.dismiss();
         onNavigate(testCase.targetRoute);
+        nav.closeWidget?.();
       }
     },
     /* @__PURE__ */ React3.createElement(Text2, { style: styles2.navigateText }, "\u{1F9ED} Go to test location")
@@ -13952,12 +13983,15 @@ var styles2 = StyleSheet3.create({
 });
 
 // src/widget/screens/TestListScreen.tsx
-import React4, { useState as useState3, useMemo as useMemo2, useCallback as useCallback3 } from "react";
+import React4, { useState as useState3, useMemo as useMemo2, useCallback as useCallback3, useEffect as useEffect4 } from "react";
 import { View as View3, Text as Text3, TouchableOpacity as TouchableOpacity3, StyleSheet as StyleSheet4 } from "react-native";
 function TestListScreen({ nav }) {
   const { assignments, currentAssignment, refreshAssignments } = useBugBear();
   const [filter, setFilter] = useState3("all");
   const [collapsedFolders, setCollapsedFolders] = useState3(/* @__PURE__ */ new Set());
+  useEffect4(() => {
+    refreshAssignments();
+  }, []);
   const groupedAssignments = useMemo2(() => {
     const groups = /* @__PURE__ */ new Map();
     for (const assignment of assignments) {
@@ -14290,9 +14324,12 @@ function TestFeedbackScreen({ status, assignmentId, nav }) {
     if (status === "failed") {
       nav.replace({ name: "REPORT", prefill: { type: "test_fail", assignmentId, testCaseId: assignment?.testCase.id } });
     } else {
-      const remaining = assignments.filter((a) => (a.status === "pending" || a.status === "in_progress") && a.id !== assignmentId);
-      if (remaining.length > 0) {
-        nav.replace({ name: "TEST_DETAIL", testId: remaining[0].id });
+      const currentIdx = assignments.findIndex((a) => a.id === assignmentId);
+      const pending = assignments.filter((a) => (a.status === "pending" || a.status === "in_progress") && a.id !== assignmentId);
+      if (pending.length > 0) {
+        const nextAfterCurrent = pending.find((a) => assignments.indexOf(a) > currentIdx);
+        const nextTest = nextAfterCurrent || pending[0];
+        nav.replace({ name: "TEST_DETAIL", testId: nextTest.id });
       } else {
         nav.reset();
       }
@@ -14302,9 +14339,12 @@ function TestFeedbackScreen({ status, assignmentId, nav }) {
     if (status === "failed") {
       nav.replace({ name: "REPORT", prefill: { type: "test_fail", assignmentId, testCaseId: assignment?.testCase.id } });
     } else {
-      const remaining = assignments.filter((a) => (a.status === "pending" || a.status === "in_progress") && a.id !== assignmentId);
-      if (remaining.length > 0) {
-        nav.replace({ name: "TEST_DETAIL", testId: remaining[0].id });
+      const currentIdx = assignments.findIndex((a) => a.id === assignmentId);
+      const pending = assignments.filter((a) => (a.status === "pending" || a.status === "in_progress") && a.id !== assignmentId);
+      if (pending.length > 0) {
+        const nextAfterCurrent = pending.find((a) => assignments.indexOf(a) > currentIdx);
+        const nextTest = nextAfterCurrent || pending[0];
+        nav.replace({ name: "TEST_DETAIL", testId: nextTest.id });
       } else {
         nav.reset();
       }
@@ -14490,10 +14530,10 @@ var styles7 = StyleSheet8.create({
 });
 
 // src/widget/screens/ReportSuccessScreen.tsx
-import React9, { useEffect as useEffect4 } from "react";
+import React9, { useEffect as useEffect5 } from "react";
 import { View as View8, Text as Text8, StyleSheet as StyleSheet9 } from "react-native";
 function ReportSuccessScreen({ nav }) {
-  useEffect4(() => {
+  useEffect5(() => {
     const timer = setTimeout(() => nav.reset(), 2e3);
     return () => clearTimeout(timer);
   }, [nav]);
@@ -14552,7 +14592,7 @@ var styles9 = StyleSheet10.create({
 });
 
 // src/widget/screens/ThreadDetailScreen.tsx
-import React11, { useState as useState7, useEffect as useEffect5 } from "react";
+import React11, { useState as useState7, useEffect as useEffect6 } from "react";
 import { View as View10, Text as Text10, TouchableOpacity as TouchableOpacity9, TextInput as TextInput4, StyleSheet as StyleSheet11, Image as Image2 } from "react-native";
 function ThreadDetailScreen({ thread, nav }) {
   const { getThreadMessages, sendMessage, markAsRead, uploadImage } = useBugBear();
@@ -14562,7 +14602,7 @@ function ThreadDetailScreen({ thread, nav }) {
   const [sending, setSending] = useState7(false);
   const [sendError, setSendError] = useState7(false);
   const replyImages = useImageAttachments(uploadImage, 3, "discussion-attachments");
-  useEffect5(() => {
+  useEffect6(() => {
     (async () => {
       setLoading(true);
       const msgs = await getThreadMessages(thread.id);
@@ -14731,7 +14771,7 @@ var styles11 = StyleSheet12.create({
 });
 
 // src/widget/screens/ProfileScreen.tsx
-import React13, { useState as useState9, useEffect as useEffect6 } from "react";
+import React13, { useState as useState9, useEffect as useEffect7 } from "react";
 import { View as View12, Text as Text12, TouchableOpacity as TouchableOpacity11, TextInput as TextInput6, StyleSheet as StyleSheet13 } from "react-native";
 function ProfileScreen({ nav }) {
   const { testerInfo, assignments, updateTesterProfile, refreshTesterInfo } = useBugBear();
@@ -14744,7 +14784,7 @@ function ProfileScreen({ nav }) {
   const [saved, setSaved] = useState9(false);
   const [showDetails, setShowDetails] = useState9(false);
   const completedCount = assignments.filter((a) => a.status === "passed" || a.status === "failed").length;
-  useEffect6(() => {
+  useEffect7(() => {
     if (testerInfo) {
       setName(testerInfo.name);
       setAdditionalEmails(testerInfo.additionalEmails || []);
@@ -14957,10 +14997,29 @@ function BugBearButton({
     }
   };
   const handleClose = () => {
+    Keyboard2.dismiss();
     setModalVisible(false);
-    reset();
   };
-  const nav = { push, pop, replace, reset, canGoBack };
+  const nav = {
+    push: (screen) => {
+      Keyboard2.dismiss();
+      push(screen);
+    },
+    pop: () => {
+      Keyboard2.dismiss();
+      pop();
+    },
+    replace: (screen) => {
+      Keyboard2.dismiss();
+      replace(screen);
+    },
+    reset: () => {
+      Keyboard2.dismiss();
+      reset();
+    },
+    canGoBack,
+    closeWidget: handleClose
+  };
   const renderScreen = () => {
     switch (currentScreen.name) {
       case "HOME":
@@ -15017,7 +15076,7 @@ function BugBearButton({
         behavior: Platform4.OS === "ios" ? "padding" : "height",
         style: styles13.modalOverlay
       },
-      /* @__PURE__ */ React14.createElement(View13, { style: styles13.modalContainer }, /* @__PURE__ */ React14.createElement(View13, { style: styles13.header }, /* @__PURE__ */ React14.createElement(View13, { style: styles13.headerLeft }, canGoBack ? /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: pop, style: styles13.backButton }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.backText }, "\u2190 Back")) : /* @__PURE__ */ React14.createElement(View13, { style: styles13.headerTitleRow }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerTitle }, "BugBear"), testerInfo && /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: () => push({ name: "PROFILE" }) }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerName }, testerInfo.name, " \u270E")))), getHeaderTitle() ? /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerScreenTitle, numberOfLines: 1 }, getHeaderTitle()) : null, /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: handleClose, style: styles13.closeButton }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.closeText }, "\u2715"))), /* @__PURE__ */ React14.createElement(
+      /* @__PURE__ */ React14.createElement(View13, { style: styles13.modalContainer }, /* @__PURE__ */ React14.createElement(View13, { style: styles13.header }, /* @__PURE__ */ React14.createElement(View13, { style: styles13.headerLeft }, canGoBack ? /* @__PURE__ */ React14.createElement(View13, { style: styles13.headerNavRow }, /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: () => nav.pop(), style: styles13.backButton }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.backText }, "\u2190 Back")), /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: () => nav.reset(), style: styles13.homeButton }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.homeText }, "\u{1F3E0}"))) : /* @__PURE__ */ React14.createElement(View13, { style: styles13.headerTitleRow }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerTitle }, "BugBear"), testerInfo && /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: () => push({ name: "PROFILE" }) }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerName }, testerInfo.name, " \u270E")))), getHeaderTitle() ? /* @__PURE__ */ React14.createElement(Text13, { style: styles13.headerScreenTitle, numberOfLines: 1 }, getHeaderTitle()) : null, /* @__PURE__ */ React14.createElement(TouchableOpacity12, { onPress: handleClose, style: styles13.closeButton }, /* @__PURE__ */ React14.createElement(Text13, { style: styles13.closeText }, "\u2715"))), /* @__PURE__ */ React14.createElement(
         ScrollView2,
         {
           style: styles13.content,
@@ -15118,15 +15177,27 @@ var styles13 = StyleSheet14.create({
     flex: 1,
     textAlign: "center"
   },
+  headerNavRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 8
+  },
   backButton: {
     paddingVertical: 2,
-    paddingRight: 12
+    paddingRight: 4
   },
   backText: {
     fontSize: 15,
     color: colors.blue,
     fontWeight: "500"
   },
+  homeButton: {
+    paddingVertical: 2,
+    paddingHorizontal: 6
+  },
+  homeText: {
+    fontSize: 16
+  },
   closeButton: {
     width: 32,
     height: 32,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbearai/react-native",
-  "version": "0.3.8",
+  "version": "0.3.10",
   "description": "BugBear React Native components for mobile apps",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",