Global Providers should have hooks as static methods (Provider.useGlobal)

[ralphievolt]

Current is
setGlobal({ cards: [], disabled: false, initial: 'values', x: 1 });

Is it possible to group these global state like the following for better control and code management?

setGlobal-A({ cards: [], disabled: false, initial: 'values', x: 1 });

and

setGlobal-B({ posts: [], blogger: 5 });

[quisido]

I'm not sure I understand what the difference between A and B are. Can you elaborate?

Are you looking to manage multiple global states?

[ralphievolt]

yes.. and i want to group them according to their usage

[quisido]

This won't be added, but there is a planned feature for multiple store contexts.

For example,

<Provider1><Cards /></Provider1>
<Provider2><Cards /></Provider2>

In the above Cards component, this.global.cards will have two separate values, as the values will be tied to the parent Provider.

This may suit your use case. However, there are no plans to have a single instance of <Cards /> have access to both Provider1 and Provider2's respective global states. You may prefer this.global.one.cards and this.global.two.cards instead.

The hooks implementation may support something like const [ value, setValue ] = Provider1.useGlobal('cards') to let you determine which provider to use, but that's a huge may and low priority. Let me know if it is something you would be interested in.

[bhgsbatista]

Provider1.useGlobal('cards') seems like a hook friendly version of React context. It seems much more natural to me.