Fix resizable and scroll

Vizzuality · Oct 15, 2024 · 669f328 · 669f328
1 parent 9a2cb5f
commit 669f328
Showing 1 changed file with 11 additions and 2 deletions.
diff --git a/src/components/section-2/index.tsx b/src/components/section-2/index.tsx
@@ -33,14 +33,23 @@ export default function Section2() {
     target: scrollSectionRef,
   });
   const [globePhase, setGlobePhase] = useState(0);
-  const [resizableWidth, setResizableWidth] = useState(400);
 
   const screenWidth = useScreenWidthWithResize();
+  const [resizableWidth, setResizableWidth] = useState(screenWidth ? screenWidth / 2 : 800);
 
   useEffect(() => {
-    scrollToSection(`globe-phase-${globePhase + 1}`);
+    if (globePhase) {
+      scrollToSection(`globe-phase-${globePhase + 1}`);
+    }
   }, [globePhase]);
 
+  useEffect(() => {
+    if (screenWidth || resizableWidth === 0) {
+      setResizableWidth(screenWidth / 2);
+    }
+  }
+    , [screenWidth]);
+
   useMotionValueEvent(scrollYProgress, "change", (latest) => {
     if (latest >= 0 && latest < 0.1 && globePhase !== 0) {
       setGlobePhase(0);