@bbearai/react 0.5.0 → 0.5.1

package/dist/index.js

@@ -602,7 +602,7 @@ function MessageListScreenSkeleton() {
 // src/widget/screens/HomeScreen.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function HomeScreen({ nav }) {
-  const { assignments, unreadCount, threads, refreshAssignments, refreshThreads, issueCounts, refreshIssueCounts, isLoading } = useBugBear();
+  const { assignments, unreadCount, threads, refreshAssignments, refreshThreads, issueCounts, refreshIssueCounts, dashboardUrl, isLoading } = useBugBear();
   (0, import_react3.useEffect)(() => {
     refreshAssignments();
     refreshThreads();
@@ -1007,6 +1007,33 @@ function HomeScreen({ nav }) {
         " tests completed"
       ] })
     ] }),
+    dashboardUrl && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "a",
+      {
+        href: dashboardUrl,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          backgroundColor: colors.card,
+          border: `1px solid ${colors.border}`,
+          borderRadius: 12,
+          padding: 14,
+          marginBottom: 16,
+          textDecoration: "none",
+          cursor: "pointer"
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontSize: 22, marginRight: 12 }, children: "\u{1F310}" }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { style: { flex: 1 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { display: "block", fontSize: 14, fontWeight: 600, color: colors.textPrimary }, children: "Open Dashboard" }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { display: "block", fontSize: 12, color: colors.textMuted, marginTop: 2 }, children: "View analytics, history & more" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontSize: 16, color: colors.textMuted, marginLeft: 8 }, children: "\u2192" })
+        ]
+      }
+    ),
     /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { display: "flex", justifyContent: "center", padding: "8px 0" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
       "button",
       {
@@ -1097,6 +1124,37 @@ function TestDetailScreen({ testId, nav }) {
       setIsSubmitting(false);
     }
   }, [client, displayedAssignment, refreshAssignments, nav, isSubmitting]);
