Resolve #51

snippets/Carousel.md

@@ -7,7 +7,7 @@ Renders a carousel component.
 
 - Use the `React.setState()` hook to create the `active` state variable and give it a value of `0` (index of the first item).
 - Use an object, `style`, to hold the styles for the individual components.
-- Use the `React.setEffect()` hook to update the value of `active` to the index of the next item, using `setTimeout`.
+- Use the `React.useEffect()` hook to update the value of `active` to the index of the next item, using `setTimeout`.
 - Destructure `props`, compute if visibility style should be set to `visible` or not for each carousel item while mapping over and applying the combined style to the carousel item component accordingly.
 - Render the carousel items using `React.cloneElement()` and pass down rest `props` along with the computed styles.
 
@@ -32,6 +32,7 @@ function Carousel(props) {
       const { carouselItems } = props;
       setActive((active + 1) % carouselItems.length);
     }, 2000);
+    return () => clearTimeout(scrollInterval);
   });
   const { carouselItems, ...rest } = props;
   return (