Retaining Messages in the State
Explore how to retain and update messages in Redux state using user IDs and unique message numbers. Understand non-mutating state updates to preserve chat history during message submissions. This lesson helps you maintain conversation continuity in React applications with Redux.
We'll cover the following...
As we observed in the previous lesson, sending a message returned only an empty string and hence, erased all the contents of the conversation:
How do we fix this?
Remember that every user has their messages mapped to their ID. All we need to do is target this ID and ONLY update the messages in there. Here’s what that looks like graphically:
Please take a look at the console in the graphic above. The graphic assumes that a user has submitted the form input 3 times with the text, Hi.
As expected the text, Hi shows up three different times in the chat conversations for the particular contact.
Now, have a look at the console. It’ll give you an idea of what we’re aiming for in the code solution to come.
In this application, every user has 10 messages. Each of the messages has a number that ranges from 0 to 9
Thus, whenever a user submits a ...