+  const handleReopen = (0, import_react4.useCallback)(async () => {
+    if (!client || !displayedAssignment || isSubmitting) return;
+    setIsSubmitting(true);
+    try {
+      await client.reopenAssignment(displayedAssignment.id);
+      await refreshAssignments();
+    } finally {
+      setIsSubmitting(false);
+    }
+  }, [client, displayedAssignment, refreshAssignments, isSubmitting]);
+  const handleChangeResult = (0, import_react4.useCallback)(async (newStatus) => {
+    if (!client || !displayedAssignment || isSubmitting) return;
+    setIsSubmitting(true);
+    try {
+      await client.reopenAssignment(displayedAssignment.id);
+      await client.updateAssignmentStatus(displayedAssignment.id, newStatus);
+      await refreshAssignments();
+      if (newStatus === "failed") {
+        nav.replace({
+          name: "REPORT",
+          prefill: {
+            type: "test_fail",
+            assignmentId: displayedAssignment.id,
+            testCaseId: displayedAssignment.testCase.id
+          }
+        });
+      }
+    } finally {
+      setIsSubmitting(false);
+    }
+  }, [client, displayedAssignment, refreshAssignments, nav, isSubmitting]);
   const handleSkip = (0, import_react4.useCallback)(async () => {
     if (!client || !displayedAssignment || !selectedSkipReason) return;
     setSkipping(true);
@@ -1612,7 +1670,113 @@ function TestDetailScreen({ testId, nav }) {
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex", gap: 10, marginTop: 8 }, children: [
+    displayedAssignment.status === "passed" || displayedAssignment.status === "failed" || displayedAssignment.status === "skipped" || displayedAssignment.status === "blocked" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+        "div",
+        {
+          style: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            gap: 6,
+            padding: "8px 12px",
+            borderRadius: 8,
+            marginTop: 8,
+            marginBottom: 8,
+            backgroundColor: displayedAssignment.status === "passed" ? colors.greenDark : displayedAssignment.status === "failed" ? colors.redDark : colors.card,
+            border: `1px solid ${displayedAssignment.status === "passed" ? colors.green : displayedAssignment.status === "failed" ? colors.red : colors.border}`
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { style: { fontSize: 14 }, children: displayedAssignment.status === "passed" ? "\u2705" : displayedAssignment.status === "failed" ? "\u274C" : displayedAssignment.status === "skipped" ? "\u23ED" : "\u{1F6AB}" }),
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+              "span",
+              {
+                style: {
+                  fontSize: 13,
+                  fontWeight: 600,
+                  color: displayedAssignment.status === "passed" ? colors.green : displayedAssignment.status === "failed" ? "#fca5a5" : colors.textSecondary
+                },
+                children: [
+                  "Marked as ",
+                  displayedAssignment.status.charAt(0).toUpperCase() + displayedAssignment.status.slice(1)
+                ]
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex", gap: 10, marginTop: 4 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: handleReopen,
+            disabled: isSubmitting,
+            style: {
+              flex: 1,
+              paddingTop: 14,
+              paddingBottom: 14,
+              borderRadius: 12,
+              textAlign: "center",
+              backgroundColor: colors.card,
+              border: `1px solid ${colors.blue}`,
+              cursor: isSubmitting ? "not-allowed" : "pointer",
+              fontSize: 14,
+              fontWeight: 600,
+              color: colors.blue,
+              opacity: isSubmitting ? 0.5 : 1
+            },
+            children: isSubmitting ? "Reopening..." : "\u{1F504} Reopen Test"
+          }
+        ),
+        displayedAssignment.status === "passed" && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => handleChangeResult("failed"),
+            disabled: isSubmitting,
+            style: {
+              flex: 1,
+              paddingTop: 14,
+              paddingBottom: 14,
+              borderRadius: 12,
+              textAlign: "center",
+              backgroundColor: colors.redDark,
+              border: `1px solid ${colors.red}`,
+              cursor: isSubmitting ? "not-allowed" : "pointer",
+              fontSize: 14,
+              fontWeight: 600,
+              color: "#fca5a5",
+              opacity: isSubmitting ? 0.5 : 1
+            },
+            children: "Change to Fail"
+          }
+        ),
+        displayedAssignment.status === "failed" && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => handleChangeResult("passed"),
+            disabled: isSubmitting,
+            style: {
+              flex: 1,
+              paddingTop: 14,
+              paddingBottom: 14,
+              borderRadius: 12,
+              textAlign: "center",
+              backgroundColor: colors.greenDark,
+              border: `1px solid ${colors.green}`,
+              cursor: isSubmitting ? "not-allowed" : "pointer",
+              fontSize: 14,
+              fontWeight: 600,
+              color: "#86efac",
+              opacity: isSubmitting ? 0.5 : 1
+            },
+            children: "Change to Pass"
+          }
+        )
+      ] })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex", gap: 10, marginTop: 8 }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
         "button",
         {
@@ -1831,10 +1995,11 @@ function TestDetailScreen({ testId, nav }) {
 var import_react5 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 function TestListScreen({ nav }) {
-  const { assignments, currentAssignment, refreshAssignments, isLoading } = useBugBear();
+  const { assignments, currentAssignment, refreshAssignments, dashboardUrl, isLoading } = useBugBear();
   const [filter, setFilter] = (0, import_react5.useState)("all");
   const [roleFilter, setRoleFilter] = (0, import_react5.useState)(null);
   const [trackFilter, setTrackFilter] = (0, import_react5.useState)(null);
+  const [platformFilter, setPlatformFilter] = (0, import_react5.useState)("web");
   const [searchQuery, setSearchQuery] = (0, import_react5.useState)("");
   const [sortMode, setSortMode] = (0, import_react5.useState)("priority");
   const [collapsedFolders, setCollapsedFolders] = (0, import_react5.useState)(/* @__PURE__ */ new Set());
@@ -1852,6 +2017,13 @@ function TestListScreen({ nav }) {
     }
     return Array.from(trackMap.values());
   }, [assignments]);
+  const availablePlatforms = (0, import_react5.useMemo)(() => {
+    const set = /* @__PURE__ */ new Set();
+    for (const a of assignments) {
+      if (a.testCase.platforms) a.testCase.platforms.forEach((p) => set.add(p));
+    }
+    return Array.from(set).sort();
+  }, [assignments]);
   const selectedRole = availableRoles.find((r) => r.id === roleFilter);
   const groupedAssignments = (0, import_react5.useMemo)(() => {
     const groups = /* @__PURE__ */ new Map();
@@ -1912,6 +2084,7 @@ function TestListScreen({ nav }) {
     });
   }, []);
   const filterAssignment = (0, import_react5.useCallback)((a) => {
+    if (platformFilter && a.testCase.platforms && !a.testCase.platforms.includes(platformFilter)) return false;
     if (roleFilter && a.testCase.role?.id !== roleFilter) return false;
     if (trackFilter && a.testCase.track?.id !== trackFilter) return false;
     if (searchQuery) {
@@ -1924,7 +2097,7 @@ function TestListScreen({ nav }) {
     if (filter === "done") return a.status === "passed";
     if (filter === "reopened") return a.status === "failed";
     return true;
-  }, [roleFilter, trackFilter, searchQuery, filter]);
+  }, [platformFilter, roleFilter, trackFilter, searchQuery, filter]);
   const pendingCount = assignments.filter(
     (a) => a.status === "pending" || a.status === "in_progress"
   ).length;
