Refactor sidebar components

[JeffreytheCoder]

Brief Title

Acceptance Criteria fulfillment

• All current menus share a general component and CSS module
• The menus behave the same as before
• The refactored menu framework have flexibility for all types of menus

Fixes #504

Video/Screenshots

All menus look the same as before

[JeffreytheCoder]

Anyone knows why the lint check workflow fails with the following error?

>  Lerna (powered by Nx)   Running target format:check for 6 projects failed

   Tasks not run because their dependencies failed or --nx-bail=true:
   
   - e2e-react:format:check
   - @embeddedchat/htmlembed:format:check
   
   Failed tasks:
   
   - @embeddedchat/react:format:check

[Spiral-Memory]

Anyone knows why the lint check workflow fails with the following error?

>  Lerna (powered by Nx)   Running target format:check for 6 projects failed

   Tasks not run because their dependencies failed or --nx-bail=true:
   
   - e2e-react:format:check
   - @embeddedchat/htmlembed:format:check
   
   Failed tasks:
   
   - @embeddedchat/react:format:check

Format with prettier.

Run it in this file : src/components/Sidebar/Sidebar.module.css

[Spiral-Memory]

@JeffreytheCoder , This is an awesome change, great work bro!. It was difficult to achieve as well. Well, I suggest attaching a video showcasing everything working smoothly (all sidebar components) without any rendering issue or console errors for every functionality in those sidebars. I can see that you have only extracted the very common elements and passed the other part as a children prop. While it's not extremely modular, which is good as it reduces the chances of introducing bugs, as discussed earlier there is still potential for issues and since we have a plan to release it as next major version soon. Therefore, please ensure from your side as well, and including a video with no console errors will be helpful.

[JeffreytheCoder]

@Spiral-Memory Thanks bro! It's hard to modularize sidebar content because they vary a lot, but having a modularized sidebar wrapper solves some inconsistent stylings, and it's better to maintain and add upcoming features like resizing along with the chat window.

Here's the recording below that shows all sidebars work as before, with no console warning or error:

I'll create another PR to put pinned & starred messages into the general sidebar after #501 is reviewed.

[Spiral-Memory]

Yep, I told you, it has so much variation and is hard to modularize, hehe! Anyway, great work!

Yes, and until then, the file menu feature will also be added. Refactor both together.

Is the thread scrollbar working fine? Create many threads and check.

[JeffreytheCoder]

Yes it works :)

[Spiral-Memory]

Awesome 🥳🥳

[JeffreytheCoder]

@sidmohanty11 Ready for review

[sidmohanty11]

@JeffreytheCoder awesome! Had one question, how does it look in minimised mode?

[JeffreytheCoder]

@sidmohanty11 Same as before, the sidebar expand to full screen:

[sidmohanty11]

Thanks @JeffreytheCoder !!