fix: pause video on scroll

src/shared/components/Carousel/Carousel.tsx

@@ -8,24 +8,26 @@ import sliderArrowLeft from "@/shared/assets/icons/sliderArrowLeft.svg";
 import sliderArrowRight from "@/shared/assets/icons/sliderArrowRight.svg";
 
 type Props = {
-    children: ReactNode
+    children: ReactNode,
+    settings?: ComponentProps<typeof Slider>
 };
 
-const settings: ComponentProps<typeof Slider> = {
-    infinite: true,
-    speed: 500,
-    slidesToShow: 1,
-    slidesToScroll: 1,
-    lazyLoad: 'progressive',
-    prevArrow: <Image src={sliderArrowLeft} alt={''}/>,
-    nextArrow: <Image src={sliderArrowRight} alt={''}/>,
-    dots: true
-};
+export function Carousel({children, settings}: Props) {
+    const defaultSettings: ComponentProps<typeof Slider> = {
+        infinite: true,
+        speed: 500,
+        slidesToShow: 1,
+        slidesToScroll: 1,
+        lazyLoad: 'progressive',
+        prevArrow: <Image src={sliderArrowLeft} alt={''}/>,
+        nextArrow: <Image src={sliderArrowRight} alt={''}/>,
+        dots: true,
+        ...settings
+    };
 
-export function Carousel({children}: Props) {
     return (
         <div className={styles.root}>
-            <Slider {...settings}>
+            <Slider {...defaultSettings}>
                 {children}
             </Slider>
         </div>