RocketChat / EmbeddedChat

An easy to use full-stack component (ReactJS) embedding Rocket.Chat into your webapp
https://www.npmjs.com/package/@embeddedchat/react
107 stars 214 forks source link

[BUG]: Fix chat input bugs and refactor it. Fix command list and member list. #588

Closed Spiral-Memory closed 3 weeks ago

Spiral-Memory commented 3 weeks ago

Description:

Fixing many chat input issues and refactoring the component.

Expected behavior:

Many things don't work properly, especially the command list. The code is hard to understand because it's not modular.

Actual behavior:

Things should work as expected.

https://github.com/RocketChat/EmbeddedChat/assets/78961432/9d7085f8-6bba-44ef-96b3-8fc61ecdca92

Issues mentioned in video:

  1. Mention List Behavior:

    • In the mention list, we can navigate down, but once we reach its height limit, it doesn't automatically scroll.
  2. Command List Accessibility:

    • The command list lacks keyboard control options entirely.
  3. Text Input Issues:

    • When text exceeds the input container's width, it doesn't break and go to the next line.
    • There's no scrolling option available for long messages; navigation must be done solely via keyboard.
  4. Code Readability in ChatInput Component:

    • The ChatInput component code is difficult to read due to multiple if and else statements without proper separation.