[MM-18156] Change around RHS search bar such that it's tabbable when RHS is open #4107
Conversation
devinbinnie
added
2: Dev Review
|
@hmhealey @asaadmahmood Just wanted to verify my approach makes sense before putting it up as a proper PR. |
asaadmahmood
added
the
Setup Cloud Test Server
There was a problem hiding this comment.
Looks good to me, one issue I see is (disconnect from this PR), when I focus search, type something, and press enter, it loses focus, I would prefer it kept its focus and when I typed something, it populated the search bar, right now, it jumps to the center channel.
stevemudie
added
QA Review Done
and removed
3: QA Review
| @@ -116,12 +114,17 @@ export default class ChannelHeader extends React.PureComponent { | |||
| if (header !== prevHeader) { | |||
| this.props.actions.getCustomEmojisInText(header); | |||
| } | |||
| if (this.props.rhsOpen !== prevProps.rhsOpen) { | |||
| this.handleResize(); | |||
There was a problem hiding this comment.
This should be done using getDerivedStateFromProps since it updates the state of the component. Either that or we can leave this.state.showSearchBar as it was before where it only depends on the size of the window and check this.state.showSearchBar || this.props.rhsOpen in the render method
devinbinnie
added
4: Reviews Complete
|
Mattermost test server updated with git commit Access here: https://mattermost-webapp-pr-4107.test.mattermost.cloud |
|
Test server destroyed |
amyblais
added
Changelog/Not Needed
hanzei
removed
the
Setup Cloud Test Server
Summary
When tabbing through the Channel Header when the RHS is open, if you tab past the Pinned Post button, the tab focus would go down to the center channel. This PR makes the RHS search bar container invisible and uses the one normally used by the channel header.
Ticket Link
https://mattermost.atlassian.net/browse/MM-18156