Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Improve ease of focusing on Room list Search #7255

Merged
merged 1 commit into from
Dec 2, 2021
Merged

Improve ease of focusing on Room list Search #7255

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion res/css/structures/_LeftPanel.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,6 @@ $roomListCollapsedWidth: 68px;
background-color: $panel-actions;
padding: 2px 4px;
user-select: none;
pointer-events: none;
font-size: $font-12px;
line-height: $font-15px;
font-weight: $font-semi-bold;
Expand Down
10 changes: 5 additions & 5 deletions src/components/structures/RoomSearch.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ interface IState {

@replaceableComponent("structures.RoomSearch")
export default class RoomSearch extends React.PureComponent<IProps, IState> {
private dispatcherRef: string;
private readonly dispatcherRef: string;
private inputRef: React.RefObject<HTMLInputElement> = createRef();
private searchFilter: NameFilterCondition = new NameFilterCondition();

Expand Down Expand Up @@ -136,9 +136,9 @@ export default class RoomSearch extends React.PureComponent<IProps, IState> {
}
};

public focus(): void {
public focus = (): void => {
this.inputRef.current?.focus();
}
};

public render(): React.ReactNode {
const classes = classNames({
Expand All @@ -154,7 +154,7 @@ export default class RoomSearch extends React.PureComponent<IProps, IState> {
});

let icon = (
<div className='mx_RoomSearch_icon' />
<div className="mx_RoomSearch_icon" onClick={this.focus} />
);
let input = (
<input
Expand All @@ -178,7 +178,7 @@ export default class RoomSearch extends React.PureComponent<IProps, IState> {
onClick={this.clearInput}
/>
);
let shortcutPrompt = <div className="mx_RoomSearch_shortcutPrompt">
let shortcutPrompt = <div className="mx_RoomSearch_shortcutPrompt" onClick={this.focus}>
{ isMac ? "⌘ K" : "Ctrl K" }
</div>;

Expand Down