From 42e8ce8cf02c7aa69f92cba53f52d4a0dc0f4a0e Mon Sep 17 00:00:00 2001
From: tnagorra <weathermist@gmail.com>
Date: Fri, 17 Nov 2023 11:30:49 +0545
Subject: [PATCH] Update the styling of map container

- Add isChromatic to update animation parameters
---
 storybook/.storybook/preview-head.html                     | 3 +++
 storybook/package.json                                     | 1 +
 storybook/stories/BubbleMap.stories.tsx                    | 2 +-
 storybook/stories/ChoroplethMap.stories.tsx                | 2 +-
 storybook/stories/FitBounds.stories.tsx                    | 5 +++--
 storybook/stories/FlyToLocation.stories.tsx                | 5 +++--
 storybook/stories/GeoJSONMap.stories.tsx                   | 2 +-
 storybook/stories/MbtilesMap.stories.tsx                   | 1 -
 storybook/stories/PmtilesMap.stories.tsx                   | 1 -
 storybook/stories/SimpleMap.stories.tsx                    | 2 +-
 storybook/stories/WithClickInteraction.stories.tsx         | 1 -
 storybook/stories/WithClickInteractionAndPopup.stories.tsx | 1 -
 storybook/stories/WithDragInteraction.stories.tsx          | 2 +-
 storybook/stories/WithHoverInteractionAndPopup.stories.tsx | 2 +-
 storybook/stories/WithHoverInteractive.stories.tsx         | 2 +-
 yarn.lock                                                  | 5 +++++
 16 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/storybook/.storybook/preview-head.html b/storybook/.storybook/preview-head.html
index 5efba73..dfe8609 100644
--- a/storybook/.storybook/preview-head.html
+++ b/storybook/.storybook/preview-head.html
@@ -2,6 +2,9 @@
   window.global = window;
 </script>
 <style>
+    .html, .body, #root {
+        height: 100%
+    }
     * {
         box-sizing: border-box;
     }
diff --git a/storybook/package.json b/storybook/package.json
index d20e4cf..cf82a4d 100644
--- a/storybook/package.json
+++ b/storybook/package.json
@@ -17,6 +17,7 @@
         "@mapbox/mapbox-gl-draw": "^1.4.3",
         "@togglecorp/fujs": "^2.0.0",
         "@togglecorp/re-map": "^0.3.0",
+        "chromatic": "^9.0.0",
         "immer": "^10.0.3",
         "maplibre-gl": "^3.5.2",
         "react": "^18.2.0",
