From 13e3d8b9b2fcfe6ef6b9c16442dad67dcf6dbece Mon Sep 17 00:00:00 2001
From: RachelElysia <71795832+RachelElysia@users.noreply.github.com>
Date: Wed, 7 Jun 2023 16:47:10 -0400
Subject: [PATCH] Fleet UI: Click dropdown label option again to deselect on
 manage host table (#12202)

---
 changes/7601-deselect-label-filter                       | 1 +
 frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx | 7 ++++++-
 2 files changed, 7 insertions(+), 1 deletion(-)
 create mode 100644 changes/7601-deselect-label-filter

diff --git a/changes/7601-deselect-label-filter b/changes/7601-deselect-label-filter
new file mode 100644
index 0000000000..52bc095fbd
--- /dev/null
+++ b/changes/7601-deselect-label-filter
@@ -0,0 +1 @@
+- Ability to deselect label filter on host table
diff --git a/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx b/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx
index 00b81b509b..f3acb63359 100644
--- a/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx
+++ b/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tsx
@@ -501,6 +501,9 @@ const ManageHostsPage = ({
   const handleLabelChange = ({ slug }: ILabel): boolean => {
     const { MANAGE_HOSTS } = PATHS;
 
+    const isDeselectingLabel =
+      labelID && labelID === selectedLabel?.id.toString();
+
     // Non-status labels are not compatible with policies or software filters
     // so omit policies and software params from next location
     let newQueryParams = queryParams;
@@ -514,7 +517,9 @@ const ManageHostsPage = ({
 
     router.replace(
       getNextLocationPath({
-        pathPrefix: `${MANAGE_HOSTS}/${slug}`,
+        pathPrefix: isDeselectingLabel
+          ? MANAGE_HOSTS
+          : `${MANAGE_HOSTS}/${slug}`,
         queryParams: newQueryParams,
       })
     );