title: OnClick hook call - React
body: <p>I need to execute a graphQL query so my users can log out. Ideally, they would click a <code>logout</code> button and the query would execute, signing them out. However, it's not that easy.</p>
  <p>Here's my code so far:</p>
  <pre class="lang-js prettyprint-override"><code>const LOGOUT = gql`
    mutation Logout {
      logout
    }
  `;
  
  const LogoutButton = (props) =&gt; {
    const logout = () =&gt; {
      useMutation&lt;Record&lt;string, any&gt;&gt;(LOGOUT);
    };
  
    return (
      &lt;button onClick={logout}&gt;Logout&lt;/button&gt;
    )
  };
  </code></pre>
  <p>I'm getting the following error message: <code>Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component.</code></p>
  <p>I'm sorry for such a rookie question, but I'm stuck. I appreciate any advice.</p>