Merge branch 'release-2023-49' into release-2023-49-e2e

packages/e2e/cypress/config/dashboardReportUrls/default.json

@@ -161,32 +161,6 @@
     "orgUnit": "TO",
     "dashboard": "PEHS"
   },
-  {
-    "code": "COVID_Compose_Daily_Deaths_Vs_Cases",
-    "project": "covidau",
-    "orgUnit": "AU",
-    "dashboard": "COVID-19"
-  },
-  {
-    "code": "COVID_New_Cases_By_State",
-    "project": "covidau",
-    "orgUnit": "AU",
-    "dashboard": "COVID-19",
-    "startDate": "2021-05-30",
-    "endDate": "2021-05-30"
-  },
-  {
-    "code": "COVID_Total_Cases_By_State",
-    "project": "covidau",
-    "orgUnit": "AU",
-    "dashboard": "COVID-19"
-  },
-  {
-    "code": "COVID_Compose_Cumulative_Deaths_Vs_Cases",
-    "project": "covidau",
-    "orgUnit": "AU_Australian Capital Territory",
-    "dashboard": "COVID-19"
-  },
   {
     "code": "FETP_PG_graduate_by_district",
     "project": "fetp",
@@ -205,12 +179,6 @@
     "orgUnit": "FETP-DYO3",
     "dashboard": "FETP"
   },
-  {
-    "code": "LA_EOC_Total_Dengue_Cases_by_Week",
-    "project": "laos_eoc",
-    "orgUnit": "LA_Bokeo",
-    "dashboard": "Dengue"
-  },
   {
     "code": "LA_Laos_Schools_Resources_Percentage_Primary",
     "project": "laos_schools",
@@ -223,26 +191,6 @@
     "orgUnit": "LA",
     "dashboard": "ICT Facilities"
   },
-  {
-    "code": "Laos_EOC_Malaria_Critical_Item_Availability",
-    "project": "laos_eoc",
-    "orgUnit": "LA-BK AH Bokeo (Military)",
-    "dashboard": "Malaria"
-  },
-  {
-    "code": "Laos_EOC_Malaria_Critical_Item_Availability_Single_Value",
-    "project": "laos_eoc",
-    "orgUnit": "LA-BK AH Bokeo (Military)",
-    "dashboard": "Malaria",
-    "startDate": "2020-06-01",
-    "endDate": "2020-06-30"
-  },
-  {
-    "code": "Laos_EOC_Malaria_Stock_Availability_Facility",
-    "project": "laos_eoc",
-    "orgUnit": "LA-BK AH Bokeo (Military)",
-    "dashboard": "Malaria"
-  },
   {
     "code": "Laos_Schools_Age_Of_Computers_By_School_Type",
     "project": "laos_schools",

packages/e2e/cypress/config/mapOverlayUrls/default.json

@@ -44,11 +44,6 @@
     "project": "explore",
     "orgUnit": "TO"
   },
