77 lines
2.0 KiB
JavaScript
77 lines
2.0 KiB
JavaScript
import React from 'react'
|
|
import { connect } from 'react-redux'
|
|
import { isEmpty, compose } from 'ramda'
|
|
import Answers from 'Components/AnswerList'
|
|
import Conversation from 'Components/conversation/Conversation'
|
|
import withColours from 'Components/utils/withColours'
|
|
import Targets from 'Components/Targets'
|
|
import './GenericSimulation.css'
|
|
import {
|
|
nextStepsSelector,
|
|
analysisWithDefaultsSelector
|
|
} from 'Selectors/analyseSelectors'
|
|
import { reduxForm } from 'redux-form'
|
|
import PeriodSwitch from 'Components/PeriodSwitch'
|
|
import Controls from './Controls'
|
|
|
|
export default compose(
|
|
withColours,
|
|
connect(state => ({
|
|
previousAnswers: state.conversationSteps.foldedSteps,
|
|
noNextSteps: nextStepsSelector(state).length == 0,
|
|
analysis: analysisWithDefaultsSelector(state)
|
|
}))
|
|
)(
|
|
class extends React.Component {
|
|
state = {
|
|
displayAnswers: false
|
|
}
|
|
render() {
|
|
let {
|
|
colours,
|
|
noNextSteps,
|
|
previousAnswers,
|
|
analysis: { controls }
|
|
} = this.props
|
|
return (
|
|
<div id="GenericSimulation">
|
|
<header>
|
|
<img src="https://images.unsplash.com/photo-1488722796624-0aa6f1bb6399?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80" />
|
|
<h1>Quel revenu au régime des indépendants ?</h1>
|
|
<PeriodSwitch />
|
|
</header>
|
|
<div className="ui__ container" id="simulationContent">
|
|
{!isEmpty(previousAnswers) && (
|
|
<button
|
|
style={{
|
|
background: colours.colour,
|
|
color: colours.textColour
|
|
}}
|
|
onClick={() => this.setState({ displayAnswers: true })}>
|
|
Mes réponses
|
|
</button>
|
|
)}
|
|
|
|
{this.state.displayAnswers && (
|
|
<Answers
|
|
onClose={() => this.setState({ displayAnswers: false })}
|
|
/>
|
|
)}
|
|
<Conversation
|
|
textColourOnWhite={this.props.colours.textColourOnWhite}
|
|
/>
|
|
<Controls {...{ controls }} />
|
|
{noNextSteps && (
|
|
<>
|
|
<h2>Plus de questions ! </h2>
|
|
<p>Vous avez atteint l'estimation la plus précise.</p>
|
|
</>
|
|
)}
|
|
<Targets />
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
)
|