title: How can i update context value with the state value
body: <p>I can receive the correct object, but i can't update the context value with the updated object with the state value</p>
  <p>In the:</p>
  <pre><code>const Context = createContext({
    theme: dark,
    toggleTheme: () =&gt; {},
  });
  </code></pre>
  <p>I want to make the theme: dark, become, theme: defaultTheme, with a dynamic value modified by useState</p>
  <pre><code>import React, { createContext, useState } from 'react';
  
  import light from '../themes/light';
  import dark from '../themes/dark';
  
  const Context = createContext({
    theme: dark,
    toggleTheme: () =&gt; {},
  });
  
  export default Context;
  
  export function ThemeContextProvider({ children }) {
    const [defaultTheme, setDefaultTheme] = useState(dark);
  
    function toggleTheme() {
      setDefaultTheme(defaultTheme === dark ? light : dark);
    }
    
    return (
      &lt;Context.Provider value={{ theme, toggleTheme }}&gt;
      {children}
      &lt;/Context.Provider&gt;
    )
  }
  </code></pre>