React: Add support for multiple Context values

[realityforge]

This is a request to support consuming multiple contexts from within a class component without creating artificial wrapper components. Looking at the new hooks proposal it seems that the underlying infrastructure is capable of propagating changes from multiple contexts to a single component but this does not seem to be exposing outside of hooks. I would love to see it available in class components using an approach not unlike the old context API where you declare a static contextTypes field on the function which would expose multiple values to the component..

To differentiate from the old api the value in the contextTypes object MUST be the context object.

// Theme context, default to light theme
const ThemeContext = React.createContext('light');

// Signed-in user context
const UserContext = React.createContext({name: 'Guest'});

Button.contextTypes = {
  theme: ThemeContext,
  user: UserContext
};

This should be able to be distinguished from the old context API where the props are typically PropTypes.* references. i.e

Button.contextTypes = {
  color: PropTypes.string
};

[FredyC]

Honestly, why would you shoot yourself in the leg with classes when you can use hooks ? :) Yea sure it's still alpha and not released officially, but I believe this is one of the reasons the team came up with hooks so you don't need to do such craziness with classes.

[gaearon]

We opted not to support this because of extra object allocations this would incur and extra static typing difficulties.

[aikar]

@gaearon that reason makes no sense. you would only have the additional object allocations if the component needed multiple contexts.

This is a major barrier to migrating off legacy API, and supporting this would simplify migration greatly.

I believe the implementation of this would be pretty minor overall, will you take it if it's PR'd?

@FredyC your comment was off topic

[fega]

@FredyC the problem that I'm facing with hooks currently is the lack of Hot reloading support.

[FredyC]

@fega Frankly, I never used hot reloading and never seen value in it to be worth the trouble.

[fega]

@FredyC Having to login in the app every time that you changes a file is very bad for development speed

[FredyC]

@fega Well, this is a bad place to discuss that for sure, but I am certain that it's possible to overcome such obstacle by persisting login state somewhere (at least in development). Your choice really. Personally, I wouldn't use class components because of such a small issue.

Besides, you _should_ write tests which are effectively faster than any manual testing or hot reloading.