@@ -2058,6 +2231,59 @@ function TestListScreen({ nav }) {
         }
       }
     ) }),
+    availablePlatforms.length >= 2 && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { style: { display: "flex", gap: 4, marginBottom: 8 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: () => setPlatformFilter(null),
+          style: {
+            padding: "3px 8px",
+            borderRadius: 6,
+            backgroundColor: !platformFilter ? colors.card : "transparent",
+            border: !platformFilter ? `1px solid ${colors.border}` : "1px solid transparent",
+            cursor: "pointer",
+            fontSize: 11,
+            color: !platformFilter ? colors.textPrimary : colors.textMuted,
+            fontWeight: !platformFilter ? 600 : 400,
+            whiteSpace: "nowrap"
+          },
+          children: "All Platforms"
+        }
+      ),
+      availablePlatforms.map((p) => {
+        const isActive = platformFilter === p;
+        const label = p === "ios" ? "iOS" : p === "android" ? "Android" : p === "web" ? "Web" : p;
+        const icon = p === "ios" ? "\u{1F4F1}" : p === "android" ? "\u{1F916}" : p === "web" ? "\u{1F310}" : "\u{1F4CB}";
+        return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+          "button",
+          {
+            type: "button",
+            onClick: () => setPlatformFilter(isActive ? null : p),
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: 4,
+              padding: "3px 8px",
+              borderRadius: 6,
+              backgroundColor: isActive ? colors.blue + "20" : "transparent",
+              border: isActive ? `1px solid ${colors.blue}60` : "1px solid transparent",
+              cursor: "pointer",
+              fontSize: 11,
+              color: isActive ? colors.blue : colors.textMuted,
+              fontWeight: isActive ? 600 : 400,
+              whiteSpace: "nowrap"
+            },
+            children: [
+              icon,
+              " ",
+              label
+            ]
+          },
+          p
+        );
+      })
+    ] }),
     (availableTracks.length >= 2 || true) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 12 }, children: [
       availableTracks.length >= 2 && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { style: { display: "flex", gap: 4, flex: 1, overflow: "auto" }, children: [
         /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
@@ -2371,7 +2597,27 @@ function TestListScreen({ nav }) {
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: { display: "flex", justifyContent: "center", paddingTop: 12, paddingBottom: 8 }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    dashboardUrl && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      "a",
+      {
+        href: `${dashboardUrl}/test-cases`,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: 6,
+          paddingTop: 12,
+          fontSize: 13,
+          fontWeight: 500,
+          color: colors.blue,
+          textDecoration: "none"
+        },
+        children: "\u{1F310} Manage on Dashboard \u2192"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: { display: "flex", justifyContent: "center", paddingTop: 8, paddingBottom: 8 }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       "button",
       {
         type: "button",
@@ -3373,7 +3619,7 @@ var styles3 = {
 // src/widget/screens/MessageListScreen.tsx
 var import_jsx_runtime12 = require("react/jsx-runtime");
 function MessageListScreen({ nav }) {
-  const { threads, unreadCount, refreshThreads, isLoading } = useBugBear();
+  const { threads, unreadCount, refreshThreads, dashboardUrl, isLoading } = useBugBear();
   if (isLoading) return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MessageListScreenSkeleton, {});
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { children: [
     /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
@@ -3562,6 +3808,26 @@ function MessageListScreen({ nav }) {
       },
       thread.id
     )) }),
+    dashboardUrl && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      "a",
+      {
+        href: `${dashboardUrl}/discussions`,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: 6,
+          paddingTop: 12,
+          fontSize: 13,
+          fontWeight: 500,
+          color: colors.blue,
+          textDecoration: "none"
+        },
+        children: "\u{1F310} View on Dashboard \u2192"
+      }
+    ),
     /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
       "div",
       {
@@ -3569,7 +3835,7 @@ function MessageListScreen({ nav }) {
           display: "flex",
           justifyContent: "space-between",
           alignItems: "center",
-          paddingTop: 12,
+          paddingTop: 8,
           paddingLeft: 4,
           paddingRight: 4
         },
@@ -4693,6 +4959,7 @@ var SEVERITY_CONFIG = {
   low: { label: "Low", color: "#71717a", bg: "#27272a" }
 };
 function IssueDetailScreen({ nav, issue }) {
+  const { dashboardUrl } = useBugBear();
   const statusConfig = STATUS_LABELS[issue.status] || { label: issue.status, bg: "#27272a", color: "#a1a1aa" };
   const severityConfig = issue.severity ? SEVERITY_CONFIG[issue.severity] : null;
   return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { children: [
@@ -4810,7 +5077,29 @@ function IssueDetailScreen({ nav, issue }) {
         " \xB7 Updated ",
         formatRelativeTime(issue.updatedAt)
       ] })
-    ] })
+    ] }),
+    dashboardUrl && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      "a",
+      {
+        href: `${dashboardUrl}/reports`,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: 6,
+          marginTop: 12,
+          padding: "10px 0",
+          fontSize: 13,
+          fontWeight: 500,
+          color: colors.blue,
+          textDecoration: "none",
+          borderTop: `1px solid ${colors.border}`
+        },
+        children: "\u{1F310} View on Dashboard \u2192"
+      }
+    )
   ] });
 }
 

