[perf-improv] Create separate provider for the context and pass its descendants as a "children"

[SanjalKatiyar]

Currently used:
https://github.com/red-hat-storage/odf-console/blob/master/packages/odf/components/topology/Topology.tsx#L575
https://github.com/red-hat-storage/odf-console/blob/master/packages/mco/components/mco-dashboard/disaster-recovery/dr-dashboard.tsx#L128

Refer: https://reactjs.org/docs/context.html#contextprovider
All consumers that are descendants of a Provider will re-render whenever the Provider’s value prop changes.
Whenever Provider’s value prop changes all the child FCs will get re-rendered (irrespective of whether a child is a consumer of the context or not). This will cause unnecessary re-renders for those FCs which are not consuming any state from the context.
To avoid that use composition: create a separate FC which will provide the context and pass the consumer FCs as its "children".
example: https://github.com/openshift/console/blob/master/frontend/public/components/app.jsx#L241

[SanjalKatiyar]

cc @bipuladh @GowthamShanmugam (just FYI)

[black-dragon74]

@SanjalKatiyar can I take this one?

[SanjalKatiyar]

@SanjalKatiyar can I take this one?

/assign @debjyoti-pandit
Hi,
this is already assigned (forgot to update the issue) and WIP.