EES-5542 fixed bug in ReleaseDataBlockEditPage and test

dfe-analytical-services · Jan 17, 2025 · 19506c4 · 19506c4
1 parent 402eed3
commit 19506c4
Show file tree

Hide file tree

Showing 6 changed files with 76 additions and 63 deletions.
diff --git a/...statistics-admin/src/pages/release/datablocks/__tests__/ReleaseDataBlockEditPage.test.tsx b/...statistics-admin/src/pages/release/datablocks/__tests__/ReleaseDataBlockEditPage.test.tsx
@@ -13,11 +13,13 @@ import _dataBlockService, {
   ReleaseDataBlockSummary,
 } from '@admin/services/dataBlockService';
 import _permissionService from '@admin/services/permissionService';
+import render from '@common-test/render';
 import _tableBuilderService, {
   Subject,
 } from '@common/services/tableBuilderService';
+import { Chart } from '@common/services/types/blocks';
 import { waitFor } from '@testing-library/dom';
-import { render, screen, within } from '@testing-library/react';
+import { screen, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { produce } from 'immer';
 import React from 'react';
@@ -49,6 +51,48 @@ jest.mock('@common/hooks/useMedia', () => ({
 }));
 
 describe('ReleaseDataBlockEditPage', () => {
+  const chart: Chart = {
+    title: 'Test chart title',
+    alt: 'Test chart alt',
+    type: 'verticalbar',
+    height: 300,
+    width: 600,
+    axes: {
+      major: {
+        type: 'major',
+        visible: true,
+        groupBy: 'timePeriod',
+        min: 0,
+        sortAsc: true,
+        size: 50,
+        showGrid: true,
+        tickConfig: 'default',
+        referenceLines: [],
+        dataSets: [
+          {
+            filters: ['gender-female'],
+            indicator: 'authorised-absence-sessions',
+          },
+        ],
+      },
+      minor: {
+        type: 'minor',
+        visible: true,
+        min: 0,
+        sortAsc: true,
+        size: 50,
+        showGrid: true,
+        tickConfig: 'default',
+        referenceLines: [],
+        dataSets: [],
+      },
+    },
+    legend: {
+      position: 'top',
+      items: [],
+    },
+  };
+
   const testDataBlock: ReleaseDataBlock = {
     id: 'block-1',
     dataBlockParentId: 'block-1-parent',
@@ -82,49 +126,7 @@ describe('ReleaseDataBlockEditPage', () => {
         rows: [{ type: 'Indicator', value: 'authorised-absence-sessions' }],
       },
     },
-    charts: [
-      {
-        title: 'Test chart title',
-        alt: 'Test chart alt',
-        type: 'verticalbar',
-        height: 300,
-        width: 600,
-        axes: {
-          major: {
-            type: 'major',
-            visible: true,
-            groupBy: 'timePeriod',
-            min: 0,
-            sortAsc: true,
-            size: 50,
-            showGrid: true,
-            tickConfig: 'default',
-            referenceLines: [],
-            dataSets: [
-              {
-                filters: ['gender-female'],
-                indicator: 'authorised-absence-sessions',
-              },
-            ],
-          },
-          minor: {
-            type: 'minor',
-            visible: true,
-            min: 0,
-            sortAsc: true,
-            size: 50,
-            showGrid: true,
-            tickConfig: 'default',
-            referenceLines: [],
-            dataSets: [],
-          },
-        },
-        legend: {
-          position: 'top',
-          items: [],
-        },
-      },
-    ],
+    charts: [chart],
   };
 
   const testDataBlockSummaries: ReleaseDataBlockSummary[] = [

diff --git a/...on-statistics-admin/src/pages/release/datablocks/components/DataBlockPageReadOnlyTabs.tsx b/...on-statistics-admin/src/pages/release/datablocks/components/DataBlockPageReadOnlyTabs.tsx
@@ -13,6 +13,7 @@ import mapFullTable from '@common/modules/table-tool/utils/mapFullTable';
 import mapTableHeadersConfig from '@common/modules/table-tool/utils/mapTableHeadersConfig';
 import tableBuilderQueries from '@common/queries/tableBuilderQueries';
 import tableBuilderService from '@common/services/tableBuilderService';
+import { MapChart } from '@common/services/types/blocks';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import React, { useMemo, useState } from 'react';
 
@@ -25,9 +26,12 @@ const testId = (dataBlock: ReleaseDataBlock) =>
   `Data block - ${dataBlock.name}`;
 
 const DataBlockPageReadOnlyTabs = ({ releaseId, dataBlock }: Props) => {
+  const isMapChart = dataBlock.charts[0]?.type === 'map';
   const queryClient = useQueryClient();
   const [selectedBoundaryLevel, setSelectedBoundaryLevel] = useState(
-    getMapInitialBoundaryLevel(dataBlock.charts),
+    isMapChart
+      ? getMapInitialBoundaryLevel(dataBlock.charts[0] as MapChart)
+      : undefined,
   );
 
   const getDataBlockGeoJsonQuery = tableBuilderQueries.getDataBlockGeoJson(
@@ -44,7 +48,7 @@ const DataBlockPageReadOnlyTabs = ({ releaseId, dataBlock }: Props) => {
     queryKey: getDataBlockGeoJsonQuery.queryKey,
     queryFn: selectedBoundaryLevel
       ? getDataBlockGeoJsonQuery.queryFn
-      : undefined,
+      : () => Promise.resolve({}),
     staleTime: Infinity,
     cacheTime: Infinity,
     keepPreviousData: true,
@@ -57,8 +61,8 @@ const DataBlockPageReadOnlyTabs = ({ releaseId, dataBlock }: Props) => {
       tableBuilderService.getTableData(
         dataBlock.query,
         releaseId,
-        dataBlock.charts[0]?.type === 'map'
-          ? dataBlock.charts[0].boundaryLevel
+        isMapChart
+          ? (dataBlock.charts[0] as MapChart).boundaryLevel
           : undefined,
       ),
     [releaseId, dataBlock],
@@ -73,7 +77,10 @@ const DataBlockPageReadOnlyTabs = ({ releaseId, dataBlock }: Props) => {
       ...tableData,
       subjectMeta: {
         ...tableData.subjectMeta,
-        locations: locationGeoJson ?? tableData.subjectMeta.locations,
+        locations:
+          selectedBoundaryLevel && locationGeoJson
+            ? locationGeoJson
+            : tableData.subjectMeta.locations,
       },
     });
 

diff --git a/...-education-statistics-admin/src/pages/release/datablocks/components/DataBlockPageTabs.tsx b/...-education-statistics-admin/src/pages/release/datablocks/components/DataBlockPageTabs.tsx
@@ -82,7 +82,9 @@ const DataBlockPageTabs = ({
     const tableData = await tableBuilderService.getTableData(
       query,
       releaseId,
-      getMapInitialBoundaryLevel(dataBlock.charts),
+      dataBlock.charts[0]?.type === 'map'
+        ? getMapInitialBoundaryLevel(dataBlock.charts[0])
+        : undefined,
     );
 
     const { initialStep, subjectMeta } = await getInitialStepSubjectMeta(

diff --git a/...ation-statistics-common/src/modules/charts/components/utils/getMapInitialBoundaryLevel.ts b/...ation-statistics-common/src/modules/charts/components/utils/getMapInitialBoundaryLevel.ts
@@ -1,17 +1,14 @@
-import { Chart } from '@common/services/types/blocks';
+import { MapChart } from '@common/services/types/blocks';
 import isEqual from 'lodash/isEqual';
 import orderMapLegendItems from './orderMapLegendItems';
 
 export default function getMapInitialBoundaryLevel(
-  charts: Chart[],
+  map: MapChart,
 ): number | undefined {
-  const chart = charts[0];
-  if (chart?.type !== 'map' || chart?.legend === undefined) return undefined;
-
-  const { dataSet: firstDataSet } = orderMapLegendItems(chart.legend)[0];
-  const firstDataSetConfig = chart.map?.dataSetConfigs.find(({ dataSet }) => {
+  const { dataSet: firstDataSet } = orderMapLegendItems(map.legend)[0];
+  const firstDataSetConfig = map.map?.dataSetConfigs.find(({ dataSet }) => {
     return isEqual(dataSet, firstDataSet);
   });
 
-  return firstDataSetConfig?.boundaryLevel ?? chart.boundaryLevel;
+  return firstDataSetConfig?.boundaryLevel ?? map.boundaryLevel;
 }
diff --git a/...lore-education-statistics-common/src/modules/find-statistics/components/DataBlockTabs.tsx b/...lore-education-statistics-common/src/modules/find-statistics/components/DataBlockTabs.tsx
@@ -46,7 +46,9 @@ const DataBlockTabs = ({
 }: DataBlockTabsProps) => {
   const queryClient = useQueryClient();
   const [selectedBoundaryLevel, setSelectedBoundaryLevel] = useState(
-    getMapInitialBoundaryLevel(dataBlock.charts),
+    dataBlock.charts[0]?.type === 'map'
+      ? getMapInitialBoundaryLevel(dataBlock.charts[0])
+      : undefined,
   );
 
   const {
@@ -74,7 +76,7 @@ const DataBlockTabs = ({
     queryKey: getDataBlockGeoJsonQuery.queryKey,
     queryFn: selectedBoundaryLevel
       ? getDataBlockGeoJsonQuery.queryFn
-      : undefined,
+      : () => Promise.resolve({}),
     staleTime: Infinity,
     cacheTime: Infinity,
     keepPreviousData: true,
@@ -88,11 +90,14 @@ const DataBlockTabs = ({
           ...tableData,
           subjectMeta: {
             ...tableData.subjectMeta,
-            locations: locationGeoJson ?? tableData.subjectMeta.locations,
+            locations:
+              selectedBoundaryLevel && locationGeoJson
+                ? locationGeoJson
+                : tableData.subjectMeta.locations,
           },
         })
       : undefined;
-  }, [tableData, locationGeoJson, isFetching]);
+  }, [tableData, locationGeoJson, isFetching, selectedBoundaryLevel]);
 
   const errorMessage = <WarningMessage>Could not load content</WarningMessage>;
 

diff --git a/src/explore-education-statistics-common/src/services/types/blocks.ts b/src/explore-education-statistics-common/src/services/types/blocks.ts
@@ -69,7 +69,7 @@ type LineChart = {
   };
 };
 
-type MapChart = {
+export type MapChart = {
   type: 'map';
   axes: {
     major: AxisConfiguration;