Fix encounter polling lifecycle for bulk-import detection

Three issues prevented the bounding box from rendering after detection
completes for bulk-imported encounters:

1. setMediaAssets mutated _encounterData.mediaAssets in place. React
   useEffects keyed on store.encounterData saw the same reference and
   never re-ran, so rects/imageReady never updated when polling
   returned new annotations. Switched to immutable update: replace
   _encounterData with a new object.

2. The polling predicate treated null detectionStatus as terminal.
   Bulk imports create encounters with a trivial placeholder annotation
   and detectionStatus=null while detection is queued to WBIA. The
   first poll saw null, stopped polling, and never noticed when
   detection actually completed. Added isAwaitingBulkImportDetection
   helper that keeps polling alive when detectionStatus is null,
   importTaskId is set, and only trivial annotations exist.

3. ImageCard's "Detection in progress" indicator used the same broken
   predicate. Now uses the shared helper so the spinner shows during
   the WBIA wait.

Centralized the predicates in pollingHelpers.js so Encounter.jsx and
ImageCard.jsx can't drift. Added MAX_POLL_CYCLES=100 (~5 min at 3s
interval) safety cap so encounters that never get detection don't
poll forever.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: JasonWildMe

frontend/src/pages/Encounter/Encounter.jsx

@@ -38,6 +38,11 @@ import { Divider } from "antd";
 import { get } from "lodash-es";
 import CollabModal from "./CollabModal";
 import Alert from "react-bootstrap/Alert";
+import {
+  shouldContinuePollingEncounter,
+  POLL_INTERVAL_MS,
+  MAX_POLL_CYCLES,
+} from "./pollingHelpers";
 
 const Encounter = observer(() => {
   const [store] = useState(() => new EncounterStore());
@@ -72,26 +77,7 @@ const Encounter = observer(() => {
   useEffect(() => {
     let cancelled = false;
     let timeoutId = null;
-
-    const isTerminalDetectionStatus = (status) =>
-      !status ||
-      status === "complete" ||
-      status === "error" ||
-      status === "pending";
-
-    const shouldContinuePolling = (encounterData) => {
-      const mediaAssets = Array.isArray(encounterData?.mediaAssets)
-        ? encounterData.mediaAssets
-        : [];
-
-      if (mediaAssets.length === 0) {
-        return false;
-      }
-
-      return mediaAssets.some(
-        (asset) => !isTerminalDetectionStatus(asset?.detectionStatus),
-      );
-    };
+    let pollCount = 0;
 
     const fetchEncounter = async () => {
       try {
@@ -108,8 +94,12 @@ const Encounter = observer(() => {
           store.setMediaAssets(res.data.mediaAssets);
         }
 
-        if (shouldContinuePolling(res.data)) {
-          timeoutId = window.setTimeout(fetchEncounter, 3000);
+        pollCount++;
+        if (
+          pollCount < MAX_POLL_CYCLES &&
+          shouldContinuePollingEncounter(res.data)
+        ) {
+          timeoutId = window.setTimeout(fetchEncounter, POLL_INTERVAL_MS);
         }
       } catch (_err) {
         if (!cancelled && isInitialLoad.current) {

frontend/src/pages/Encounter/ImageCard.jsx

@@ -14,6 +14,7 @@ import Tooltip from "../../components/ToolTip";
 import axios from "axios";
 import { useIntl } from "react-intl";
 import SpotMappingIcon2 from "../../components/icons/SpotMappingIcon2";
+import { isAssetActivelyAwaitingDetection } from "./pollingHelpers";
 
 const ImageCard = observer(({ store = {} }) => {
   const imgRef = useRef(null);
@@ -67,17 +68,11 @@ const ImageCard = observer(({ store = {} }) => {
     JSON.stringify(editAnnotationParams),
   );
 
-  const isTerminalDetectionStatus = (status) =>
-    !status ||
-    status === "complete" ||
-    status === "error" ||
-    status === "pending";
-
   const selectedAsset =
     store.encounterData?.mediaAssets?.[store.selectedImageIndex];
-  const selectedAssetDetectionStatus = selectedAsset?.detectionStatus;
   const isDetectionInProgress =
-    !!selectedAsset && !isTerminalDetectionStatus(selectedAssetDetectionStatus);
+    !!selectedAsset &&
+    isAssetActivelyAwaitingDetection(selectedAsset, store.encounterData);
 
   const handleEnter = (text) => setTip((s) => ({ ...s, show: true, text }));
   const handleMove = (e) => {

frontend/src/pages/Encounter/pollingHelpers.js

@@ -0,0 +1,43 @@
+// Shared detection-status predicates used by Encounter.jsx polling loop and
+// ImageCard.jsx "Detection in progress" indicator. Keeping them here avoids
+// the two files drifting out of sync.
+
+const POLL_INTERVAL_MS = 3000;
+const MAX_POLL_CYCLES = 100; // 100 cycles * 3s = ~5 minutes
+
+const isAnnotationTrivial = (a) => a?.isTrivial === true || a?.trivial === true;
+
+export const isTerminalDetectionStatus = (status) =>
+  !status ||
+  status === "complete" ||
+  status === "error" ||
+  status === "pending";
+
+// True when an asset is from a bulk import and detection has been queued
+// to WBIA but the callback hasn't returned yet. In this state the API
+// returns detectionStatus=null and only a trivial placeholder annotation.
+// Scoped to encounters that have an importTaskId so we don't poll forever
+// on legacy/manual encounters that intentionally never run detection.
+export const isAwaitingBulkImportDetection = (asset, encounterData) => {
+  if (!encounterData?.importTaskId) return false;
+  if (asset?.detectionStatus !== null && asset?.detectionStatus !== undefined)
+    return false;
+  const anns = Array.isArray(asset?.annotations) ? asset.annotations : [];
+  return anns.length > 0 && anns.every(isAnnotationTrivial);
+};
+
+export const isAssetActivelyAwaitingDetection = (asset, encounterData) =>
+  !isTerminalDetectionStatus(asset?.detectionStatus) ||
+  isAwaitingBulkImportDetection(asset, encounterData);
+
+export const shouldContinuePollingEncounter = (encounterData) => {
+  const mediaAssets = Array.isArray(encounterData?.mediaAssets)
+    ? encounterData.mediaAssets
+    : [];
+  if (mediaAssets.length === 0) return false;
+  return mediaAssets.some((asset) =>
+    isAssetActivelyAwaitingDetection(asset, encounterData),
+  );
+};
+
+export { POLL_INTERVAL_MS, MAX_POLL_CYCLES };

frontend/src/pages/Encounter/stores/EncounterStore.js

@@ -162,7 +162,7 @@ class EncounterStore {
 
   setMediaAssets(mediaAssets) {
     if (this._encounterData) {
-      this._encounterData.mediaAssets = mediaAssets;
+      this._encounterData = { ...this._encounterData, mediaAssets };
     }
   }