Using context

Use context to pass data to child components without explicitly passing it through components (known as prop drilling). Context is useful to share data that is needed in components throughout the application, such as styling information, application state, or the currently logged-in user.

The code to use a context is divided into three parts:

• createContextId(): this creates a serializable ID for the context. Make sure that this ID is unique within your application.
• useContextProvider(): In a parent component, call this method to publish the context value. All children (and grandchildren) that are descendants of this component will be able to retrieve the context.
• useContext() to retrieve the context and use it in any component.

In this example, we would like to pass the TodosStore to the <Items> component. Update the code to use useContext() to retrieve the value.

Contexts typically are stores, and as such, they must be serializable.