title: Trying to resolve a 'state update on an unmounted component' error suggesting a memory leak
body: <p>I've been receiving an error message in the developer console suggesting a type of memory leak tied to my <code>useEffect()</code>'s. The error suggests to develop some form of 'cleanup' function, but I'm not sure why this is occurring in the first place or how to go about developing this. How should I approach this? My <code>useEffect()</code> functions in question are below:</p>
  <pre><code>useEffect(() =&gt; {
      window.addEventListener('scroll', handleScroll);
      return () =&gt; window.removeEventListener('scroll', handleScroll);
    }, []);
  
    useEffect(() =&gt; {
      if (!isFetching) return;
      fetchMoreListItems();
    }, [isFetching]);
  
    useEffect(() =&gt; {
      let mounted = true;
      if (!props.resource) return;
      props.resource
        .follow('item-collection')
        .followAll('item')
        .then(resources =&gt; {
        if (mounted) {
           setItems(resources);
          }
        })
        .catch(err =&gt; console.error('Error fetching resources: ' + err));
        return () =&gt; mounted = false;
    }, [itemResource]);
  </code></pre>