I’m developing a React application where I have a list of elements fetched from a database. Each element has a title (input field) and content (textarea), which are initially disabled.

I’ve implemented functionality so that users can click an “Edit” button for any element to enable these fields and make changes directly on the page, without any popups or redirects.

After editing, users should be able to save or cancel their changes. Currently, the application allows for creating, editing, and deleting elements seamlessly.

I’d like to confirm if this approach is considered good practice in terms of user experience and React development. Are there any potential drawbacks or alternative methods I should consider?

Any advice, best practices, or examples would be greatly appreciated!

Thank you.