From a4728fd030784846d408a65623c9df5aeb138e68 Mon Sep 17 00:00:00 2001
From: Julius Volz <julius.volz@gmail.com>
Date: Fri, 28 Mar 2025 17:55:37 +0100
Subject: [PATCH] Hide empty target pools and alert groups by default (#16341)

Also change the SD page setting for this to be in localStorage, as on the
other pages.

Should help a tiny bit with https://github.com/prometheus/prometheus/issues/16308

Signed-off-by: Julius Volz <julius.volz@gmail.com>
---
 web/ui/mantine-ui/src/pages/AlertsPage.tsx            |  2 +-
 .../service-discovery/ServiceDiscoveryPoolsList.tsx   | 11 +++++------
 .../mantine-ui/src/pages/targets/ScrapePoolsList.tsx  |  2 +-
 3 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/web/ui/mantine-ui/src/pages/AlertsPage.tsx b/web/ui/mantine-ui/src/pages/AlertsPage.tsx
index 4ce42d9059..18325350b6 100644
--- a/web/ui/mantine-ui/src/pages/AlertsPage.tsx
+++ b/web/ui/mantine-ui/src/pages/AlertsPage.tsx
@@ -164,7 +164,7 @@ export default function AlertsPage() {
   const [debouncedSearch] = useDebouncedValue<string>(searchFilter.trim(), 250);
   const [showEmptyGroups, setShowEmptyGroups] = useLocalStorage<boolean>({
     key: "alertsPage.showEmptyGroups",
-    defaultValue: true,
+    defaultValue: false,
   });
 
   const { alertGroupsPerPage } = useSettings();
diff --git a/web/ui/mantine-ui/src/pages/service-discovery/ServiceDiscoveryPoolsList.tsx b/web/ui/mantine-ui/src/pages/service-discovery/ServiceDiscoveryPoolsList.tsx
index 6aec62fcc5..0501fd6788 100644
--- a/web/ui/mantine-ui/src/pages/service-discovery/ServiceDiscoveryPoolsList.tsx
+++ b/web/ui/mantine-ui/src/pages/service-discovery/ServiceDiscoveryPoolsList.tsx
@@ -25,9 +25,8 @@ import {
 } from "../../state/serviceDiscoveryPageSlice";
 import CustomInfiniteScroll from "../../components/CustomInfiniteScroll";
 
-import { useDebouncedValue } from "@mantine/hooks";
+import { useDebouncedValue, useLocalStorage } from "@mantine/hooks";
 import { targetPoolDisplayLimit } from "./ServiceDiscoveryPage";
-import { BooleanParam, useQueryParam, withDefault } from "use-query-params";
 import { LabelBadges } from "../../components/LabelBadges";
 
 type TargetLabels = {
@@ -154,10 +153,10 @@ const ScrapePoolList: FC<ScrapePoolListProp> = ({
   searchFilter,
 }) => {
   const dispatch = useAppDispatch();
-  const [showEmptyPools, setShowEmptyPools] = useQueryParam(
-    "showEmptyPools",
-    withDefault(BooleanParam, true)
-  );
+  const [showEmptyPools, setShowEmptyPools] = useLocalStorage<boolean>({
+    key: "serviceDiscoveryPage.showEmptyPools",
+    defaultValue: false,
+  });
 
   // Based on the selected pool (if any), load the list of targets.
   const {
diff --git a/web/ui/mantine-ui/src/pages/targets/ScrapePoolsList.tsx b/web/ui/mantine-ui/src/pages/targets/ScrapePoolsList.tsx
index 80eb58540c..c444747724 100644
--- a/web/ui/mantine-ui/src/pages/targets/ScrapePoolsList.tsx
+++ b/web/ui/mantine-ui/src/pages/targets/ScrapePoolsList.tsx
@@ -167,7 +167,7 @@ const ScrapePoolList: FC<ScrapePoolListProp> = ({
   const dispatch = useAppDispatch();
   const [showEmptyPools, setShowEmptyPools] = useLocalStorage<boolean>({
     key: "targetsPage.showEmptyPools",
-    defaultValue: true,
+    defaultValue: false,
   });
 
   const { collapsedPools, showLimitAlert } = useAppSelector(