ways of using React context

From what I observed React context is used in many ways:

• As simple value (e.g. string, number, boolean)
• As object
  • As immutable object (i.e. if you want to change something in context you trigger appropriate update to component which render Context.Provider
  • As mutable object (i.e. if you want to change something in context, you mutate context directly.

I usually work this way that have main app context which is mutable and contains some "global" variables and some methods for making global changes. I think mutable React context is harder to maintain. And context always sounded like some escape hatch for access/write to global state.

And I usually won't have too many contexts. In small app there would be one React context. In bigger apps I could think about some others, for some specific parts of app or maybe for some specific aspect of app (e.g. UserContext, ToDoContext etc.)

And context for me means usually object. In React docs I see that example is that they keep theme name ("dark") in context, but I think it's too little information. Usually theme info contains some other data anyway (like colors). And not sure if people do this way similar to what is in React docs, or maybe it's just simplistic example?