Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[IMPROVE] Added auto-focus for better user-experience. #19954

Merged
merged 9 commits into from
Feb 18, 2021

Conversation

Darshilp326
Copy link
Contributor

Proposed changes (including videos or screenshots)

Issue(s)

Closes #19378
While sending file message there is no focus on upload file modal.
While opening contexual-bar options like threads,discussions,members no focus in search bars.

Steps to test or reproduce

Untitled_.Dec.23.2020.10_57.PM.mp4
Untitled_.Dec.23.2020.11_01.PM.mp4

Further comments

@Darshilp326
Copy link
Contributor Author

Can anyone help me to solve failed check?

@Darshilp326
Copy link
Contributor Author

Please review! :)

app/ui-utils/client/lib/modal.js Show resolved Hide resolved
client/components/FilterByText.tsx Outdated Show resolved Hide resolved
client/views/room/contextualBar/Discussions/index.js Outdated Show resolved Hide resolved
client/views/room/contextualBar/Threads/index.js Outdated Show resolved Hide resolved
app/ui/client/lib/fileUpload.js Show resolved Hide resolved
@RonLek
Copy link
Contributor

RonLek commented Dec 24, 2020

@Darshilp326 left few comments :)

@Darshilp326
Copy link
Contributor Author

@MartinSchoeler Please review :)

Copy link
Contributor

@MartinSchoeler MartinSchoeler left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @Darshilp326 unfortunately this pull request is still not ideal, firstly because this will hardcode the autofocus on components that are used in other parts of Rocket.Chat, and this can lead to unwanted behaviors. Second, the native autofocus prop has it's limitations, so my suggestion would be to use our useAutoFocus hook for that.

I've created a pull request fixing only the directory screen, it should serve as a good example/base for the other elements that you are trying to add autofocus.

Here is the Pull Request #20509

Feel free to contact me if you have any questions about my implementation.

Looking forward to see the new changes. Thanks!

@Darshilp326
Copy link
Contributor Author

@MartinSchoeler Okay got your point! I will be making new changes to this pr:)

Copy link
Contributor

@MartinSchoeler MartinSchoeler left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me now!

@ggazzo ggazzo merged commit 1e440a3 into RocketChat:develop Feb 18, 2021
@sampaiodiego sampaiodiego mentioned this pull request Feb 28, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Improve] Focus should be in search fields or in input text box of modal windows
4 participants