title: Custom hook for reac-query CRUD opertions
body: <p>I'm working on encapsulating my <code>react-query</code> CRUD operations for Orders in a custom hook. First I've encapsulated the <code>getAllOrders</code> opertion and worked well but now I'm trying to do the same with the <code>getDetails</code> and I'm having this error message:</p>
  <blockquote>
  <p>React Hook &quot;useQuery&quot; is called in function &quot;order&quot; that is neither a React function component nor a custom React Hook function. React component names must start with an uppercase letter. React Hook names must start with the word &quot;use&quot;  react-hooks/rules-of-hooks</p>
  </blockquote>
  <p>It's complaining because the query it's not being executed on a component or hook but inside a function inside a hook.</p>
  <p>I don't want to pass a parameter to the hook because not always I'll need one order details.</p>
  <p>This is my hook so far:</p>
  <pre class="lang-js prettyprint-override"><code>const useOrders = () =&gt; {
    const session = useContext(Context);
    const token = session.storedValue.token;
  
    const orders = useQuery([&quot;orders&quot;, token], () =&gt; {
      const result = getOrders(token);
      return result;
    });
  
    const order = (orderId) =&gt; {
      const query = useQuery([&quot;order&quot;, token, orderId], () =&gt; {
        const result = getOrderDetails(token, orderId);
        return result;
      });
  
      return query;
    };
  
    return { orders, order };
  };
  </code></pre>
  <p>I'd like to pass the <code>orderId</code> to the <code>order</code> function and get query.</p>