-
Notifications
You must be signed in to change notification settings - Fork 87
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(simulateurs): Nouveau simulateur réduction générale
- Loading branch information
Showing
13 changed files
with
641 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
110 changes: 110 additions & 0 deletions
110
site/cypress/integration/mon-entreprise/reduction-generale.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,110 @@ | ||
| import { checkA11Y, fr } from '../../support/utils' | ||
|
|
||
| describe('Réduction générale', { testIsolation: false }, function () { | ||
| if (!fr) { | ||
| return | ||
| } | ||
|
|
||
| const inputSelector = 'div[id="simulator-legend"] input[inputmode="numeric"]' | ||
|
|
||
| before(function () { | ||
| return cy.visit('/simulateurs/réduction-générale') | ||
| }) | ||
|
|
||
| it('should not crash', function () { | ||
| cy.contains('Salaire brut') | ||
| }) | ||
|
|
||
| it('should allow to select a company size', function () { | ||
| cy.get('button').contains('SMIC').click() | ||
|
|
||
| cy.contains('Plus de 50 salariés').click() | ||
| cy.contains('Modifier mes réponses').click() | ||
| cy.get('div[data-cy="modal"]') | ||
| .eq(0) | ||
| .contains('Effectif') | ||
| .next() | ||
| .contains('100') | ||
| cy.get('div[data-cy="modal"]').eq(0).contains('Fermer').click() | ||
|
|
||
| cy.contains('Moins de 50 salariés').click() | ||
| cy.contains('Modifier mes réponses').click() | ||
| cy.get('div[data-cy="modal"]') | ||
| .eq(0) | ||
| .contains('Effectif') | ||
| .next() | ||
| .contains('10') | ||
| cy.get('div[data-cy="modal"]').eq(0).contains('Fermer').click() | ||
| }) | ||
|
|
||
| it('should allow to change time period', function () { | ||
| cy.contains('Montant mensuel').click() | ||
| cy.get(inputSelector).first().type('{selectall}2000') | ||
|
|
||
| cy.contains('Montant annuel').click() | ||
| cy.get(inputSelector).first().should('have.value', '24 000 €') | ||
| }) | ||
|
|
||
| it('should have median salary and SMIC buttons', function () { | ||
| cy.contains('Montant mensuel').click() | ||
| cy.get('button').contains('SMIC') | ||
| cy.get('button').contains('salaire médian').click() | ||
| cy.get(inputSelector).first().should('have.value', '2 600 €') | ||
| }) | ||
|
|
||
| it('should display values for the réduction générale', function () { | ||
| cy.contains('Montant mensuel').click() | ||
| cy.get(inputSelector).first().type('{selectall}1900') | ||
|
|
||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale-value"]' | ||
| ).should('include.text', '494 €') | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_retraite-value"]' | ||
| ).should('include.text', '93 €') | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_Urssaf-value"]' | ||
| ).should('include.text', '401 €') | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_Urssaf___part_chômage-value"]' | ||
| ).should('include.text', '63 €') | ||
|
|
||
| cy.contains('Plus de 50 salariés').click() | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale-value"]' | ||
| ).should('include.text', '500 €') | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_retraite-value"]' | ||
| ).should('include.text', '93 €') | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_Urssaf-value"]' | ||
| ).should('include.text', '407 €') | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_Urssaf___part_chômage-value"]' | ||
| ).should('include.text', '63 €') | ||
| }) | ||
|
|
||
| it('should display a warning for a salary too high', function () { | ||
| cy.contains('Montant mensuel').click() | ||
| cy.get(inputSelector).first().type('{selectall}3000') | ||
|
|
||
| cy.get('div[id="simulator-legend"]').should( | ||
| 'include.text', | ||
| 'La RGCP concerne uniquement les salaires inférieurs à 1,6 SMIC.' | ||
| ) | ||
|
|
||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_retraite-value"]' | ||
| ).should('include.text', '0 €') | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_Urssaf-value"]' | ||
| ).should('include.text', '0 €') | ||
| cy.get( | ||
| 'p[id="salarié___cotisations___exonérations___réduction_générale___part_Urssaf___part_chômage-value"]' | ||
| ).should('include.text', '0 €') | ||
| }) | ||
|
|
||
| it('should be RGAA compliant', function () { | ||
| checkA11Y() | ||
| }) | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
133 changes: 133 additions & 0 deletions
133
site/source/pages/simulateurs/reduction-generale/RéductionGénérale.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,133 @@ | ||
| import { DottedName } from 'modele-social' | ||
| import { useEffect, useState } from 'react' | ||
| import { Trans, useTranslation } from 'react-i18next' | ||
| import { useDispatch } from 'react-redux' | ||
| import { styled } from 'styled-components' | ||
|
|
||
| import { Condition } from '@/components/EngineValue/Condition' | ||
| import PeriodSwitch from '@/components/PeriodSwitch' | ||
| import { SelectSimulationYear } from '@/components/SelectSimulationYear' | ||
| import SimulateurWarning from '@/components/SimulateurWarning' | ||
| import Simulation, { | ||
| SimulationGoal, | ||
| SimulationGoals, | ||
| } from '@/components/Simulation' | ||
| import { SimulationValue } from '@/components/Simulation/SimulationValue' | ||
| import { useEngine } from '@/components/utils/EngineContext' | ||
| import { Message, Radio, ToggleGroup } from '@/design-system' | ||
| import { Spacing } from '@/design-system/layout' | ||
| import { Li, Ul } from '@/design-system/typography/list' | ||
| import { Body } from '@/design-system/typography/paragraphs' | ||
| import { updateSituation } from '@/store/actions/actions' | ||
|
|
||
| export default function RéductionGénéraleSimulation() { | ||
| return ( | ||
| <> | ||
| <Simulation afterQuestionsSlot={<SelectSimulationYear />}> | ||
| <SimulateurWarning simulateur="réduction-générale" /> | ||
| <RéductionGénéraleSimulationGoals | ||
| legend="Salaire brut du salarié et réduction générale applicable" | ||
| toggles={ | ||
| <> | ||
| <EffectifSwitch /> | ||
| <PeriodSwitch /> | ||
| </> | ||
| } | ||
| /> | ||
| </Simulation> | ||
| </> | ||
| ) | ||
| } | ||
|
|
||
| function EffectifSwitch() { | ||
| const dispatch = useDispatch() | ||
| const engine = useEngine() | ||
| const dottedName = 'entreprise . salariés . effectif' as DottedName | ||
| const engineEffectif = engine.evaluate(dottedName).nodeValue as string | ||
| const [currentEffectif, setCurrentEffectif] = useState(engineEffectif) | ||
| const { t } = useTranslation() | ||
|
|
||
| useEffect(() => { | ||
| const effectif = parseInt(engineEffectif) > 49 ? '100' : '10' | ||
| setCurrentEffectif(effectif) | ||
| }, [currentEffectif, engineEffectif]) | ||
|
|
||
| return ( | ||
| <ToggleGroup | ||
| value={currentEffectif} | ||
| onChange={(value) => { | ||
| setCurrentEffectif(value) | ||
| dispatch(updateSituation(dottedName, `'${value}'`)) | ||
| }} | ||
| aria-label={t("Effectif de l'entreprise")} | ||
| > | ||
| <Radio value="10"> | ||
| <Trans>Moins de 50 salariés</Trans> | ||
| </Radio> | ||
| <Radio value="100"> | ||
| <Trans>Plus de 50 salariés</Trans> | ||
| </Radio> | ||
| </ToggleGroup> | ||
| ) | ||
| } | ||
| const StyledUl = styled(Ul)` | ||
| margin-top: 0; | ||
| ` | ||
| const StyledLi = styled(Li)` | ||
| &::before { | ||
| margin-top: ${({ theme }) => theme.spacings.sm}; | ||
| } | ||
| ` | ||
| function RéductionGénéraleSimulationGoals({ | ||
| toggles = <PeriodSwitch />, | ||
| legend, | ||
| }: { | ||
| toggles?: React.ReactNode | ||
| legend: string | ||
| }) { | ||
| return ( | ||
| <SimulationGoals toggles={toggles} legend={legend}> | ||
| <SimulationGoal dottedName="salarié . contrat . salaire brut" /> | ||
|
|
||
| <Condition expression="salarié . cotisations . exonérations . réduction générale = 0"> | ||
| <Message type="info"> | ||
| <Body> | ||
| <Trans> | ||
| La RGCP concerne uniquement les salaires inférieurs à 1,6 SMIC. | ||
| C'est-à-dire, pour 2024, une rémunération totale qui ne dépasse | ||
| pas <strong>2 827,07 €</strong> bruts par mois. | ||
| </Trans> | ||
| </Body> | ||
| </Message> | ||
| </Condition> | ||
| <Condition expression="salarié . cotisations . exonérations . réduction générale"> | ||
| <Body> | ||
| <SimulationValue dottedName="salarié . cotisations . exonérations . réduction générale" isInfoMode={true} /> | ||
| <Spacing md /> | ||
| <StyledUl> | ||
| <StyledLi> | ||
| <SimulationValue | ||
| dottedName={ | ||
| 'salarié . cotisations . exonérations . réduction générale . part retraite' | ||
| } | ||
| /> | ||
| </StyledLi> | ||
| <StyledLi> | ||
| <SimulationValue | ||
| dottedName={ | ||
| 'salarié . cotisations . exonérations . réduction générale . part Urssaf' | ||
| } | ||
| /> | ||
| <SimulationValue | ||
| dottedName={ | ||
| 'salarié . cotisations . exonérations . réduction générale . part Urssaf . part chômage' | ||
| } | ||
| label="dont chômage" | ||
| /> | ||
| </StyledLi> | ||
| </StyledUl> | ||
| </Body> | ||
| </Condition> | ||
| </SimulationGoals> | ||
| ) | ||
| } |
Oops, something went wrong.