Add Swiper

sainthiago · Sep 7, 2022 · 3574106 · 3574106
1 parent d3c6a4c
commit 3574106
Showing 1 changed file with 10 additions and 0 deletions.
diff --git a/src/components/Carousel.tsx b/src/components/Carousel.tsx
@@ -16,6 +16,7 @@ const Carousel = (props: CarouselProps) => {
 
   const [isLoading, setIsLoading] = useState(true);
   const [currentIndex, setCurrentIndex] = useState(startIndex ?? 0);
+  const [dragStart, setDragStart] = useState(0);
 
   const ref = useRef<HTMLImageElement | null>(null);
 
@@ -99,6 +100,15 @@ const Carousel = (props: CarouselProps) => {
                 onLoad={() => {
                   setTimeout(() => setIsLoading(false), 1000);
                 }}
+                onDragStart={(e) => setDragStart(e.clientX)}
+                onDragEnd={(e) => {
+                  if (dragStart > e.clientX) {
+                    scrollToRight();
+                    return;
+                  }
+
+                  scrollToLeft();
+                }}
               />
             </div>
           </>