@meridianlabs/log-viewer 0.3.184 → 0.3.186

package/lib/app/log-list/grid/LogListGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LogListGrid.d.ts","sourceRoot":"","sources":["../../../../src/app/log-list/grid/LogListGrid.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,OAAO,EAAE,EAAE,EAAE,SAAS,EAA2C,MAAM,OAAO,CAAC;AAK/E,OAAO,qBAAqB,CAAC;AAI7B,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAEzE,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,UAAU,gBAAgB;IACxB,KAAK,EAAE,KAAK,CAAC,WAAW,GAAG,aAAa,GAAG,eAAe,CAAC,CAAC;IAC5D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA0P5C,CAAC"}
+{"version":3,"file":"LogListGrid.d.ts","sourceRoot":"","sources":["../../../../src/app/log-list/grid/LogListGrid.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,OAAO,EACL,EAAE,EAEF,SAAS,EAMV,MAAM,OAAO,CAAC;AAMf,OAAO,qBAAqB,CAAC;AAI7B,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAEzE,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,UAAU,gBAAgB;IACxB,KAAK,EAAE,KAAK,CAAC,WAAW,GAAG,aAAa,GAAG,eAAe,CAAC,CAAC;IAC5D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAsX5C,CAAC"}

package/lib/app/log-list/grid/columns/types.d.ts

@@ -12,6 +12,7 @@ export interface LogListRow {
     completedAt?: string;
     itemCount?: number;
     log?: LogHandle;
+    searchText?: string;
     [key: string]: any;
 }
 //# sourceMappingURL=types.d.ts.map

package/lib/app/log-list/grid/columns/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/app/log-list/grid/columns/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,GAAG,QAAQ,GAAG,cAAc,CAAC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/app/log-list/grid/columns/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,GAAG,QAAQ,GAAG,cAAc,CAAC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB"}

package/lib/app/samples/SampleDetailComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SampleDetailComponent.d.ts","sourceRoot":"","sources":["../../../src/app/samples/SampleDetailComponent.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAmC,MAAM,OAAO,CAAC;AAYnE;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC,gDAAgD;IAChD,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,4CAA4C;IAC5C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,wDAAwD;IACxD,WAAW,EAAE,OAAO,CAAC;IACrB,oDAAoD;IACpD,OAAO,EAAE,OAAO,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B,gDAAgD;IAChD,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,gEAAgE;IAChE,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5D,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,oCAAoC;IACpC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,gCAAgC;IAChC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,mFAAmF;IACnF,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,oDAAoD;IACpD,UAAU,EAAE,sBAAsB,CAAC;IACnC,8DAA8D;IAC9D,YAAY,EAAE,YAAY,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CAoKhE,CAAC"}
+{"version":3,"file":"SampleDetailComponent.d.ts","sourceRoot":"","sources":["../../../src/app/samples/SampleDetailComponent.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAmC,MAAM,OAAO,CAAC;AAYnE;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC,gDAAgD;IAChD,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,4CAA4C;IAC5C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,wDAAwD;IACxD,WAAW,EAAE,OAAO,CAAC;IACrB,oDAAoD;IACpD,OAAO,EAAE,OAAO,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B,gDAAgD;IAChD,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,gEAAgE;IAChE,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5D,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,oCAAoC;IACpC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,gCAAgC;IAChC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,mFAAmF;IACnF,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,oDAAoD;IACpD,UAAU,EAAE,sBAAsB,CAAC;IACnC,8DAA8D;IAC9D,YAAY,EAAE,YAAY,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CAqKhE,CAAC"}

package/lib/components/FindBand.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FindBand.d.ts","sourceRoot":"","sources":["../../src/components/FindBand.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,EAAE,EAOH,MAAM,OAAO,CAAC;AAMf,OAAO,gBAAgB,CAAC;AAExB,UAAU,aAAa;CAAG;AAU1B,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAyWtC,CAAC"}
+{"version":3,"file":"FindBand.d.ts","sourceRoot":"","sources":["../../src/components/FindBand.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EAOH,MAAM,OAAO,CAAC;AAOf,UAAU,aAAa;CAAG;AAU1B,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAuUtC,CAAC"}

package/lib/components/FindBandUI.d.ts

@@ -0,0 +1,18 @@
+import { FC, KeyboardEvent, RefObject } from 'react';
+interface FindBandUIProps {
+    onClose: () => void;
+    onNext: () => void;
+    onPrevious: () => void;
+    onKeyDown?: (e: KeyboardEvent<HTMLInputElement>) => void;
+    onChange?: () => void;
+    onBeforeInput?: () => void;
+    value?: string;
+    matchCount?: number;
+    matchIndex?: number;
+    noResults?: boolean;
+    disableNav?: boolean;
+    inputRef?: RefObject<HTMLInputElement | null>;
+}
+export declare const FindBandUI: FC<FindBandUIProps>;
+export {};
+//# sourceMappingURL=FindBandUI.d.ts.map

package/lib/components/FindBandUI.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FindBandUI.d.ts","sourceRoot":"","sources":["../../src/components/FindBandUI.tsx"],"names":[],"mappings":"AACA,OAAc,EAAE,EAAE,EAAE,aAAa,EAAE,SAAS,EAAU,MAAM,OAAO,CAAC;AAEpE,OAAO,gBAAgB,CAAC;AAExB,UAAU,eAAe;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACzD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;CAC/C;AAED,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CA4E1C,CAAC"}

package/lib/index.js

@@ -17274,7 +17274,6 @@ const createSampleSlice = (set3, get2, _store) => {
           state.sample.sampleStatus = "loading";
           state.sample.sampleError = void 0;
           state.sample.sample_identifier = { logFile, id, epoch };
-          state.log.selectedSampleHandle = void 0;
         });
       },
       setSampleStatus: (status2) => set3((state) => {
@@ -106556,7 +106555,7 @@ const ViewerOptionsPopover = ({
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx(styles$1d.fullWidth, styles$1d.fullWidthPadded), children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: styles$1d.logDir, children: logDir2 }) }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx(styles$1d.spacer) }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx("text-style-label", "text-style-secondary"), children: "Version" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx(), children: "0.3.184-0-g924aa90c5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx(), children: "0.3.186-0-ge771f5dd8" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx("text-style-label", "text-style-secondary"), children: "Schema" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx(), children: DB_VERSION }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx(styles$1d.spacer) }),
@@ -164277,6 +164276,82 @@ var AgGridReact = class extends Component$1 {
     return /* @__PURE__ */ React3__default.createElement(AgGridReactUi, { ...this.props, passGridApi: this.setGridApi });
   }
 };
