mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
moved state handling for search to store
This commit is contained in:
parent
025835c9bf
commit
bebcc24f3d
@ -46,15 +46,13 @@ export class AlertRuleList extends React.Component<IContainerProps, any> {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
onSearchFilter(event) {
|
onSearchFilter = evt => {
|
||||||
this.setState({ search: event.target.value });
|
this.props.alertList.setSearchState(evt.target.value);
|
||||||
}
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { nav, alertList } = this.props;
|
const { nav, alertList } = this.props;
|
||||||
|
|
||||||
let regex = new RegExp(this.state.search, 'i');
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<PageHeader model={nav as any} />
|
<PageHeader model={nav as any} />
|
||||||
@ -66,8 +64,8 @@ export class AlertRuleList extends React.Component<IContainerProps, any> {
|
|||||||
type="text"
|
type="text"
|
||||||
className="gf-form-input width-13"
|
className="gf-form-input width-13"
|
||||||
placeholder="Search alert"
|
placeholder="Search alert"
|
||||||
value={this.state.search}
|
value={alertList.search}
|
||||||
onChange={this.onSearchFilter.bind(this)}
|
onChange={this.onSearchFilter}
|
||||||
/>
|
/>
|
||||||
<i className="gf-form-input-icon fa fa-search" />
|
<i className="gf-form-input-icon fa fa-search" />
|
||||||
</label>
|
</label>
|
||||||
@ -92,8 +90,8 @@ export class AlertRuleList extends React.Component<IContainerProps, any> {
|
|||||||
<section>
|
<section>
|
||||||
<ol className="alert-rule-list">
|
<ol className="alert-rule-list">
|
||||||
{alertList
|
{alertList
|
||||||
.searchFilter(regex)
|
.searchFilter()
|
||||||
.map(rule => <AlertRuleItem rule={rule} key={rule.id} search={this.state.search} />)}
|
.map(rule => <AlertRuleItem rule={rule} key={rule.id} search={alertList.search} />)}
|
||||||
</ol>
|
</ol>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
@ -9,9 +9,11 @@ export const AlertListStore = types
|
|||||||
.model('AlertListStore', {
|
.model('AlertListStore', {
|
||||||
rules: types.array(AlertRule),
|
rules: types.array(AlertRule),
|
||||||
stateFilter: types.optional(types.string, 'all'),
|
stateFilter: types.optional(types.string, 'all'),
|
||||||
|
search: types.optional(types.string, ''),
|
||||||
})
|
})
|
||||||
.views(self => ({
|
.views(self => ({
|
||||||
searchFilter(regex) {
|
searchFilter() {
|
||||||
|
let regex = new RegExp(self.search, 'i');
|
||||||
return self.rules.filter(alert => {
|
return self.rules.filter(alert => {
|
||||||
return regex.test(alert.name) || regex.test(alert.stateText) || regex.test(alert.info);
|
return regex.test(alert.name) || regex.test(alert.stateText) || regex.test(alert.info);
|
||||||
});
|
});
|
||||||
@ -38,4 +40,7 @@ export const AlertListStore = types
|
|||||||
self.rules.push(AlertRule.create(rule));
|
self.rules.push(AlertRule.create(rule));
|
||||||
}
|
}
|
||||||
}),
|
}),
|
||||||
|
setSearchState(evt) {
|
||||||
|
self.search = evt;
|
||||||
|
},
|
||||||
}));
|
}));
|
||||||
|
Loading…
Reference in New Issue
Block a user