Refactor EditProfileForm component and useUserProfile hook

[mayura-andrew]

Purpose

The purpose of this PR is to fix #184

Goals

• Enable the submit button only when the user has made changes to the profile information or uploaded a new profile photo.
• Successfully allow users to update their details, including first name, last name, and profile photo.

Approach

• The useUserProfile hook manages the state for the user's profile information and profile picture.
• It initializes the profile state with the user's current information and updates the state when the user changes any input field or uploads a new profile photo.
• The handleProfilePicChange function updates the profile picture state and creates a URL for the uploaded image.

Screenshots

Checklist

• This PR doesn't commit any keys, passwords, tokens, usernames, or other secrets.
• I have read and understood the development best practices guidelines ( http://bit.ly/sef-best-practices )
• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation

Related PRs

Test environment

NodeJS - v20.15.0
FireFox - v129

Learning

React Custom Hooks

[anjula-sack]

Good job! @mayura-andrew