👽 Répare la recherche de règles

source/components/SearchButton.js

@@ -1,9 +1,15 @@
 import React, { Component } from 'react'
+import { connect } from 'react-redux'
 import './SearchButton.css'
 import Overlay from './Overlay'
 import { SearchBar } from './pages/RulesList'
 import withColours from 'Components/withColours'
 
+@connect(
+	state => ({
+		flatRules: state.flatRules
+	})
+)
 @withColours
 export default class SearchButton extends Component {
 	componentDidMount() {
@@ -27,12 +33,13 @@ export default class SearchButton extends Component {
 	}
 	close = () => this.setState({ visible: false })
 	render() {
+		let { flatRules } = this.props
 		return (
 			<div id="searchButton">
 				{this.state.visible ? (
 					<Overlay onOuterClick={this.close}>
 						<h2>Chercher une règle</h2>
-						<SearchBar showDefaultList={false} finally={this.close} />
+						<SearchBar showDefaultList={false} finally={this.close} rules={flatRules} />
 					</Overlay>
 				) : (
 					<button onClick={() => this.setState({ visible: true })}>

source/components/pages/RulesList.js

@@ -34,6 +34,7 @@ export class SearchBar extends React.Component {
 		this.inputElement.focus()
 	}
 	componentWillMount() {
+		let { rules } = this.props
 		var options = {
 			keys: [
 				{
@@ -82,6 +83,7 @@ export class SearchBar extends React.Component {
 	)
 	filterOptions = (options, filter) => this.fuse.search(filter)
 	render() {
+		let { rules } = this.props
 		let { selectedOption } = this.state
 
 		if (selectedOption != null) {
@@ -113,7 +115,7 @@ export class SearchBar extends React.Component {
 							{rules.map(rule => (
 								<li key={rule.dottedName}>
 									<Link to={'/règle/' + encodeRuleName(rule.name)}>
-										{capitalise0(rule.name)}
+										{rule.title || capitalise0(rule.name)}
 									</Link>
 								</li>
 							))}