[ Async Search with Debounce and Creatable ] is always in the loading state

[lumpinif]

To be noticed: The code for Implementing the muti-select is the same as the one from [ Async Search with Debounce and Creatable ], I copy and paste it into my nextjs project.

Issue: When the loading state is triggered, it seems unstoppable to complete the search, until clear out the input then the results finally show up.

[lumpinif]

updates:

It's solved. It turns out I accidentally auto-updates the deps of onSearch in the useEffect of doSearch.
It is working as expected after I removed the onSearch and disable the eslint.

useEffect(() => {
  const doSearch = async () => {
    setIsLoading(true)
    const res = await onSearch?.(debouncedSearchTerm)
    setOptions(transToGroupOption(res || [], groupBy))
    setIsLoading(false)
  }

  const exec = async () => {
    if (!onSearch || !open) return

    if (triggerSearchOnFocus) {
      await doSearch()
    }

    if (debouncedSearchTerm) {
      await doSearch()
    }
  }

  void exec()
  // eslint-disable-next-line react-hooks/exhaustive-deps
}, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])