+const FindBandUI = ({
+  onClose,
+  onNext,
+  onPrevious,
+  onKeyDown,
+  onChange,
+  onBeforeInput,
+  value: value2,
+  matchCount,
+  matchIndex,
+  noResults = false,
+  disableNav,
+  inputRef: externalRef
+}) => {
+  const internalRef = useRef(null);
+  const inputRef = externalRef ?? internalRef;
+  const inputProps = {
+    type: "text",
+    placeholder: "Find",
+    onKeyDown,
+    onBeforeInput,
+    onChange
+  };
+  if (value2 !== void 0) {
+    inputProps.value = value2;
+  }
+  const hasCount = matchCount !== void 0 && matchIndex !== void 0;
+  const showStatus = noResults || hasCount && matchCount > 0;
+  const statusText2 = hasCount && matchCount > 0 ? `${matchIndex + 1} of ${matchCount}` : "No results";
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { "data-unsearchable": "true", className: clsx("findBand"), children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("input", { ref: inputRef, ...inputProps }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "span",
+      {
+        className: clsx(
+          "findBand-match-count",
+          noResults && matchCount === 0 && "findBand-no-results"
+        ),
+        style: { visibility: showStatus ? "visible" : "hidden" },
+        children: statusText2
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "button",
+      {
+        type: "button",
+        title: "Previous match",
+        className: "btn prev",
+        onClick: onPrevious,
+        disabled: disableNav,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx("i", { className: ApplicationIcons.arrows.up })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "button",
+      {
+        type: "button",
+        title: "Next match",
+        className: "btn next",
+        onClick: onNext,
+        disabled: disableNav,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx("i", { className: ApplicationIcons.arrows.down })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "button",
+      {
+        type: "button",
+        title: "Close",
+        className: "btn close",
+        onClick: onClose,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx("i", { className: ApplicationIcons.close })
+      }
+    )
+  ] });
+};
 ModuleRegistry.registerModules([AllCommunityModule]);
 const createGridKeyboardHandler = ({
   gridRef,
@@ -164378,6 +164453,17 @@ const LogListGrid = ({
   const internalGridRef = useRef(null);
   const gridRef = externalGridRef ?? internalGridRef;
   const gridContainerRef = useRef(null);
+  const [showFind, setShowFind] = useState(false);
+  const [findTerm, setFindTerm] = useState("");
+  const [matchIds, setMatchIds] = useState([]);
+  const [currentMatchIndex, setCurrentMatchIndex] = useState(0);
+  const findInputRef = useRef(null);
+  const closeFind = useCallback(() => {
+    setShowFind(false);
+    setFindTerm("");
+    setMatchIds([]);
+    setCurrentMatchIndex(0);
+  }, []);
   const logFiles = useMemo(() => {
     return items.filter((item2) => item2.type === "file").map((item2) => item2.log).filter((file) => file !== void 0);
   }, [items]);
@@ -164427,6 +164513,7 @@ const LogListGrid = ({
           }
         }
       }
+      row2.searchText = [row2.name, row2.task, row2.model, row2.id].filter(Boolean).join(" ").toLowerCase();
       return row2;
     });
   }, [items, logDetails]);
