Merge pull request #12189 from ryantxu/focus-panel-search

autoFocus the add-panel search filter, and add on enter
This commit is contained in:
Patrick O'Carroll
2018-06-14 09:54:41 +02:00
committed by GitHub

View File

@@ -154,6 +154,15 @@ export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelP
}); });
} }
filterKeyPress(evt) {
if (evt.key === 'Enter') {
let panel = _.head(this.state.panelPlugins);
if (panel) {
this.onAddPanel(panel);
}
}
}
filterPanels(panels, filter) { filterPanels(panels, filter) {
let regex = new RegExp(filter, 'i'); let regex = new RegExp(filter, 'i');
return panels.filter(panel => { return panels.filter(panel => {
@@ -229,10 +238,12 @@ export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelP
<label className="gf-form gf-form--grow gf-form--has-input-icon"> <label className="gf-form gf-form--grow gf-form--has-input-icon">
<input <input
type="text" type="text"
className="gf-form-input max-width-20" autoFocus
className="gf-form-input gf-form--grow"
placeholder="Panel Search Filter" placeholder="Panel Search Filter"
value={this.state.filter} value={this.state.filter}
onChange={this.filterChange.bind(this)} onChange={this.filterChange.bind(this)}
onKeyPress={this.filterKeyPress.bind(this)}
/> />
<i className="gf-form-input-icon fa fa-search" /> <i className="gf-form-input-icon fa fa-search" />
</label> </label>