Exercise: Delete Contact

You must implement the “Delete Contact” feature which allows us to remove a contact’s message thread from our contact list.

In the Skypey prototype below, you can see the ‘X’ in the top right corner of each contact. The objective is to add functionality to this close button.

As we’ve learned, there are always three steps in the world of Redux:

• create an action
• make a reducer to handle it
• dispatch the action

I advise you to first define the action type in the action-types.js.

I have already defined the action creator needed for this task in User.js. Write the implementation on your own. Make sure that your implementation only requires the user ID to make the deletion work.

One tricky thing about this exercise is that you must update the state object with new list of contacts which excludes the contact you want to delete.

You must not mutate the state object within the reducer. Instead, return a new copy.

As this is not a test on syntax, you can see Immutable Update Patterns for updating and deleting objects.

Along with dispatching the delete action, you must also set the activeUserId to null so that your main screen is rendered when you delete a contact.

Take your time and don’t worry if you don’t get it right the first time around. If you’re stuck, my solution is available in the next lesson.

Good luck!