diff --git a/x-pack/plugins/data_usage/public/app/components/data_usage_metrics.tsx b/x-pack/plugins/data_usage/public/app/components/data_usage_metrics.tsx
index ce7926656974e..331b6e6ad15d4 100644
--- a/x-pack/plugins/data_usage/public/app/components/data_usage_metrics.tsx
+++ b/x-pack/plugins/data_usage/public/app/components/data_usage_metrics.tsx
@@ -19,7 +19,7 @@ import { useGetDataUsageDataStreams } from '../../hooks/use_get_data_streams';
 import { useDataUsageMetricsUrlParams } from '../hooks/use_charts_url_params';
 import { DEFAULT_DATE_RANGE_OPTIONS, transformToUTCtime } from '../../../common/utils';
 import { useDateRangePicker } from '../hooks/use_date_picker';
-import { ChartFilters, ChartFiltersProps } from './filters/charts_filters';
+import { ChartsFilters, ChartsFiltersProps } from './filters/charts_filters';
 import { ChartsLoading } from './charts_loading';
 import { NoDataCallout } from './no_data_callout';
 import { useTestIdGenerator } from '../../hooks/use_test_id_generator';
@@ -175,7 +175,7 @@ export const DataUsageMetrics = memo(
       [setMetricsFilters]
     );
 
-    const filterOptions: ChartFiltersProps['filterOptions'] = useMemo(() => {
+    const filterOptions: ChartsFiltersProps['filterOptions'] = useMemo(() => {
       const dataStreamsOptions = dataStreams?.reduce<Record<string, number>>((acc, ds) => {
         acc[ds.name] = ds.storageSizeBytes;
         return acc;
@@ -227,7 +227,7 @@ export const DataUsageMetrics = memo(
     return (
       <EuiFlexGroup alignItems="flexStart" direction="column" data-test-subj={getTestId()}>
         <FlexItemWithCss>
-          <ChartFilters
+          <ChartsFilters
             dateRangePickerState={dateRangePickerState}
             isDataLoading={isFetchingDataStreams}
             isUpdateDisabled={!enableFetchUsageMetricsData}
diff --git a/x-pack/plugins/data_usage/public/app/components/filters/charts_filters.tsx b/x-pack/plugins/data_usage/public/app/components/filters/charts_filters.tsx
index f53854a7acac9..c9efbd87a1d5a 100644
--- a/x-pack/plugins/data_usage/public/app/components/filters/charts_filters.tsx
+++ b/x-pack/plugins/data_usage/public/app/components/filters/charts_filters.tsx
@@ -21,7 +21,7 @@ import { type UsageMetricsDateRangePickerProps, UsageMetricsDateRangePicker } fr
 import { ChartsFilter, ChartsFilterProps } from './charts_filter';
 import { FilterName } from '../../hooks';
 
-export interface ChartFiltersProps extends UsageMetricsDateRangePickerProps {
+export interface ChartsFiltersProps extends UsageMetricsDateRangePickerProps {
   isUpdateDisabled: boolean;
   isValidDateRange: boolean;
   filterOptions: Record<FilterName, ChartsFilterProps['filterOptions']>;
@@ -29,7 +29,7 @@ export interface ChartFiltersProps extends UsageMetricsDateRangePickerProps {
   showMetricsTypesFilter?: boolean;
 }
 
-export const ChartFilters = memo<ChartFiltersProps>(
+export const ChartsFilters = memo<ChartsFiltersProps>(
   ({
     dateRangePickerState,
     isDataLoading,
@@ -97,4 +97,4 @@ export const ChartFilters = memo<ChartFiltersProps>(
   }
 );
 
-ChartFilters.displayName = 'ChartFilters';
+ChartsFilters.displayName = 'ChartsFilters';