src/components/common/Loki/LokiPanel.js

@@ -32,7 +32,7 @@ const classes = {
   undeployed: `${PREFIX}-undeployed`
 };
 
-const Root = styled("html")(({ theme }) => ({
+const Root = styled("div")(({ theme }) => ({
   [`& .${classes.formControl}`]: {
     margin: theme.spacing(0),
     minWidth: 120

src/components/records/RecordSearch.js

@@ -83,7 +83,7 @@ export function RecordSearch({ iocName, rowType }) {
 
   const rowsPerPage = [20, 50];
 
-  const { pagination, setPagination } = usePagination({
+  const { pagination, setPagination, setTotalCount } = usePagination({
     rowsPerPageOptions: rowsPerPage,
     initLimit: urlPagination.rows ?? rowsPerPage[0],
     initPage: urlPagination.page ?? 0
@@ -91,8 +91,14 @@ export function RecordSearch({ iocName, rowType }) {
 
   // update pagination whenever search result total pages change
   useEffect(() => {
-    setPagination({ totalCount: records?.totalCount ?? 0 });
-  }, [setPagination, records?.totalCount]);
+    setTotalCount((prev) => {
+      if (prev === pagination.totalCount && prev > 0) {
+        return prev;
+      } else {
+        return records?.totalCount ?? 0;
+      }
+    });
+  }, [pagination, records?.totalCount, setTotalCount]);
 
   // whenever url state changes, update pagination
   useEffect(() => {
@@ -110,6 +116,7 @@ export function RecordSearch({ iocName, rowType }) {
     let requestParams = initRequestParams(pagination);
     requestParams.pv_status = recordFilter;
     requestParams.record_name = deserialize(urlState.query);
+    requestParams.ioc_name = iocName;
     getRecords(requestParams);
 
     return () => {