moved state handling for search to store

This commit is contained in:
Patrick O'Carroll 2018-01-09 13:05:50 +01:00
parent 025835c9bf
commit bebcc24f3d
2 changed files with 13 additions and 10 deletions

View File

@ -46,15 +46,13 @@ export class AlertRuleList extends React.Component<IContainerProps, any> {
});
};
onSearchFilter(event) {
this.setState({ search: event.target.value });
}
onSearchFilter = evt => {
this.props.alertList.setSearchState(evt.target.value);
};
render() {
const { nav, alertList } = this.props;
let regex = new RegExp(this.state.search, 'i');
return (
<div>
<PageHeader model={nav as any} />
@ -66,8 +64,8 @@ export class AlertRuleList extends React.Component<IContainerProps, any> {
type="text"
className="gf-form-input width-13"
placeholder="Search alert"
value={this.state.search}
onChange={this.onSearchFilter.bind(this)}
value={alertList.search}
onChange={this.onSearchFilter}
/>
<i className="gf-form-input-icon fa fa-search" />
</label>
@ -92,8 +90,8 @@ export class AlertRuleList extends React.Component<IContainerProps, any> {
<section>
<ol className="alert-rule-list">
{alertList
.searchFilter(regex)
.map(rule => <AlertRuleItem rule={rule} key={rule.id} search={this.state.search} />)}
.searchFilter()
.map(rule => <AlertRuleItem rule={rule} key={rule.id} search={alertList.search} />)}
</ol>
</section>
</div>

View File

@ -9,9 +9,11 @@ export const AlertListStore = types
.model('AlertListStore', {
rules: types.array(AlertRule),
stateFilter: types.optional(types.string, 'all'),
search: types.optional(types.string, ''),
})
.views(self => ({
searchFilter(regex) {
searchFilter() {
let regex = new RegExp(self.search, 'i');
return self.rules.filter(alert => {
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));
}
}),
setSearchState(evt) {
self.search = evt;
},
}));