import React, { FC } from 'react';
import { Carousel } from 'react-responsive-carousel';
import './index.css';

export interface CarouselContainerProps {
  children?: [];
}

const CarouselContainer: FC<CarouselContainerProps> = ({ children }) => (
  <Carousel
    autoPlay={true}
    showStatus={false}
    showThumbs={false}
    infiniteLoop={true}
    interval={7000}
    transitionTime={450}
    swipeScrollTolerance={50}
    preventMovementUntilSwipeScrollTolerance={true}
    showIndicators={children.length > 1}
    swipeable={children.length > 1}
  >
    {children}
  </Carousel>
);

export default CarouselContainer;