Editing User Information
Follow step-by-step instructions to implement the UI for editing the user information.
We'll cover the following
Now that we have the profile page ready, we can create the page that will contain the form to edit user information.
The “Edit” button on the “Profile” page should redirect the user to a page with a form to update its information. In this lesson, we'll modify the useUserActions
Hook by adding a new method to edit user information via the API. Then, we will create the form to edit user information. Lastly, we will integrate the editing form component on the EditUser
page.
Let’s start by adding a new method to the useUserActions
Hook.
Adding the edit
method to useUserActions
In the src/hooks/user.actions.js
file, we'll add another method to the useUserActions
Hook. This function will handle the patch request to the API. Because we are saving a user object in localStorage
, we will update the value of the object if the request succeeds:
Get hands-on with 1200+ tech skills courses.