🐛 répare le bouton pour réinitialiser un formulaire

source/actions.js

@@ -1,11 +1,23 @@
+/* @flow */
+import type { ResetSimulationAction } from './types/Actions'
+
 // The input "conversation" is composed of "steps"
 // The state keeps track of which of them have been submitted
 // The user can also come back to one of his answers and edit it
 export const STEP_ACTION = 'STEP_ACTION'
+
+// $FlowFixMe
 export function stepAction(name, step, source) {
 	return { type: STEP_ACTION, name, step, source }
 }
 
+export function resetSimulation(): ResetSimulationAction {
+	return {
+		type: 'RESET_SIMULATION'
+	}
+}
+
+// $FlowFixMe
 export function setExample(name, situation) {
 	return { type: 'SET_EXAMPLE', situation, name }
 }
@@ -13,6 +25,8 @@ export function setExample(name, situation) {
 export const START_CONVERSATION = 'START_CONVERSATION'
 
 export const CHANGE_THEME_COLOUR = 'CHANGE_THEME_COLOUR'
+
+// $FlowFixMe
 export function changeThemeColour(colour) {
 	return { type: CHANGE_THEME_COLOUR, colour }
 }

source/components/conversation/FoldedSteps.js

@@ -4,7 +4,8 @@ import { connect } from 'react-redux'
 //import styles from './.css'
 // css in conversation.Css
 import { isEmpty, map, pick } from 'ramda'
-import ReactPiwik from '../Tracker'
+import { reset } from 'redux-form'
+import { resetSimulation } from '../../actions'
 import { getInputComponent } from 'Engine/generateQuestions'
 import withColours from '../withColours'
 import { scroller, Element, animateScroll } from 'react-scroll'
@@ -21,20 +22,20 @@ import { scroller, Element, animateScroll } from 'react-scroll'
 		'analysis',
 		'flatRules'
 	]),
-	dispatch => ({
-		reinitialise: () => {
-			ReactPiwik.push(['trackEvent', 'restart', ''])
-			// TODO horrible hack : our state should be refactored to enable resetting the relevant part of it
-			window.location.reload(false)
-		}
-	})
+	{
+		resetSimulation,
+		resetForm: () => reset('conversation')
+	}
 )
 @translate()
-export default class extends Component {
+export default class FoldedSteps extends Component {
+	handleSimulationReset = () => {
+		this.props.resetForm()
+		this.props.resetSimulation()
+	}
 	render() {
 		let {
 			foldedSteps,
-			reinitialise,
 			targetNames,
 			flatRules,
 			themeColours: { textColourOnWhite }
@@ -44,7 +45,9 @@ export default class extends Component {
 		return (
 			<div id="foldedSteps">
 				<div className="header">
-					<button onClick={reinitialise} style={{ color: textColourOnWhite }}>
+					<button
+						onClick={this.handleSimulationReset}
+						style={{ color: textColourOnWhite }}>
 						<i className="fa fa-trash" aria-hidden="true" />
 						<Trans i18nKey="resetAll">Tout effacer</Trans>
 					</button>

source/reducers/reduceSteps.js

@@ -14,6 +14,11 @@ export default (tracker, flatRules, answerSource) => (state, action) => {
 		state.parsedRules = parseAll(flatRules)
 	}
 
+	// TODO put this in middleware
+	if (action.type === 'RESET_SIMULATION') {
+		tracker.push(['trackEvent', 'restart', ''])
+	}
+
 	// TODO
 	if (action.type == 'CHANGE_LANG') {
 		if (action.lang == 'fr') {

source/reducers/reducers.js

@@ -35,6 +35,8 @@ function conversationStarted(state = false, { type }) {
 		case 'START_CONVERSATION':
 		case 'LOAD_PREVIOUS_SIMULATION':
 			return true
+		case 'RESET_SIMULATION':
+			return false
 		default:
 			return state
 	}
@@ -43,11 +45,29 @@ function activeTargetInput(state = null, { type, name }) {
 	switch (type) {
 		case 'SET_ACTIVE_TARGET_INPUT':
 			return name
+		case 'RESET_SIMULATION':
+			return null
+		default:
+			return state
+	}
+}
+function foldedSteps(state = [], { type }) {
+	switch (type) {
+		case 'RESET_SIMULATION':
+			return []
 		default:
 			return state
 	}
 }
 
+function analysis(state = null, { type }) {
+	switch (type) {
+		case 'RESET_SIMULATION':
+			return null
+		default:
+			return state
+	}
+}
 export default (tracker, initialRules) =>
 	reduceReducers(
 		combineReducers({
@@ -57,14 +77,14 @@ export default (tracker, initialRules) =>
 
 			/* Have forms been filled or ignored ?
 		false means the user is reconsidering its previous input */
-			foldedSteps: (steps = []) => steps,
+			foldedSteps,
 			currentQuestion: (state = null) => state,
 			nextSteps: (state = []) => state,
 			missingVariablesByTarget: (state = {}) => state,
 
 			parsedRules: (state = null) => state,
 			flatRules: (state = null) => state,
-			analysis: (state = null) => state,
+			analysis,
 
 			targetNames: (state = popularTargetNames) => state,
 

source/storage/persist.js

@@ -3,7 +3,7 @@
 import type { Store } from 'redux'
 import { serialize, deserialize } from './serialize'
 import type { State } from '../types/State'
-import type { Action } from '../types/Action'
+import type { Action } from '../types/Actions'
 
 const VERSION = 1
 

source/types/Action.js

@@ -1,6 +0,0 @@
-/* @flow */
-
-type LoadPreviousSimulationAction = {
-	type: 'LOAD_PREVIOUS_SIMULATION'
-}
-export type Action = LoadPreviousSimulationAction

source/types/Actions.js

@@ -0,0 +1,11 @@
+/* @flow */
+
+export type LoadPreviousSimulationAction = {
+	type: 'LOAD_PREVIOUS_SIMULATION'
+}
+
+export type ResetSimulationAction = {
+	type: 'RESET_SIMULATION'
+}
+
+export type Action = LoadPreviousSimulationAction | ResetSimulationAction