fix: use state for absolute values checkbox

Author: Elessar1802

src/components/ResourceBrowser/ResourceList/ResourceFilterOptions.tsx

@@ -27,6 +27,7 @@ import {
     GVK_FILTER_KIND_QUERY_PARAM_KEY,
     GVKOptionValueType,
     Nodes,
+    noop,
     OptionType,
     ResourceRecommenderHeaderType,
     SearchBar,
@@ -70,7 +71,7 @@ const ResourceFilterOptions = ({
     filteredRows,
     gvkFilterConfig,
     isResourceListLoading,
-    showAbsoluteValuesInResourceRecommender,
+    resourceRecommenderConfig,
     selectedAPIVersionGVKFilter,
     selectedKindGVKFilter,
 }: ResourceFilterOptionsProps) => {
@@ -88,6 +89,9 @@ const ResourceFilterOptions = ({
     const showShortcutKey = !isInputFocused && !searchText
     const isResourceRecommender = selectedResource?.gvk?.Kind === Nodes.ResourceRecommender
 
+    const { showAbsoluteValuesInResourceRecommender = false, setShowAbsoluteValuesInResourceRecommender = noop } =
+        resourceRecommenderConfig ?? {}
+
     const [, namespaceByClusterIdList] = useAsync(() => namespaceListByClusterId(clusterId), [clusterId])
 
     const namespaceOptions = useMemo(
@@ -165,11 +169,7 @@ const ResourceFilterOptions = ({
     }
 
     const handleToggleShowAbsoluteValues = () => {
-        const newValue = !showAbsoluteValuesInResourceRecommender
-        updateSearchParams(
-            { showAbsoluteValuesInResourceRecommender: newValue ? true : null },
-            { redirectionMethod: 'replace' },
-        )
+        setShowAbsoluteValuesInResourceRecommender((prevValue) => !prevValue)
     }
 
     const getIsGVKOptionSelected = (option: SelectPickerOptionType<GVKOptionValueType>): boolean => {

src/components/ResourceBrowser/ResourceList/ResourceList.tsx

@@ -288,13 +288,11 @@ const ResourceList = () => {
         reloadGVKOptions,
         gvkOptionsError,
     }: GetResourceRecommenderResourceListPropsType) => ({
-        addTab,
         selectedCluster,
         selectedResource: {
             gvk: SIDEBAR_KEYS.resourceRecommenderGVK,
             namespaced: true,
         },
-        updateK8sResourceTab: getUpdateTabUrlForId(RESOURCE_RECOMMENDER_TAB_ID),
         lowercaseKindToResourceGroupMap,
         resourceRecommenderConfig: {
             setShowAbsoluteValuesInResourceRecommender,

src/components/ResourceBrowser/ResourceList/ResourceRecommenderTableCellComponent.tsx

@@ -37,17 +37,15 @@ const ResourceRecommendationChip = importComponentFromFELibrary('ResourceRecomme
 interface ResourceRecommenderTableCellComponentProps extends TableCellComponentProps<FiltersTypeEnum.URL> {
     handleReloadDataAfterBulkOperation: () => void
     showAbsoluteValuesInResourceRecommender: boolean
-    filterData: TableCellComponentProps<FiltersTypeEnum.URL>['filterData'] & {
-        showAbsoluteValuesInResourceRecommender: boolean
-    }
 }
 
 const ResourceRecommenderTableCellComponent = ({
     field: columnName,
     row: { id, data: resourceData },
-    filterData: { searchKey: searchText, showAbsoluteValuesInResourceRecommender },
+    filterData: { searchKey: searchText },
     signals,
     handleReloadDataAfterBulkOperation,
+    showAbsoluteValuesInResourceRecommender,
 }: ResourceRecommenderTableCellComponentProps) => {
     const { push } = useHistory()
     const { clusterId } = useParams<ClusterDetailBaseParams>()

src/components/ResourceBrowser/ResourceList/ResourceRecommenderTableViewWrapper.tsx

@@ -15,7 +15,7 @@ export const ResourceRecommenderTableViewWrapper = ({
     ...props
 }: ResourceRecommenderTableViewWrapperProps) => (
     <div className="resource-list-container flexbox-col flex-grow-1 border__primary--left dc__overflow-hidden">
-        <ResourceFilterOptions {...props} />
+        <ResourceFilterOptions searchPlaceholder="Search" {...props} />
 
         {resourceListError ? (
             <ErrorScreenManager

src/components/ResourceBrowser/Types.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { RefObject } from 'react'
+import React, { Dispatch, RefObject, SetStateAction } from 'react'
 import { GroupBase } from 'react-select'
 
 import {
@@ -114,9 +114,12 @@ export interface ResourceFilterOptionsProps
         reloadGVKOptions: () => void
         gvkOptionsError: ServerErrors
     }
-    showAbsoluteValuesInResourceRecommender?: boolean
     selectedAPIVersionGVKFilter?: string
     selectedKindGVKFilter?: string
+    resourceRecommenderConfig?: {
+        showAbsoluteValuesInResourceRecommender: boolean
+        setShowAbsoluteValuesInResourceRecommender: Dispatch<SetStateAction<boolean>>
+    }
 }
 
 export interface K8SResourceListType