Interactive comment section with React and useState

I recommend you use object destructuring in ALL of your components, you have a lot of duplicate variable names and collisions. I was very hard for me to understand what was going on. Pretty easy fix though. Check my pull request on Github for details on how to do that. Good job so far, you seem to grasp Javascript pretty well. You just need to learn the best practices for React.

You no not need to fix your handling of deleteReply. For this small project what you did is fine. If the goal was to create a massive scalable database like Facebook has you would normalize the data, which means you would make all your data 1 level deep. So you would have a collection called "comments", that is an array of comment objects with the id, content, author, and the unique IDs of all the replies, but not their content. You would have another collection called 'replies' that is an array of reply objects with author, content, and the unique ID of the comment that you are replying to. You would have a collection called "users" that only an array of user objects with a username, photo, date joined etc. The reason you have everything spread out is because it would not be possible for 1 user to download every post and user's data on the entire database of Facebook on load. You have to put everything in small separated collections so you can only grab what you need. So when you want to fetch your replies you look at the replies IDs array in your comment and fetch only the replies from the replies collection that have the ID contained in your comment.