fix: MDS-1320 workaround working

coingaming · Sep 25, 2024 · cf83cc8 · cf83cc8
1 parent eaafca1
commit cf83cc8
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 24 deletions.
diff --git a/packages/core/src/carousel/Carousel.tsx b/packages/core/src/carousel/Carousel.tsx
@@ -119,6 +119,7 @@ const Reel = ({ children, className, ...rest }: SubcomponentProps) => {
     handleMouseUp,
     debounceMouseDown,
     debounceMouseUp,
+    isDragging,
   } = useCarouselContext("Carousel.Reel");
   const arrayChildren = Children.toArray(children);
   const revertChildren = arrayChildren.reverse();
@@ -138,28 +139,19 @@ const Reel = ({ children, className, ...rest }: SubcomponentProps) => {
         className,
       )}
       onMouseEnter={() => {
-        console.log("in here oe on mouse enter");
         handleMouseDown?.();
       }}
       onMouseLeave={() => {
-        console.log("in here oe on mouse leave");
         handleMouseUp?.();
       }}
       onTouchStart={() => {
-        // handleMouseDown?.();
-        console.log("in here oe on touch start");
-        if (debouncedMouseDown) {
-          console.log("in here oe inside down");
-          debouncedMouseDown();
+        if (!isDragging) {
+          handleMouseDown?.();
         }
       }}
       onTouchEnd={() => {
-        // handleMouseUp?.();
-        // debouncedMouseUp?.();
-        console.log("in here oe on touch end");
-        if (debouncedMouseUp) {
-          console.log("in here oe inside up");
-          debouncedMouseUp();
+        if (isDragging) {
+          debouncedMouseUp?.();
         }
       }}
       ref={containerRef}

diff --git a/packages/core/src/carousel/private/utils/useInterval.ts b/packages/core/src/carousel/private/utils/useInterval.ts
@@ -17,16 +17,15 @@ const useInterval = (
       savedCallback.current?.();
     }
 
-    console.log("in here oe test", { isDragging, intervalId, delay });
-
     if (isDragging && intervalId) {
-      // clearInterval(intervalId);
+      clearInterval(intervalId);
+      setIntervalId(undefined);
       return () => {
         clearInterval(intervalId);
       };
     }
 
-    if (delay !== null) {
+    if (!isDragging && delay !== null) {
       let id = setInterval(tick, delay);
       setIntervalId(id);
       return () => {

diff --git a/packages/core/src/carousel/private/utils/withHorizontalScroll.ts b/packages/core/src/carousel/private/utils/withHorizontalScroll.ts
@@ -26,15 +26,15 @@ const findFirstVisibleIndex = (childRefs: any[]): any => {
   return childRefs.findIndex((child) => child.getAttribute("visible"));
 };
 
-const scrollToIndex = (
+const scrollToIndex = async (
   itemRef: HTMLElement,
   scrollIntoViewSmoothly: any,
   containerRef?: any,
   scrollStep?: number,
   isNotSmooth?: boolean,
 ) => {
   if (itemRef) {
-    scrollIntoViewSmoothly(itemRef, {
+    await scrollIntoViewSmoothly(itemRef, {
       block: "nearest",
       inline: scrollStep === 1 ? "center" : "nearest",
       behavior: isNotSmooth ? undefined : "smooth",
@@ -234,18 +234,16 @@ export const withHorizontalScroll = (options: Options): any => {
   }, []);
 
   const handleMouseDown = () => {
-    setIsDragging(true);
-    console.log("in here oe mouse down");
+    setIsDragging((prevState) => !prevState);
   };
 
   const handleMouseUp = () => {
-    setIsDragging(false);
+    setIsDragging((prevState) => !prevState);
     console.log("in here oe mouse up");
   };
 
   const debounce = (fallback: (...args: any) => void, delay: number) => {
     let timer: number;
-
     return (...args: any) => {
       clearTimeout(timer);
       timer = setTimeout(() => {
@@ -259,7 +257,7 @@ export const withHorizontalScroll = (options: Options): any => {
   };
 
   const debounceMouseUp = () => {
-    return debounce(handleMouseUp, 500);
+    return debounce(handleMouseUp, 3000);
   };
 
   return {