Translate modal: autosize not working
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 659
- Forks
- 133
- Avg merge
- 1d 20h
- Merged PRs (30d)
- 110
Description
Describe the bug
The Translate modal does not autosize (unless the left text field is clicked). Only two lines of the text are shown by default.
Related: https://github.com/nextcloud/text/issues/3925
Steps To Reproduce:
- Write some longer text
- Click on ... -> Translate
Actual behaviour
a) Only 2 lines of text are shown.
b) There is not enough space to show the language dropdown in full.
Expected behavior
a) The modal should autosize to show all available text. Or, if that is too large for the screen, fill the entire screen height (modulo some padding outsize of the modal).
Note: the modal only auto-resizes once I click on the left text field (source text). Still, I don't like that UX. It's not clear, it's a surprise to the user, and it requires a click. It's also not consistent - clicking the right text field (target text) does nothing.
I want to see the original text without needing a click. More importantly, I want to see the translation without needing to click the source text field.
b) The modal should autosize to show all languages in the dropdown.
Screenshots
Server details:
- Nextcloud version: 28.0.0.11
- PHP Version: 8.1
- Database: MariaDB
Client details:
- OS: Ubuntu 23.10
- Browser: Firefox 120.0.1
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 by locating the Translate modal and reproduce the issue with longer source text, checking both text fields and the language dropdown. Done means the modal shows the available source and translated text and all languages without requiring a field click, using the available screen height when needed.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100