Nouvelle page d'exemples de simulations types

source/règles/cas-types.yaml

@@ -0,0 +1,32 @@
+- nom: CDI au salaire médian
+  situation: 
+    contrat salarié . salaire . brut de base: 2300
+
+- nom: CDI au SMIC
+  situation: 
+    contrat salarié . salaire . brut de base: 1500
+
+
+- nom: SMIC temps partiel 24h / semaine
+  situation: 
+    contrat salarié . salaire . brut de base: 1030
+    contrat salarié . temps partiel . heures par semaine: 24
+
+- nom: CDI cadre salaire médian
+  situation: 
+    contrat salarié . salaire . brut de base: 3600
+    contrat salarié . statut cadre: oui
+
+- nom: CDD usage de 2 mois
+  situation: 
+    contrat salarié . salaire . brut de base: 3600
+    contrat salarié . type de contrat: CDD
+    contrat salarié . CDD . motif: usage
+    contrat salarié . CDD . durée: 2
+
+- nom: CDD accroissement d'activité de 1 an
+  situation: 
+    contrat salarié . salaire . brut de base: 2300
+    contrat salarié . type de contrat: CDD
+    contrat salarié . CDD . motif: accroissement activité
+    contrat salarié . CDD . durée: 12

source/selectors/analyseSelectors.js

@@ -33,11 +33,11 @@ export let flatRulesSelector = createSelector(
 	(lang, rules) => rules || (lang === 'en' ? baseRulesEn : baseRulesFr)
 )
 
-let parsedRulesSelector = createSelector([flatRulesSelector], rules =>
+export let parsedRulesSelector = createSelector([flatRulesSelector], rules =>
 	parseAll(rules)
 )
 
-let ruleDefaultsSelector = createSelector([flatRulesSelector], rules =>
+export let ruleDefaultsSelector = createSelector([flatRulesSelector], rules =>
 	collectDefaults(rules)
 )
 

source/sites/embauche.gouv.fr/App.js

@@ -1,5 +1,6 @@
 import PageFeedback from 'Components/Feedback/PageFeedback'
 import Mecanisms from 'Components/Mecanisms'
+import ExampleSituations from './pages/ExampleSituations'
 import RulePage from 'Components/RulePage'
 import DisableScroll from 'Components/utils/DisableScroll'
 import TrackPageView from 'Components/utils/TrackPageView'
@@ -78,6 +79,7 @@ class EmbaucheRoute extends Component {
 					<Route path="/règle/:name" component={RulePage} />
 					<Redirect from="/simu/*" to="/" />
 					<Route path="/règles" component={RulesList} />
+					<Route path="/exemples" component={ExampleSituations} />
 					<Route path="/mecanismes" component={Mecanisms} />
 					<Route path="/à-propos" component={About} />
 					<Route path="/intégrer" component={Integration} />

source/sites/embauche.gouv.fr/pages/ExampleSituations.css

@@ -0,0 +1,34 @@
+#exampleSituations .example {
+	border-bottom: 1px solid #eee;
+	width: 100%;
+	display: flex;
+	justify-items: space-between;
+}
+#exampleSituations .example h2 {
+	width: 30%;
+	display: inline-block;
+}
+#exampleSituations .example ul {
+	width: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: space-around;
+	list-style: none;
+}
+#exampleSituations .example h2 {
+	font-size: 120%;
+}
+#exampleSituations .example li {
+	padding-top: 0;
+}
+#exampleSituations .example h3 {
+	font-size: 100%;
+	font-weight: 600;
+	color: #444;
+}
+#exampleSituations .example .figure {
+	font-size: 110%;
+	text-align: center;
+	display: inline-block;
+	width: 100%;
+}

source/sites/embauche.gouv.fr/pages/ExampleSituations.js

