From 549cfbf8348166be1cf6fd2ff9d34fd5a8d5bfe8 Mon Sep 17 00:00:00 2001
From: MN <97020799+VWSCoronaDashboard24@users.noreply.github.com>
Date: Wed, 22 Jun 2022 09:37:11 +0200
Subject: [PATCH] COR-749 Fix responsive Choropleth sizing (#4293)

* fix: remove minHeight for vr and gm pages choropleth

* fix: only set minHeight when provided

* fix: remove console.log

* fix: code cleanup

Co-authored-by: VWSCoronaDashboard24 <VWSCoronaDashboard24@users.noreply.github.com>
---
 .../choropleth/components/canvas-choropleth-map.tsx           | 4 +++-
 .../src/components/choropleth/components/choropleth-map.tsx   | 1 +
 packages/app/src/pages/gemeente/index.tsx                     | 2 +-
 packages/app/src/pages/veiligheidsregio/index.tsx             | 2 +-
 4 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/app/src/components/choropleth/components/canvas-choropleth-map.tsx b/packages/app/src/components/choropleth/components/canvas-choropleth-map.tsx
index 09e352259b..350fb94d95 100644
--- a/packages/app/src/components/choropleth/components/canvas-choropleth-map.tsx
+++ b/packages/app/src/components/choropleth/components/canvas-choropleth-map.tsx
@@ -46,6 +46,7 @@ export type CanvasChoroplethMapProps = {
   fitExtent: FitExtent;
   getFeatureName: (code: string) => string;
   height: number;
+  minHeight?: number;
   isTabInteractive: boolean;
   mapProjection: () => GeoProjection;
   tooltipTrigger: ChoroplethTooltipHandlers[2];
@@ -72,6 +73,7 @@ export const CanvasChoroplethMap = (props: CanvasChoroplethMapProps) => {
     fitExtent,
     getFeatureName,
     height,
+    minHeight,
     isTabInteractive,
     mapProjection,
     tooltipTrigger,
@@ -170,7 +172,7 @@ export const CanvasChoroplethMap = (props: CanvasChoroplethMapProps) => {
       <div
         ref={containerRef}
         style={{
-          minHeight: height,
+          minHeight: minHeight && minHeight > 0 ? minHeight : 'inherit',
           maxHeight: '75vh',
           maxWidth: '100%',
           height: '100%',
diff --git a/packages/app/src/components/choropleth/components/choropleth-map.tsx b/packages/app/src/components/choropleth/components/choropleth-map.tsx
index b852aed439..9e9c0c043e 100644
--- a/packages/app/src/components/choropleth/components/choropleth-map.tsx
+++ b/packages/app/src/components/choropleth/components/choropleth-map.tsx
@@ -136,6 +136,7 @@ export const ChoroplethMap: <T extends ChoroplethDataItem>(
             dataOptions={dataOptions}
             width={width}
             height={correctedHeight}
+            minHeight={minHeight}
             annotations={annotations}
             featureOverHandler={featureOverHandler}
             featureOutHandler={featureOutHandler}
diff --git a/packages/app/src/pages/gemeente/index.tsx b/packages/app/src/pages/gemeente/index.tsx
index 56d91fe2e4..db4b466731 100644
--- a/packages/app/src/pages/gemeente/index.tsx
+++ b/packages/app/src/pages/gemeente/index.tsx
@@ -83,7 +83,7 @@ const Municipality = (props: StaticProps<typeof getStaticProps>) => {
                 }}
                 map="gm"
                 data={data}
-                minHeight={900}
+                minHeight={0}
                 dataConfig={{
                   metricName: 'gemeente' as any,
                   metricProperty: 'admissions_on_date_of_admission',
diff --git a/packages/app/src/pages/veiligheidsregio/index.tsx b/packages/app/src/pages/veiligheidsregio/index.tsx
index da349f08cb..0592b86bfc 100644
--- a/packages/app/src/pages/veiligheidsregio/index.tsx
+++ b/packages/app/src/pages/veiligheidsregio/index.tsx
@@ -91,7 +91,7 @@ const VrIndexPage = (props: StaticProps<typeof getStaticProps>) => {
                 }}
                 map="vr"
                 data={data}
-                minHeight={900}
+                minHeight={0}
                 dataConfig={{
                   metricName: 'veiligheidsregio' as any,
                   metricProperty: 'admissions_on_date_of_admission',