Comment section ✨PLUS✨

I changed expected behaviour to make the challenge more interesting:

• You can reply to any comment at any depth (so it's a comment tree like on facebook)
• You can change the current user (via the button in the top-right)
• No sorting of first-level comments (it's easily done but boring and kinda useless here)

Also:

• Ctrl+Enter in the textarea submits the form
• You cannot add empty comments
• You cannot vote on your own comments
• A user can vote only +1 or -1 (no multiple votes)
• You can cancel your vote by voting the opposite
• Your vote is shown
• Cancel button is shown when updating the comment

Very interesting project, took a lot of time though. At first I implemented the majority of functionality using props-drilling 😈. Then moved the state to a context 🤷‍♂️. Then rewrote everything with redux 💪

• Used redux-thunk's synchronous action-function to move comment creation non-pure logic(time and random id) out of components
• Used timeago.js to format the time
• react-remove-scroll-bar and TrapFocus from @mui/base for the delete modal
• Drawer from @mui/material for the users drawer
• React.memo with redux docs best practices to minimize rerenders

❔ Questions:

• Are there best practices for writing synchronous thunk actions? Redux docs don't tell where to put them. I'm pretty sure slices are the place for them(since normal action-creators are exported from the slices and components don't need to know what kind of action they import), but I'd love to confirm and see them in action(pun intended) in the real projects.
• Did I do well with minimizing rerenders? I think I did, but would love to get feedback on this.
• The Comment component looks pretty intimidating. I thought about moving some stuff from it to separate components, but to me nothing makes sense to extract. What do you think? Also there are so many handler functions, maybe I should've implemented it differently?

Feedback is appreciated!