@cdc/dashboard 4.25.8 → 4.25.11

package/src/helpers/apiFilterHelpers.ts

@@ -1,166 +1,190 @@
-import { gatherQueryParams } from '@cdc/core/helpers/gatherQueryParams'
-import { APIFilterDropdowns, DropdownOptions } from '../components/DashboardFilters'
-import { APIFilter } from '../types/APIFilter'
-import { SharedFilter } from '../types/SharedFilter'
-import _ from 'lodash'
-import { getQueryParam } from '@cdc/core/helpers/queryStringUtils'
-import { FILTER_STYLE } from '../types/FilterStyles'
-
-/** key for the dropdowns object */
-type DropdownsKey = string
-
-export const getLoadingFilterMemo = (
-  apiFiltersEndpoints: string[],
-  apiFilterDropdowns,
-  changedChildFilterIndexes = []
-): APIFilterDropdowns =>
-  apiFiltersEndpoints.reduce((acc, endpoint, currIndex) => {
-    const _key: DropdownsKey = endpoint
-    const hasChanged = changedChildFilterIndexes.includes(currIndex)
-    if (apiFilterDropdowns[_key] && !hasChanged) {
-      acc[_key] = apiFilterDropdowns[_key]
-    } else {
-      acc[_key] = undefined
-    }
-    return acc
-  }, {})
-
-export const getParentParams = (
-  childFilter: SharedFilter,
-  sharedFilters: SharedFilter[]
-): Record<'key' | 'value', string>[] | null => {
-  const _parents = sharedFilters.filter(parentFilter => childFilter.parents?.includes(parentFilter.key))
-  if (!(_parents || []).length) return null
-
-  return _parents.flatMap(filter => {
-    if (filter.filterStyle === FILTER_STYLE.nestedDropdown) {
-      const key = filter.apiFilter.valueSelector || ''
-      const subKey = filter.apiFilter.subgroupValueSelector || ''
-      const val = filter.queuedActive ? filter.queuedActive[0] : (filter.active as string) || ''
-      const subVal = filter.queuedActive ? filter.queuedActive[1] : filter.subGrouping?.active || ''
-      return [
-        { key, value: val },
-        { key: subKey, value: subVal }
-      ]
-    } else {
-      const key = filter.queryParameter || filter.apiFilter.valueSelector || ''
-      const value = filter.queuedActive || filter.active || ''
-      if (Array.isArray(value)) {
-        return value.map(_value => ({ key, value: _value.toString() }))
-      }
-      return [{ key, value: value.toString() }]
-    }
-  })
-}
-
-export const notAllParentsSelected = parentParams => parentParams?.some(({ value }) => value === '')
-
-export const getFilterValues = (data: Array<Object>, apiFilter: APIFilter): DropdownOptions => {
-  const { textSelector, valueSelector, subgroupTextSelector, subgroupValueSelector } = apiFilter
-  if (subgroupValueSelector) {
-    const memo = {}
-    data.forEach(v => {
-      if (!memo[v[valueSelector]]) {
-        memo[v[valueSelector]] = { text: v[textSelector || valueSelector], value: v[valueSelector], subOptions: [] }
-      }
-      memo[v[valueSelector]].subOptions.push({ text: v[subgroupTextSelector], value: v[subgroupValueSelector] })
-    })
-    return Object.values(memo)
-  } else {
-  }
-  return data.map(v => ({ text: v[textSelector || valueSelector], value: v[valueSelector] }))
-}
-
-/** API endpoint to fetch */
-type Endpoint = string
-type SharedFilterIndex = number
-export const getToFetch = (
-  sharedFilters: SharedFilter[],
-  apiFilterDropdowns: APIFilterDropdowns
-): Record<Endpoint, [DropdownsKey, SharedFilterIndex]> => {
-  const toFetch = {}
-  sharedFilters.forEach((filter, index) => {
-    const baseEndpoint = filter.apiFilter?.apiEndpoint
-    if (!baseEndpoint) return
-    const _key = baseEndpoint
-    if (apiFilterDropdowns[_key]) return // don't reload cached filter
-    const parentParams = getParentParams(filter, sharedFilters)
-
-    if (notAllParentsSelected(parentParams)) return // don't send request for dependent children filter options
-
-    const endpoint = baseEndpoint + (parentParams ? gatherQueryParams(baseEndpoint, parentParams) : '')
-    toFetch[endpoint] = [_key, index]
-  })
-  return toFetch
-}
-
-export const setActiveNestedDropdown = (dropdownOptions, sharedFilter) => {
-  const defaultQueryParamValue = getQueryParam(sharedFilter?.setByQueryParameter)
-  const defaultValue = dropdownOptions[0]?.value
-  const subDefaultValue = dropdownOptions[0]?.subOptions[0].value
-  const subDefaultQueryParamValue = getQueryParam(sharedFilter?.subGrouping.setByQueryParameter)
-  if (!sharedFilter.active) {
-    sharedFilter.active = defaultQueryParamValue || defaultValue
-    sharedFilter.subGrouping.active = subDefaultQueryParamValue || subDefaultValue
-  } else {
-    const currentOption = dropdownOptions.find(option => option.value === sharedFilter.active)
-    sharedFilter.active = currentOption ? currentOption.value : defaultValue
-    if (currentOption) {
-      const currentSubOption = currentOption.subOptions.find(option => option.value === sharedFilter.subGrouping.active)
-      sharedFilter.subGrouping.active = currentSubOption?.value || subDefaultValue
-    } else {
-      sharedFilter.subGrouping.active = subDefaultValue
-    }
-  }
-}
-
-export const setActiveMultiDropdown = (dropdownOptions, sharedFilter) => {
-  const defaultQueryParamValue = getQueryParam(sharedFilter?.setByQueryParameter)
-  const multiDefaultQueryParamValue = Array.isArray(defaultQueryParamValue)
-    ? defaultQueryParamValue
-    : defaultQueryParamValue?.split(',')
-  const multiDefaultValue = defaultQueryParamValue ? multiDefaultQueryParamValue : [dropdownOptions[0]?.value]
-  const currentOption = ((sharedFilter.active as string[]) || []).filter(activeVal =>
-    dropdownOptions.find(option => option.value === activeVal)
-  )
-  sharedFilter.active = currentOption.length ? currentOption : multiDefaultValue
-}
-
-export const setAutoLoadDefaultValue = (
-  sharedFilterIndex: number,
-  dropdownOptions: DropdownOptions,
-  sharedFilters: SharedFilter[],
-  autoLoadFilterIndexes: number[]
-): SharedFilter => {
-  const sharedFiltersCopy = _.cloneDeep(sharedFilters)
-  const sharedFilter = _.cloneDeep(sharedFiltersCopy[sharedFilterIndex])
-  const defaultQueryParamValue = getQueryParam(sharedFilter?.setByQueryParameter)
-  const hasQueryParameter = sharedFilter.setByQueryParameter ? defaultQueryParamValue !== undefined : false
-  if (!autoLoadFilterIndexes.length || !dropdownOptions?.length) {
-    if (hasQueryParameter && sharedFilter.apiFilter) {
-      const subQueryValue = getQueryParam(sharedFilter.subGrouping?.setByQueryParameter)
-      const isNestedDropdown = subQueryValue !== undefined
-      sharedFilter.queuedActive = isNestedDropdown ? [defaultQueryParamValue, subQueryValue] : defaultQueryParamValue
-    }
-    return sharedFilter // no autoLoading happening
-  }
-  if (autoLoadFilterIndexes.includes(sharedFilterIndex) || hasQueryParameter) {
-    const filterParents = sharedFiltersCopy.filter(f => sharedFilter.parents?.includes(f.key))
-    const notAllParentFiltersSelected = filterParents.some(p => !(p.active || p.queuedActive))
-    if (filterParents && notAllParentFiltersSelected) return sharedFilter
-    if (sharedFilter.filterStyle === FILTER_STYLE.multiSelect) {
-      setActiveMultiDropdown(dropdownOptions, sharedFilter)
-    } else if (sharedFilter.filterStyle === FILTER_STYLE.nestedDropdown) {
-      setActiveNestedDropdown(dropdownOptions, sharedFilter)
-    } else {
-      const defaultValue = dropdownOptions[0]?.value
-      if (!sharedFilter.active) {
-        sharedFilter.active = defaultQueryParamValue || defaultValue
-      } else {
-        const currentOption = dropdownOptions.find(option => option.value == sharedFilter.active) // loose equality required: 2017 should equal '2017'
-        sharedFilter.active = currentOption ? currentOption.value : defaultValue
-      }
-    }
-  }
-  return sharedFilter
-}
+import { gatherQueryParams } from '@cdc/core/helpers/gatherQueryParams'
+import { APIFilterDropdowns, DropdownOptions } from '../components/DashboardFilters'
+import { APIFilter } from '../types/APIFilter'
+import { SharedFilter } from '../types/SharedFilter'
+import _ from 'lodash'
+import { getQueryParam } from '@cdc/core/helpers/queryStringUtils'
+import { FILTER_STYLE } from '../types/FilterStyles'
+
+/** key for the dropdowns object */
+type DropdownsKey = string
+
+export const getLoadingFilterMemo = (
+  apiFiltersEndpoints: string[],
+  apiFilterDropdowns,
+  changedChildFilterIndexes = []
+): APIFilterDropdowns =>
+  apiFiltersEndpoints.reduce((acc, endpoint, currIndex) => {
+    const _key: DropdownsKey = endpoint
+    const hasChanged = changedChildFilterIndexes.includes(currIndex)
+    if (apiFilterDropdowns[_key] && !hasChanged) {
+      acc[_key] = apiFilterDropdowns[_key]
+    } else {
+      acc[_key] = undefined
+    }
+    return acc
+  }, {})
+
+export const getParentParams = (
+  childFilter: SharedFilter,
+  sharedFilters: SharedFilter[]
+): Record<'key' | 'value', string>[] | null => {
+  const _parents = sharedFilters.filter(parentFilter => childFilter.parents?.includes(parentFilter.key))
+  if (!(_parents || []).length) return null
+
+  return _parents.flatMap(filter => {
+    if (filter.filterStyle === FILTER_STYLE.nestedDropdown) {
+      const key = filter.apiFilter.valueSelector || ''
+      const subKey = filter.apiFilter.subgroupValueSelector || ''
+      const val = filter.queuedActive ? filter.queuedActive[0] : (filter.active as string) || ''
+      const subVal = filter.queuedActive ? filter.queuedActive[1] : filter.subGrouping?.active || ''
+      return [
+        { key, value: val },
+        { key: subKey, value: subVal }
+      ]
+    } else {
+      const key = filter.queryParameter || filter.apiFilter.valueSelector || ''
+      const value = filter.queuedActive || filter.active || ''
+      if (Array.isArray(value)) {
+        return value.map(_value => ({ key, value: _value.toString() }))
+      }
+      return [{ key, value: value.toString() }]
+    }
+  })
+}
+
+/**
+ * Checks if any parent filters are unselected or at their reset state.
+ * Returns true if at least one parent is not properly selected.
+ */
+export const hasUnselectedParents = (parentParams, sharedFilters?: SharedFilter[]): boolean => {
+  if (!parentParams) return false
+
+  return parentParams.some(({ key, value }) => {
+    // Check if value is empty
+    if (value === '') return true
+
+    // Check if value equals the parent filter's resetLabel
+    if (sharedFilters) {
+      const parentFilter = sharedFilters.find(f => f.queryParameter === key || f.apiFilter?.valueSelector === key)
+      if (parentFilter?.resetLabel && value === parentFilter.resetLabel) {
+        return true
+      }
+    }
+
+    return false
+  })
+}
+
+// Keep old name for backward compatibility
+export const notAllParentsSelected = hasUnselectedParents
+
+export const getFilterValues = (data: Array<Object>, apiFilter: APIFilter): DropdownOptions => {
+  const { textSelector, valueSelector, subgroupTextSelector, subgroupValueSelector } = apiFilter
+  if (subgroupValueSelector) {
+    const memo = {}
+    data.forEach(v => {
+      if (!memo[v[valueSelector]]) {
+        memo[v[valueSelector]] = { text: v[textSelector || valueSelector], value: v[valueSelector], subOptions: [] }
+      }
+      memo[v[valueSelector]].subOptions.push({ text: v[subgroupTextSelector], value: v[subgroupValueSelector] })
+    })
+    return Object.values(memo)
+  } else {
+  }
+  return data.map(v => ({ text: v[textSelector || valueSelector], value: v[valueSelector] }))
+}
+
+/** API endpoint to fetch */
+type Endpoint = string
+type SharedFilterIndex = number
+export const getToFetch = (
+  sharedFilters: SharedFilter[],
+  apiFilterDropdowns: APIFilterDropdowns
+): Record<Endpoint, [DropdownsKey, SharedFilterIndex]> => {
+  const toFetch = {}
+  sharedFilters.forEach((filter, index) => {
+    const baseEndpoint = filter.apiFilter?.apiEndpoint
+    if (!baseEndpoint) return
+    const _key = baseEndpoint
+    if (apiFilterDropdowns[_key]) return // don't reload cached filter
+    const parentParams = getParentParams(filter, sharedFilters)
+
+    if (notAllParentsSelected(parentParams, sharedFilters)) return // don't send request for dependent children filter options
+
+    const endpoint = baseEndpoint + (parentParams ? gatherQueryParams(baseEndpoint, parentParams) : '')
+    toFetch[endpoint] = [_key, index]
+  })
+  return toFetch
+}
+
+export const setActiveNestedDropdown = (dropdownOptions, sharedFilter) => {
+  const defaultQueryParamValue = getQueryParam(sharedFilter?.setByQueryParameter)
+  const defaultValue = dropdownOptions[0]?.value
+  const subDefaultValue = dropdownOptions[0]?.subOptions[0].value
+  const subDefaultQueryParamValue = getQueryParam(sharedFilter?.subGrouping.setByQueryParameter)
+  if (!sharedFilter.active) {
+    sharedFilter.active = defaultQueryParamValue || defaultValue
+    sharedFilter.subGrouping.active = subDefaultQueryParamValue || subDefaultValue
+  } else {
+    const currentOption = dropdownOptions.find(option => option.value === sharedFilter.active)
+    sharedFilter.active = currentOption ? currentOption.value : defaultValue
+    if (currentOption) {
+      const currentSubOption = currentOption.subOptions.find(option => option.value === sharedFilter.subGrouping.active)
+      sharedFilter.subGrouping.active = currentSubOption?.value || subDefaultValue
+    } else {
+      sharedFilter.subGrouping.active = subDefaultValue
+    }
+  }
+}
+
+export const setActiveMultiDropdown = (dropdownOptions, sharedFilter) => {
+  const defaultQueryParamValue = getQueryParam(sharedFilter?.setByQueryParameter)
+  const multiDefaultQueryParamValue = Array.isArray(defaultQueryParamValue)
+    ? defaultQueryParamValue
+    : defaultQueryParamValue?.split(',')
+  const multiDefaultValue = defaultQueryParamValue ? multiDefaultQueryParamValue : [dropdownOptions[0]?.value]
+  const currentOption = (Array.isArray(sharedFilter.active) ? sharedFilter.active : []).filter(activeVal =>
+    dropdownOptions.find(option => option.value === activeVal)
+  )
+  sharedFilter.active = currentOption.length ? currentOption : multiDefaultValue
+}
+
+export const setAutoLoadDefaultValue = (
+  sharedFilterIndex: number,
+  dropdownOptions: DropdownOptions,
+  sharedFilters: SharedFilter[],
+  autoLoadFilterIndexes: number[]
+): SharedFilter => {
+  const sharedFiltersCopy = _.cloneDeep(sharedFilters)
+  const sharedFilter = _.cloneDeep(sharedFiltersCopy[sharedFilterIndex])
+  const defaultQueryParamValue = getQueryParam(sharedFilter?.setByQueryParameter)
+  const hasQueryParameter = sharedFilter.setByQueryParameter ? defaultQueryParamValue !== undefined : false
+  if (!autoLoadFilterIndexes.length || !dropdownOptions?.length) {
+    if (hasQueryParameter && sharedFilter.apiFilter) {
+      const subQueryValue = getQueryParam(sharedFilter.subGrouping?.setByQueryParameter)
+      const isNestedDropdown = subQueryValue !== undefined
+      sharedFilter.queuedActive = isNestedDropdown ? [defaultQueryParamValue, subQueryValue] : defaultQueryParamValue
+    }
+    return sharedFilter // no autoLoading happening
+  }
+  if (autoLoadFilterIndexes.includes(sharedFilterIndex) || hasQueryParameter) {
+    const filterParents = sharedFiltersCopy.filter(f => sharedFilter.parents?.includes(f.key))
+    const notAllParentFiltersSelected = filterParents.some(p => !(p.active || p.queuedActive))
+    if (filterParents && notAllParentFiltersSelected) return sharedFilter
+    if (sharedFilter.filterStyle === FILTER_STYLE.multiSelect) {
+      setActiveMultiDropdown(dropdownOptions, sharedFilter)
+    } else if (sharedFilter.filterStyle === FILTER_STYLE.nestedDropdown) {
+      setActiveNestedDropdown(dropdownOptions, sharedFilter)
+    } else {
+      const defaultValue = dropdownOptions[0]?.value
+      if (!sharedFilter.active) {
+        sharedFilter.active = defaultQueryParamValue || defaultValue
+      } else {
+        const currentOption = dropdownOptions.find(option => option.value == sharedFilter.active) // loose equality required: 2017 should equal '2017'
+        sharedFilter.active = currentOption ? currentOption.value : defaultValue
+      }
+    }
+  }
+  return sharedFilter
+}

