diff --git a/public/app/plugins/datasource/cloudwatch/components/Dimensions/Dimensions.test.tsx b/public/app/plugins/datasource/cloudwatch/components/Dimensions/Dimensions.test.tsx index 7286356811bd..1829732b5d8d 100644 --- a/public/app/plugins/datasource/cloudwatch/components/Dimensions/Dimensions.test.tsx +++ b/public/app/plugins/datasource/cloudwatch/components/Dimensions/Dimensions.test.tsx @@ -55,6 +55,24 @@ describe('Dimensions', () => { }); }); + describe('when rendered with two existing dimensions and values are represented as arrays', () => { + it('should render two filter items', async () => { + props.query.dimensions = { + InstanceId: ['*'], + InstanceGroup: ['Group1'], + }; + render(); + const filterItems = screen.getAllByTestId('cloudwatch-dimensions-filter-item'); + expect(filterItems.length).toBe(2); + + expect(within(filterItems[0]).getByText('InstanceId')).toBeInTheDocument(); + expect(within(filterItems[0]).getByText('*')).toBeInTheDocument(); + + expect(within(filterItems[1]).getByText('InstanceGroup')).toBeInTheDocument(); + expect(within(filterItems[1]).getByText('Group1')).toBeInTheDocument(); + }); + }); + describe('when adding a new filter item', () => { it('it should add the new item but not call onChange', async () => { props.query.dimensions = {}; diff --git a/public/app/plugins/datasource/cloudwatch/components/Dimensions/Dimensions.tsx b/public/app/plugins/datasource/cloudwatch/components/Dimensions/Dimensions.tsx index 4dc13d44744d..c95365b34306 100644 --- a/public/app/plugins/datasource/cloudwatch/components/Dimensions/Dimensions.tsx +++ b/public/app/plugins/datasource/cloudwatch/components/Dimensions/Dimensions.tsx @@ -25,15 +25,32 @@ export interface DimensionFilterCondition { const dimensionsToFilterConditions = (dimensions: DimensionsType | undefined) => Object.entries(dimensions ?? {}).reduce((acc, [key, value]) => { - if (value && typeof value === 'string') { - const filter = { - key, - value, - operator: '=', - }; - return [...acc, filter]; + if (!value) { + return acc; } - return acc; + + // Previously, we only appended to the `acc`umulated dimensions if the value was a string. + // However, Cloudwatch can present dimensions with single-value arrays, e.g. + // k: FunctionName + // v: ['MyLambdaFunction'] + // in which case we grab the single-value from the Array and use that as the value. + let v = ''; + if (typeof value === 'string') { + v = value; + } else if (Array.isArray(value) && typeof value[0] === 'string') { + v = value[0]; + } + + if (!v) { + return acc; + } + + const filter = { + key: key, + value: v, + operator: '=', + }; + return [...acc, filter]; }, []); const filterConditionsToDimensions = (filters: DimensionFilterCondition[]) => {