title: How to update UserContext in functional components?
body: <p>I am building a MERN stack application and trying to figure out how to update my UserContext data.</p>
  <p>The UserContext data is as follows:</p>
  <pre><code>{ jwt: &quot;eyJhbGc...&quot;
    user: {
      createdAt: &quot;2022-05-05T10:52:22.653Z&quot;
      currentChild: &quot;abc789&quot; &lt;--- this is what I want to update
      email: &quot;test@gmail.com&quot;
      firstName: &quot;lindsay&quot;
      password: &quot;$2b$10$CJjs9mvr8n4mTps1xxjmJe0jMK6Fo7Tg88qMXaHm5H6yFiOssq4Wa&quot;
      updatedAt: &quot;2022-06-01T11:25:42.450Z&quot;
      __v: 0
      _id: &quot;xyz123&quot;
   }
  }
  </code></pre>
  <p>UserContext.js:</p>
  <pre><code>import React, { createContext, useState } from 'react';
  
  export const UserContext = createContext('');
  
  export default ({ children }) =&gt; {
    const [user, setUser] = useState();
    return (
      &lt;UserContext.Provider value={{ user, setUser }}&gt;
        {children}
      &lt;/UserContext.Provider&gt;
    );
  };
  </code></pre>
  <p>index.js:</p>
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import './index.css';
  import App from './App';
  import UserContextProvider from './context/UserContext';
  import reportWebVitals from './reportWebVitals';
  
  ReactDOM.render(
    &lt;React.StrictMode&gt;
      &lt;UserContextProvider&gt;
        &lt;App /&gt;
      &lt;/UserContextProvider&gt;
    &lt;/React.StrictMode&gt;,
    document.getElementById('root')
  );
  
  reportWebVitals();
  </code></pre>
  <p>function where I want to update the currentChild value of user from UserContext:</p>
  <pre><code>const updateUserData = async (kid_id) =&gt; {
      
      const user_id = user.user._id; 
      let body = {
        kidID: kid_id,
      };
      try {
        const res = await fetch(`/api/users/update/${user_id}`, {
          method: 'PUT',
          headers: {
            'x-auth-token': user.jwt,
            'Content-type': 'application/json',
          },
          body: JSON.stringify(body),
        });
        const data = await res.json();    
        console.log('updateUserData', data);
        // ******************** update currentChild value of user here.. ************* 
        // how?? 
        return data;
      } catch (error) {
        setError(error.message);
      }
    };
  </code></pre>
  <p>Any help would be great. Everything so far I found via google is related to class components. Thanks</p>