Stop slider when infinite: false, React-Slick Slide

working on a nextjs page.

using react-slick to slide name, categories etc.

when i click next button it still going backward, doesnt stop and creating space. (reference attached image)
This should be stop, when infinite is set to: false.

Inspired from [this site](https://www.viator.com/Paris/d479-ttd) to achieve this slider.

my setting. please check [setup on Stackblitz](https://stackblitz.com/edit/stackblitz-starters-dsndi6?file=components%2Freact-slick.tsx)

`const CategoryScroller = () => {
const settings = {
dots: false,
infinite: false,
speed: 500,
initialSlide: 0,
centerPadding: '0px',
variableWidth: true, // Enable variable width
nextArrow: ,
prevArrow: ,
responsive: [
],
};`

markup

`