@@ -0,0 +1,79 @@
+// Page listing the engine's currently implemented mecanisms and their tests
+import React, { Component } from 'react'
+import './ExampleSituations.css'
+import examples from 'Règles/cas-types.yaml'
+import { analyseMany } from 'Engine/traverse'
+import { connect } from 'react-redux'
+import {
+	ruleDefaultsSelector,
+	parsedRulesSelector
+} from 'Selectors/analyseSelectors'
+import withColours from 'Components/utils/withColours'
+
+class ExempleSituations extends Component {
+	render() {
+		return (
+			<div className="ui__ container" id="exampleSituations">
+				<h1>Exemples de calculs</h1>
+				<ul>
+					{examples.map(ex => (
+						<Example ex={ex} key={ex.nom} />
+					))}
+				</ul>
+			</div>
+		)
+	}
+}
+@connect(state => ({
+	defaults: ruleDefaultsSelector(state),
+	parsedRules: parsedRulesSelector(state)
+}))
+@withColours
+class Example extends Component {
+	render() {
+		let {
+				ex: { nom, situation },
+				parsedRules,
+				defaults,
+				colours
+			} = this.props,
+			[total, net, netAprèsImpôts] = analyseMany(parsedRules, [
+				'total',
+				'net',
+				'net après impôt'
+			])(dottedName => ({ ...defaults, ...situation }[dottedName])).targets,
+			figures = [
+				total,
+				do {
+					let dottedName = 'contrat salarié . salaire . brut de base'
+					;({
+						dottedName,
+						nodeValue: situation[dottedName],
+						title: 'Salaire brut'
+					})
+				},
+				net,
+				{ ...netAprèsImpôts, title: 'Net après impôt' }
+			]
+
+		return (
+			<li className="example">
+				<h2>{nom}</h2>
+				<ul>
+					{figures.map(t => (
+						<li key={t.dottedName}>
+							<h3>{t.title}</h3>
+							<span
+								style={{ color: colours.textColourOnWhite }}
+								className="figure">
+								{Math.round(t.nodeValue)} €
+							</span>
+						</li>
+					))}{' '}
+				</ul>
+			</li>
+		)
+	}
+}
+
+export default ExempleSituations

source/webpack.common.js

@@ -85,7 +85,8 @@ module.exports = {
 		new HTMLPlugin({
 			template: 'index.html',
 			chunks: ['infrance'],
-			title: 'My company in France: A step-by-step guide to start a business in France',
+			title:
+				'My company in France: A step-by-step guide to start a business in France',
 			description:
 				'Find the type of company that suits you and follow the steps to register your company. Discover the French social security system by simulating your hiring costs. Discover the procedures to hire in France and learn the basics of French labour law.',
 			filename: 'infrance.html'
@@ -101,9 +102,18 @@ module.exports = {
 		new CopyPlugin([
 			'./manifest.webmanifest',
 			'./source/sites/embauche.gouv.fr/images/logo',
-			{ from: './source/sites/embauche.gouv.fr/robots.txt', to: 'robots.embauche.txt' },
-			{ from: './source/sites/mycompanyinfrance.fr/robots.txt', to: 'robots.infrance.txt' },
-			{ from: './source/sites/mycompanyinfrance.fr/sitemap.txt', to: 'sitemap.infrance.txt' },
+			{
+				from: './source/sites/embauche.gouv.fr/robots.txt',
+				to: 'robots.embauche.txt'
+			},
+			{
+				from: './source/sites/mycompanyinfrance.fr/robots.txt',
+				to: 'robots.infrance.txt'
+			},
+			{
+				from: './source/sites/mycompanyinfrance.fr/sitemap.txt',
+				to: 'sitemap.infrance.txt'
+			}
 		])
 	]
 }

test/real-rules.test.js

@@ -1,9 +1,3 @@
-/*
-  Les mécanismes sont testés dans mécanismes/ comme le sont les variables directement dans la base YAML.
-  On y créée dans chaque fichier une base YAML autonome, dans laquelle intervient le mécanisme à tester,
-  puis on teste idéalement tous ses comportements sans en faire intervenir d'autres.
-*/
-
 import { AssertionError } from 'chai'
 import { rules } from '../source/engine/rules'
 import { parseAll } from '../source/engine/traverse'