SEO : Ajout d'un titre et description html sur les pages /simu et /règle

index.html

@@ -5,9 +5,8 @@
 		<meta name="viewport" content="initial-scale=1">
 		<meta http-equiv="X-UA-Compatible" content="IE=edge">
 		<meta name="google-site-verification" content="C03WwnrJP0FLqf83ibMBA7_N-TLQcwsJaAhqKXppxaE" />
-
-		<meta name="description" content="Estimer le prix d'une embauche en France">
 		<title>Simulateur d'embauche</title>
+		<meta name="description" content="Estimer le prix d'une embauche en France" data-react-helmet="true"> <!-- data-helmet pour que React Helmet puisse écraser ce meta par défaut -->
 		<link href='https://fonts.googleapis.com/css?family=Open+Sans:200,300,400,500,600,700' rel='stylesheet' type='text/css'>
 	</head>
 

package.json

@@ -22,6 +22,7 @@
     "ramda": "^0.23.0",
     "react": "^15.5.4",
     "react-dom": "^15.5.4",
+    "react-helmet": "^5.1.3",
     "react-redux": "^5.0.5",
     "react-router-dom": "^4.1.1",
     "reduce-reducers": "^0.1.2",

source/components/Simulateur.js

@@ -12,6 +12,7 @@ import 'Components/Simulateur.css'
 import classNames from 'classnames'
 import {capitalise0} from '../utils'
 import Satisfaction from 'Components/Satisfaction'
+import Helmet from 'react-helmet'
 
 let situationSelector = formValueSelector('conversation')
 
@@ -60,12 +61,18 @@ export default class extends React.Component {
 			reinitalise = () => {
 				this.props.resetForm(this.name)
 				this.props.startConversation(this.name)
-			}
+			},
+			title = sim('titre') || capitalise0(this.rule['titre'] || this.rule['nom'])
 
 
 		return (
 			<div id="sim" className={classNames({started})}>
-				<h1>{sim('titre') || capitalise0(this.rule['titre'] || this.rule['nom'])}</h1>
+				<Helmet>
+					<title>{title}</title>
+					{sim('sous-titre') &&
+						<meta name="description" content={sim('sous-titre')} />}
+				</Helmet>
+				<h1>{title}</h1>
 				{sim('sous-titre') &&
 					<div id="simSubtitle">{sim('sous-titre')}</div>
 				}

source/components/rule/Rule.js

@@ -13,6 +13,8 @@ import {capitalise0} from '../../utils'
 import References from './References'
 import Algorithm from './Algorithm'
 import Examples from './Examples'
+import Helmet from 'react-helmet'
+
 
 // situationGate function useful for testing :
 let testingSituationGate = v => // eslint-disable-line no-unused-vars
@@ -66,6 +68,10 @@ export default class Rule extends Component {
 
 		return (
 			<div id="rule">
+				<Helmet>
+					<title>{capitalise0(name)}</title>
+					<meta name="description" content={description} />
+				</Helmet>
 				<h1>
 					<span className="rule-type">{type}</span>
 					<span className="rule-name">{capitalise0(name)}</span>