Slick Infante is not working

import React from "react";
import ScrollAnimation from "react-animate-on-scroll";
import { FaRegCircle } from "react-icons/fa";
import SlickSlider from "react-slick";

import { useState, useEffect } from "react";
const SplitFour = ({ img, list, images }) => {
const [isMobile, setIsMobile] = useState(false);
useEffect(() => {
const handleResize = () => {
setIsMobile(window.innerWidth < 768); // Adjust the threshold as needed
};

// Initial check on component mount
handleResize();

// Add event listener for window resize
window.addEventListener("resize", handleResize);

// Clean up the event listener on component unmount
return () => {
window.removeEventListener("resize", handleResize);
};
}, []);
const settings = {
infinite: true,
slidesToShow: isMobile ? 2 : 6,
slidesToScroll: 1,
autoplay: true,
speed: 2000,
autoplaySpeed: 2000,
pauseOnHover: true,
arrows: false,
};
return (

{/*

Network and data security is a rapidly growing concern for
business across the globe. As cyber-security threats become
more advanced and frequent, it’s critical that companies
defend themselves against crippling attacks and invasive
breaches. EchoServe can work with your security team to
identify potential vulnerabilities

*/}

{list.map((item) => {
return (

• 
  
  {item.point}
  

);
})}

{images?.map((item) => {
return ;
})}

export default SplitFour;
this is my code the infinite is not working