title: Invalid Hook Call when calling a helper function with useSelector
body: <p>I created a helper function (fetchBatchInfo) inside a TypeScript file to use in more than one component but it is returning the error &quot;Invalid Hook Call when calling a function with useSelector&quot; since it has a useSelector inside. I'm using the function renderBatches that calls this helper function inside a FlatList renderItem. I tried searching for alternatives and found about custom hooks, but I could not find a way to execute the custom hook inside the render function of the FlatList, since it is still a hook.</p>
  <p>I'm still a beginner in redux, is there a way to achieve what I'm trying to?</p>
  <p>Render function of flatlist:</p>
  <pre><code>const renderBatches = useCallback((animalBatch: AnimalBatch) =&gt; {
      let animalBatch: AnimalBatch= animalBatch.item;
  
      let { chickenBatch } = fetchBatchInfo(animalBatch);
  
      return (
          &lt;Text&gt;{animalBatch.quantity} - {chickenBatch.sex}&lt;/Text&gt;
      );
  }, [animalBatchUser]);
  </code></pre>
  <br/>
  Helper function that returns all data of current animalBatch:
  <pre><code>export const fetchBatchInfo = (animalBatch: AnimalBatch) =&gt; {
      const chickenBatchesUser = useSelector(
          (state: RootStateOrAny) =&gt; state.batch.chickenBatchesUser);
  
      let chickenBatch: ChickenBatch | undefined = chickenBatchesUser.find(
          (chickenBatch: ChickenBatch) =&gt; chickenBatch.idChickenBatch == animalBatch.idChickenBatch)
  
      return {
          chickenBatch
      };
  }
  </code></pre>
  <p>Before using this helper function, it was working, because the chickenBatchesUser useSelector was outside the render function, but since I will be using this code in other places I want to make this helper function work.</p>
  <p>Does someone know a way to do this?</p>