From eaa3ce071c8d48bb8a7cdbc17ee74ac3718fb3d6 Mon Sep 17 00:00:00 2001
From: RachelElysia <71795832+RachelElysia@users.noreply.github.com>
Date: Fri, 28 Mar 2025 10:46:22 -0400
Subject: [PATCH] Fleet UI: Fix dropdown from changing when vuln filters change
 (#27620)

---
 .../SoftwareTitles/SoftwareTable/helpers.ts      |  1 +
 .../details/cards/Software/HostSoftware.tsx      | 16 +++++++---------
 .../hosts/details/cards/Software/helpers.tsx     | 10 ++++++++++
 3 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/frontend/pages/SoftwarePage/SoftwareTitles/SoftwareTable/helpers.ts b/frontend/pages/SoftwarePage/SoftwareTitles/SoftwareTable/helpers.ts
index b4dacf1c7d..c798768f27 100644
--- a/frontend/pages/SoftwarePage/SoftwareTitles/SoftwareTable/helpers.ts
+++ b/frontend/pages/SoftwarePage/SoftwareTitles/SoftwareTable/helpers.ts
@@ -88,6 +88,7 @@ export const buildSoftwareFilterQueryParams = (
   }
 };
 
+// TODO: Consider parsing SoftwarePage query params to change from type string
 export const getSoftwareFilterFromQueryParams = (queryParams: QueryParams) => {
   const { available_for_install, self_service } = queryParams;
   switch (true) {
diff --git a/frontend/pages/hosts/details/cards/Software/HostSoftware.tsx b/frontend/pages/hosts/details/cards/Software/HostSoftware.tsx
index 91c62bea80..9c3b5056a1 100644
--- a/frontend/pages/hosts/details/cards/Software/HostSoftware.tsx
+++ b/frontend/pages/hosts/details/cards/Software/HostSoftware.tsx
@@ -30,14 +30,17 @@ import SoftwareFiltersModal from "pages/SoftwarePage/components/SoftwareFiltersM
 import {
   buildSoftwareFilterQueryParams,
   buildSoftwareVulnFiltersQueryParams,
-  getSoftwareFilterFromQueryParams,
   getSoftwareVulnFiltersFromQueryParams,
   ISoftwareVulnFiltersParams,
 } from "pages/SoftwarePage/SoftwareTitles/SoftwareTable/helpers";
 import { generateSoftwareTableHeaders as generateHostSoftwareTableConfig } from "./HostSoftwareTableConfig";
 import { generateSoftwareTableHeaders as generateDeviceSoftwareTableConfig } from "./DeviceSoftwareTableConfig";
 import HostSoftwareTable from "./HostSoftwareTable";
-import { getInstallErrorMessage, getUninstallErrorMessage } from "./helpers";
+import {
+  getHostSoftwareFilterFromQueryParams,
+  getInstallErrorMessage,
+  getUninstallErrorMessage,
+} from "./helpers";
 
 const baseClass = "software-card";
 
@@ -131,7 +134,7 @@ const HostSoftware = ({
 
   const isUnsupported =
     isAndroid(platform) || (isIPadOrIPhone(platform) && queryParams.vulnerable); // no Android software and no vulnerable software for iOS
-  const softwareFilter = getSoftwareFilterFromQueryParams(queryParams);
+  const softwareFilter = getHostSoftwareFilterFromQueryParams(queryParams);
 
   // disables install/uninstall actions after click
   const [softwareIdActionPending, setSoftwareIdActionPending] = useState<
@@ -330,11 +333,6 @@ const HostSoftware = ({
     ]
   );
 
-  const getHostSoftwareFilterFromQueryParams = useCallback(() => {
-    const { available_for_install } = queryParams;
-    return available_for_install ? "installableSoftware" : "allSoftware";
-  }, [queryParams]);
-
   const tableConfig = useMemo(() => {
     return isMyDevicePage
       ? generateDeviceSoftwareTableConfig()
@@ -393,7 +391,7 @@ const HostSoftware = ({
             searchQuery={queryParams.query}
             page={queryParams.page}
             pagePath={pathname}
-            hostSoftwareFilter={getHostSoftwareFilterFromQueryParams()}
+            hostSoftwareFilter={softwareFilter}
             vulnFilters={getSoftwareVulnFiltersFromQueryParams(queryParams)}
             onAddFiltersClick={toggleSoftwareFiltersModal}
             pathPrefix={pathname}
diff --git a/frontend/pages/hosts/details/cards/Software/helpers.tsx b/frontend/pages/hosts/details/cards/Software/helpers.tsx
index 2c12ca9e10..b6e53b580c 100644
--- a/frontend/pages/hosts/details/cards/Software/helpers.tsx
+++ b/frontend/pages/hosts/details/cards/Software/helpers.tsx
@@ -1,4 +1,5 @@
 import React from "react";
+import { QueryParams } from "utilities/url";
 import { getErrorReason } from "interfaces/errors";
 import { trimEnd, upperFirst } from "lodash";
 
@@ -69,3 +70,12 @@ export const getUninstallErrorMessage = (e: unknown) => {
 
   return DEFAULT_UNINSTALL_ERROR_MESSAGE;
 };
+
+// available_for_install string > boolean conversion in parseHostSoftwareQueryParams
+export const getHostSoftwareFilterFromQueryParams = (
+  queryParams: QueryParams
+) => {
+  const { available_for_install } = queryParams;
+
+  return available_for_install ? "installableSoftware" : "allSoftware";
+};