package/src/helpers/filterData.ts

@@ -2,7 +2,11 @@ import _ from 'lodash'
 import { SharedFilter } from '../types/SharedFilter'
 import { FILTER_STYLE } from '../types/FilterStyles'
 
-const findFilterTier = (filters: SharedFilter[], sharedFilter: SharedFilter) => {
+/**
+ * Recursively calculates the tier/depth of a filter based on its parent dependencies.
+ * Root filters (no parents) are tier 1, children of root filters are tier 2, etc.
+ */
+const findFilterTier = (filters: SharedFilter[], sharedFilter: SharedFilter): number => {
   if (!sharedFilter.parents?.length) {
     return 1
   } else {
@@ -12,6 +16,10 @@ const findFilterTier = (filters: SharedFilter[], sharedFilter: SharedFilter) =>
   }
 }
 
+/**
+ * Calculates and assigns tier values to all filters, returns the maximum tier.
+ * Mutates the filter objects by setting their tier property.
+ */
 function getMaxTierAndSetFilterTiers(filters: SharedFilter[]): number {
   let maxTier = 1
   filters.forEach(sharedFilter => {
@@ -23,7 +31,30 @@ function getMaxTierAndSetFilterTiers(filters: SharedFilter[]): number {
   return maxTier
 }
 
-function filter(data = [], filters: SharedFilter[], condition) {
+/**
+ * Checks if a filter is currently at its reset/incomplete state.
+ * A filter is incomplete if it's visible AND:
+ * - The active value is empty/null/undefined, OR
+ * - The active value equals the resetLabel (if one is defined)
+ */
+export const isFilterAtResetState = (filter: SharedFilter): boolean => {
+  // Only check filters that are visible to the user
+  if (!filter.showDropdown) return false
+
+  // Check if active value is empty/null/undefined
+  const isEmptyValue = filter.active === '' || filter.active === null || filter.active === undefined
+
+  // Check if active value equals the resetLabel
+  const equalsResetLabel = filter.resetLabel && filter.resetLabel === filter.active
+
+  return isEmptyValue || equalsResetLabel
+}
+
+/**
+ * Filters data by applying filters of a specific tier.
+ * Filters are applied hierarchically by tier to handle parent-child dependencies.
+ */
+function filterDataByTier(data = [], filters: SharedFilter[], tier: number) {
   const activeFilters = _.filter(filters, f => (f.resetLabel === f.active ? f.values?.includes(f.resetLabel) : true))
   return data.filter(row => {
     const foundMatchingFilter = activeFilters.find(filter => {
@@ -51,8 +82,9 @@ function filter(data = [], filters: SharedFilter[], condition) {
         isNotTheSelectedValue = subGroupActive && selectedSubGroupValue !== subGroupActive
       }
 
-      const isFirstOccurrenceOfTier = filter.tier === condition
-      if (filter.type !== 'urlfilter' && isFirstOccurrenceOfTier && isNotTheSelectedValue) {
+      const isMatchingTier = filter.tier === tier
+      // Only apply client-side filtering for datafilter (urlfilters modify the API endpoint instead)
+      if (filter.type !== 'urlfilter' && isMatchingTier && isNotTheSelectedValue) {
         return true
       }
     })
@@ -60,17 +92,30 @@ function filter(data = [], filters: SharedFilter[], condition) {
   })
 }
 
+/**
+ * Filters data based on shared filter configurations.
+ * Returns empty array if any filter is at its reset state (incomplete selection).
+ * Otherwise applies filters hierarchically by tier to handle parent-child dependencies.
+ */
 export const filterData = (filters: SharedFilter[], _data: Object[]): Object[] => {
   const maxTier = getMaxTierAndSetFilterTiers(filters)
 
+  // Check if any filters are currently at their reset state
+  const hasResetFilters = filters.some(isFilterAtResetState)
+
+  // If any filter is at reset state, return empty data to show "no data" message
+  if (hasResetFilters) {
+    return []
+  }
+
   for (let i = 0; i < maxTier; i++) {
     const lastIteration = i === maxTier - 1
 
-    const filteredData = filter(_data, filters, i + 1)
+    const filteredData = filterDataByTier(_data, filters, i + 1)
 
     if (lastIteration) {
-      // not sure if this last run of filter() function is necessary.
-      return filter(filteredData, filters, maxTier - 1)
+      // not sure if this last run of filterDataByTier() function is necessary.
+      return filterDataByTier(filteredData, filters, maxTier - 1)
     }
   }
 }

package/src/helpers/filterResetHelpers.ts

@@ -0,0 +1,102 @@
+import { SharedFilter } from '../types/SharedFilter'
+import { APIFilterDropdowns } from '../components/DashboardFilters'
+import { FILTER_STYLE } from '../types/FilterStyles'
+
+/**
+ * Determines the reset value for a filter based on its configuration.
+ * When forceEmpty is true (like when clicking "Clear Filters"), always returns empty.
+ * Otherwise uses priority: defaultValue > empty string (for resetLabel) > first API option
+ * Note: resetLabel is for display purposes only. When present, we return empty string
+ * so the placeholder option renders correctly in the dropdown.
+ */
+export const getFilterResetValue = (
+  filter: SharedFilter,
+  apiFilterDropdowns: APIFilterDropdowns,
+  forceEmpty: boolean = false
+): string | undefined => {
+  // When clearing filters, always reset to empty/resetLabel state
+  if (forceEmpty) {
+    // Return empty string to show reset label or placeholder, undefined falls back to first value
+    return ''
+  }
+
+  // If filter has a defaultValue, use that (for initial load)
+  if (filter.defaultValue) {
+    return filter.defaultValue
+  }
+  // If filter has a resetLabel, return empty string so placeholder renders
+  if (typeof filter.resetLabel === 'string') {
+    return ''
+  }
+  // Otherwise, use first available value if API filter
+  if (filter.apiFilter) {
+    const _key = filter.apiFilter.apiEndpoint
+    const options = apiFilterDropdowns[_key]
+    if (options && options.length > 0) {
+      return options[0].value
+    }
+  }
+  return undefined
+}
+
+/**
+ * Resets a filter's active and queuedActive values based on its filter style.
+ * Handles multi-select, nested-dropdown, and standard dropdown styles.
+ */
+export const resetFilterToValue = (
+  filter: SharedFilter,
+  resetValue: string | undefined,
+  apiFilterDropdowns: APIFilterDropdowns
+): void => {
+  // Handle multi-select filters
+  if (filter.filterStyle === FILTER_STYLE.multiSelect) {
+    filter.active = resetValue ? [resetValue] : []
+    filter.queuedActive = undefined
+  } else if (filter.filterStyle === FILTER_STYLE.nestedDropdown) {
+    // For nested dropdowns, reset both group and subgroup
+    const _key = filter.apiFilter?.apiEndpoint
+    const options = apiFilterDropdowns[_key]
+
+    // When resetValue is explicitly empty/undefined, clear both group and subgroup
+    if (resetValue === '' || resetValue === undefined) {
+      filter.active = resetValue || ''
+      filter.subGrouping.active = ''
+    } else if (options && options.length > 0) {
+      // Use specific resetValue or fall back to first option
+      const selectedOption = options.find(opt => opt.value === resetValue) || options[0]
+      filter.active = selectedOption.value
+      if (selectedOption.subOptions && selectedOption.subOptions.length > 0) {
+        filter.subGrouping.active = selectedOption.subOptions[0].value
+      } else {
+        filter.subGrouping.active = ''
+      }
+    } else {
+      // No options available, use resetValue or empty
+      filter.active = resetValue || ''
+      filter.subGrouping.active = ''
+    }
+    filter.queuedActive = undefined
+  } else {
+    // Standard dropdown
+    filter.active = resetValue
+    filter.queuedActive = undefined
+  }
+}
+
+/**
+ * Clears dropdown cache for child filters that have parent dependencies.
+ * Sets them to empty arrays so they appear disabled without loading state.
+ */
+export const clearChildFilterDropdowns = (
+  sharedFilters: SharedFilter[],
+  apiFilterDropdowns: APIFilterDropdowns
+): APIFilterDropdowns => {
+  const updatedDropdowns = { ...apiFilterDropdowns }
+  sharedFilters.forEach(filter => {
+    if (filter.apiFilter && filter.parents && filter.parents.length > 0) {
+      // Set to empty array so they show as disabled without loading state
+      updatedDropdowns[filter.apiFilter.apiEndpoint] = []
+    }
+  })
+  return updatedDropdowns
+}