From d8ee14a77dff167bc6fccaf1edfaebedae180112 Mon Sep 17 00:00:00 2001
From: Johan Girod <johan.girod@beta.gouv.fr>
Date: Mon, 20 May 2019 12:45:26 +0200
Subject: [PATCH] =?UTF-8?q?:art:=20am=C3=A9liore=20l'affichage=20et=20corr?=
 =?UTF-8?q?ige=20le=20debounce=20sur=20l'input=20du=20pourcentage?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 source/components/PercentageField.css         |  1 +
 source/components/PercentageField.js          | 22 ++++++++++---------
 source/components/TargetSelection.js          |  8 ++++---
 .../simulationConfigs/assimilé.yaml           |  1 +
 .../layout/Navigation/SideBar.js              |  4 ++--
 5 files changed, 21 insertions(+), 15 deletions(-)

diff --git a/source/components/PercentageField.css b/source/components/PercentageField.css
index 5ef595dc5..b19eaf060 100644
--- a/source/components/PercentageField.css
+++ b/source/components/PercentageField.css
@@ -3,6 +3,7 @@
 	vertical-align: middle;
 	outline: none;
 	border: none;
+	cursor: pointer;
 	padding: 0;
 	background: none;
 }
diff --git a/source/components/PercentageField.js b/source/components/PercentageField.js
index 787e88077..ce3bd2aff 100644
--- a/source/components/PercentageField.js
+++ b/source/components/PercentageField.js
@@ -2,30 +2,32 @@ import React from 'react'
 import { debounce } from '../utils'
 import './PercentageField.css'
 
-export default class extends React.Component {
-	onChange = this.props.debounce
+export default class PercentageField extends React.Component {
+	debouncedOnChange = this.props.debounce
 		? debounce(this.props.debounce, this.props.input.onChange)
 		: this.props.input.onChange
-
+	state = {
+		value: this.props.input?.value
+	}
+	onChange(value) {
+		this.setState({ value })
+		this.debouncedOnChange(value)
+	}
 	render() {
-		let {
-			input: { value }
-		} = this.props
-
 		return (
 			<div>
 				<input
 					className="range"
 					onChange={e => this.onChange(e.target.value)}
-					value={value}
 					type="range"
+					value={this.state.value}
 					name="volume"
 					min="0"
-					step="0.1"
+					step="0.05"
 					max="1"
 				/>
 				<span style={{ display: 'inline-block', width: '3em' }}>
-					{value * 100} %
+					{Math.round(this.state.value * 100)} %
 				</span>
 			</div>
 		)
diff --git a/source/components/TargetSelection.js b/source/components/TargetSelection.js
index f2a39b466..81661bcc4 100644
--- a/source/components/TargetSelection.js
+++ b/source/components/TargetSelection.js
@@ -104,14 +104,16 @@ export default compose(
 							controls={analysis.controls}
 						/>
 					)}
-					<PeriodSwitch />
 
 					{(Array.isArray(objectifs)
 						? [[null, objectifs]]
 						: toPairs(objectifs)
-					).map(([groupName, groupTargets]) => (
+					).map(([groupName, groupTargets], index) => (
 						<>
-							{groupName && <h2>{emoji(groupName)}</h2>}
+							<div style={{ display: 'flex', alignItems: 'end' }}>
+								{groupName && <h2 style={{ flex: 1 }}>{emoji(groupName)}</h2>}
+								{index === 0 && <PeriodSwitch />}
+							</div>
 							<section
 								className="ui__ plain card"
 								style={{
diff --git a/source/components/simulationConfigs/assimilé.yaml b/source/components/simulationConfigs/assimilé.yaml
index 3551a1cd9..b74030cbe 100644
--- a/source/components/simulationConfigs/assimilé.yaml
+++ b/source/components/simulationConfigs/assimilé.yaml
@@ -19,6 +19,7 @@ questions:
   blacklist:
     - entreprise . charges
     - contrat salarié . avantages en nature . montant
+    - entreprise . rémunération du dirigeant
 situation:
   auto entrepreneur: non
   indépendant: non
diff --git a/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.js b/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.js
index 2e1f68844..127246da2 100644
--- a/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.js
+++ b/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.js
@@ -17,7 +17,7 @@ type OwnProps = {|
 
 type Props = OwnProps & {
 	tracker: Tracker,
-	location: Location,
+	location: Location
 }
 type State = {
 	opened: boolean,
@@ -97,5 +97,5 @@ class SideBar extends React.Component<Props, State> {
 
 export default (compose(
 	withTracker,
-	withRouter,
+	withRouter
 )(SideBar): React$ComponentType<OwnProps>)