diff --git a/packages/manager/.changeset/pr-13139-fixed-1764247173880.md b/packages/manager/.changeset/pr-13139-fixed-1764247173880.md new file mode 100644 index 00000000000..fb971eb3f3e --- /dev/null +++ b/packages/manager/.changeset/pr-13139-fixed-1764247173880.md @@ -0,0 +1,5 @@ +--- +"@linode/manager": Fixed +--- + +CloudPulse metrics volumes contextual view `not showing dimension values` and CloudPulse metrics `group by default selection retention` ([#13139](https://github.com/linode/manager/pull/13139)) diff --git a/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardWithFilters.test.tsx b/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardWithFilters.test.tsx index 4b199e9dfe7..238f49432d9 100644 --- a/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardWithFilters.test.tsx +++ b/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardWithFilters.test.tsx @@ -8,12 +8,20 @@ import { renderWithTheme } from 'src/utilities/testHelpers'; import { CloudPulseDashboardWithFilters } from './CloudPulseDashboardWithFilters'; +import type { GroupByOption } from '../GroupBy/CloudPulseGroupByDrawer'; + const queryMocks = vi.hoisted(() => ({ useCloudPulseDashboardsQuery: vi.fn().mockReturnValue({}), + useGlobalDimensions: vi.fn().mockReturnValue({}), })); const circleProgress = 'circle-progress'; const mandatoryFiltersError = 'Select filters to visualize metrics.'; +const mockGroupByOptions: GroupByOption[] = [ + { value: 'option1', label: 'Option 1' }, + { value: 'option2', label: 'Option 2' }, + { value: 'option3', label: 'Option 3' }, +]; vi.mock('src/queries/cloudpulse/dashboards', async () => { const actual = await vi.importActual('src/queries/cloudpulse/dashboards'); @@ -22,6 +30,14 @@ vi.mock('src/queries/cloudpulse/dashboards', async () => { useCloudPulseDashboardsQuery: queryMocks.useCloudPulseDashboardsQuery, }; }); +vi.mock('../GroupBy/utils', async () => { + const actual = await vi.importActual('../GroupBy/utils'); + + return { + ...actual, + useGlobalDimensions: queryMocks.useGlobalDimensions, + }; +}); const mockDashboard = dashboardFactory.build(); describe('CloudPulseDashboardWithFilters component tests', () => { @@ -61,10 +77,19 @@ describe('CloudPulseDashboardWithFilters component tests', () => { isLoading: false, }); + queryMocks.useGlobalDimensions.mockReturnValue({ + isLoading: false, + options: mockGroupByOptions, + defaultValue: [], + }); + renderWithTheme( ); + const groupByIcon = screen.getByTestId('group-by'); + expect(groupByIcon).toBeEnabled(); + const startDate = screen.getByText('Start Date'); const nodeTypeSelect = screen.getByTestId('node-type-select'); expect(startDate).toBeInTheDocument(); @@ -217,7 +242,6 @@ describe('CloudPulseDashboardWithFilters component tests', () => { const startDate = screen.getByText('Start Date'); expect(startDate).toBeInTheDocument(); - await userEvent.click(screen.getByPlaceholderText('Select a Dashboard')); await userEvent.click(screen.getByText('nodebalancer_firewall_dashbaord')); expect( diff --git a/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardWithFilters.tsx b/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardWithFilters.tsx index da2046e17cf..8d139630e7a 100644 --- a/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardWithFilters.tsx +++ b/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardWithFilters.tsx @@ -202,7 +202,7 @@ export const CloudPulseDashboardWithFilters = React.memo( /> diff --git a/packages/manager/src/features/CloudPulse/Overview/GlobalFilters.tsx b/packages/manager/src/features/CloudPulse/Overview/GlobalFilters.tsx index 5f7dcbf7488..fdbd89ecf4f 100644 --- a/packages/manager/src/features/CloudPulse/Overview/GlobalFilters.tsx +++ b/packages/manager/src/features/CloudPulse/Overview/GlobalFilters.tsx @@ -165,7 +165,11 @@ export const GlobalFilters = React.memo((props: GlobalFilterProperties) => { handleChange={onGroupByChange} preferenceGroupBy={preferences?.[GROUP_BY]} savePreferences - selectedDashboard={selectedDashboard} + selectedDashboard={ + preferences?.[DASHBOARD_ID] === selectedDashboard?.id // wait for dashboard id in preference to match selected dashboard id + ? selectedDashboard + : undefined + } /> diff --git a/packages/manager/src/features/CloudPulse/Widget/CloudPulseWidget.tsx b/packages/manager/src/features/CloudPulse/Widget/CloudPulseWidget.tsx index bba0b004af4..2220f3d45e4 100644 --- a/packages/manager/src/features/CloudPulse/Widget/CloudPulseWidget.tsx +++ b/packages/manager/src/features/CloudPulse/Widget/CloudPulseWidget.tsx @@ -209,7 +209,9 @@ export const CloudPulseWidget = (props: CloudPulseWidgetProperties) => { dimensionLabel: 'linode_id', type: 'metrics', entities: entityIds, - regions: regions?.filter((region) => region.id === linodeRegion) ?? [], + regions: linodeRegion // if linode region is selected, filter regions to only that region else pass all regions + ? (regions?.filter(({ id }) => id === linodeRegion) ?? []) + : regions, scope: 'entity', serviceType, associatedEntityType: FILTER_CONFIG.get(dashboardId)?.associatedEntityType, @@ -218,7 +220,9 @@ export const CloudPulseWidget = (props: CloudPulseWidgetProperties) => { dimensionLabel: 'vpc_subnet_id', type: 'metrics', entities: entityIds, - regions: regions?.filter((region) => region.id === linodeRegion) ?? [], + regions: linodeRegion // if linode region is selected, filter regions to only that region else pass all regions + ? (regions?.filter(({ id }) => id === linodeRegion) ?? []) + : regions, scope: 'entity', serviceType, associatedEntityType: FILTER_CONFIG.get(dashboardId)?.associatedEntityType, @@ -226,7 +230,9 @@ export const CloudPulseWidget = (props: CloudPulseWidgetProperties) => { const linodeFromVolumes = useBlockStorageFetchOptions({ entities: entityIds, dimensionLabel: 'linode_id', - regions: regions?.filter(({ id }) => id === region) ?? [], + regions: region // if region is selected, filter regions to only that region else pass all regions + ? (regions?.filter(({ id }) => id === region) ?? []) + : regions, type: 'metrics', scope: 'entity', serviceType,