diff --git a/storybook/stories/BubbleMap.stories.tsx b/storybook/stories/BubbleMap.stories.tsx
index 0d4f611..0783ebc 100644
--- a/storybook/stories/BubbleMap.stories.tsx
+++ b/storybook/stories/BubbleMap.stories.tsx
@@ -72,5 +72,5 @@ export function Default() {
 
 export default {
     title: 'Type/Bubble Map',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/storybook/stories/ChoroplethMap.stories.tsx b/storybook/stories/ChoroplethMap.stories.tsx
index 5f22b5c..d86b458 100644
--- a/storybook/stories/ChoroplethMap.stories.tsx
+++ b/storybook/stories/ChoroplethMap.stories.tsx
@@ -187,5 +187,5 @@ export function Default() {
 
 export default {
     title: 'Type/Choropleth Map',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/storybook/stories/FitBounds.stories.tsx b/storybook/stories/FitBounds.stories.tsx
index 5c92a9e..c92e690 100644
--- a/storybook/stories/FitBounds.stories.tsx
+++ b/storybook/stories/FitBounds.stories.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import isChromatic from 'chromatic/isChromatic';
 import Map, {
     MapContainer,
     MapBounds,
@@ -27,7 +28,7 @@ export function Default() {
             <MapBounds
                 bounds={bounds}
                 padding={10}
-                duration={1000}
+                duration={isChromatic() ? 0 : 1000}
             />
         </Map>
     );
@@ -35,5 +36,5 @@ export function Default() {
 
 export default {
     title: 'Basic/Fit Bounds',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/storybook/stories/FlyToLocation.stories.tsx b/storybook/stories/FlyToLocation.stories.tsx
index 57fbb95..6c684c3 100644
--- a/storybook/stories/FlyToLocation.stories.tsx
+++ b/storybook/stories/FlyToLocation.stories.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import isChromatic from 'chromatic/isChromatic';
 import Map, {
     MapContainer,
     MapCenter,
@@ -25,7 +26,7 @@ export function Default() {
                 ]}
                 centerOptions={{
                     zoom: 4,
-                    duration: 1000,
+                    duration: isChromatic() ? 0 : 1000,
                 }}
             />
         </Map>
@@ -34,5 +35,5 @@ export function Default() {
 
 export default {
     title: 'Basic/Fly to Location',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/storybook/stories/GeoJSONMap.stories.tsx b/storybook/stories/GeoJSONMap.stories.tsx
index f6a23d8..af01414 100644
--- a/storybook/stories/GeoJSONMap.stories.tsx
+++ b/storybook/stories/GeoJSONMap.stories.tsx
@@ -76,5 +76,5 @@ export function Default() {
 
 export default {
     title: 'Source/GeoJSON Source',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/storybook/stories/MbtilesMap.stories.tsx b/storybook/stories/MbtilesMap.stories.tsx
index d12b3f8..cc2f102 100644
--- a/storybook/stories/MbtilesMap.stories.tsx
+++ b/storybook/stories/MbtilesMap.stories.tsx
@@ -10,5 +10,4 @@ export function Default() {
 
 export default {
     title: 'Source/Mbtiles Source',
-    parameters: { delay: 500 },
 };
diff --git a/storybook/stories/PmtilesMap.stories.tsx b/storybook/stories/PmtilesMap.stories.tsx
index 4d3fcf6..ca0c21c 100644
--- a/storybook/stories/PmtilesMap.stories.tsx
+++ b/storybook/stories/PmtilesMap.stories.tsx
@@ -10,5 +10,4 @@ export function Default() {
 
 export default {
     title: 'Source/Pmtiles Source',
-    parameters: { delay: 500 },
 };
diff --git a/storybook/stories/SimpleMap.stories.tsx b/storybook/stories/SimpleMap.stories.tsx
index 2c98b18..d14dbea 100644
--- a/storybook/stories/SimpleMap.stories.tsx
+++ b/storybook/stories/SimpleMap.stories.tsx
@@ -24,5 +24,5 @@ export function Default() {
 
 export default {
     title: 'Basic/Simple Map',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/storybook/stories/WithClickInteraction.stories.tsx b/storybook/stories/WithClickInteraction.stories.tsx
index 4a03261..0b427a6 100644
--- a/storybook/stories/WithClickInteraction.stories.tsx
+++ b/storybook/stories/WithClickInteraction.stories.tsx
@@ -10,5 +10,4 @@ export function Default() {
 
 export default {
     title: 'Basic/With Click Interaction',
-    parameters: { delay: 500 },
 };
diff --git a/storybook/stories/WithClickInteractionAndPopup.stories.tsx b/storybook/stories/WithClickInteractionAndPopup.stories.tsx
index 57b2220..4f8c59c 100644
--- a/storybook/stories/WithClickInteractionAndPopup.stories.tsx
+++ b/storybook/stories/WithClickInteractionAndPopup.stories.tsx
@@ -10,5 +10,4 @@ export function Default() {
 
 export default {
     title: 'Basic/With Click Interaction and Popup',
-    parameters: { delay: 500 },
 };
diff --git a/storybook/stories/WithDragInteraction.stories.tsx b/storybook/stories/WithDragInteraction.stories.tsx
index 6f1e3f7..f03830c 100644
--- a/storybook/stories/WithDragInteraction.stories.tsx
+++ b/storybook/stories/WithDragInteraction.stories.tsx
@@ -170,5 +170,5 @@ export function Default() {
 
 export default {
     title: 'Basic/With Drag Interaction',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/storybook/stories/WithHoverInteractionAndPopup.stories.tsx b/storybook/stories/WithHoverInteractionAndPopup.stories.tsx
index 911ec4a..bf84fc0 100644
--- a/storybook/stories/WithHoverInteractionAndPopup.stories.tsx
+++ b/storybook/stories/WithHoverInteractionAndPopup.stories.tsx
@@ -131,5 +131,5 @@ export function Default() {
 
 export default {
     title: 'Basic/With Hover Interaction and Popup',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/storybook/stories/WithHoverInteractive.stories.tsx b/storybook/stories/WithHoverInteractive.stories.tsx
index 3daf712..c124851 100644
--- a/storybook/stories/WithHoverInteractive.stories.tsx
+++ b/storybook/stories/WithHoverInteractive.stories.tsx
@@ -85,5 +85,5 @@ export function Default() {
 
 export default {
     title: 'Basic/With Hover Interaction',
-    parameters: { delay: 500 },
+    parameters: { delay: 1000 },
 };
diff --git a/yarn.lock b/yarn.lock
index 8d596a5..ce06ceb 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4943,6 +4943,11 @@ chownr@^2.0.0:
   resolved "https://registry.yarnpkg.com/chownr/-/chownr-2.0.0.tgz#15bfbe53d2eab4cf70f18a8cd68ebe5b3cb1dece"
   integrity sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==
 
+chromatic@^9.0.0:
+  version "9.0.0"
+  resolved "https://registry.yarnpkg.com/chromatic/-/chromatic-9.0.0.tgz#0b429b5b171428495a39e7dcbaeaa56b06f055e6"
+  integrity sha512-PczbWYOfqsf/SM0yIzI3ZOpFznEyf9Fc96EkxoYkhztFaA9CEOcpA9nk8zpmNgPUQWmIWNyG7z4xEK40sApFzw==
+
 chrome-trace-event@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/chrome-trace-event/-/chrome-trace-event-1.0.3.tgz#1015eced4741e15d06664a957dbbf50d041e26ac"