Problem at the end of List

[kaydeniz]

Hi, I made a page with an infinite loop structure in my project by using your project. but when I come to the end of the list, it still works as if there is an element in the list and tries to load it. Can we put a limit on lazyLoad?

[Ashutosh Hathidara]

@kaydeniz can you explain in detail? couldn't get your point.

[kaydeniz]

`
import {getQuestionDetailsInTest} from "../../../../../_apis/addQuestionApi/addQuestionApi";
import useLazyLoad from "../utils/lazyLoad";
import {Stack} from "@mui/material";
import QuestionView from "./QuestionView/QuestionView";
import clsx from "clsx";
import React, {useRef} from "react";
import CircularProgress from "@mui/material/CircularProgress";
import PropTypes from "prop-types";

function LazyComponent(props) {
const {questionList} = props;
const triggerRef = useRef(null);
const onGrabData = (currentPage) => {
const param = {questionIds: [questionList[currentPage].questionId]}
return new Promise((resolve) => {
let data = {}
getQuestionDetailsInTest(param,
(responseData) => {
data = responseData
},
() => {
}
).then(() => resolve(data))
});
};

const {data, loading} = useLazyLoad({triggerRef, onGrabData});

return (
    <Stack spacing={2}>
        {data.map(question => {
            return <QuestionView key={question.questionId} questionData={question}/>
        })}
        <div ref={triggerRef} className={clsx("trigger", {visible: loading})}>
            <div className='loading-circular'>
                <CircularProgress/>
            </div>
        </div>
    </Stack>
);

}

LazyComponent.propTypes = {
questionList: PropTypes.array
};

export default LazyComponent;
`
I prepared the above component to show the questions in my project. As I scroll down on the page, I call a question and display the incoming data. I also show the last question in the list, but still onGrabData works as if there is a question in the list and I get an error. I wonder if I have to limit the size of my list in the useLazyLoad hook.

[kaydeniz]

@ashutosh1919 Hi, Have you had a chance to look into the problem?