title: hook change state doesn't update context provider's value?
body: <p>I have 2 component, and a context provider, when I call my hook at parent level, I have no issue changing the state and having those 2 component getting the value via context</p>
  
  <p>working demo of contex api usage but I call change state at parent level which is not what I wanted
  <a href="https://stackblitz.com/edit/react-51e2ky?file=index.js" rel="noreferrer">https://stackblitz.com/edit/react-51e2ky?file=index.js</a></p>
  
  <p>I want to change state at inner component with hook, but I don't see the value been changed when I click on the <code>navbar login</code>. </p>
  
  <p><a href="https://stackblitz.com/edit/react-rgenmi?file=Navbar.js" rel="noreferrer">https://stackblitz.com/edit/react-rgenmi?file=Navbar.js</a></p>
  
  <p>parent:</p>
  
  <pre><code>const App = () =&gt; {
    const {user} = loginHook()
      return (
        &lt;UserContext.Provider value={user}&gt;
          &lt;Navbar /&gt;
          &lt;Content /&gt;
        &lt;/UserContext.Provider&gt;
      );
  
  }
  </code></pre>
  
  <p>Navbar.js</p>
  
  <pre><code>const Navbar = () =&gt; {
    const user = React.useContext(userContex)
    const {setUser} = loginHook()
  
    return &lt;div&gt;{user ? &lt;span&gt;{user.name}&lt;/span&gt; : &lt;button onClick={() =&gt; {
      setUser({
        name: 'jane'
      })
    }}&gt;navbar Login&lt;/button&gt;}&lt;/div&gt;
  }
  </code></pre>
  
  <p>custom hook</p>
  
  <pre><code>const loginHook = () =&gt; {
    const [user, setUser] = React.useState(null)
  
    return {
      user,
      setUser
    }
  }
  </code></pre>
  
  <p>I can pass setUser from parent to children but I want to avoid that, I expect I can use context api and react hook seamlessly. </p>