put this.props.search in the Highlighter

This commit is contained in:
Patrick O'Carroll 2018-01-09 13:18:16 +01:00
parent bebcc24f3d
commit 48548f0641

View File

@ -119,15 +119,13 @@ export class AlertRuleItem extends React.Component<AlertRuleItemProps, any> {
this.props.rule.togglePaused(); this.props.rule.togglePaused();
}; };
renderText(text: string, searchArray) { renderText(text: string) {
return <Highlighter highlightClassName="textHighlight" textToHighlight={text} searchWords={searchArray} />; return <Highlighter highlightClassName="textHighlight" textToHighlight={text} searchWords={[this.props.search]} />;
} }
render() { render() {
const { rule } = this.props; const { rule } = this.props;
const searchArray = [this.props.search];
let stateClass = classNames({ let stateClass = classNames({
fa: true, fa: true,
'fa-play': rule.isPaused, 'fa-play': rule.isPaused,
@ -144,16 +142,14 @@ export class AlertRuleItem extends React.Component<AlertRuleItemProps, any> {
</span> </span>
<div className="alert-rule-item__header"> <div className="alert-rule-item__header">
<div className="alert-rule-item__name"> <div className="alert-rule-item__name">
<a href={ruleUrl}>{this.renderText(rule.name, searchArray)}</a> <a href={ruleUrl}>{this.renderText(rule.name)}</a>
</div> </div>
<div className="alert-rule-item__text"> <div className="alert-rule-item__text">
<span className={`${rule.stateClass}`}>{this.renderText(rule.stateText, searchArray)}</span> <span className={`${rule.stateClass}`}>{this.renderText(rule.stateText)}</span>
<span className="alert-rule-item__time"> for {rule.stateAge}</span> <span className="alert-rule-item__time"> for {rule.stateAge}</span>
</div> </div>
</div> </div>
{rule.info && ( {rule.info && <div className="small muted alert-rule-item__info">{this.renderText(rule.info)}</div>}
<div className="small muted alert-rule-item__info">{this.renderText(rule.info, searchArray)}</div>
)}
</div> </div>
<div className="alert-rule-item__footer"> <div className="alert-rule-item__footer">
<a <a