From 16f5e4aee6a44f74d4f947022edaec55f8c4f95b Mon Sep 17 00:00:00 2001
From: Mael <mael.thomas@data.gouv.fr>
Date: Tue, 24 Apr 2018 18:30:16 +0200
Subject: [PATCH] :bug: Avancement par objectif correctement calcule

---
 source/components/TargetSelection.js | 72 ++++++++++++++++------------
 source/containers/App.dev.js         |  1 +
 source/i18n.js                       |  7 +--
 source/reducers.js                   | 43 ++++++++++-------
 4 files changed, 72 insertions(+), 51 deletions(-)

diff --git a/source/components/TargetSelection.js b/source/components/TargetSelection.js
index 2a557d2e9..0773dd8ca 100644
--- a/source/components/TargetSelection.js
+++ b/source/components/TargetSelection.js
@@ -51,16 +51,23 @@ export default class TargetSelection extends Component {
 					}}>
 					{this.renderOutputList()}
 				</section>
-				{!this.firstEstimationComplete &&
-					<h1><Trans i18nKey="enterSalary">Entrez un salaire mensuel</Trans></h1>
-				}
+				{!this.firstEstimationComplete && (
+					<h1>
+						<Trans i18nKey="enterSalary">Entrez un salaire mensuel</Trans>
+					</h1>
+				)}
 
 				{this.firstEstimationComplete &&
 					!conversationStarted && (
 						<div id="action">
 							<p>
-								<b><Trans>Estimation approximative</Trans></b> <br />
-								<Trans i18nKey="defaults">pour une situation par défaut (CDI non cadre).</Trans>
+								<b>
+									<Trans>Estimation approximative</Trans>
+								</b>{' '}
+								<br />
+								<Trans i18nKey="defaults">
+									pour une situation par défaut (CDI non cadre).
+								</Trans>
 							</p>
 							<BlueButton onClick={this.props.startConversation}>
 								<Trans>Affiner le calcul</Trans>
@@ -115,8 +122,34 @@ export default class TargetSelection extends Component {
 
 let computeRatio = (mvt, name) =>
 	!isEmpty(mvt) &&
-	values(mvt.current[name]).length /
-		values(mvt.initial[name]).length
+	values(mvt.current[name]).length / values(mvt.initial[name]).length
+
+let ProgressCircle = ({ activeInput, s, missingVariablesByTarget }) => {
+	let isActiveInput = activeInput === s.dottedName,
+		ratio = isActiveInput
+			? null
+			: computeRatio(missingVariablesByTarget, s.dottedName)
+
+	return (
+		<span
+			className="progressCircle"
+			style={{
+				visibility: isActiveInput ? 'hidden' : 'visible'
+			}}>
+			{ratio === 0 ? (
+				<i className="fa fa-check" aria-hidden="true" />
+			) : (
+				<Circle
+					percent={100 - ratio * 100}
+					strokeWidth="15"
+					strokeColor="#5de662"
+					trailColor="#fff"
+					trailWidth="5"
+				/>
+			)}
+		</span>
+	)
+}
 
 let Header = ({
 	conversationStarted,
@@ -126,30 +159,7 @@ let Header = ({
 }) => (
 	<span className="header">
 		{conversationStarted && (
-			<span
-				className="progressCircle"
-				style={{
-					visibility: activeInput === s.dottedName ? 'hidden' : 'visible'
-				}}>
-				{do {
-					let ratio =
-						activeInput === s.dottedName
-							? 0
-							: computeRatio(missingVariablesByTarget, s.dottedName)
-
-					ratio === 0 ? (
-						<i className="fa fa-check" aria-hidden="true" />
-					) : (
-						<Circle
-							percent={100 - ratio * 100}
-							strokeWidth="15"
-							strokeColor="#5de662"
-							trailColor="#fff"
-							trailWidth="5"
-						/>
-					)
-				}}
-			</span>
+			<ProgressCircle {...{ s, missingVariablesByTarget, activeInput }} />
 		)}
 
 		<span className="texts">
diff --git a/source/containers/App.dev.js b/source/containers/App.dev.js
index 4b81952c4..da2c13b46 100644
--- a/source/containers/App.dev.js
+++ b/source/containers/App.dev.js
@@ -7,6 +7,7 @@ export default ({ store }) => (
 	<Provider store={store}>
 		<div id="dev">
 			<Layout />
+			<DevTools />
 		</div>
 	</Provider>
 )
diff --git a/source/i18n.js b/source/i18n.js
index 2ce4d3036..8a3b6b3ad 100644
--- a/source/i18n.js
+++ b/source/i18n.js
@@ -5,8 +5,9 @@ import queryString from 'query-string'
 import { getIframeOption } from './utils'
 import enTranslations from './locales/en.yaml'
 
-let lang = getIframeOption('lang') ||
-    queryString.parse(location.search)['lang'] ||
+let lang =
+	getIframeOption('lang') ||
+	queryString.parse(location.search)['lang'] ||
 	sessionStorage['lang'] ||
 	'fr'
 
@@ -14,7 +15,7 @@ sessionStorage['lang'] = lang
 
 i18next.init(
 	{
-		debug: true,
+		debug: false,
 		lng: lang,
 		resources: {
 			en: {
diff --git a/source/reducers.js b/source/reducers.js
index c600a0be1..04e57da5a 100644
--- a/source/reducers.js
+++ b/source/reducers.js
@@ -84,7 +84,8 @@ export let reduceSteps = (tracker, flatRules, answerSource) => (
 		missingVariablesByTarget = collectMissingVariablesByTarget(
 			nextStepsAnalysis.targets
 		),
-		nextSteps = getNextSteps(missingVariablesByTarget)
+		nextSteps = getNextSteps(missingVariablesByTarget),
+		currentQuestion = head(nextSteps)
 
 	let newState = {
 		...state,
@@ -92,23 +93,21 @@ export let reduceSteps = (tracker, flatRules, answerSource) => (
 		situationGate: situationWithDefaults(state),
 		explainedVariable: null,
 		nextSteps,
-		// store the missingVariables when no question has been answered yet,
-		// to be able to compute a progress by objective
-		missingVariablesByTarget: {
-			initial:
-				state.foldedSteps.length === 0
-					? missingVariablesByTarget
-					: state.missingVariablesByTarget.initial,
-			current: missingVariablesByTarget
-		},
-		currentQuestion: head(nextSteps),
+		currentQuestion,
 		foldedSteps:
 			action.type === 'SET_CONVERSATION_TARGETS' && action.reset
 				? []
 				: state.foldedSteps
 	}
 
-	if (action.type == 'START_CONVERSATION') return newState
+	if (action.type == 'START_CONVERSATION')
+		return {
+			...newState,
+			missingVariablesByTarget: {
+				initial: missingVariablesByTarget,
+				current: missingVariablesByTarget
+			}
+		}
 
 	if (action.type == STEP_ACTION && action.name == 'fold') {
 		tracker.push([
@@ -124,10 +123,15 @@ export let reduceSteps = (tracker, flatRules, answerSource) => (
 				'after' + length(newState.foldedSteps) + 'questions'
 			])
 		}
+		let foldedSteps = [...state.foldedSteps, state.currentQuestion]
 
 		return {
 			...newState,
-			foldedSteps: [...state.foldedSteps, state.currentQuestion]
+			foldedSteps,
+			missingVariablesByTarget: {
+				...state.missingVariablesByTarget,
+				current: missingVariablesByTarget
+			}
 		}
 	}
 	if (action.type == STEP_ACTION && action.name == 'unfold') {
@@ -137,14 +141,19 @@ export let reduceSteps = (tracker, flatRules, answerSource) => (
 		let previous = state.currentQuestion,
 			// we fold it back into foldedSteps if it had been answered
 			answered = previous && answerSource(state)(previous) != undefined,
-			foldedSteps = answered
+			rawFoldedSteps = answered
 				? concat(state.foldedSteps, [previous])
-				: state.foldedSteps
+				: state.foldedSteps,
+			foldedSteps = without([action.step], foldedSteps)
 
 		return {
 			...newState,
-			foldedSteps: without([action.step], foldedSteps),
-			currentQuestion: action.step
+			foldedSteps,
+			currentQuestion: action.step,
+			missingVariablesByTarget: {
+				...state.missingVariablesByTarget,
+				current: missingVariablesByTarget
+			}
 		}
 	}
 }