From b8041a1b0936261bd966d1f7a1fb622f0ce68997 Mon Sep 17 00:00:00 2001 From: Johan Girod Date: Tue, 20 Nov 2018 12:37:57 +0100 Subject: [PATCH] =?UTF-8?q?Ajoute=20un=20bouton=20pr=C3=A9c=C3=A9dent=20pe?= =?UTF-8?q?ndant=20le=20guide=20du=20choix=20de=20status?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/actions/companyStatusActions.js | 18 ++++++ source/components/ui/Typography.css | 2 +- source/components/ui/index.css | 5 +- .../pages/Company/CompanyStatusNavigation.js | 27 +++++++++ .../pages/Company/DirectorStatus.js | 4 +- .../pages/Company/Home.js | 4 +- .../pages/Company/Liability.js | 4 +- .../pages/Company/Microenterprise.js | 5 +- .../pages/Company/MinorityDirector.js | 4 +- .../pages/Company/NumberOfAssociate.js | 6 +- .../pages/Company/PickLegalStatus.js | 12 ++-- ...egalStatusChoice.js => PreviousAnswers.js} | 59 +++++++++++-------- 12 files changed, 105 insertions(+), 45 deletions(-) create mode 100644 source/sites/mycompanyinfrance.fr/pages/Company/CompanyStatusNavigation.js rename source/sites/mycompanyinfrance.fr/pages/Company/{LegalStatusChoice.js => PreviousAnswers.js} (56%) diff --git a/source/actions/companyStatusActions.js b/source/actions/companyStatusActions.js index 75fd15a8e..5089517fa 100644 --- a/source/actions/companyStatusActions.js +++ b/source/actions/companyStatusActions.js @@ -9,6 +9,7 @@ import type { DirectorIsInAMinorityAction, DefineDirectorStatusAction } from 'Types/companyTypes' +import { last } from "ramda"; import type { RouterHistory } from 'react-router' import { dropWhile } from "ramda"; import { nextQuestionUrlSelector } from 'Selectors/companyStatusSelectors' @@ -88,3 +89,20 @@ export const resetCompanyStatusChoice = (from: string) => ( }: ResetCompanyStatusAction) ) } + +export const goBackToPreviousQuestion = () => ( + dispatch: ResetCompanyStatusAction => void, + getState: () => any, + history: RouterHistory +) => { + const previousQuestion = last(Object.keys(getState().inFranceApp.companyLegalStatus)); + if (previousQuestion) { + dispatch( + ({ + type: 'RESET_COMPANY_STATUS_CHOICE', + answersToReset: [previousQuestion], + }: ResetCompanyStatusAction) + ) + } + history.push(sitePaths().entreprise.statusJuridique[previousQuestion || 'index']) +} \ No newline at end of file diff --git a/source/components/ui/Typography.css b/source/components/ui/Typography.css index a583d82f9..0a5b0ed31 100644 --- a/source/components/ui/Typography.css +++ b/source/components/ui/Typography.css @@ -71,7 +71,7 @@ button { p, ul { line-height: 1.7rem; - margin: 0 0 1em; + margin: 0 0 1rem; } p.ui__.lead { font-size: 1.7rem; diff --git a/source/components/ui/index.css b/source/components/ui/index.css index 0246325d7..2d9041b88 100644 --- a/source/components/ui/index.css +++ b/source/components/ui/index.css @@ -20,14 +20,15 @@ button { .ui__.answer-group { display: flex; - flex-wrap: wrap; justify-content: flex-end; } @media (max-width: 500px) { .ui__.answer-group { - flex-direction: column; + flex-wrap: wrap; } .ui__.answer-group > * { + flex-grow: 1; + flex-shrink: 0; margin-right: 0; } } diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/CompanyStatusNavigation.js b/source/sites/mycompanyinfrance.fr/pages/Company/CompanyStatusNavigation.js new file mode 100644 index 000000000..5dad44545 --- /dev/null +++ b/source/sites/mycompanyinfrance.fr/pages/Company/CompanyStatusNavigation.js @@ -0,0 +1,27 @@ +/* @flow */ + +import { goBackToPreviousQuestion } from 'Actions/companyStatusActions' +import { T } from 'Components' +import React from 'react' +import { connect } from 'react-redux' +import { SkipButton } from 'Ui/Button' +type ownProps = { + onSkip?: () => void +} + +type Props = ownProps & { + goBackToPreviousQuestion: () => void +} +export default connect( + null, + { goBackToPreviousQuestion } +)(({ goBackToPreviousQuestion, onSkip }: Props) => ( +
+ + {onSkip && } +
+)) diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/DirectorStatus.js b/source/sites/mycompanyinfrance.fr/pages/Company/DirectorStatus.js index 1749edcc0..7aa8c9776 100644 --- a/source/sites/mycompanyinfrance.fr/pages/Company/DirectorStatus.js +++ b/source/sites/mycompanyinfrance.fr/pages/Company/DirectorStatus.js @@ -5,7 +5,7 @@ import { compose } from 'ramda' import Helmet from 'react-helmet' import { withI18n } from 'react-i18next' import { connect } from 'react-redux' -import { SkipButton } from 'Ui/Button' +import CompanyStatusNavigation from './CompanyStatusNavigation' import type { DirectorStatus } from 'Types/companyTypes' import type { TFunction } from 'react-i18next' @@ -70,8 +70,8 @@ const DefineDirectorStatus = ({ defineDirectorStatus, t }: Props) => ( }}> Indépendant - defineDirectorStatus(null)} /> + defineDirectorStatus(null)} /> ) diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/Home.js b/source/sites/mycompanyinfrance.fr/pages/Company/Home.js index 9820f98f8..f6a022361 100644 --- a/source/sites/mycompanyinfrance.fr/pages/Company/Home.js +++ b/source/sites/mycompanyinfrance.fr/pages/Company/Home.js @@ -8,7 +8,7 @@ import { connect } from 'react-redux' import { Link, Redirect } from 'react-router-dom' import { nextQuestionUrlSelector } from 'Selectors/companyStatusSelectors' import sitePaths from '../../sitePaths' -import LegalStatusChoices from './LegalStatusChoice' +import PreviousAnswers from './PreviousAnswers' import type { TFunction } from 'react-i18next' import type { Match, Location } from 'react-router' @@ -81,7 +81,7 @@ const CreateMyCompany = ({ )} - + ) } diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/Liability.js b/source/sites/mycompanyinfrance.fr/pages/Company/Liability.js index c279bb06e..bd142e0e8 100644 --- a/source/sites/mycompanyinfrance.fr/pages/Company/Liability.js +++ b/source/sites/mycompanyinfrance.fr/pages/Company/Liability.js @@ -5,7 +5,7 @@ import { compose } from 'ramda' import Helmet from 'react-helmet' import { withI18n } from 'react-i18next' import { connect } from 'react-redux' -import { SkipButton } from 'Ui/Button' +import CompanyStatusNavigation from './CompanyStatusNavigation' import type { CompanyLiability } from 'Types/companyTypes' import type { TFunction } from 'react-i18next' @@ -108,8 +108,8 @@ const Liability = ({ className="ui__ button"> Responsabilité limitée - chooseCompanyLiability(null)} /> + chooseCompanyLiability(null)} /> {/* this is an economic activity conducted by a single natural person, in his own name ; */} {/* Company : This is an economic activity conducted by a single partner - single member company with limited liability (EURL) - or several partners (limited liability company (SARL), public limited company (SA), simplified joint-stock company (SAS)...). */} diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/Microenterprise.js b/source/sites/mycompanyinfrance.fr/pages/Company/Microenterprise.js index 0383c066e..873a3ec38 100644 --- a/source/sites/mycompanyinfrance.fr/pages/Company/Microenterprise.js +++ b/source/sites/mycompanyinfrance.fr/pages/Company/Microenterprise.js @@ -5,7 +5,8 @@ import { compose } from 'ramda' import Helmet from 'react-helmet' import { withI18n } from 'react-i18next' import { connect } from 'react-redux' -import { SkipButton } from 'Ui/Button' +import CompanyStatusNavigation from './CompanyStatusNavigation' + import type { TFunction } from 'react-i18next' type Props = { @@ -95,8 +96,8 @@ const Microenterprise = ({ companyIsMicroenterprise, t }: Props) => ( className="ui__ button"> Entreprise Individuelle - companyIsMicroenterprise(null)} /> + companyIsMicroenterprise(null)}/> ) diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/MinorityDirector.js b/source/sites/mycompanyinfrance.fr/pages/Company/MinorityDirector.js index 6938800fc..328d453ba 100644 --- a/source/sites/mycompanyinfrance.fr/pages/Company/MinorityDirector.js +++ b/source/sites/mycompanyinfrance.fr/pages/Company/MinorityDirector.js @@ -5,7 +5,7 @@ import { compose } from 'ramda' import Helmet from 'react-helmet' import { withI18n } from 'react-i18next' import { connect } from 'react-redux' -import { SkipButton } from 'Ui/Button' +import CompanyStatusNavigation from './CompanyStatusNavigation' import type { TFunction } from 'react-i18next' type Props = { @@ -66,8 +66,8 @@ const MinorityDirector = ({ directorIsInAMinority, t }: Props) => ( className="ui__ button"> Gérant minoritaire - directorIsInAMinority(null)} /> + directorIsInAMinority(null)} /> ) diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/NumberOfAssociate.js b/source/sites/mycompanyinfrance.fr/pages/Company/NumberOfAssociate.js index d51fa67d9..08a199a76 100644 --- a/source/sites/mycompanyinfrance.fr/pages/Company/NumberOfAssociate.js +++ b/source/sites/mycompanyinfrance.fr/pages/Company/NumberOfAssociate.js @@ -6,7 +6,7 @@ import { compose } from 'ramda' import Helmet from 'react-helmet' import { withI18n } from 'react-i18next' import { connect } from 'react-redux' -import { SkipButton } from 'Ui/Button' +import CompanyStatusNavigation from './CompanyStatusNavigation' import type { TFunction } from 'react-i18next' type Props = { @@ -64,8 +64,10 @@ const NumberOfAssociates = ({ companyHasMultipleAssociates, t }: Props) => ( className="ui__ button"> Plusieurs associés - companyHasMultipleAssociates(null)} /> + companyHasMultipleAssociates(null)} + /> ) diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/PickLegalStatus.js b/source/sites/mycompanyinfrance.fr/pages/Company/PickLegalStatus.js index 0d45e9802..e5ae8abc6 100644 --- a/source/sites/mycompanyinfrance.fr/pages/Company/PickLegalStatus.js +++ b/source/sites/mycompanyinfrance.fr/pages/Company/PickLegalStatus.js @@ -13,12 +13,12 @@ import withLanguage from 'Components/utils/withLanguage' import type { TFunction } from 'react-i18next' import sitePaths from '../../sitePaths'; -import { goToCompanyStatusChoice } from 'Actions/companyStatusActions' +import { goBackToPreviousQuestion } from 'Actions/companyStatusActions' type Props = { history: RouterHistory, possibleStatus: { [LegalStatus]: boolean }, - onStartAgain: () => void, + goBackToPreviousQuestion: () => void, setMainStatus: LegalStatus => void, language: string, t: TFunction @@ -32,7 +32,7 @@ const StatusButton = withI18n()( ) ) -const SetMainStatus = ({ history, possibleStatus, onStartAgain, t, language }: Props) => { +const SetMainStatus = ({ history, possibleStatus, goBackToPreviousQuestion, t, language }: Props) => { return ( <> @@ -161,8 +161,8 @@ const SetMainStatus = ({ history, possibleStatus, onStartAgain, t, language }: P justifyContent: 'space-between' }} > - Choisir plus tard › @@ -177,6 +177,6 @@ export default compose( withLanguage, connect( state => ({ possibleStatus: possibleStatusSelector(state) }), - { onStartAgain: goToCompanyStatusChoice } + { goBackToPreviousQuestion } ) )(SetMainStatus) diff --git a/source/sites/mycompanyinfrance.fr/pages/Company/LegalStatusChoice.js b/source/sites/mycompanyinfrance.fr/pages/Company/PreviousAnswers.js similarity index 56% rename from source/sites/mycompanyinfrance.fr/pages/Company/LegalStatusChoice.js rename to source/sites/mycompanyinfrance.fr/pages/Company/PreviousAnswers.js index f30e3162e..a3cc780a9 100644 --- a/source/sites/mycompanyinfrance.fr/pages/Company/LegalStatusChoice.js +++ b/source/sites/mycompanyinfrance.fr/pages/Company/PreviousAnswers.js @@ -1,4 +1,5 @@ /* @flow */ +import { goToCompanyStatusChoice } from 'Actions/companyStatusActions' import { React, T } from 'Components' import { isNil } from 'ramda' import { connect } from 'react-redux' @@ -35,33 +36,43 @@ const requirementToText = (key, value) => { type Props = CompanyLegalStatus & { goToCompanyStatusChoice: () => void } -const LegalStatusChoice = ({ ...legalStatus }: Props) => { +const PreviousAnswers = ({ + goToCompanyStatusChoice, + ...legalStatus +}: Props) => { return ( - !!Object.keys(legalStatus).length && ( - <> -

- Vos choix : -

-
    - - {Object.entries(legalStatus).map( - ([key, value]) => - !isNil(value) && ( -
  • - - {requirementToText(key, value)} - -
    • - ) - )} -     -
- - ) + <> + {!!Object.keys(legalStatus).length && ( + + )} + {Object.values(legalStatus).some(answer => answer !== null) && ( + <> +

+ Vos choix : +

+
    + + {Object.entries(legalStatus).map( + ([key, value]) => + !isNil(value) && ( +
  • + + {requirementToText(key, value)} + +
    • + ) + )} +     +
+ + )} + ) } export default connect( state => state.inFranceApp.companyLegalStatus, - () => ({}) -)(LegalStatusChoice) + { goToCompanyStatusChoice } +)(PreviousAnswers)