@@ -164513,47 +164600,145 @@ const LogListGrid = ({
   useEffect(() => {
     resizeGridColumns();
   }, [columns, resizeGridColumns]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: clsx(styles$18.gridWrapper), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: gridContainerRef, className: styles$18.gridContainer, tabIndex: 0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-    AgGridReact,
-    {
-      ref: gridRef,
-      rowData: data,
-      animateRows: false,
-      columnDefs: columns,
-      defaultColDef: {
-        sortable: true,
-        filter: true,
-        resizable: true
-      },
-      autoSizeStrategy: { type: "fitGridWidth" },
-      headerHeight: 25,
-      rowSelection: { mode: "singleRow", checkboxes: false },
-      getRowId: (params) => params.data.id,
-      onGridColumnsChanged: (e) => {
-        const cols = e.api.getColumnDefs();
-        if (cols && cols?.length > maxColCount.current) {
-          maxColCount.current = cols.length;
-          resizeGridColumns();
+  const performSearch = useCallback(
+    (term) => {
+      const api2 = gridRef.current?.api;
+      if (!api2 || !term) {
+        setMatchIds([]);
+        setCurrentMatchIndex(0);
+        return;
+      }
+      const lowerTerm = term.toLowerCase();
+      const foundIds = [];
+      api2.forEachNode((node2) => {
+        const rowData = node2.data;
+        if (!rowData?.searchText) return;
+        if (rowData.searchText.includes(lowerTerm)) {
+          foundIds.push(rowData.id);
         }
-      },
-      onGridSizeChanged: resizeGridColumns,
-      theme: themeBalham,
-      enableCellTextSelection: true,
-      initialState: initialGridState,
-      suppressCellFocus: true,
-      onStateUpdated: (e) => {
-        setGridState(e.state);
-        if (gridRef.current?.api) {
-          const displayedRowCount = gridRef.current.api.getDisplayedRowCount();
-          setFilteredCount(displayedRowCount);
+      });
+      setMatchIds(foundIds);
+      setCurrentMatchIndex(0);
+      if (foundIds.length > 0) {
+        const firstNode = api2.getRowNode(foundIds[0]);
+        if (firstNode) {
+          api2.deselectAll();
+          api2.ensureNodeVisible(firstNode, "middle");
+          firstNode.setSelected(true, true);
         }
-      },
-      onRowClicked: handleRowClick,
-      onSortChanged: handleSortChanged,
-      onFilterChanged: handleFilterChanged,
-      loading: data.length === 0 && (loading > 0 || syncing)
+      }
+    },
+    [gridRef]
+  );
+  const goToMatch = useCallback(
+    (index) => {
+      if (matchIds.length === 0) return;
+      const idx = (index % matchIds.length + matchIds.length) % matchIds.length;
+      setCurrentMatchIndex(idx);
+      const api2 = gridRef.current?.api;
+      if (!api2) return;
+      const node2 = api2.getRowNode(matchIds[idx]);
+      if (node2) {
+        api2.deselectAll();
+        api2.ensureNodeVisible(node2, "middle");
+        node2.setSelected(true, true);
+      }
+    },
+    [matchIds, gridRef]
+  );
+  const handleInputKeyDown = useCallback(
+    (e) => {
+      if (e.key === "Escape") {
+        closeFind();
+      } else if (e.key === "Enter") {
+        e.preventDefault();
+        goToMatch(currentMatchIndex + (e.shiftKey ? -1 : 1));
+      }
+    },
+    [goToMatch, currentMatchIndex, closeFind]
+  );
+  useEffect(() => {
+    const handleFindKeyDown = (e) => {
+      if ((e.metaKey || e.ctrlKey) && e.key === "f") {
+        e.preventDefault();
+        e.stopPropagation();
+        setShowFind(true);
+        setTimeout(() => findInputRef.current?.focus(), 100);
+      }
+      if (e.key === "Escape" && showFind) {
+        closeFind();
+      }
+    };
+    document.addEventListener("keydown", handleFindKeyDown, true);
+    return () => document.removeEventListener("keydown", handleFindKeyDown, true);
+  }, [closeFind, showFind]);
+  useEffect(() => {
+    if (findTerm) {
+      performSearch(findTerm);
+    } else {
+      setMatchIds([]);
+      setCurrentMatchIndex(0);
     }
-  ) }) });
+  }, [findTerm, performSearch]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: clsx(styles$18.gridWrapper), children: [
+    showFind && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      FindBandUI,
+      {
+        inputRef: findInputRef,
+        value: findTerm,
+        onChange: () => setFindTerm(findInputRef.current?.value ?? ""),
+        onKeyDown: handleInputKeyDown,
+        onClose: closeFind,
+        onPrevious: () => goToMatch(currentMatchIndex - 1),
+        onNext: () => goToMatch(currentMatchIndex + 1),
+        disableNav: matchIds.length === 0,
+        noResults: !!findTerm && matchIds.length === 0,
+        matchCount: findTerm ? matchIds.length : void 0,
+        matchIndex: findTerm ? currentMatchIndex : void 0
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: gridContainerRef, className: styles$18.gridContainer, tabIndex: 0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      AgGridReact,
+      {
+        ref: gridRef,
+        rowData: data,
+        animateRows: false,
+        columnDefs: columns,
+        defaultColDef: {
+          sortable: true,
+          filter: true,
+          resizable: true
+        },
+        autoSizeStrategy: { type: "fitGridWidth" },
+        headerHeight: 25,
+        rowSelection: { mode: "singleRow", checkboxes: false },
+        getRowId: (params) => params.data.id,
+        onGridColumnsChanged: (e) => {
+          const cols = e.api.getColumnDefs();
+          if (cols && cols?.length > maxColCount.current) {
+            maxColCount.current = cols.length;
+            resizeGridColumns();
+          }
+        },
+        onGridSizeChanged: resizeGridColumns,
+        theme: themeBalham,
+        enableCellTextSelection: true,
+        initialState: initialGridState,
+        suppressCellFocus: true,
+        onStateUpdated: (e) => {
+          setGridState(e.state);
+          if (gridRef.current?.api) {
+            const displayedRowCount = gridRef.current.api.getDisplayedRowCount();
+            setFilteredCount(displayedRowCount);
+          }
+        },
+        onRowClicked: handleRowClick,
+        onSortChanged: handleSortChanged,
+        onFilterChanged: handleFilterChanged,
+        loading: data.length === 0 && (loading > 0 || syncing)
+      }
+    ) })
+  ] });
 };
 const footer$1 = "_footer_14uod_1";
 const spinnerContainer$1 = "_spinnerContainer_14uod_11";
