RocketChat / EmbeddedChat

An easy to use full-stack component (ReactJS) embedding Rocket.Chat into your webapp
https://rocketchat.github.io/EmbeddedChat/docs
125 stars 251 forks source link

Login/auth issue occurs when 2FA is enabled, and there are no error messages. #400

Closed Spiral-Memory closed 9 months ago

Spiral-Memory commented 10 months ago

Description:

The embedded chat application encounters difficulties when 2FA is activated, preventing users from logging in and disrupting the authentication process. Additionally, it is necessary to ensure the display of accurate error messages for all types of login errors.

Steps to reproduce:

  1. Set up the embedded chat application as per the provided documentation and access the embedded chat Storybook.
  2. Enable Two-Factor Verification in the admin workspace through the Rocket Chat application.
  3. Launch the embedded chat application and try to log in.

Expected behavior:

When 2FA is activated, a modal should appear for OTP entry. The system will then validate the OTP; if incorrect, a corresponding message should be displayed, and if correct, the user should be logged in seamlessly. Upon receiving a "totp-required" tag from the Rocket Chat backend, it is crucial to ensure proper propagation of this error to the frontend through the auth and embedded chat API.

Actual behavior:

In this case, No message is presented to the user, and the modal fails to open, preventing the user from logging in. In the console, an incorrect error is printed, indicating that the API returned an "Unauthorized" tag, which does not accurately reflect the actual error provided by the Rocket Chat backend API.

https://github.com/RocketChat/EmbeddedChat/assets/78961432/d6cdd12f-db21-4f68-9f32-5eb1a56e0629

Spiral-Memory commented 10 months ago

@abhinavkrin ,I've resolved this bug and created a pull request. Kindly review it to confirm if the approach is accurate and can be merged.