package/dist/index.mjs

@@ -563,7 +563,7 @@ function MessageListScreenSkeleton() {
 // src/widget/screens/HomeScreen.tsx
 import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 function HomeScreen({ nav }) {
-  const { assignments, unreadCount, threads, refreshAssignments, refreshThreads, issueCounts, refreshIssueCounts, isLoading } = useBugBear();
+  const { assignments, unreadCount, threads, refreshAssignments, refreshThreads, issueCounts, refreshIssueCounts, dashboardUrl, isLoading } = useBugBear();
   useEffect2(() => {
     refreshAssignments();
     refreshThreads();
@@ -968,6 +968,33 @@ function HomeScreen({ nav }) {
         " tests completed"
       ] })
     ] }),
+    dashboardUrl && /* @__PURE__ */ jsxs2(
+      "a",
+      {
+        href: dashboardUrl,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          backgroundColor: colors.card,
+          border: `1px solid ${colors.border}`,
+          borderRadius: 12,
+          padding: 14,
+          marginBottom: 16,
+          textDecoration: "none",
+          cursor: "pointer"
+        },
+        children: [
+          /* @__PURE__ */ jsx3("span", { style: { fontSize: 22, marginRight: 12 }, children: "\u{1F310}" }),
+          /* @__PURE__ */ jsxs2("span", { style: { flex: 1 }, children: [
+            /* @__PURE__ */ jsx3("span", { style: { display: "block", fontSize: 14, fontWeight: 600, color: colors.textPrimary }, children: "Open Dashboard" }),
+            /* @__PURE__ */ jsx3("span", { style: { display: "block", fontSize: 12, color: colors.textMuted, marginTop: 2 }, children: "View analytics, history & more" })
+          ] }),
+          /* @__PURE__ */ jsx3("span", { style: { fontSize: 16, color: colors.textMuted, marginLeft: 8 }, children: "\u2192" })
+        ]
+      }
+    ),
     /* @__PURE__ */ jsx3("div", { style: { display: "flex", justifyContent: "center", padding: "8px 0" }, children: /* @__PURE__ */ jsx3(
       "button",
       {
@@ -1058,6 +1085,37 @@ function TestDetailScreen({ testId, nav }) {
       setIsSubmitting(false);
     }
   }, [client, displayedAssignment, refreshAssignments, nav, isSubmitting]);
+  const handleReopen = useCallback2(async () => {
+    if (!client || !displayedAssignment || isSubmitting) return;
+    setIsSubmitting(true);
+    try {
+      await client.reopenAssignment(displayedAssignment.id);
+      await refreshAssignments();
+    } finally {
+      setIsSubmitting(false);
+    }
+  }, [client, displayedAssignment, refreshAssignments, isSubmitting]);
+  const handleChangeResult = useCallback2(async (newStatus) => {
+    if (!client || !displayedAssignment || isSubmitting) return;
+    setIsSubmitting(true);
+    try {
+      await client.reopenAssignment(displayedAssignment.id);
+      await client.updateAssignmentStatus(displayedAssignment.id, newStatus);
+      await refreshAssignments();
+      if (newStatus === "failed") {
+        nav.replace({
+          name: "REPORT",
+          prefill: {
+            type: "test_fail",
+            assignmentId: displayedAssignment.id,
+            testCaseId: displayedAssignment.testCase.id
+          }
+        });
+      }
+    } finally {
+      setIsSubmitting(false);
+    }
+  }, [client, displayedAssignment, refreshAssignments, nav, isSubmitting]);
   const handleSkip = useCallback2(async () => {
     if (!client || !displayedAssignment || !selectedSkipReason) return;
     setSkipping(true);
@@ -1573,7 +1631,113 @@ function TestDetailScreen({ testId, nav }) {
         ]
       }
     ),
-    /* @__PURE__ */ jsxs3("div", { style: { display: "flex", gap: 10, marginTop: 8 }, children: [
+    displayedAssignment.status === "passed" || displayedAssignment.status === "failed" || displayedAssignment.status === "skipped" || displayedAssignment.status === "blocked" ? /* @__PURE__ */ jsxs3(Fragment, { children: [
+      /* @__PURE__ */ jsxs3(
+        "div",
+        {
+          style: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            gap: 6,
+            padding: "8px 12px",
+            borderRadius: 8,
+            marginTop: 8,
+            marginBottom: 8,
+            backgroundColor: displayedAssignment.status === "passed" ? colors.greenDark : displayedAssignment.status === "failed" ? colors.redDark : colors.card,
+            border: `1px solid ${displayedAssignment.status === "passed" ? colors.green : displayedAssignment.status === "failed" ? colors.red : colors.border}`
+          },
+          children: [
+            /* @__PURE__ */ jsx4("span", { style: { fontSize: 14 }, children: displayedAssignment.status === "passed" ? "\u2705" : displayedAssignment.status === "failed" ? "\u274C" : displayedAssignment.status === "skipped" ? "\u23ED" : "\u{1F6AB}" }),
+            /* @__PURE__ */ jsxs3(
+              "span",
+              {
+                style: {
+                  fontSize: 13,
+                  fontWeight: 600,
+                  color: displayedAssignment.status === "passed" ? colors.green : displayedAssignment.status === "failed" ? "#fca5a5" : colors.textSecondary
+                },
+                children: [
+                  "Marked as ",
+                  displayedAssignment.status.charAt(0).toUpperCase() + displayedAssignment.status.slice(1)
+                ]
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs3("div", { style: { display: "flex", gap: 10, marginTop: 4 }, children: [
+        /* @__PURE__ */ jsx4(
+          "button",
+          {
+            type: "button",
+            onClick: handleReopen,
+            disabled: isSubmitting,
+            style: {
+              flex: 1,
+              paddingTop: 14,
+              paddingBottom: 14,
+              borderRadius: 12,
+              textAlign: "center",
+              backgroundColor: colors.card,
+              border: `1px solid ${colors.blue}`,
+              cursor: isSubmitting ? "not-allowed" : "pointer",
+              fontSize: 14,
+              fontWeight: 600,
+              color: colors.blue,
+              opacity: isSubmitting ? 0.5 : 1
+            },
+            children: isSubmitting ? "Reopening..." : "\u{1F504} Reopen Test"
+          }
+        ),
+        displayedAssignment.status === "passed" && /* @__PURE__ */ jsx4(
+          "button",
+          {
+            type: "button",
+            onClick: () => handleChangeResult("failed"),
+            disabled: isSubmitting,
+            style: {
+              flex: 1,
+              paddingTop: 14,
+              paddingBottom: 14,
+              borderRadius: 12,
+              textAlign: "center",
+              backgroundColor: colors.redDark,
+              border: `1px solid ${colors.red}`,
+              cursor: isSubmitting ? "not-allowed" : "pointer",
+              fontSize: 14,
+              fontWeight: 600,
+              color: "#fca5a5",
+              opacity: isSubmitting ? 0.5 : 1
+            },
+            children: "Change to Fail"
+          }
+        ),
+        displayedAssignment.status === "failed" && /* @__PURE__ */ jsx4(
+          "button",
+          {
+            type: "button",
+            onClick: () => handleChangeResult("passed"),
+            disabled: isSubmitting,
+            style: {
+              flex: 1,
+              paddingTop: 14,
+              paddingBottom: 14,
+              borderRadius: 12,
+              textAlign: "center",
+              backgroundColor: colors.greenDark,
+              border: `1px solid ${colors.green}`,
+              cursor: isSubmitting ? "not-allowed" : "pointer",
+              fontSize: 14,
+              fontWeight: 600,
+              color: "#86efac",
+              opacity: isSubmitting ? 0.5 : 1
+            },
+            children: "Change to Pass"
+          }
+        )
+      ] })
+    ] }) : /* @__PURE__ */ jsxs3("div", { style: { display: "flex", gap: 10, marginTop: 8 }, children: [
       /* @__PURE__ */ jsx4(
         "button",
         {
@@ -1792,10 +1956,11 @@ function TestDetailScreen({ testId, nav }) {
 import { useState as useState3, useMemo, useCallback as useCallback3 } from "react";
 import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 function TestListScreen({ nav }) {
-  const { assignments, currentAssignment, refreshAssignments, isLoading } = useBugBear();
+  const { assignments, currentAssignment, refreshAssignments, dashboardUrl, isLoading } = useBugBear();
   const [filter, setFilter] = useState3("all");
   const [roleFilter, setRoleFilter] = useState3(null);
   const [trackFilter, setTrackFilter] = useState3(null);
+  const [platformFilter, setPlatformFilter] = useState3("web");
   const [searchQuery, setSearchQuery] = useState3("");
   const [sortMode, setSortMode] = useState3("priority");
   const [collapsedFolders, setCollapsedFolders] = useState3(/* @__PURE__ */ new Set());
@@ -1813,6 +1978,13 @@ function TestListScreen({ nav }) {
     }
     return Array.from(trackMap.values());
   }, [assignments]);
+  const availablePlatforms = useMemo(() => {
+    const set = /* @__PURE__ */ new Set();
+    for (const a of assignments) {
+      if (a.testCase.platforms) a.testCase.platforms.forEach((p) => set.add(p));
+    }
+    return Array.from(set).sort();
+  }, [assignments]);
   const selectedRole = availableRoles.find((r) => r.id === roleFilter);
   const groupedAssignments = useMemo(() => {
     const groups = /* @__PURE__ */ new Map();
@@ -1873,6 +2045,7 @@ function TestListScreen({ nav }) {
     });
   }, []);
   const filterAssignment = useCallback3((a) => {
+    if (platformFilter && a.testCase.platforms && !a.testCase.platforms.includes(platformFilter)) return false;
     if (roleFilter && a.testCase.role?.id !== roleFilter) return false;
     if (trackFilter && a.testCase.track?.id !== trackFilter) return false;
     if (searchQuery) {
@@ -1885,7 +2058,7 @@ function TestListScreen({ nav }) {
     if (filter === "done") return a.status === "passed";
     if (filter === "reopened") return a.status === "failed";
     return true;
-  }, [roleFilter, trackFilter, searchQuery, filter]);
+  }, [platformFilter, roleFilter, trackFilter, searchQuery, filter]);
   const pendingCount = assignments.filter(
     (a) => a.status === "pending" || a.status === "in_progress"
   ).length;
@@ -2019,6 +2192,59 @@ function TestListScreen({ nav }) {
         }
       }
     ) }),
+    availablePlatforms.length >= 2 && /* @__PURE__ */ jsxs4("div", { style: { display: "flex", gap: 4, marginBottom: 8 }, children: [
+      /* @__PURE__ */ jsx5(
+        "button",
+        {
+          type: "button",
+          onClick: () => setPlatformFilter(null),
+          style: {
+            padding: "3px 8px",
+            borderRadius: 6,
+            backgroundColor: !platformFilter ? colors.card : "transparent",
+            border: !platformFilter ? `1px solid ${colors.border}` : "1px solid transparent",
+            cursor: "pointer",
+            fontSize: 11,
+            color: !platformFilter ? colors.textPrimary : colors.textMuted,
+            fontWeight: !platformFilter ? 600 : 400,
+            whiteSpace: "nowrap"
+          },
+          children: "All Platforms"
+        }
+      ),
+      availablePlatforms.map((p) => {
+        const isActive = platformFilter === p;
+        const label = p === "ios" ? "iOS" : p === "android" ? "Android" : p === "web" ? "Web" : p;
+        const icon = p === "ios" ? "\u{1F4F1}" : p === "android" ? "\u{1F916}" : p === "web" ? "\u{1F310}" : "\u{1F4CB}";
+        return /* @__PURE__ */ jsxs4(
+          "button",
+          {
+            type: "button",
+            onClick: () => setPlatformFilter(isActive ? null : p),
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: 4,
+              padding: "3px 8px",
+              borderRadius: 6,
+              backgroundColor: isActive ? colors.blue + "20" : "transparent",
+              border: isActive ? `1px solid ${colors.blue}60` : "1px solid transparent",
+              cursor: "pointer",
+              fontSize: 11,
+              color: isActive ? colors.blue : colors.textMuted,
+              fontWeight: isActive ? 600 : 400,
+              whiteSpace: "nowrap"
+            },
+            children: [
+              icon,
+              " ",
+              label
+            ]
+          },
+          p
+        );
+      })
+    ] }),
     (availableTracks.length >= 2 || true) && /* @__PURE__ */ jsxs4("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 12 }, children: [
       availableTracks.length >= 2 && /* @__PURE__ */ jsxs4("div", { style: { display: "flex", gap: 4, flex: 1, overflow: "auto" }, children: [
         /* @__PURE__ */ jsx5(
@@ -2332,7 +2558,27 @@ function TestListScreen({ nav }) {
         ]
       }
     ),
-    /* @__PURE__ */ jsx5("div", { style: { display: "flex", justifyContent: "center", paddingTop: 12, paddingBottom: 8 }, children: /* @__PURE__ */ jsx5(
+    dashboardUrl && /* @__PURE__ */ jsx5(
+      "a",
+      {
+        href: `${dashboardUrl}/test-cases`,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: 6,
+          paddingTop: 12,
+          fontSize: 13,
+          fontWeight: 500,
+          color: colors.blue,
+          textDecoration: "none"
+        },
+        children: "\u{1F310} Manage on Dashboard \u2192"
+      }
+    ),
+    /* @__PURE__ */ jsx5("div", { style: { display: "flex", justifyContent: "center", paddingTop: 8, paddingBottom: 8 }, children: /* @__PURE__ */ jsx5(
       "button",
       {
         type: "button",
@@ -3334,7 +3580,7 @@ var styles3 = {
 // src/widget/screens/MessageListScreen.tsx
 import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 function MessageListScreen({ nav }) {
-  const { threads, unreadCount, refreshThreads, isLoading } = useBugBear();
+  const { threads, unreadCount, refreshThreads, dashboardUrl, isLoading } = useBugBear();
   if (isLoading) return /* @__PURE__ */ jsx12(MessageListScreenSkeleton, {});
   return /* @__PURE__ */ jsxs11("div", { children: [
     /* @__PURE__ */ jsx12(
@@ -3523,6 +3769,26 @@ function MessageListScreen({ nav }) {
       },
       thread.id
     )) }),
+    dashboardUrl && /* @__PURE__ */ jsx12(
+      "a",
+      {
+        href: `${dashboardUrl}/discussions`,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: 6,
+          paddingTop: 12,
+          fontSize: 13,
+          fontWeight: 500,
+          color: colors.blue,
+          textDecoration: "none"
+        },
+        children: "\u{1F310} View on Dashboard \u2192"
+      }
+    ),
     /* @__PURE__ */ jsxs11(
       "div",
       {
@@ -3530,7 +3796,7 @@ function MessageListScreen({ nav }) {
           display: "flex",
           justifyContent: "space-between",
           alignItems: "center",
-          paddingTop: 12,
+          paddingTop: 8,
           paddingLeft: 4,
           paddingRight: 4
         },
@@ -4654,6 +4920,7 @@ var SEVERITY_CONFIG = {
   low: { label: "Low", color: "#71717a", bg: "#27272a" }
 };
 function IssueDetailScreen({ nav, issue }) {
+  const { dashboardUrl } = useBugBear();
   const statusConfig = STATUS_LABELS[issue.status] || { label: issue.status, bg: "#27272a", color: "#a1a1aa" };
   const severityConfig = issue.severity ? SEVERITY_CONFIG[issue.severity] : null;
   return /* @__PURE__ */ jsxs16("div", { children: [
@@ -4771,7 +5038,29 @@ function IssueDetailScreen({ nav, issue }) {
         " \xB7 Updated ",
         formatRelativeTime(issue.updatedAt)
       ] })
-    ] })
+    ] }),
+    dashboardUrl && /* @__PURE__ */ jsx17(
+      "a",
+      {
+        href: `${dashboardUrl}/reports`,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: 6,
+          marginTop: 12,
+          padding: "10px 0",
+          fontSize: 13,
+          fontWeight: 500,
+          color: colors.blue,
+          textDecoration: "none",
+          borderTop: `1px solid ${colors.border}`
+        },
+        children: "\u{1F310} View on Dashboard \u2192"
+      }
+    )
   ] });
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbearai/react",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "BugBear React components for web apps",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",