How to show the current slide and total slides with react-slick

Question

Even following different examples I can't apply the solution. Here are some sites I visited:

https://react-slick.neostack.com/docs/example/custom-paging

https://codesandbox.io/s/react-slick-forked-rxj5vp?file=/index.js:472-572

https://jsfiddle.net/tjwo23L8/

For me it is always presented in the frontend a wrong value that is not the total value of slides. Here is the code I am applying:

const heroSettings = { dots: true, infinite: true,fade: true,lazyLoad: true, speed: 800, autoplay: true, autoplaySpeed: 5000,slidesToShow: 1,slidesToScroll: 1,  customPaging: i => (<button> {i  + '/' + (i + currentSLide)}</button>),};

I get a value on the frontend similar to: 1/30 or 2/7. Since I have 7 slides in total in the loop.