From e268ee7078e259590ccfc9e79d88bac71d7f29ca Mon Sep 17 00:00:00 2001
From: Yuval Adam <_@yuv.al>
Date: Thu, 1 Sep 2022 11:14:37 +0300
Subject: Fix slider prev value callback

---
 src/Map.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/Map.tsx b/src/Map.tsx
index ddac01d..588f5c4 100644
--- a/src/Map.tsx
+++ b/src/Map.tsx
@@ -25,7 +25,6 @@ export function Map({ slider, images }: MapProps) {
   const [loaded, setLoaded] = useState(false);
 
   const prevImages = useRef(images).current;
-  const prevSlider = useRef(slider).current;
 
   useEffect(() => {
     if (map.current) return;
@@ -88,9 +87,12 @@ export function Map({ slider, images }: MapProps) {
 
   useEffect(() => {
     if (!loaded) return;
-    images[prevSlider] && map.current.setPaintProperty(`layer-${images[prevSlider]}`, "raster-opacity", 0);
     images[slider] && map.current.setPaintProperty(`layer-${images[slider]}`, "raster-opacity", 0.85);
-  }, [loaded, prevSlider, slider, images]);
+    return () => {
+      // callback will hide the previous layer with the previous slider value
+      map.current.setPaintProperty(`layer-${images[slider]}`, "raster-opacity", 0);
+    }
+  }, [loaded, slider, images]);
 
   return (
     <div>
-- 
cgit v1.3.1