Adding Asynchronous Events to Contexts

Let's write code to add asynchronous events to the contexts in this lesson.

Adding ActionCable back

We can now add the ActionCable subscription back to the system, but we have a logistical problem to deal with first.

That is, the ActionCable subscription needs to be global and must have external access to the existing VenueContext reducer. It needs to be global because multiple components may need access to the subscription data. But it also must be external from the VenueContext because the subscription uses the concert_id, which is now data in the state. It also must use the dispatch function, because the subscription receives data about what tickets have been held from the ActionCable channel, and it will need to use dispatch to update the global state based on that data. This means that the subscription needs to understand the reducer when it’s defined, so it must be external to the reducer.

Creating a new context

We can manage this problem in a few different ways. One of those solutions is to create a new context to make the subscription a separate part of global data, declared like this:

Get hands-on with 1400+ tech skills courses.