title: Is it possible to use the same <Context.Provider> on multiple components?
body: <p>I know that I can wrap HOC with my <code>&lt;Context.Provider&gt;</code> and consume it in all child components.</p>
  
  <p>I would like to consume context in two separate components but they are nested somewhere deeply and closest parent of them is somewhere in the app root. I don't want to provide context to (almost) all components, so I was wondering is it possible to wrap only those two components?</p>
  
  <p>I tried to do it but only first component gets context.</p>
  
  <p>The App structure looks like this:</p>
  
  <pre><code>&lt;App&gt;
      &lt;A1&gt;
          &lt;A2&gt;
              &lt;MyContext.Provider&gt;
                  &lt;Consumer1/&gt;
              &lt;/MyContext.Provider&gt;
          &lt;/A2&gt;
      &lt;/A1&gt;
      &lt;B1&gt;
          &lt;B2&gt;
              &lt;MyContext.Provider&gt;
                  &lt;Consumer2/&gt;
              &lt;/MyContext.Provider&gt;
          &lt;/B2&gt;
      &lt;/B1&gt;
  &lt;/App&gt;
  
  </code></pre>
  
  <p>EDIT: I was wrong thinking that wrapping root component will make re-render all child components on context change. Only consumers will rerender so it's perfectly fine to wrap root component.</p>