I’m trying to filter data from api. In fact it’s working but i see error:
“FilterCheckboxGroup.js:54 Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn’t have a dependency array, or one of the dependencies changes on every render. Error Component Stack”

valueInput is controling by input with onChange handler

const [valueInput, setValueInput] = useState('')
const [filteredDataList, setFilteredDataList] = useState([])
const [checkedFilterValues, setCheckedFilterValues] = useState()

const { isLoading, error, data } = useGetTableDataQuery(
    `${url}?${column.id}=${value ?? ''}`,
    {
        selectFromResult: ({ data, ...rest }) => {
            if (!data || !data.data) {
                return { data: [], ...rest }
            }
            const modifiedData =
                data.data.map(item => item[column.id]) || []
            const removedDuplicatesData = [...new Set(modifiedData)]
            return { data: removedDuplicatesData, ...rest }
        },
    }
)

useEffect(() => {
    if (data && data.length > 0 && !isLoading) {
        if (valueInput) {
            const updatedDataList = data.filter(listItem =>
                listItem.toLowerCase().includes(valueInput.toLowerCase())
            )
            setFilteredDataList(updatedDataList)
        } else {
            setFilteredDataList(data)
        }
    }
}, [valueInput, data])