RocketChat / RocketChat/Rocket.Chat
[Bug] Select dropdown options are not RTL-aligned in Account Preferences
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 46.1k
- Forks
- 13.9k
- Avg merge
- 3d 3h
- Merged PRs (30d)
- 130
Description
Description:
In Account > Preferences, when the UI is in an RTL language (for example Arabic), the Language select dropdown options are not fully aligned by direction.
The selected value in the closed input looks correct, but the opened options list has direction/alignment inconsistencies.
Video demo of the issue:
https://github.com/user-attachments/assets/012ac91e-7e81-4cb7-b010-b710b37b15a2
Steps to reproduce:
- Open
http://localhost:3000/account/preferences. - Change language to Arabic and save.
- Open the Language select dropdown.
- Observe option text alignment and horizontal spacing in the options list.
Expected behavior:
- Option text in the dropdown should follow RTL direction (logical
start). - Option inline spacing should be direction-aware and consistent in RTL.
Actual behavior:
- Option list alignment/spacing appears LTR-oriented in RTL context.
Server Setup Information:
- Version of Rocket.Chat Server:
8.1.0-develop(local source) - License Type:
- Number of Users:
- Operating System: Ubuntu
- Deployment Method: Local development
- Number of Running Instances:
- DB Replicaset Oplog:
- NodeJS Version:
- MongoDB Version:
Client Setup Information
- Desktop App or Browser Version: All browsrs
- Operating System: Ubuntu
Additional context
This appears in shared select/options UI classes, so it may affect other dropdowns in RTL pages as well.
Relevant logs:
N/A (UI/CSS issue).
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the /account/preferences route and inspect the shared select/options UI classes mentioned in the report. Reproduce the issue with Arabic enabled and compare the closed Language select with its opened options list. Done means option text uses RTL logical alignment and inline spacing remains direction-aware, without regressing other dropdowns.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- frontend, internationalization
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100