@@ -165539,64 +165724,21 @@ const FindBand = () => {
       document.removeEventListener("keydown", handleGlobalKeyDown, true);
     };
   }, [handleSearch, restoreCursor]);
-  const matchCountLabel = useMemo(() => {
-    if (matchCount === null) return null;
-    if (matchCount === 0) return "No results";
-    return `${currentMatchIndex} of ${matchCount}`;
-  }, [matchCount, currentMatchIndex]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { "data-unsearchable": "true", className: clsx("findBand"), children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "input",
-      {
-        type: "text",
-        ref: searchBoxRef,
-        placeholder: "Find",
-        onKeyDown: handleKeyDown,
-        onBeforeInput: handleBeforeInput,
-        onChange: handleInputChange
-      }
-    ),
-    matchCountLabel !== null && /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "span",
-      {
-        className: clsx(
-          "findBand-match-count",
-          matchCount === 0 && "findBand-no-results"
-        ),
-        children: matchCountLabel
-      }
-    ),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "button",
-      {
-        type: "button",
-        title: "Previous match",
-        className: "btn next",
-        onClick: findPrevious,
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx("i", { className: ApplicationIcons.arrows.up })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "button",
-      {
-        type: "button",
-        title: "Next match",
-        className: "btn prev",
-        onClick: findNext,
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx("i", { className: ApplicationIcons.arrows.down })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "button",
-      {
-        type: "button",
-        title: "Close",
-        className: "btn close",
-        onClick: storeHideFind,
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx("i", { className: ApplicationIcons.close })
-      }
-    )
-  ] });
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    FindBandUI,
+    {
+      inputRef: searchBoxRef,
+      onClose: storeHideFind,
+      onNext: findNext,
+      onPrevious: findPrevious,
+      onKeyDown: handleKeyDown,
+      onBeforeInput: handleBeforeInput,
+      onChange: handleInputChange,
+      noResults: matchCount !== null && matchCount === 0,
+      matchCount: matchCount ?? void 0,
+      matchIndex: matchCount !== null && matchCount > 0 ? currentMatchIndex - 1 : void 0
+    }
+  );
 };
 function windowFind(searchTerm, back) {
   return window.find(
@@ -180930,7 +181072,8 @@ const SampleDetailComponent = ({
   }, [sampleData]);
   const sampleStatus2 = useStore((state) => state.sample.sampleStatus);
   const sampleMatchesRequest = useMemo(() => {
-    if (!sample2 || !sampleId || !epoch) return false;
+    if (!sampleId || !epoch) return false;
+    if (!sample2) return true;
     return String(sample2.id) === sampleId && sample2.epoch === parseInt(epoch, 10);
   }, [sample2, sampleId, epoch]);
   const showFind = useStore((state) => state.app.showFind);
@@ -181043,7 +181186,7 @@ const SampleDetailComponent = ({
           ] })
         }
       ),
-      sampleStatus2 !== "loading" && sample2 && sampleMatchesRequest && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      sampleStatus2 !== "loading" && sampleMatchesRequest && /* @__PURE__ */ jsxRuntimeExports.jsx(
         InlineSampleComponent,
         {
           showActivity: false,