Profile Image Upload with Cloudinary

Value Proposition

As a registered family member,

I want to be able to upload and update my profile image using Cloudinary,

so that I can have a personalized and easily recognizable profile picture.

On the profile page of the registered user, there should be a form with "Upload" button and "Choose an image" icon, which opens a file selector to choose an image from user's device.
The selected image should be uploaded to Cloudinary for storage.
Upon successful upload, Cloudinary should return a URL for the uploaded image, which should be saved to the user's account in the backend.
The profile page should display the newly uploaded profile picture.
After successfully uploading the image, the user should receive a notification indicating that their profile picture has been updated.
If there is an error during upload, I should receive an appropriate error message.
User should be able to remove or change their profile image at any time by uploading a new image.
The image upload and preview features should be responsive, ensuring they work correctly on various devices and screen sizes.

[ ] create feature branch feature/profile-image-upload-cloudinary
[ ] set up the project, install cloduinary and formidable
[ ] create a form with input type="file", style it and write a handleSubmit function
[ ] write API route and send image file from iput to Cloudinary
[ ] make the image and the form responsive