diff --git a/frontend/src/component/impact-metrics/ChartConfigModal/LabelFilter/LabelFilterItem/LabelFilterItem.tsx b/frontend/src/component/impact-metrics/ChartConfigModal/LabelFilter/LabelFilterItem/LabelFilterItem.tsx index 1fcbe7269a..491041bb31 100644 --- a/frontend/src/component/impact-metrics/ChartConfigModal/LabelFilter/LabelFilterItem/LabelFilterItem.tsx +++ b/frontend/src/component/impact-metrics/ChartConfigModal/LabelFilter/LabelFilterItem/LabelFilterItem.tsx @@ -6,6 +6,7 @@ import { TextField, Typography, } from '@mui/material'; +import { METRIC_LABELS_SELECT_ALL } from 'component/impact-metrics/hooks/useImpactMetricsState'; import type { FC } from 'react'; type LabelFilterItemProps = { @@ -22,12 +23,11 @@ export const LabelFilterItem: FC = ({ value, onChange, }) => { - const SELECT_ALL = '*'; - const isAllSelected = value.includes(SELECT_ALL); + const isAllSelected = value.includes(METRIC_LABELS_SELECT_ALL); const autocompleteId = `autocomplete-${labelKey}`; const isTruncated = options.length >= 1_000; - const optionsWithSelectAll = [SELECT_ALL, ...options]; + const optionsWithSelectAll = [METRIC_LABELS_SELECT_ALL, ...options]; return ( = ({ options={optionsWithSelectAll} value={isAllSelected ? options : value} getOptionLabel={(option) => - option === SELECT_ALL ? '(Select all)' : option + option === METRIC_LABELS_SELECT_ALL ? '(Select all)' : option } onChange={(_, newValues, reason, details) => { - if (details?.option === SELECT_ALL) { - onChange(isAllSelected ? [] : [SELECT_ALL]); + if (details?.option === METRIC_LABELS_SELECT_ALL) { + onChange(isAllSelected ? [] : [METRIC_LABELS_SELECT_ALL]); return; } - onChange(newValues.filter((v) => v !== SELECT_ALL)); + onChange( + newValues.filter((v) => v !== METRIC_LABELS_SELECT_ALL), + ); }} renderOption={(props, option, { selected }) => (
  • - {option === SELECT_ALL ? ( + {option === METRIC_LABELS_SELECT_ALL ? ( { const { settings,