title: Is logical to use React useCallback for this example?
body: <p>I'm new in React hooks, in one of parts in our projects, we have a function to handle modal display in cards:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const toggleModal = () =&gt; setModalDisplay(!modalDisplay)</code></pre>
  </div>
  </div>
  </p>
  <p>in this case, I have to pass this function to each child components... maybe for 10 or 1000 children!</p>
  <p>So, regard to React JS DOC <code>useCallback</code> returns a memoized function to reduce the memory usage and handle expensive computing. but I have to pass params to second argument to refresh callback and return the new one.</p>
  <p>but in this case, we have a state to handle modal toggle, that every times has changes between true and false. so, with considering the logic of <code>useCallback</code> and our use case, if I use <code>useCallback</code> for this example, practically that function (<code>toggleModal</code>) updates every times and <code>useCallback</code> is useless for this use case.</p>
  <p>for example:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const memoizedModalToggle = useCallback(
    () =&gt; {
      setModalDisplay(!modalDisplay)
    },
    [modalDisplay],
  );</code></pre>
  </div>
  </div>
  </p>
  <p>finally, is this a correct using of <code>useCallback</code>? or I have mistake in implementation and logic?</p>
  <p>Thanks</p>