-  {
-    "id": "COVID_AU_State_Total_Number_Confirmed_Cases",
-    "project": "covidau",
-    "orgUnit": "AU"
-  },
   {
     "id": "COVID_Facility_Commodities_Soap",
     "project": "explore",

packages/e2e/cypress/e2e/dashboardReports.spec.js

@@ -36,7 +36,7 @@ const urlToRouteRegex = url => {
     throw new Error(`'${url}' is not a valid report url: it must contain a 'report' query param`);
   }
 
-  return new RegExp(`report/.*\\?(.*&|)isExpanded=true&(.*&|)itemCode=${itemCode}(&|$)`);
+  return new RegExp(`(legacyDashboardReport|report)/.*\\?(.*&|)itemCode=${itemCode}(&|$)`);
 };
 
 describe('Dashboard reports', () => {

packages/e2e/cypress/e2e/mapOverlays.spec.js

@@ -35,7 +35,10 @@ const urlToRouteRegex = url => {
     throw new Error(`'${url}' is not a valid report url: it must contain a 'report' query param`);
   }
 
-  return new RegExp(`measureData\\?(.*&|)mapOverlayCode=${mapOverlayCode}(&|$)`);
+  // Allows responses for both versions of the frontend
+  return new RegExp(
+    `(measureData\\?(.*&|)mapOverlayCode=${mapOverlayCode}(&|$)|legacyMapOverlayReport/${mapOverlayCode})`,
+  );
 };
 
 describe('Map overlays', () => {

packages/tupaia-web/src/api/api.ts

@@ -48,7 +48,7 @@ const getErrorMessage = (error: any) => {
   }
 
   // remove axios `api error ...:` prefix
-  return message?.includes(':') ? message?.split(': ')[1] : message;
+  return message?.includes(':') ? message?.split(': ').slice(1).join(': ') : message;
 };
 
 // Todo: Move api request util to ui-components and allow for mapping to backend request type safety

packages/tupaia-web/src/features/Dashboard/ExportDashboard/ExportDashboard.tsx

@@ -46,6 +46,9 @@ const Container = styled.div`
       font-size: 1rem;
     }
   }
+  .loading-container {
+    width: 100%;
+  }
 `;
 
 const Title = styled(Typography).attrs({

packages/tupaia-web/src/features/Dashboard/ExportDashboard/Preview.tsx

@@ -247,7 +247,7 @@ export const Preview = ({ onClose, selectedDashboardItems = [] }: ExportDashboar
                 entityCode={entityCode}
                 dashboardName={dashboardName}
                 selectedDashboardItems={[visualisationToPreview]}
-                isPreview={!isLoading}
+                isPreview={true}
               />
             </PreviewContainer>
           </PreviewPanelContainer>

packages/tupaia-web/src/features/Map/MapOverlaysLayer/MapOverlaysLayer.tsx

@@ -21,11 +21,16 @@ const useZoomToEntity = () => {
 
   // This is a replacement for the map positioning being handled in the ui-map-components LeafletMap file. We are doing this because we need access to the user's current zoom level, and are also slowly moving away from class based components to use hooks instead.
   useEffect(() => {
-    if (!entity || !map || (!entity.point && !entity.bounds)) return;
+    if (!entity || !map || (!entity.point && !entity.bounds && !entity.region)) return;
+
     if (entity.bounds) {
       map.flyToBounds(entity.bounds, {
         animate: false, // don't animate, as it can slow things down a bit
       });
+    } else if (entity.region) {
+      map.flyToBounds(entity.region, {
+        animate: false, // don't animate, as it can slow things down a bit
+      });
     } else {
       const currentZoom = map.getZoom();
       // if already zoomed in beyond the POINT_ZOOM_LEVEL, don't zoom out

packages/tupaia-web/src/features/Map/MapOverlaysLayer/PolygonLayer.tsx

@@ -128,7 +128,7 @@ export const PolygonLayer = ({ measureData = [], serieses = [], isLoading }: Pol
       {polygons.map((measure: MeasureData) => {
         const { region, code, color, name, permanentTooltip = false } = measure;
 
-        const shade = BREWER_PALETTE[color as keyof typeof BREWER_PALETTE] || color;
+        const shade = BREWER_PALETTE[color as keyof typeof BREWER_PALETTE] || color || '';
         const displayType = getDisplayType(measure);
         const PolygonComponent = POLYGON_COMPONENTS[displayType];
         const showDataOnTooltip = displayType === DISPLAY_TYPES.shaded;

packages/tupaia-web/src/features/Map/utils/useMapOverlayMapData.ts

@@ -10,7 +10,7 @@ import {
   useEntityAncestors,
   useMapOverlays,
 } from '../../../api/queries';
-import { useMapOverlayTableData } from './useMapOverlayTableData.ts';
+import { useMapOverlayTableData } from './useMapOverlayTableData';
 import { Entity } from '../../../types';
 
 /*
@@ -25,25 +25,44 @@ const useNavigationEntities = (
 ) => {
   const rootEntityCode = activeEntity?.parentCode || activeEntity?.code;
 
-  const { data = [] } = useEntitiesWithLocation(
+  // Get siblings for the root entity
+  const { data: siblings = [] } = useEntitiesWithLocation(
     projectCode,
     rootEntityCode,
     {
       params: {
         includeRootEntity: false,
         filter: {
-          generational_distance: 2,
+          generational_distance: 1,
         },
       },
     },
     { enabled: !!rootEntityCode },
   );
 
-  // if display on level is set, we don't want to show the sibling entities because this would cause slow load times, which displayOnLevel is aiming to fix
-  if (displayOnLevel) return [];
+  // Get immediate children for the selected entity
+  const { data: children = [] } = useEntitiesWithLocation(
+    projectCode,
+    activeEntity?.code,
+    {
+      params: {
+        includeRootEntity: false,
+        filter: {
+          generational_distance: 1,
+        },
+      },
+    },
+    { enabled: !!activeEntity?.code && activeEntity?.code !== rootEntityCode },
+  );
+
+  const entitiesData = [...siblings, ...children];
+
+  // If display on level is set, we don't want to show the sibling entities because this would cause slow load times, which displayOnLevel is aiming to fix. Also, don't show child entities if the current entity is the same as 'displayAtLevel', because we would end up with extra entities on the map
+  if (displayOnLevel)
+    return activeEntity?.type?.replace('_', '') === displayOnLevel.toLowerCase() ? [] : children;
 
   // Don't show nav entities for the selected measure level
-  const filteredData = data?.filter(entity => {
+  const filteredData = entitiesData?.filter(entity => {
     if (!measureLevel) return true;
     // handle edge cases of array measure levels
     if (Array.isArray(measureLevel))
@@ -71,6 +90,7 @@ const useRootEntityCode = (entity, measureLevel, displayOnLevel) => {
   }
   const { parentCode, code, type } = entity;
 
+  // if displayAtLevel is set, look for the entity at that level
   if (displayOnLevel) {
     const measure = entityAncestors?.find(
       (entity: Entity) => entity.type.replace('_', '') === displayOnLevel?.toLowerCase(),
@@ -117,6 +137,7 @@ export const useMapOverlayMapData = (hiddenValues = {}) => {
 
   // Get the main visual entities (descendants of root entity for the selected visual) and their data for displaying the visual
   const mapOverlayData = useMapOverlayTableData({ hiddenValues, rootEntityCode });
+
   // Get the relatives (siblings and immediate children) of the active entity for displaying navigation polygons
   const relativesMeasureData = entityRelatives
     ?.filter(

packages/tupaia-web/src/features/Visuals/Chart.tsx

@@ -17,6 +17,12 @@ const GREY_DE = '#DEDEE0';
 const GREY_FB = '#FBF9F9';
 const TEXT_DARKGREY = '#414D55';
 
+const ScreenChartTable = styled(ChartTable)`
+  table {
+    table-layout: unset;
+  }
+`;
+
 const ExportingStyledTable = styled(ChartTable)`
   padding: 1.8rem 0;
   border-bottom: none;
@@ -142,7 +148,7 @@ const DISPLAY_TYPE_VIEWS = [
     value: 'table',
     Icon: GridOn,
     label: 'View table',
-    display: ChartTable,
+    display: ScreenChartTable,
   },
 ];
 
@@ -173,10 +179,10 @@ export const Chart = () => {
   const views = isExport ? EXPORT_DISPLAY_TYPE_VIEWS : DISPLAY_TYPE_VIEWS;
   let availableDisplayTypes = showTable ? views : [views[0]];
 
-  const viewContent = ({
+  const viewContent = {
     ...report,
     ...config,
-  } as unknown) as ViewContent;
+  } as unknown as ViewContent;
 
   return (
     <ErrorBoundary>

packages/tupaia-web/src/views/PDFExport.tsx

@@ -36,8 +36,10 @@ export const PDFExport = ({
   selectedDashboardItems: propsSelectedDashboardItems,
   isPreview = false,
 }: PDFExportProps) => {
-  // Hacky way to change default background color without touching root css.
-  document.body.style.backgroundColor = 'white';
+  // Hacky way to change default background color without touching root css. Only apply when generating the pdf, not when in preview mode as it changes the display
+  if (!isPreview) {
+    document.body.style.backgroundColor = 'white';
+  }
 
   const {
     projectCode: urlProjectCode,