IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Use react's onKeyDown event on the input instead of event listener on document

Browse Source
This commit is contained in:
Johannes Schill 2018-12-10 21:38:07 +01:00
parent cdcc316310
commit 1ffac5a33d
1 changed files with 2 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
public/app/features/dashboard/dashgrid/VizTypePicker.tsx
View File

@ -47,7 +47,7 @@ export class VizTypePicker extends PureComponent<Props, State> {
}); });
}; };
onKeydown = (evt: KeyboardEvent) => { onKeyDown = evt => {
if (evt.key === 'ArrowDown') { if (evt.key === 'ArrowDown') {
evt.preventDefault(); evt.preventDefault();
this.goRight(); this.goRight();
@ -66,12 +66,6 @@ export class VizTypePicker extends PureComponent<Props, State> {
setTimeout(() => { setTimeout(() => {
this.searchInput.focus(); this.searchInput.focus();
}, 300); }, 300);
document.addEventListener('keydown', this.onKeydown);
}
componentWillUnmount() {
document.removeEventListener('keydown', this.onKeydown);
} }
getPanelPlugins(filter): PanelPlugin[] { getPanelPlugins(filter): PanelPlugin[] {
@ -138,6 +132,7 @@ export class VizTypePicker extends PureComponent<Props, State> {
placeholder="" placeholder=""
ref={elem => (this.searchInput = elem)} ref={elem => (this.searchInput = elem)}
onChange={this.onSearchQueryChange} onChange={this.onSearchQueryChange}
onKeyDown={this.onKeyDown}
/> />
<i className="gf-form-input-icon fa fa-search" /> <i className="gf-form-input-icon fa fa-search" />
</label> </label>