Search⌘ K
AI Features

Adding Asynchronous Events to Contexts

Explore how to add asynchronous Action Cable subscriptions to React contexts by creating nested contexts and managing dispatch functions. Understand handling asynchronous state changes separately from reducers to maintain order and reliability. This lesson helps you integrate real-time events into global state effectively.

Adding Action Cable back

Now we can add the Action Cable subscription back to the system. There are two problems to solve, one of which is kind of logistical and the other of which is more philosophical.

The logistical problem is that if you look at what data our subscription used in the past version and look at what data is now in our VenueContext, we have a problem. The subscription uses the concert_id, which is data in the state.

However, it will also use the dispatch function because the subscription receives data about what tickets have been held from the Action Cable channel and uses dispatch to update global state based on that data. We use that data to redraw the screen, which means the subscription needs to know how to update the context state, which ...