From 0a33071b8a8e649a2ad60892511dd0a3f9ea14c6 Mon Sep 17 00:00:00 2001 From: Johan Girod Date: Tue, 29 Sep 2020 15:16:42 +0200 Subject: [PATCH] =?UTF-8?q?Revert=20"R=C3=A9organisation=20de=20la=20page?= =?UTF-8?q?=20/simulateur"?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../mon-entreprise/demande-mobilité.js | 8 +- .../integration/mon-entreprise/gérer.js | 2 +- mon-entreprise/scripts/fetch-stats.js | 22 +- .../source/components/MoreInfosOnUs.tsx | 2 +- .../source/components/Notifications.tsx | 1 - .../SalaryExplanation.tsx | 0 .../source/components/SchemeComparaison.tsx | 2 +- .../source/components/Simulation.tsx | 22 +- .../source/components/StackedBarChart.tsx | 1 + .../simulationConfigs}/artiste-auteur.yaml | 0 .../simulationConfigs/assimilé.yaml} | 0 .../simulationConfigs}/auto-entrepreneur.yaml | 0 .../simulationConfigs}/chômage-partiel.yaml | 0 .../simulationConfigs}/indépendant.yaml | 0 .../profession-libérale.yaml | 0 .../rémunération-dirigeant.yaml | 0 .../simulationConfigs}/salarié.yaml | 0 .../AutoEntrepreneurExplanation.tsx | 47 -- .../IndépendantExplanation.tsx | 34 - mon-entreprise/source/components/ui/Card.css | 61 +- mon-entreprise/source/components/ui/index.css | 5 - mon-entreprise/source/locales/rules-en.yaml | 20 +- mon-entreprise/source/locales/ui-en.yaml | 261 ++---- mon-entreprise/source/rules/dirigeant.yaml | 8 - .../source/rules/profession-libérale.yaml | 55 +- .../iframe-integration-script.js | 2 +- .../pages/Créer/CreationChecklist.tsx | 65 +- .../mon-entreprise.fr/pages/Créer/Home.tsx | 17 +- .../pages/Dev/IntegrationTest.tsx | 25 +- .../AideDéclarationIndépendant/index.tsx | 2 +- .../pages/Gérer/DemandeMobilite/index.tsx | 2 +- .../mon-entreprise.fr/pages/Gérer/Home.tsx | 35 +- .../pages/Iframes/SimulateurEmbauche.tsx | 16 + .../mon-entreprise.fr/pages/Iframes/index.tsx | 61 +- .../pages/Landing/Landing.css | 13 +- .../pages/Landing/Landing.tsx | 14 +- .../pages/Simulateurs/ArtisteAuteur.tsx | 18 +- .../pages/Simulateurs/AutoEntrepreneur.tsx | 172 ++++ .../pages/Simulateurs/ChômagePartiel.tsx | 93 ++- .../pages/Simulateurs/Home.tsx | 244 +++--- .../pages/Simulateurs/Indépendant.tsx | 76 ++ .../Simulateurs/IndépendantSimulation.tsx | 12 - .../pages/Simulateurs/Page.tsx | 34 - .../pages/Simulateurs/ProfessionLibérale.tsx | 135 ++++ .../pages/Simulateurs/RémunérationSASU.tsx | 98 +++ .../pages/Simulateurs/Salarié.tsx | 168 ++++ .../pages/Simulateurs/SalariéSimulation.tsx | 46 -- .../pages/Simulateurs/SchemeComparaison.tsx | 23 + .../images/illustration-simulateur.svg | 1 - .../pages/Simulateurs/index.tsx | 59 +- .../pages/Simulateurs/metadata.tsx | 745 ------------------ .../ActivitésSelection.tsx | 16 +- .../mon-entreprise.fr/pages/Stats/Stats.tsx | 12 +- .../pages/integration/Iframe.tsx | 12 +- .../pages/integration/index.tsx | 15 +- .../sites/mon-entreprise.fr/sitePaths.ts | 15 +- .../__snapshots__/simulations.jest.js.snap | 40 +- .../test/regressions/simulations.jest.js | 10 +- 58 files changed, 1301 insertions(+), 1546 deletions(-) rename mon-entreprise/source/components/{simulationExplanation => }/SalaryExplanation.tsx (100%) rename mon-entreprise/source/{sites/mon-entreprise.fr/pages/Simulateurs/configs => components/simulationConfigs}/artiste-auteur.yaml (100%) rename mon-entreprise/source/{sites/mon-entreprise.fr/pages/Simulateurs/configs/dirigeant-sasu.yaml => components/simulationConfigs/assimilé.yaml} (100%) rename mon-entreprise/source/{sites/mon-entreprise.fr/pages/Simulateurs/configs => components/simulationConfigs}/auto-entrepreneur.yaml (100%) rename mon-entreprise/source/{sites/mon-entreprise.fr/pages/Simulateurs/configs => components/simulationConfigs}/chômage-partiel.yaml (100%) rename mon-entreprise/source/{sites/mon-entreprise.fr/pages/Simulateurs/configs => components/simulationConfigs}/indépendant.yaml (100%) rename mon-entreprise/source/{sites/mon-entreprise.fr/pages/Simulateurs/configs => components/simulationConfigs}/profession-libérale.yaml (100%) rename mon-entreprise/source/{sites/mon-entreprise.fr/pages/Simulateurs/configs => components/simulationConfigs}/rémunération-dirigeant.yaml (100%) rename mon-entreprise/source/{sites/mon-entreprise.fr/pages/Simulateurs/configs => components/simulationConfigs}/salarié.yaml (100%) delete mode 100644 mon-entreprise/source/components/simulationExplanation/AutoEntrepreneurExplanation.tsx delete mode 100644 mon-entreprise/source/components/simulationExplanation/IndépendantExplanation.tsx create mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Iframes/SimulateurEmbauche.tsx create mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/AutoEntrepreneur.tsx create mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Indépendant.tsx delete mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/IndépendantSimulation.tsx delete mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Page.tsx create mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ProfessionLibérale.tsx create mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/RémunérationSASU.tsx create mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Salarié.tsx delete mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/SalariéSimulation.tsx delete mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/images/illustration-simulateur.svg delete mode 100644 mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/metadata.tsx diff --git a/mon-entreprise/cypress/integration/mon-entreprise/demande-mobilité.js b/mon-entreprise/cypress/integration/mon-entreprise/demande-mobilité.js index 54d4b3919..dacd78f54 100644 --- a/mon-entreprise/cypress/integration/mon-entreprise/demande-mobilité.js +++ b/mon-entreprise/cypress/integration/mon-entreprise/demande-mobilité.js @@ -25,13 +25,13 @@ describe('Formulaire demande mobilité', function() { .type('1991-07-25') .tab() .type('Pouts') - .wait(1500) + .wait(1000) .type('{enter}') .tab() .type('3 rue de la Rhumerie') .tab() .type('Brest') - .wait(1500) + .wait(1000) .type('{enter}') .tab() .type('jean.deaux@gmail.com') @@ -46,7 +46,7 @@ describe('Formulaire demande mobilité', function() { .type('14 chemin des Docks') .tab() .type('Bre') - .wait(1500) + .wait(1000) cy.contains('29240').click() cy.contains('Organisme Urssaf').click() cy.focused() @@ -67,7 +67,7 @@ describe('Formulaire demande mobilité', function() { .next() .click() cy.get('label[for="détachement . pays"]') - .wait(1500) + .wait(1000) .click() cy.focused() .select('Irlande') diff --git a/mon-entreprise/cypress/integration/mon-entreprise/gérer.js b/mon-entreprise/cypress/integration/mon-entreprise/gérer.js index f117c35d2..1dd99fb36 100644 --- a/mon-entreprise/cypress/integration/mon-entreprise/gérer.js +++ b/mon-entreprise/cypress/integration/mon-entreprise/gérer.js @@ -37,6 +37,6 @@ describe('Manage page test', function() { }) it('should be able to navigate to the hiring simulator', function() { cy.contains(fr ? 'une embauche' : 'hiring').click() - cy.contains(fr ? 'salarié' : 'employee') + cy.contains(fr ? 'salarié' : 'employees') }) }) diff --git a/mon-entreprise/scripts/fetch-stats.js b/mon-entreprise/scripts/fetch-stats.js index ce45c6f65..79fc305ce 100644 --- a/mon-entreprise/scripts/fetch-stats.js +++ b/mon-entreprise/scripts/fetch-stats.js @@ -125,8 +125,7 @@ async function fetchSimulators(dt) { '/comparaison-régimes-sociaux', '/dirigeant-sasu', '/aide-declaration-independants', - '/demande-mobilité', - '/économie-collaborative' + '/demande-mobilité' ].includes(label) ) @@ -156,13 +155,9 @@ async function fetchSimulators(dt) { const dataIframes = await responseIframes.json() const resultIframes = dataIframes.filter(x => [ - '/simulateur-embauche', - '/simulateur-autoentrepreneur', - '/simulateur-assimilesalarie', - '/simulateur-artiste-auteur', - '/simulateur-independant', - '/demande-mobilite' - ].some(path => x.label.startsWith(path)) + '/simulateur-embauche?couleur=', + '/simulateur-autoentrepreneur?couleur=' + ].includes(x.label) ) const groupSimulateursIframesVisits = ({ label }) => @@ -173,15 +168,8 @@ async function fetchSimulators(dt) { ? '/salaire-brut-net' : label.startsWith('/simulateur-autoentrepreneur') ? '/auto-entrepreneur' - : label.startsWith('/assimilé-salarié') || - label.startsWith('/simulateur-assimilesalarie') + : label.startsWith('/assimilé-salarié') ? '/dirigeant-sasu' - : label.startsWith('/simulateur-independant') - ? '/indépendant' - : label.startsWith('/simulateur-artiste-auteur') - ? '/artiste-auteur' - : label.startsWith('/demande-mobilite') - ? '/demande-mobilité' : label const sumVisits = (acc, { nb_visits }) => acc + nb_visits diff --git a/mon-entreprise/source/components/MoreInfosOnUs.tsx b/mon-entreprise/source/components/MoreInfosOnUs.tsx index 7cf2f35ca..c7f241ae2 100644 --- a/mon-entreprise/source/components/MoreInfosOnUs.tsx +++ b/mon-entreprise/source/components/MoreInfosOnUs.tsx @@ -16,7 +16,7 @@ export default function MoreInfosOnUs() { return (
engine.evaluate(n.dottedName))) const inversionFail = useInversionFail() const hiddenNotifications = useSelector( diff --git a/mon-entreprise/source/components/simulationExplanation/SalaryExplanation.tsx b/mon-entreprise/source/components/SalaryExplanation.tsx similarity index 100% rename from mon-entreprise/source/components/simulationExplanation/SalaryExplanation.tsx rename to mon-entreprise/source/components/SalaryExplanation.tsx diff --git a/mon-entreprise/source/components/SchemeComparaison.tsx b/mon-entreprise/source/components/SchemeComparaison.tsx index e8de1335b..a03a35c8f 100644 --- a/mon-entreprise/source/components/SchemeComparaison.tsx +++ b/mon-entreprise/source/components/SchemeComparaison.tsx @@ -7,7 +7,7 @@ import classnames from 'classnames' import Conversation from 'Components/conversation/Conversation' import SeeAnswersButton from 'Components/conversation/SeeAnswersButton' import Value from 'Components/EngineValue' -import dirigeantComparaison from '../sites/mon-entreprise.fr/pages/Simulateurs/configs/rémunération-dirigeant.yaml' +import dirigeantComparaison from 'Components/simulationConfigs/rémunération-dirigeant.yaml' import Engine from 'publicodes' import revenusSVG from 'Images/revenus.svg' import { diff --git a/mon-entreprise/source/components/Simulation.tsx b/mon-entreprise/source/components/Simulation.tsx index f5a0c7b9e..3e6676669 100644 --- a/mon-entreprise/source/components/Simulation.tsx +++ b/mon-entreprise/source/components/Simulation.tsx @@ -1,20 +1,24 @@ +import { setSimulationConfig } from 'Actions/actions' +import Notifications from 'Components/Notifications' import Conversation, { ConversationProps } from 'Components/conversation/Conversation' import SeeAnswersButton from 'Components/conversation/SeeAnswersButton' import PageFeedback from 'Components/Feedback/PageFeedback' -import Notifications from 'Components/Notifications' import SearchButton from 'Components/SearchButton' import TargetSelection from 'Components/TargetSelection' +import { useSimulationProgress } from 'Components/utils/useNextQuestion' +import React, { useEffect } from 'react' +import { Trans } from 'react-i18next' +import { useDispatch, useSelector } from 'react-redux' +import { useLocation } from 'react-router' +import { SimulationConfig } from 'Reducers/rootReducer' +import { firstStepCompletedSelector } from 'Selectors/simulationSelectors' import * as Animate from 'Components/ui/animate' import Progress from 'Components/ui/Progress' -import { useSimulationProgress } from 'Components/utils/useNextQuestion' -import React from 'react' -import { Trans } from 'react-i18next' -import { useSelector } from 'react-redux' -import { firstStepCompletedSelector } from 'Selectors/simulationSelectors' type SimulationProps = { + config: SimulationConfig explanations?: React.ReactNode results?: React.ReactNode customEndMessages?: ConversationProps['customEndMessages'] @@ -22,11 +26,17 @@ type SimulationProps = { } export default function Simulation({ + config, explanations, results, customEndMessages, showPeriodSwitch }: SimulationProps) { + const dispatch = useDispatch() + const location = useLocation<{ fromGérer?: boolean }>() + useEffect(() => { + dispatch(setSimulationConfig(config, location.state?.fromGérer)) + }, [config]) const firstStepCompleted = useSelector(firstStepCompletedSelector) return ( <> diff --git a/mon-entreprise/source/components/StackedBarChart.tsx b/mon-entreprise/source/components/StackedBarChart.tsx index 10cf9947e..967289eca 100644 --- a/mon-entreprise/source/components/StackedBarChart.tsx +++ b/mon-entreprise/source/components/StackedBarChart.tsx @@ -5,6 +5,7 @@ import React from 'react' import { animated, useSpring } from 'react-spring' import { DottedName } from 'Rules' import styled from 'styled-components' +import { capitalise0 } from '../utils' const BarStack = styled.div` display: flex; diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/artiste-auteur.yaml b/mon-entreprise/source/components/simulationConfigs/artiste-auteur.yaml similarity index 100% rename from mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/artiste-auteur.yaml rename to mon-entreprise/source/components/simulationConfigs/artiste-auteur.yaml diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/dirigeant-sasu.yaml b/mon-entreprise/source/components/simulationConfigs/assimilé.yaml similarity index 100% rename from mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/dirigeant-sasu.yaml rename to mon-entreprise/source/components/simulationConfigs/assimilé.yaml diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/auto-entrepreneur.yaml b/mon-entreprise/source/components/simulationConfigs/auto-entrepreneur.yaml similarity index 100% rename from mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/auto-entrepreneur.yaml rename to mon-entreprise/source/components/simulationConfigs/auto-entrepreneur.yaml diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/chômage-partiel.yaml b/mon-entreprise/source/components/simulationConfigs/chômage-partiel.yaml similarity index 100% rename from mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/chômage-partiel.yaml rename to mon-entreprise/source/components/simulationConfigs/chômage-partiel.yaml diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/indépendant.yaml b/mon-entreprise/source/components/simulationConfigs/indépendant.yaml similarity index 100% rename from mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/indépendant.yaml rename to mon-entreprise/source/components/simulationConfigs/indépendant.yaml diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/profession-libérale.yaml b/mon-entreprise/source/components/simulationConfigs/profession-libérale.yaml similarity index 100% rename from mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/profession-libérale.yaml rename to mon-entreprise/source/components/simulationConfigs/profession-libérale.yaml diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/rémunération-dirigeant.yaml b/mon-entreprise/source/components/simulationConfigs/rémunération-dirigeant.yaml similarity index 100% rename from mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/rémunération-dirigeant.yaml rename to mon-entreprise/source/components/simulationConfigs/rémunération-dirigeant.yaml diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/salarié.yaml b/mon-entreprise/source/components/simulationConfigs/salarié.yaml similarity index 100% rename from mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/configs/salarié.yaml rename to mon-entreprise/source/components/simulationConfigs/salarié.yaml diff --git a/mon-entreprise/source/components/simulationExplanation/AutoEntrepreneurExplanation.tsx b/mon-entreprise/source/components/simulationExplanation/AutoEntrepreneurExplanation.tsx deleted file mode 100644 index 539f60331..000000000 --- a/mon-entreprise/source/components/simulationExplanation/AutoEntrepreneurExplanation.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import StackedBarChart from 'Components/StackedBarChart' -import { ThemeColorsContext } from 'Components/utils/colors' -import { EngineContext } from 'Components/utils/EngineContext' -import { default as React, useContext } from 'react' -import { Trans, useTranslation } from 'react-i18next' -import { useSelector } from 'react-redux' -import { targetUnitSelector } from 'Selectors/simulationSelectors' - -export default function AutoEntrepreneurExplanation() { - const engine = useContext(EngineContext) - const { t } = useTranslation() - const { palettes } = useContext(ThemeColorsContext) - const targetUnit = useSelector(targetUnitSelector) - const impôt = engine.evaluate('impôt', { unit: targetUnit }) - - return ( -
-

- Répartition du chiffre d'affaires -

- -
- ) -} diff --git a/mon-entreprise/source/components/simulationExplanation/IndépendantExplanation.tsx b/mon-entreprise/source/components/simulationExplanation/IndépendantExplanation.tsx deleted file mode 100644 index ca838e994..000000000 --- a/mon-entreprise/source/components/simulationExplanation/IndépendantExplanation.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import StackedBarChart from 'Components/StackedBarChart' -import { ThemeColorsContext } from 'Components/utils/colors' -import { EngineContext } from 'Components/utils/EngineContext' -import { default as React, useContext } from 'react' -import { useTranslation } from 'react-i18next' - -export default function IndépendantExplanation() { - const engine = useContext(EngineContext) - const { t } = useTranslation() - const { palettes } = useContext(ThemeColorsContext) - - return ( -
-

Répartition de la rémunération totale

- -
- ) -} diff --git a/mon-entreprise/source/components/ui/Card.css b/mon-entreprise/source/components/ui/Card.css index 8bb5a8470..8bdd3737c 100644 --- a/mon-entreprise/source/components/ui/Card.css +++ b/mon-entreprise/source/components/ui/Card.css @@ -93,27 +93,30 @@ } .ui__.card.box { + min-width: 14.333rem; flex: 0.3; - max-width: 18rem; + max-width: 17rem; display: flex; flex-direction: column; text-align: center; - margin: 0.6rem; - padding: 1rem; + + margin: 1rem; + padding-top: 1rem; + padding-bottom: 1rem; text-decoration: none; align-items: center; color: inherit; font-size: inherit !important; } - .ui__.card.box .ui__.box-icon > img { - margin: 0.4rem !important; + margin: 0.8rem !important; + transform: scale(1.5) translateY(0.1rem); +} +.ui__.card.box:active .ui__.box-icon > img { transform: scale(1.5) translateY(0.1rem); } - .ui__.card.box .ui__.big.box-icon > img { transform: scale(2.3) translateY(0.2rem); - margin: 0.6rem !important; } .ui__.card.box.inverted-colors { @@ -124,49 +127,9 @@ color: #f3f3f3; } -.ui__.box-container { - display: grid; - justify-items: stretch; -} -.ui__.box-container:not(.full-width) { - margin: 0 -0.6rem; -} -.ui__.small.box-container { - grid-template-columns: repeat(2, 1fr); -} -@media (max-width: 400px) { +@media (max-width: 500px) { .ui__.card.box { max-width: 100%; - } -} - -@media (min-width: 400px) { - .ui__.small.box-container { - grid-template-columns: repeat(3, 1fr); - } - .ui__.box-container { - grid-template-columns: repeat(2, 1fr); - } -} - -@media (min-width: 700px) { - .ui__.small.box-container { - grid-template-columns: repeat(4, 1fr); - } - .ui__.box-container { - grid-template-columns: repeat(3, 1fr); - } -} - -@media (min-width: 1000px) { - .ui__.full-width.small.box-container { - grid-template-columns: repeat(5, auto); - } - .ui__.full-width.box-container { - --padding: calc((100vw - 1300px) / 2); - grid-template-columns: repeat(4, auto); - padding-right: var(--padding); - padding-left: var(--padding); - justify-content: center; + flex: 1; } } diff --git a/mon-entreprise/source/components/ui/index.css b/mon-entreprise/source/components/ui/index.css index 23b6876d6..fba42ebae 100644 --- a/mon-entreprise/source/components/ui/index.css +++ b/mon-entreprise/source/components/ui/index.css @@ -82,11 +82,6 @@ blockquote { color: #f3f3f3; } -.ui__.light-border { - border: 4px solid var(--lighterColor); - border-radius: 0.3rem; -} - .ui__.center-flex { display: flex; justify-content: center; diff --git a/mon-entreprise/source/locales/rules-en.yaml b/mon-entreprise/source/locales/rules-en.yaml index 4899cd41e..e63ec15bd 100644 --- a/mon-entreprise/source/locales/rules-en.yaml +++ b/mon-entreprise/source/locales/rules-en.yaml @@ -3787,18 +3787,6 @@ dirigeant . auto-entrepreneur . net de cotisations: résumé.fr: Avant impôt titre.en: Net contribution income titre.fr: Revenu net de cotisations -dirigeant . auto-entrepreneur . notification valeur annuelle: - description.en: > - [automatic] The ACRE rate used is the one corresponding to the current - month. The - - simulator does not yet take into account the overlap of 2 periods - - of an acre in a single year. - description.fr: | - Le taux ACRE utilisé est celui correspondant au mois courant. Le - simulateur ne prends pas encore en compte le chevauchement de 2 période - d'acre sur une meme année. dirigeant . auto-entrepreneur . plafond: description.en: > The status of microentrepreneur applies as long as the annual turnover @@ -3954,18 +3942,12 @@ dirigeant . indépendant . PL . CARCDSF . chirurgien-dentiste . exonération PCV de cotisation pour la prestation complémentaire de vieillesse (PCV) si vous en faites la demande. [En savoir plus](http://www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations) -? dirigeant . indépendant . PL . CARCDSF . chirurgien-dentiste . prix d'une consultation +? dirigeant . indépendant . PL . CARCDSF . chirurgien-dentiste . exonération PCV . prix d'une consultation : titre.en: '[automatic] consulting fee' titre.fr: prix d'une consultation dirigeant . indépendant . PL . CARCDSF . retraite complémentaire: titre.en: '[automatic] supplementary pension (CARCDSF)' titre.fr: retraite complémentaire (CARCDSF) -? dirigeant . indépendant . PL . CARCDSF . retraite complémentaire . cotisation forfaitaire -: titre.en: '[automatic] flat-rate contribution' - titre.fr: cotisation forfaitaire -? dirigeant . indépendant . PL . CARCDSF . retraite complémentaire . cotisation proportionnelle -: titre.en: '[automatic] proportional contribution' - titre.fr: cotisation proportionnelle ? dirigeant . indépendant . PL . CARCDSF . retraite complémentaire . réduction de la cotisation forfaitaire : description.en: > [automatic] You have the possibility of benefiting from a contribution diff --git a/mon-entreprise/source/locales/ui-en.yaml b/mon-entreprise/source/locales/ui-en.yaml index 4da144e75..7a2dc1c12 100644 --- a/mon-entreprise/source/locales/ui-en.yaml +++ b/mon-entreprise/source/locales/ui-en.yaml @@ -17,7 +17,6 @@ Au-dessus de: Above Aucun résultat: No result$ Auto-entrepreneur: Auto-entrepreneur Auto-entrepreneur en EIRL: Auto-entrepreneur with EIRL option -Autres outils: Other tools Avec chômage partiel: With partial unemployment Calcul: Formula Cette commune n'existe pas: This commune does not exist @@ -78,7 +77,6 @@ International: International Intégrer l'interface de simulation: Integrate the simulation interface Intégrer la bibliothèque de calcul: Integrate the calculation library Intégrer nos simulateurs: Integrate our simulators -Intégrer un simulateur: Integrating a simulator J'ai compris: understood Janvier 2019: January 2019 La somme de: This rule is the sum of @@ -96,7 +94,6 @@ Nous n'avons rien trouvé: We didn't find any matching registered company. Oui: Yes Outils pour les développeurs: Tools for developers Pages associées: Related pages -Par statut: By status Part du salaire net maintenue: Share of net salary maintained Part employeur: Employer share Part salariale: Employee share @@ -112,7 +109,6 @@ Plus d'informations: More information (fr) Plusieurs associés: Several partners Prise en charge du revenu net avec chômage partiel: Net income support with short-time working Prochaines questions: Next questions -Professionnels de santé: Health Care Professionals Protection sociale: Social security Précédent: Previous Prévisualisation: Preview @@ -147,7 +143,6 @@ Salaire: Salary Salaire net: Net Salary Salaire net et brut: Net and gross salary Salarié: Employee -Salariés et employeurs: Employees and employers Sans responsabilité limitée: Without limited liability Si: If Simulateur de salaire: Employee salary simulation @@ -814,13 +809,6 @@ oui: yes page: documentation: title: Documentation - simulateurs: - accueil: - description: <0>All the simulators on this site are :<1><0><0>Maintained - up to date with the latest legislative - developments<1><0>Continuously improved to increase the number - of devices considered<2><0>Easily and freely integrates on any - website. <3>Learn more about it. pages: common: ressources-auto-entrepreneur: @@ -910,31 +898,7 @@ pages: attribute <1>data-lang="en" allows you to choose English as the simulator language. module: What module? - gérer: - aide-déclaration-indépendant: - meta: - description: Easily calculate the amount of payroll taxes to report on your 2019 - income tax return. - title: 'Self-employed tax return: calculation of the amount of contributions' - shortname: Income tax return assistance - title: Help with your 2019 income tax return - demande-mobilité: - meta: - description: Interactive form to be completed for self-employed persons wishing - to carry out their activity in other European countries - title: 'Self-employed: demand for mobility in Europe' - shortname: Demand for mobility in Europe simulateurs: - accueil: - header: All the simulators on this site are kept up to date with the latest - legislative developments. - titre: Simulators available - artiste-auteur: - meta: - description: Estimate social contributions on copyright and BNC income - title: 'Artist-author: calculation of URSSAF membership fees' - shortname: Artist-author - title: Estimate my artist/author dues auto-entrepreneur: meta: description: Calculation of your income based on turnover, after deduction of @@ -973,15 +937,7 @@ pages: account the actual expenses incurred in the activity.<9><0> <2>See details of the calculation of the income allowance for an auto-entrepreneur<10>Useful resources<11><0>''' - shortname: Auto-entrepreneur - title: Self-entrepreneur Income Simulator titre: Auto-entrepreneur income simulator - auxiliaire: - shortname: Medical Axiliary - title: Income simulator for a private medical assistant - chirurgien-dentiste: - shortname: Dental surgeon - title: Income simulator for a private dental surgeon chômage-partiel: explications seo: >- [👨 Integrate this simulator on your @@ -1026,45 +982,6 @@ pages: ogTitle: 'Short-time working simulator: find out the impact on the net salaried income and the total employer cost.' titre: Calculation of the short-time working allowance in France - seo: <0>How is the partial activity allowance calculated?<1>The basic - partial activity allowance is fixed by law at <2>70% of gross - salary. It is prorated according to the number of hours off work. For an - employee at € 2300 gross monthly, who works 50% of his usual time, this - gives <5>€ 2300 × 50% × 70% = € 805.<2>In addition to this basic - allowance, there is a supplementary allowance for salaries close to the - minimum wage. This additional allowance is paid when the combined - remuneration and basic allowance are below a net SMIC. These allowances - are paid by the employer, who will then be reimbursed in part or in full - by the State.<3>👉 <2>See the details of the calculation of the - allowance<4> How to calculate the part reimbursed by the - State?<5>The State covers part of the partial compensation for wages - up to **4.5 SMIC**, with a minimum of €8.03 per unemployed hour. In - concrete terms, this results in 100% coverage for salaries close to the - SMIC. This gradually decreases until it stabilizes at **93%** for wages - <3>between €2,000 and €7,000 (wage corresponding to the limit of 4.5 - SMIC).<6>👉 <2>See details of the calculation of the reimbursement - of the allowance<7> How to report a partial activity?<8>In - response to the coronavirus crisis, the conditions for partial - employment have been eased. The employer is allowed to place his - employees in partial activity before the official application is filed. - The employee then has a period of <2>30 days to comply with the - regulations. Benefits will be paid retroactively from the date of the - partial unemployment.<9>👉 <2>Applying for partial unemployment - benefit<10> What social security contributions must be paid for the - partial activity allowance?<11>The partial activity allowance is - subject to the CSG/CRDS and to a sickness contribution in certain cases. - For more information, see the explanatory page on the <2>URSSAF - website. - shortname: Partial unemployment - title: 'Covid-19: Short-time work simulator' - comparaison: - meta: - description: Self-employed, self-employed or similarly employed? With this - comparison, find the plan that suits you best - title: 'Starting a business: a comparison of social schemes' - shortname: Status Comparison - title: 'Self-employed, assimilated employee or auto-entrepreneur: which plan to - choose?' dirigean sasu: explication seo: '<0>How to calculate the salary of a SASU executive? <1>As for a conventional employee, the SASU <1>manager pays social @@ -1084,26 +1001,6 @@ pages: this, simply enter the announced compensation in the total loaded box. The simulation can then be refined by answering the various questions.' - indépendant: - meta: - description: Calculation of net income after tax and contributions based on - turnover and vice versa - title: 'Independent: Urssaf income simulator' - shortname: Independent - title: Income simulator for the self-employed - médecin: - shortname: Doctor - title: Income simulator for private practitioners - profession-libérale: - meta: - description: Net Income Calculation for Self-Employed Persons in Liberal Income - Tax (IR, BNC) - title: 'Liberal professions: the Urssaf simulator' - shortname: Liberal profession - title: Professional Income Simulator - sage-femme: - shortname: Midwife - title: Income simulator for private midwives salarié: explication seo: <0>Calculate your net salary<1>During the job interview, the employer usually offers a "gross" remuneration. The announced amount @@ -1142,32 +1039,6 @@ pages: ogTitle: 'Gross, net, net after-tax salary, total cost: the ultimate simulator for employees and employers' titre: 'Gross / net salary: the Urssaf converter' - seo: <0>How is the net salary calculated?<1>At the job interview, the - employer usually proposes a "gross" remuneration. The amount announced - thus includes employee contributions, which are used to finance the - employee's social protection and which are deducted from the "net" - salary received by the employee.<2>You can use our simulator to - convert the <2>gross salary into net salary. Simply enter the - advertised remuneration in the gross salary box. The simulation can be - refined by answering the various questions (fixed-term contract, - executive status, overtime, part-time, meal vouchers, - etc.).<3><4>Moreover, since 2019,<1> income tax is deducted - at source. To do this, the Directorate General of Public Finance (DGFiP) - sends the employer the tax rate calculated from the employee's income - tax return. If this rate is unknown, for example in the first year of - employment, the employer uses the <4>neutral rate.<5>How to - calculate the cost of hiring?<6>If you are looking to hire, you can - calculate the total cost of your employee's remuneration, as well as the - corresponding employer and employee contribution amounts. This enables - you to define the remuneration level by knowing the overall amount of - expense this represents for your company.<7>In addition to the - salary, our simulator takes into account the calculation of benefits in - kind (telephone, company car, etc.), as well as the compulsory health - insurance.<8>There are <2>deferred hiring <2>aids which are - not all taken into account by our simulator, you can find them on <6>the - official portal. - shortname: Employee - title: Employee income simulator titre: Income simulator for employees sasu: meta: @@ -1176,31 +1047,7 @@ pages: net income after tax from the total allocated to your compensation. ogTitle: 'SASU executive compensation: a simulator to find out your net salary' titre: 'Head of SASU: Urssaf revenue simulator' - seo-explanation: '<0>How to calculate the salary of a SASU executive? <1>As - for a classic employee, the SASU <2>manager pays social security - contributions on the remuneration he pays himself. The contributions are - calculated in the same way as for the employee: they are broken down - into the employer and employee parts and are expressed as a percentage - of the gross salary.<2>The assimilated manager-employee does not pay - <2>unemployment contributions. Furthermore, they do not benefit from - the <5>general reduction in contributions or from the provisions of - the French Labour Code, such as <9>overtime or - bonuses.<3>However, the employee is entitled to the <2>ACRE - reduction at the start of employment, under certain - conditions.<4>You can use our simulator to calculate the <2>net - remuneration from a super-gross amount allocated to the executive''s - remuneration. To do this, simply enter the total amount allocated in the - "total charged" box. The simulation can then be refined by answering - the various questions.' - shortname: Head of SASU - title: Income simulator for SASU manager titre: Revenue simulator for SAS(U) executive - économie-collaborative: - meta: - description: Airbnb, Drivy, Blablacar, Leboncoin... Find out how to be in order - in your declarations - title: 'Online platform income tax return: interactive guide' - shortname: Collaborative Economy Guide par: per payslip: disclaimer: It takes into account national law but not union negotiated rules. @@ -1275,6 +1122,85 @@ selectionRégime: page: titre: Social scheme selection titre: Which social scheme would you like to explore? +simulateurs: + accueil: + description: >- + <0>All the simulators on this site are: + + <1><0>Maintained with the latest legislation <1>Continuously improved to increase the number of devices taken into account <2>Developed in partnership with the Urssaf (the contribution collector entity in France)<2> + titre: Available simulators + artiste-auteur: + titre: Estimate my artist/author contributions + assimilé-salarié: + explications: The equal or minority directors of SARL or the directors of SA and + SAS are considered as "assimilé salarié" and are subject to the general + regime. Consequently, the director has the same social protection as an + employee, apart from unemployment coverage. + page: + description: Estimate your income as a SASU or SAS director based on your + turnover. All contributions and income tax are taken into account. + Official URSSAF simulator + titre: Official salary simulator for SASU and SAS directors + titre: SAS and SASU directors income simulator + auto-entrepreneur: + page: + description: Estimate your income as an auto-entrepreneur based on your + turnover. All contributions and income tax are taken into account. + Official URSSAF simulator. + titre: Official income simulator for auto-entrepreneur + titre: Auto-entrepreneur income simulator + indépendant: + explication1: Our estimate takes into account the <1>actual contributions + due by the self-employed person. During the first year of his activity, he + will pay a reduced flat rate (a sum of around 1300€ / year for a craftsman + benefiting from ACRE)... but it will be regularized the following year + according to this real amount. + explication2: Unemployment and occupational accident insurance are not covered + by the Social Security for the self-employed. Retirement based on + professional income is generally lower. To be covered, the professional + may take out additional insurance. + page: + description: Estimate your income as a self-employed person based on your + turnover (for EI, EURL and SARL majority directors). All contributions + and income tax are taken into account. Official URSSAF simulator + titre: Official income simulator for self-employed person + titre: Self-employed income simulator + inversionFail: | + The amount entered results in an impossible result. This is due to a + threshold effect in the calculation of contributions. + + We invite you to try again by slightly modifying the amount entered (a few euros more for example). + profession-libérale: + page: + description: simulators.profession-liberal.page.description + titre: simulators.profession-liberal.page.title + titre: Income simulator for {professionName}. + précision: + bonne: Good accuracy + défaut: 'Refine the simulation by answering the following questions:' + faible: Low accuracy + moyenne: Medium accuracy + résumé: + aide-déclaration-revenu-indep: Easily calculate the amount of payroll taxes to + report on your 2019 income tax return. + artiste-auteur: Estimating the social security contributions of an artist or author + assimilé: | + Calculate the income of an officer of a minority SAS, SASU or SARL + auto: | + Calculate the income (or turnover) of an auto-entrepreneur + chômage-partiel: Simulate the net income paid to the employee, as well as the + total remaining cost to the company if the partial activity is used. + comparaison: > + Simulate the differences between the plans (contributions, retirement, + maternity, illness, etc.) + demande-mobilité: Application form for mobility in Europe for self-employed workers + indépendant: | + Calculate the income of a majority manager of EURL, EI, or SARL + salarié: > + Calculate the net, gross, or total salary of an employee, trainee, or + similar + économie-collaborative: A guide to know how to declare your income from online + platforms (AirBnb, leboncoin, blablacar, etc.). warning: artiste-auteur: This estimate is proposed for information only. It is based on the applicable regulatory elements and the elements that you have entered, @@ -1292,35 +1218,6 @@ selectionRégime: titre: Before starting... urssaf: The figures are indicative and do not replace the actual accounts of the Urssaf, impots.gouv.fr, etc -simulateurs: - inversionFail: >- - The amount entered results in an impossible result. This is due to a - threshold effect in the calculation of contributions. - - - We invite you to try again by slightly modifying the amount entered (a few euros more for example). - précision: - défaut: 'Refine the simulation by answering the questions:' - warning: - artiste-auteur: - '1': This estimate is provided for information purposes. It is based on the - applicable regulatory elements and the elements that you have entered, - but it does not take into account your entire situation. The actual - amount of your contributions may therefore be different. - '2': This simulator allows you to estimate the amount of your contributions for - the year 2020 based on your projected income. - auto-entrepreneur: ' Self-entrepreneurs cannot deduct their expenses from their - turnover. Therefore, <3>all costs related to the business must be - <3>netted out to obtain the income actually received.' - cfe: The simulator does not include the business property tax (CFE), which is - due from the second year of the fiscal year. Its amount varies greatly - depending on the company's turnover and domiciliation. <2>More - information. - plus: Read the details - sasu: Corporate income tax and dividend management are not yet implemented. - titre: Before we start... - urssaf: The calculations are indicative and are not a substitute for the actual - statements of URSSAF, impots.gouv.fr, or others. simulation-end: cta: Know the steps to take hiring: diff --git a/mon-entreprise/source/rules/dirigeant.yaml b/mon-entreprise/source/rules/dirigeant.yaml index 5b62f9dbd..83e39b887 100644 --- a/mon-entreprise/source/rules/dirigeant.yaml +++ b/mon-entreprise/source/rules/dirigeant.yaml @@ -311,14 +311,6 @@ dirigeant . auto-entrepreneur . cotisations et contributions . cotisations . tau dirigeant . auto-entrepreneur . cotisations et contributions . cotisations . plafond ACRE: formule: plafond sécurité sociale temps plein / impôt . abattement . taux inversé -dirigeant . auto-entrepreneur . notification valeur annuelle: - applicable si: entreprise . ACRE - type: notification - description: | - Le taux ACRE utilisé est celui correspondant au mois courant. Le - simulateur ne prends pas encore en compte le chevauchement de 2 période - d'acre sur une meme année. - dirigeant . auto-entrepreneur . impôt: dirigeant . auto-entrepreneur . impôt . abattement: diff --git a/mon-entreprise/source/rules/profession-libérale.yaml b/mon-entreprise/source/rules/profession-libérale.yaml index 8e008a60a..9d489e010 100644 --- a/mon-entreprise/source/rules/profession-libérale.yaml +++ b/mon-entreprise/source/rules/profession-libérale.yaml @@ -317,8 +317,6 @@ dirigeant . indépendant . PL . PAMC: - conjoint collaborateur - entreprise . franchise de TVA - dirigeant . indépendant . revenus étrangers - - dirigeant . indépendant . cotisations et contributions . exonération de cotisations minimales - - dirigeant . indépendant . cotisations et contributions . maladie domiciliation fiscale étranger formule: oui dirigeant . indépendant . PL . PAMC . proportion recette activité non conventionnée: @@ -663,36 +661,28 @@ dirigeant . indépendant . PL . CARCDSF: - métier = 'santé . chirurgien-dentiste' - métier = 'santé . sage-femme' références: - Site CARMF: http://www.carcdsf.fr + Site CARMF: https://www.carcdsf.fr dirigeant . indépendant . PL . CARCDSF . retraite complémentaire: titre: retraite complémentaire (CARCDSF) remplace: cotisations et contributions . retraite complémentaire formule: somme: - - cotisation forfaitaire - - cotisation proportionnelle + - produit: + assiette: 2960.40 €/an + taux: réduction de la cotisation forfaitaire + arrondi: oui + - barème: + assiette: assiette des cotisations + multiplicateur: plafond sécurité sociale temps plein + tranches: + - taux: 0% + plafond: 0.85 + - taux: 10.65% + plafond: 5 + arrondi: oui références: - Site CARCDSF: http://www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations - -dirigeant . indépendant . PL . CARCDSF . retraite complémentaire . cotisation proportionnelle: - formule: - barème: - assiette: assiette des cotisations - multiplicateur: plafond sécurité sociale temps plein - tranches: - - taux: 0% - plafond: 0.85 - - taux: 10.65% - plafond: 5 - arrondi: oui - -dirigeant . indépendant . PL . CARCDSF . retraite complémentaire . cotisation forfaitaire: - formule: - produit: - assiette: 2960.40 €/an - taux: réduction de la cotisation forfaitaire - arrondi: oui + Site CARCDSF: www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations dirigeant . indépendant . PL . CARCDSF . retraite complémentaire . réduction de la cotisation forfaitaire: applicable si: assiette des cotisations < 85% * plafond sécurité sociale temps plein @@ -716,7 +706,7 @@ dirigeant . indépendant . PL . CARCDSF . retraite complémentaire . réduction formule: assiette des cotisations / (85% * plafond sécurité sociale temps plein) références: - Site CARCDSF: http://www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations + Site CARCDSF: www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations dirigeant . indépendant . PL . CARCDSF . chirurgien-dentiste: applicable si: métier = 'santé . chirurgien-dentiste' @@ -750,24 +740,22 @@ dirigeant . indépendant . PL . CARCDSF . chirurgien-dentiste . PCV: taux: 0.725 % arrondi: oui références: - Site CARCDSF: http://www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations + Site CARCDSF: www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations dirigeant . indépendant . PL . CARCDSF . chirurgien-dentiste . exonération PCV: type: notification applicable si: (assiette des cotisations / prix d'une consultation) <= 500 consultation/an - formule: oui description: >- Vous avez la possibilité de bénéficier d'une exonération totale de cotisation pour la prestation complémentaire de vieillesse (PCV) si vous en faites la demande. [En savoir plus](http://www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations) -dirigeant . indépendant . PL . CARCDSF . chirurgien-dentiste . prix d'une consultation: +dirigeant . indépendant . PL . CARCDSF . chirurgien-dentiste . exonération PCV . prix d'une consultation: formule: 23 €/consultation dirigeant . indépendant . PL . CARCDSF . sage-femme: - applicable si: métier = 'santé . sage-femme' - formule: oui + applicable si: métier = 'PAM . sage-femme' dirigeant . indépendant . PL . CARCDSF . sage-femme . RID: titre: invalidité et décès (CARCDSF sage-femme) @@ -790,7 +778,7 @@ dirigeant . indépendant . PL . CARCDSF . sage-femme . RID: - si: classe = 'C' alors: 273 €/an références: - Montant des cotisations: http://www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations + Montant des cotisations: www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations dirigeant . indépendant . PL . CARCDSF . sage-femme . RID . classe: titre: Classe de cotisation @@ -827,7 +815,7 @@ dirigeant . indépendant . PL . CARCDSF . sage-femme . PCV: taux: 1 / 3 arrondi: oui références: - Site CARCDSF: http://www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations + Site CARCDSF: www.carcdsf.fr/cotisations-du-praticien/montant-des-cotisations note: | Une dispense peut être accordée lorsque les revenus professionnels sont inférieurs ou égaux à 3120 €. @@ -842,7 +830,6 @@ dirigeant . indépendant . PL . CARCDSF . sage-femme . PCV: dirigeant . indépendant . PL . CARCDSF . sage-femme . exonération PCV: type: notification applicable si: assiette des cotisations <= 3120 €/an - formule: oui description: >- Vous avez la possibilité de bénéficier d'une exonération totale de cotisation pour la prestation complémentaire de vieillesse (PCV) si vous en diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/iframe-integration-script.js b/mon-entreprise/source/sites/mon-entreprise.fr/iframe-integration-script.js index 7c1ba732f..afb4e7d30 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/iframe-integration-script.js +++ b/mon-entreprise/source/sites/mon-entreprise.fr/iframe-integration-script.js @@ -53,7 +53,7 @@ const moduleToSitePath = { } const simulateurLink = (fr ? process.env.FR_SITE : process.env.EN_SITE).replace( '${path}', - moduleToSitePath[moduleName] ?? '' + moduleToSitePath[moduleName] ) links.innerHTML = `
diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Créer/CreationChecklist.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Créer/CreationChecklist.tsx index b116f4df8..32da5c530 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Créer/CreationChecklist.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Créer/CreationChecklist.tsx @@ -452,10 +452,19 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {

{emoji('🧰')} Ressources utiles

-
+
* { + flex: 1; + } + `} + > {isAutoentrepreneur && (

Simulateur de revenus auto-entrepreneur

-

+ Simuler le montant de vos cotisations sociales et de votre impôt et estimez votre futur revenu net. -

+ )} {['EI', 'EIRL', 'EURL'].includes(statut) && (

Simulateur de cotisations indépendant

-

+ Simuler le montant de vos cotisations sociales pour bien préparer votre business plan. -

+ )} {['SAS', 'SASU'].includes(statut) && (

Simulateur de rémunération pour dirigeant de SASU

-

+ Simuler le montant de vos cotisations sociales pour bien préparer votre business plan. -

+ )}

Après la création

-

+ SIREN, SIRET, code APE, KBis. Un petit glossaire des termes que vous pourrez (éventuellement) rencontrer après la création. -

+ {isAutoentrepreneur && } {i18n.language === 'fr' && ['EI', 'EIRL', 'EURL'].includes(statut) && ( -

Guide Urssaf pour les travailleur indépendant

-

+

Guide Urssaf pour les travailleur indépendant 2020

+ Des conseils sur comment préparer son projet pour se lancer dans la création et une présentation détaillée de votre protection sociale. -

+
PDF @@ -568,31 +577,31 @@ export function RessourceAutoEntrepreneur() { <>

Questions fréquentes

-

+ Une liste exhaustive et maintenue à jour de toutes les questions fréquentes (et moins fréquentes) que l'on est amené à poser en tant qu'auto-entrepreneur -

+ {i18n.language === 'fr' && ( -

Guide pratique Urssaf

-

+

Guide partique Urssaf 2020

+ Des conseils pour les auto-entrepreneurs : comment préparer son projet pour se lancer dans la création et une présentation détaillée de votre protection sociale. -

- + +
PDF
@@ -600,15 +609,15 @@ export function RessourceAutoEntrepreneur() { )}

Comment déclarer son revenu aux impôts ?

-

+ Les informations officielles de l'administration fiscale concernant les auto-entrepreneurs et le régime de la micro-entreprise. -

+ diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Créer/Home.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Créer/Home.tsx index aaa6d3b26..0d13f09e0 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Créer/Home.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Créer/Home.tsx @@ -66,9 +66,18 @@ export default function Créer() {

Ressources utiles

-
+
* { + flex: 1; + } + `} + > @@ -80,7 +89,7 @@ export default function Créer() { diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Dev/IntegrationTest.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Dev/IntegrationTest.tsx index 0e2a920bc..615b32dbe 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Dev/IntegrationTest.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Dev/IntegrationTest.tsx @@ -1,16 +1,19 @@ -import React, { Suspense, useMemo } from 'react' -import useSimulatorsData from '../Simulateurs/metadata' +import React, { Suspense } from 'react' const LazyColorPicker = React.lazy(() => import('./ColorPicker')) +export const integrableModuleNames = [ + 'simulateur-embauche', + 'simulateur-autoentrepreneur', + 'simulateur-independant', + 'simulateur-assimilesalarie', + 'simulateur-artiste-auteur', + 'simulateur-chomage-partiel' +] + +// Intégrations "cachées" (non diffusées) +const privateModuleNames = ['demande-mobilite'] + export default function IntegrationTest() { - const simulators = useSimulatorsData() - const integrableModuleNames = useMemo( - () => - Object.values(simulators) - .map(s => s.iframe) - .filter(Boolean), - [simulators] - ) const [currentModule, setCurrentModule] = React.useState( integrableModuleNames[0] ) @@ -33,7 +36,7 @@ export default function IntegrationTest() { <>

Quel module ?

diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/AideDéclarationIndépendant/index.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/AideDéclarationIndépendant/index.tsx index ebfc1919e..63c4303f1 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/AideDéclarationIndépendant/index.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/AideDéclarationIndépendant/index.tsx @@ -24,7 +24,7 @@ import RuleLink from 'Components/RuleLink' import { formatValue } from 'publicodes' import Skeleton from 'Components/ui/Skeleton' -export default function AideDéclarationIndépendant() { +export default function() { const dispatch = useDispatch() const rules = useContext(EngineContext).getParsedRules() const company = useSelector( diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/DemandeMobilite/index.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/DemandeMobilite/index.tsx index 590ce5c0f..5cfc2d70c 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/DemandeMobilite/index.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/DemandeMobilite/index.tsx @@ -12,7 +12,7 @@ import formulaire from './formulaire-détachement.yaml' const LazyEndBlock = React.lazy(() => import('./EndBlock')) -export default function FormulaireMobilitéIndépendant() { +export default function formulaireMobilitéIndépendant() { const engine = new Engine(formulaire) return ( <> diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/Home.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/Home.tsx index 6d10e278a..59f90ad47 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/Home.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Gérer/Home.tsx @@ -81,12 +81,12 @@ export default function SocialSecurity() { />
<> -
-
+
+
{company?.statutJuridique === 'EI' && !company.isAutoEntrepreneur && ( + Covid-19
Découvrir
- Covid-19 Ressources utiles -
+
* { + flex: 1; + } + `} + > {dirigeant === 'indépendant' && i18n.language === 'fr' && process.env.HEAD !== 'master' && ( @@ -200,7 +211,7 @@ export default function SocialSecurity() { )} {!company?.isAutoEntrepreneur && ( @@ -214,7 +225,7 @@ export default function SocialSecurity() { )} {company?.isAutoEntrepreneur && ( @@ -229,7 +240,7 @@ export default function SocialSecurity() { )} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Iframes/SimulateurEmbauche.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Iframes/SimulateurEmbauche.tsx new file mode 100644 index 000000000..3886b56ab --- /dev/null +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Iframes/SimulateurEmbauche.tsx @@ -0,0 +1,16 @@ +import { SitePathsContext } from 'Components/utils/SitePathsContext' +import React, { useContext } from 'react' +import { Helmet } from 'react-helmet' +import { SalarySimulation } from '../Simulateurs/Salarié' + +export default function IframeSimulateurEmbauche() { + const sitePaths = useContext(SitePathsContext) + return ( + <> + + + + + + ) +} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Iframes/index.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Iframes/index.tsx index 4da41d53c..dbfe7f3d8 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Iframes/index.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Iframes/index.tsx @@ -1,41 +1,50 @@ import { IsEmbeddedContext } from 'Components/utils/embeddedContext' import React from 'react' -import { Route, Switch } from 'react-router-dom' +import { Route } from 'react-router-dom' import { inIframe } from '../../../../utils' -import useSimulatorsData from '../Simulateurs/metadata' -import SimulateurPage from '../Simulateurs/Page' +import SimulateurChômagePartiel from '../Simulateurs/ChômagePartiel' +import SimulateurArtisteAuteur from '../Simulateurs/ArtisteAuteur' +import SimulateurAssimiléSalarié from '../Simulateurs/RémunérationSASU' +import SimulateurAutoEntrepreneur from '../Simulateurs/AutoEntrepreneur' +import SimulateurIndépendant from '../Simulateurs/Indépendant' +import DemandeMobilite from '../Gérer/DemandeMobilite' import IframeFooter from './IframeFooter' -import { Helmet } from 'react-helmet' +import SimulateurEmbauche from './SimulateurEmbauche' export default function Iframes() { - const simulators = useSimulatorsData() return ( {/** Open external links in the parent frame. This behavior can be configured on individual link, eg . - Our own link are handled in-app by the router, and aren't affected by this directive. - */} - + Our own link are handled in-app by the router, and aren't affected by this directive. */}
- - {Object.values(simulators) - .filter(({ iframe }) => !!iframe) - .map(s => ( - ( - <> - - - - - - )} - /> - ))} - + + + + + + + + {inIframe() && }
diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Landing/Landing.css b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Landing/Landing.css index 7c84b64da..328644eec 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Landing/Landing.css +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Landing/Landing.css @@ -1,3 +1,4 @@ + .landing-title { margin-bottom: 1rem; display: flex; @@ -7,9 +8,9 @@ .landing-title__img { align-self: flex-end; margin-top: 2rem; - max-width: 19.5rem; - margin-left: 1.5rem; - margin-bottom: -3.5rem; + max-width: 18rem; + margin-left: 1rem; + margin-bottom: -2rem; } @media (min-width: 500px) { .landing-title__logo { @@ -19,8 +20,10 @@ @media (max-width: 900px) { .landing-title__img { - margin: 0; - margin-bottom: -3.5rem; + margin-top: 2rem; + margin-right: -5rem; + margin-left: -1rem; + max-height: 25rem; } .landing-header__brand-logo { height: 4rem; diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Landing/Landing.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Landing/Landing.tsx index 0e4980eba..029760396 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Landing/Landing.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Landing/Landing.tsx @@ -17,8 +17,8 @@ export default function Landing() { ) return ( <> -
-
+
+
logo mon-entreprise.fr
-
+
{emoji('💶')}
@@ -82,7 +82,7 @@ export default function Landing() {
{emoji('🧮')}
@@ -98,7 +98,7 @@ export default function Landing() {
-
+

Qui sommes-nous ?

diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ArtisteAuteur.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ArtisteAuteur.tsx index d7dbcd4f4..2a2c94239 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ArtisteAuteur.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ArtisteAuteur.tsx @@ -1,18 +1,20 @@ import { setSimulationConfig, updateSituation } from 'Actions/actions' -import RuleInput from 'Components/conversation/RuleInput' import { DistributionBranch } from 'Components/Distribution' -import Value, { Condition } from 'Components/EngineValue' +import { Condition } from 'Components/EngineValue' import SimulateurWarning from 'Components/SimulateurWarning' +import config from 'Components/simulationConfigs/artiste-auteur.yaml' import 'Components/TargetSelection.css' -import Animate from 'Components/ui/animate' +import { IsEmbeddedContext } from 'Components/utils/embeddedContext' import { EngineContext, useEvaluation } from 'Components/utils/EngineContext' +import Value from 'Components/EngineValue' +import RuleInput from 'Components/conversation/RuleInput' import React, { createContext, useContext, useEffect, useState } from 'react' import { Trans } from 'react-i18next' import { useDispatch, useSelector } from 'react-redux' import { DottedName } from 'Rules' import { situationSelector } from 'Selectors/simulationSelectors' import styled from 'styled-components' -import config from './configs/artiste-auteur.yaml' +import Animate from 'Components/ui/animate' const InitialRenderContext = createContext(false) function useInitialRender() { @@ -29,9 +31,17 @@ export default function ArtisteAuteur() { dispatch(setSimulationConfig(config)) }, []) const initialRender = useInitialRender() + const inIframe = useContext(IsEmbeddedContext) return ( <> + {!inIframe && ( +

+ + Estimer mes cotisations d’artiste-auteur + +

+ )}
diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/AutoEntrepreneur.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/AutoEntrepreneur.tsx new file mode 100644 index 000000000..181802de8 --- /dev/null +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/AutoEntrepreneur.tsx @@ -0,0 +1,172 @@ +import Warning from 'Components/SimulateurWarning' +import Simulation from 'Components/Simulation' +import autoEntrepreneurConfig from 'Components/simulationConfigs/auto-entrepreneur.yaml' +import StackedBarChart from 'Components/StackedBarChart' +import { ThemeColorsContext } from 'Components/utils/colors' +import { IsEmbeddedContext } from 'Components/utils/embeddedContext' +import { EngineContext } from 'Components/utils/EngineContext' +import Meta from 'Components/utils/Meta' +import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { default as React, useContext } from 'react' +import { Trans, useTranslation } from 'react-i18next' +import { useSelector } from 'react-redux' +import { targetUnitSelector } from 'Selectors/simulationSelectors' +import AutoEntrepreneurPreview from './images/AutoEntrepreneurPreview.png' +import Emoji from 'Components/utils/Emoji' +import { RessourceAutoEntrepreneur } from '../Créer/CreationChecklist' +import RuleLink from 'Components/RuleLink' + +export default function AutoEntrepreneur() { + const inIframe = useContext(IsEmbeddedContext) + const { t, i18n } = useTranslation() + const META = { + title: t( + 'pages.simulateurs.auto-entrepreneur.meta.titre', + 'Auto-entrepreneurs : simulateur de revenus' + ), + description: t( + 'pages.simulateurs.auto-entrepreneur.meta.description', + "Calcul de votre revenu à partir du chiffre d'affaires, après déduction des cotisations et de l'impôt sur le revenu." + ), + ogTitle: t( + 'pages.simulateurs.auto-entrepreneur.meta.ogTitle', + 'Auto-entrepreneur : calculez rapidement votre revenu net à partir du CA et vice-versa' + ), + ogDescription: t( + 'pages.simulateurs.auto-entrepreneur.meta.ogDescription', + "Grâce au simulateur de revenu auto-entrepreneur développé par l'Urssaf, vous pourrez estimer le montant de vos revenus en fonction de votre chiffre d'affaire mensuel ou annuel pour mieux gérer votre trésorerie. Ou dans le sens inverse : savoir quel montant facturer pour atteindre un certain revenu." + ), + ...(i18n.language === 'fr' && { ogImage: AutoEntrepreneurPreview }) + } + const isEmbedded = React.useContext(IsEmbeddedContext) + return ( + <> + + {!inIframe && ( +

+ + Simulateur de revenus auto-entrepreneur + +

+ )} + + } + /> + {!isEmbedded && } + + ) +} + +function ExplanationSection() { + const engine = useContext(EngineContext) + const { t } = useTranslation() + const { palettes } = useContext(ThemeColorsContext) + const targetUnit = useSelector(targetUnitSelector) + const impôt = engine.evaluate('impôt', { unit: targetUnit }) + + return ( +
+

+ Répartition du chiffre d'affaires +

+ +
+ ) +} + +function SeoExplanations() { + const sitePaths = useContext(SitePathsContext) + return ( + +

Comment calculer le revenu net d'un auto-entrepreneur ?

+

+ Un auto-entrepreneur doit payer des cotisations sociales à + l'administration. Ces cotisations servent au financement de la sécurité + sociale, et ouvrent des droits pour la retraite ou pour l'assurance + maladie. Elle permettent également de financer la formation + professionnelle. Leur montant varie en fonction du type d'activité. +

+

+ {' '} + + Voir le détail du calcul des cotisations + +

+

+ Il ne faut pas oublier de retrancher toutes les dépenses effectuées dans + le cadre de l'activité professionnelle (équipements, matière premières, + local, transport). Bien qu'elles ne soient pas utilisées pour le calcul + des cotisations et de l'impôt, elles doivent être prises en compte pour + vérifier si l'activité est viable économiquement. +

+

+ La formule de calcul complète est donc : +

+ + Revenu net = Chiffres d'affaires − Cotisations sociales − Dépenses + professionnelles + +
+

+

+ Comment calculer l'impôt sur le revenu pour un auto-entrepreneur ? +

+

+ Si vous avez opté pour le versement libératoire lors de la création de + votre auto-entreprise, l'impôt sur le revenu est payé en même temps que + les cotisations sociales. +

+

+ {' '} + + Voir comment est calculé le montant du versement libératoire + +

+

+ Sinon, vous serez imposé selon le barème standard de l'impôt sur le + revenu. Le revenu imposable est alors calculé comme un pourcentage du + chiffre d'affaires. C'est qu'on appel l'abattement forfaitaire. Ce + pourcentage varie en fonction du type d'activité excercé. On dit qu'il + est forfaitaire car il ne prends pas en compte les dépenses réelles + effectuées dans le cadre de l'activité. +

+

+ {' '} + + Voir le détail du calcul du revenu abattu pour un auto-entrepreneur + +

+

+ Ressources utiles +

+
+ +
+ + ) +} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ChômagePartiel.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ChômagePartiel.tsx index 1a5601a42..e87b30232 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ChômagePartiel.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ChômagePartiel.tsx @@ -1,15 +1,20 @@ import RuleLink from 'Components/RuleLink' import Simulation from 'Components/Simulation' +import chomagePartielConfig from 'Components/simulationConfigs/chômage-partiel.yaml' import Animate from 'Components/ui/animate' import Warning from 'Components/ui/WarningBlock' import { IsEmbeddedContext } from 'Components/utils/embeddedContext' import { useEvaluation } from 'Components/utils/EngineContext' +import { Markdown } from 'Components/utils/markdown' +import { ScrollToTop } from 'Components/utils/Scroll' import { EvaluatedRule, formatValue } from 'publicodes' import React, { useContext, useEffect, useState } from 'react' -import { useTranslation } from 'react-i18next' +import { Trans, useTranslation } from 'react-i18next' import { DottedName } from 'Rules' import styled from 'styled-components' import { productionMode } from '../../../../utils' +import ChômagePartielPreview from './images/ChômagePartielPreview.png' +import Meta from 'Components/utils/Meta' declare global { interface Window { @@ -32,8 +37,37 @@ export default function ChômagePartiel() { document.body.removeChild(script) } }, []) + const { t, i18n } = useTranslation() + const META = { + title: t( + 'pages.simulateurs.chômage-partiel.meta.titre', + "Calcul de l'indemnité chômage partiel : le simulateur Urssaf" + ), + description: t( + 'pages.simulateurs.chômage-partiel.meta.description', + "Calcul du revenu net pour l'employé et du reste à charge pour l'employeur après remboursement de l'Etat, en prenant en compte toutes les cotisations sociales." + ), + ogTitle: t( + 'pages.simulateurs.chômage-partiel.meta.ogTitle', + "Simulateur chômage partiel : découvrez l'impact sur le revenu net salarié et le coût total employeur." + ), + ogDescription: t( + 'pages.simulateurs.chômage-partiel.meta.ogDescription', + "Accédez à une première estimation en saisissant à partir d'un salaire brut. Vous pourrez ensuite personaliser votre situation (temps partiel, convention, etc). Prends en compte la totalité des cotisations, y compris celles spécifiques à l'indemnité (CSG et CRDS)." + ), + ...(i18n.language === 'fr' && { ogImage: ChômagePartielPreview }) + } return ( <> + + + + {!inIframe && ( + +

Covid-19 : Simulateur de chômage partiel

+ + )} +
  • @@ -43,12 +77,14 @@ export default function ChômagePartiel() {
} customEndMessages={ Voir les résultats au-dessus } showPeriodSwitch={false} /> + {!inIframe && } ) } @@ -317,3 +353,58 @@ const ResultTable = styled.table` background: var(--lighterColor); } ` + +function TextExplanations() { + const { t } = useTranslation() + + return ( + + ) +} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Home.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Home.tsx index dc0ef22c2..74498701b 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Home.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Home.tsx @@ -1,89 +1,164 @@ +import { SitePathsContext } from 'Components/utils/SitePathsContext' import React, { useContext } from 'react' import emoji from 'react-easy-emoji' import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' import { Link } from 'react-router-dom' -import classnames from 'classnames' -import simulatorSvg from './images/illustration-simulateur.svg' -import useSimulatorsData, { SimulatorData } from './metadata' -import { SitePathsContext } from 'Components/utils/SitePathsContext' +export function useSimulatorsMetadata() { + const { t } = useTranslation() + const sitePaths = useContext(SitePathsContext) + + type SimulatorMetaData = { + name: string + icône: string + description?: string + sitePath: string + label?: string + } + + return [ + { + name: t('Assimilé salarié'), + icône: '☂️', + description: t( + 'simulateurs.résumé.assimilé', + "Calculer le revenu d'un dirigeant de SAS, SASU ou SARL minoritaire" + ), + sitePath: sitePaths.simulateurs.SASU + }, + { + name: t('Indépendant'), + icône: '👩‍🔧', + description: t( + 'simulateurs.résumé.indépendant', + "Calculer le revenu d'un dirigeant de EURL, EI, ou SARL majoritaire" + ), + sitePath: sitePaths.simulateurs.indépendant + }, + { + name: t('Auto-entrepreneur'), + icône: '🚶‍♂️', + description: t( + 'simulateurs.résumé.auto', + "Calculer le revenu (ou le chiffre d'affaires) d'un auto-entrepreneur" + ), + sitePath: sitePaths.simulateurs['auto-entrepreneur'] + }, + { + name: t('Salarié'), + icône: '🤝', + description: t( + 'simulateurs.résumé.salarié', + "Calculer le salaire net, brut, ou total d'un salarié, stagiaire, ou assimilé" + ), + sitePath: sitePaths.simulateurs.salarié + }, + { + name: t('Artiste-auteur'), + icône: '👩‍🎨', + description: t( + 'simulateurs.résumé.artiste-auteur', + "Estimer les cotisations sociales d'un artiste ou auteur" + ), + sitePath: sitePaths.simulateurs['artiste-auteur'] + }, + { + name: t('Comparaison statuts'), + icône: '📊', + description: t( + 'simulateurs.résumé.comparaison', + 'Découvrir les différences entre les régimes (cotisations,retraite, maternité, maladie, etc.)' + ), + sitePath: sitePaths.simulateurs.comparaison + }, + { + name: t('Économie collaborative'), + description: t( + 'simulateurs.résumé.économie-collaborative', + 'Un guide pour savoir comment déclarer vos revenus issus de plateformes en ligne (AirBnb, leboncoin, blablacar, etc.)' + ), + icône: '🙋', + sitePath: sitePaths.simulateurs.économieCollaborative.index + }, + { + name: t('Chômage partiel'), + description: t( + 'simulateurs.résumé.chômage-partiel', + "Simuler le revenu net versé au salarié, ainsi que le coût total restant à charge pour l'entreprise en cas de recours à l'activité partielle." + ), + icône: '😷', + label: t('Covid 19'), + sitePath: sitePaths.simulateurs['chômage-partiel'] + }, + { + name: t('Aide à la déclaration de revenu'), + description: t( + 'simulateurs.résumé.aide-déclaration-revenu-indep', + 'Calculer facilement les montants des charges sociales à reporter dans votre déclaration de revenu 2019.' + ), + icône: '✍️', + label: t('Indépendant'), + sitePath: sitePaths.gérer.déclarationIndépendant + }, + { + name: t('Demande de mobilité'), + description: t( + 'simulateurs.résumé.demande-mobilité', + 'Formulaire de demande de mobilité en Europe pour les travailleurs indépendants' + ), + icône: '🧳', + label: t('Indépendant'), + sitePath: sitePaths.gérer.formulaireMobilité + } + ] as Array +} export default function Simulateurs() { const { t } = useTranslation() - const sitePaths = useContext(SitePathsContext) - const simulators = useSimulatorsData() - const titre = t('pages.simulateurs.accueil.titre', 'Simulateurs disponibles') + const simulatorsMetadata = useSimulatorsMetadata() + const titre = t('simulateurs.accueil.titre', 'Simulateurs disponibles') return ( <> {titre} -
-
-

{titre}

-

- - Tous les simulateurs sur ce site sont maintenus à jour avec les - dernières évolutions législatives. - -

-
- -
-
-

- Salariés et employeurs -

-
- - -
- -

- Par statut -

-
- - - - - {process.env.HEAD !== 'master' && ( - +
+

{titre}

+
+ {simulatorsMetadata.map( + ({ name, description, sitePath, icône, label }) => ( + +
{emoji(icône)}
+

{name}

+

+ {description} +

+ {label && {label}} + + ) )}
- {process.env.HEAD !== 'master' && ( - <> -

- - Professionnels de santé {emoji('🏥')} - -

-
- - - - -
- - )} -

- Autres outils -

-
- - - - -
- +

Tous les simulateurs sur ce site sont :

  • @@ -95,9 +170,7 @@ export default function Simulateurs() { de dispositifs pris en compte
  • - Intégrable facilement et gratuitement sur - n'importe quel site internet.{' '} - En savoir plus. + Développés en partenariat avec l'Urssaf
@@ -105,34 +178,3 @@ export default function Simulateurs() { ) } - -function SimulateurCard({ - small = false, - shortName, - meta, - path, - icône -}: SimulatorData[keyof SimulatorData] & { small?: boolean }) { - return ( - -
- {emoji(icône)} -
- {small ? shortName :

{shortName}

} - {!small && meta?.description && ( -

- {meta.description} -

- )} - - ) -} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Indépendant.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Indépendant.tsx new file mode 100644 index 000000000..ef9390c46 --- /dev/null +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Indépendant.tsx @@ -0,0 +1,76 @@ +import Warning from 'Components/SimulateurWarning' +import Simulation from 'Components/Simulation' +import indépendantConfig from 'Components/simulationConfigs/indépendant.yaml' +import StackedBarChart from 'Components/StackedBarChart' +import { ThemeColorsContext } from 'Components/utils/colors' +import { IsEmbeddedContext } from 'Components/utils/embeddedContext' +import { EngineContext } from 'Components/utils/EngineContext' +import { default as React, useContext } from 'react' +import { Helmet } from 'react-helmet' +import { Trans, useTranslation } from 'react-i18next' + +export default function Indépendant() { + const { t } = useTranslation() + const inIframe = useContext(IsEmbeddedContext) + + return ( + <> + + + {t( + 'simulateurs.indépendant.page.titre', + 'Indépendant : simulateur officiel de revenus et de cotisations' + )} + + + + {!inIframe && ( +

+ + Simulateur de revenus pour indépendants + +

+ )} + + } + /> + + ) +} + +function ExplanationSection() { + const engine = useContext(EngineContext) + const { t } = useTranslation() + const { palettes } = useContext(ThemeColorsContext) + + return ( +
+

Répartition de la rémunération totale

+ +
+ ) +} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/IndépendantSimulation.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/IndépendantSimulation.tsx deleted file mode 100644 index 623c76a0b..000000000 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/IndépendantSimulation.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import SimulateurWarning from 'Components/SimulateurWarning' -import Simulation from 'Components/Simulation' -import IndépendantExplanation from 'Components/simulationExplanation/IndépendantExplanation' -import React from 'react' -export default function IndépendantSimulation() { - return ( - <> - - } /> - - ) -} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Page.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Page.tsx deleted file mode 100644 index 058aa365e..000000000 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Page.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import { setSimulationConfig } from 'Actions/actions' -import { IsEmbeddedContext } from 'Components/utils/embeddedContext' -import Meta from 'Components/utils/Meta' -import { default as React, useContext, useEffect } from 'react' -import { useDispatch } from 'react-redux' -import { useLocation } from 'react-router-dom' -import { SimulatorData } from './metadata' - -export default function SimulateurPage({ - meta, - title, - config, - component: Component, - seoExplanations -}: SimulatorData[keyof SimulatorData]) { - const inIframe = useContext(IsEmbeddedContext) - const dispatch = useDispatch() - const fromGérer = !!useLocation<{ fromGérer?: boolean }>().state?.fromGérer - useEffect(() => { - if (!config) { - return - } - dispatch(setSimulationConfig(config, fromGérer)) - }, [config]) - - return ( - <> - {meta && } - {title && !inIframe &&

{title}

} - - {seoExplanations && !inIframe && seoExplanations} - - ) -} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ProfessionLibérale.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ProfessionLibérale.tsx new file mode 100644 index 000000000..4c5a33787 --- /dev/null +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ProfessionLibérale.tsx @@ -0,0 +1,135 @@ +import Simulation from 'Components/Simulation' +import professionLibéraleConfig from 'Components/simulationConfigs/profession-libérale.yaml' +import StackedBarChart from 'Components/StackedBarChart' +import { ThemeColorsContext } from 'Components/utils/colors' +import { IsEmbeddedContext } from 'Components/utils/embeddedContext' +import { EngineContext } from 'Components/utils/EngineContext' +import React, { useContext, useEffect } from 'react' +import { Helmet } from 'react-helmet' +import { Trans, useTranslation } from 'react-i18next' +import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { useHistory, useParams, useRouteMatch } from 'react-router-dom' +import { useDispatch } from 'react-redux' +import { updateSituation } from 'Actions/actions' +import { DottedName } from 'Rules' +import { utils } from 'publicodes' +import { capitalise0 } from '../../../../utils' + +// The subsimulator feature allow to customize a simulator page content (title, +// description) and url based on the answer to a multiple-choice question. +// Arguments: +// - `namespace` correspond to the question in the rule set +// - `sitepath` is a React Router path descriptor which must contain a +// `:subsimulator?` argument +function useSubSimulators( + namespace: DottedName, + sitepath: string +): string | undefined { + const engine = useContext(EngineContext) + const history = useHistory() + const dispatch = useDispatch() + const subsimulatorUrlParam = '/:subsimulator?' + if (!sitepath.includes(subsimulatorUrlParam)) { + throw new Error('sitepath must contain the subsimulator param.') + } + const urlState = useRouteMatch<{ subsimulator: string }>({ path: sitepath }) + ?.params?.subsimulator + const defaultUrl = sitepath.replace(subsimulatorUrlParam, '') + + // TODO: ajouter le support de l'attribut "titre" de la règle + const situationState = engine.situation[namespace]?.nodeValue + + const encodedSituationState = utils.encodeRuleName(situationState) + const subSimulatorsList = Object.keys(engine.getParsedRules()) + .filter(dottedname => dottedname.startsWith(namespace)) + .map(dottedname => dottedname.replace(`${namespace} . `, '')) + .map(rulename => utils.encodeRuleName(rulename)) + + useEffect(() => { + if (urlState && !subSimulatorsList.includes(urlState)) { + history.push(defaultUrl) + } else if (encodedSituationState && encodedSituationState !== urlState) { + history.push(`${defaultUrl}/${encodedSituationState}`) + } else if (urlState && urlState !== encodedSituationState) { + dispatch(updateSituation(namespace, `'${urlState}'`)) + } + }, [urlState, encodedSituationState]) + if (typeof situationState !== 'string') { + return + } + return situationState +} + +export default function ProfessionLibérale() { + const { t } = useTranslation() + const inIframe = useContext(IsEmbeddedContext) + const sitePaths = useContext(SitePathsContext) + const professionName = 'profession libérale' + // useSubSimulators( + // 'dirigeant . indépendant . PL . métier . santé', + // sitePaths.simulateurs['profession-libérale'] + // ) ?? 'profession libérale' + + return ( + <> + + + {t( + 'simulateurs.profession-libérale.page.titre', + `${capitalise0( + professionName + )} : simulateur de revenus et de cotisations` + )} + + + + {!inIframe && ( +

+ + Simulateur de revenus pour {professionName} + +

+ )} + {/* */} + } + /> + + ) +} + +function ExplanationSection() { + const engine = useContext(EngineContext) + const { t } = useTranslation() + const { palettes } = useContext(ThemeColorsContext) + + return ( +
+

Répartition de la rémunération totale

+ +
+ ) +} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/RémunérationSASU.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/RémunérationSASU.tsx new file mode 100644 index 000000000..974c76268 --- /dev/null +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/RémunérationSASU.tsx @@ -0,0 +1,98 @@ +import RuleLink from 'Components/RuleLink' +import SalaryExplanation from 'Components/SalaryExplanation' +import Warning from 'Components/SimulateurWarning' +import Simulation from 'Components/Simulation' +import assimiléConfig from 'Components/simulationConfigs/assimilé.yaml' +import { IsEmbeddedContext } from 'Components/utils/embeddedContext' +import Meta from 'Components/utils/Meta' +import React, { useContext } from 'react' +import { Trans, useTranslation } from 'react-i18next' +import RémunérationSASUPreview from './images/RémunérationSASUPreview.png' + +export default function RémunérationSASU() { + const { t } = useTranslation() + const META = { + title: t( + 'pages.simulateurs.sasu.meta.titre', + 'Dirigeant de SASU : simulateur de revenus Urssaf' + ), + description: t( + 'pages.simulateurs.sasu.meta.description', + "Calcul du salaire net à partir du chiffre d'affaires + charges et vice-versa." + ), + ogTitle: t( + 'pages.simulateurs.sasu.meta.ogTitle', + 'Rémunération du dirigeant de SASU : un simulateur pour connaître votre salaire net' + ), + ogDescription: t( + 'pages.simulateurs.sasu.meta.ogDescription', + 'En tant que dirigeant assimilé-salarié, calculez immédiatement votre revenu net après impôt à partir du total alloué à votre rémunération.' + ), + ogImage: RémunérationSASUPreview + } + const inIframe = useContext(IsEmbeddedContext) + + return ( + <> + + {!inIframe && ( +

+ + Simulateur de revenus pour dirigeant de SASU + +

+ )} + + } + /> + {!inIframe && } + + ) +} + +function SeoExplanations() { + return ( + +

Comment calculer le salaire d'un dirigeant de SASU ?

+ +

+ Comme pour un salarié classique, le dirigeant de sasu{' '} + paye des cotisations sociales sur la rémunération qu'il se verse. Les + cotisations sont calculées de la même manière que pour le salarié : + elles sont décomposées en partie employeur et partie salarié et sont + exprimées comme un pourcentage du salaire brut. +

+

+ Le dirigeant assimilé-salarié ne paye pas de{' '} + cotisations chômage. Par ailleurs, il ne bénéficie pas + de la{' '} + + réduction générale de cotisations + {' '} + ni des dispositifs encadrés par le code du travail comme les{' '} + + heures supplémentaires + {' '} + ou les primes. +

+ +

+ Il peut en revanche prétendre à la{' '} + + réduction ACRE + {' '} + en debut d'activité, sous certaines conditions. +

+ +

+ Vous pouvez utiliser notre simulateur pour calculer la{' '} + rémunération nette à partir d'un montant superbrut + alloué à la rémunération du dirigeant. Il vous suffit pour cela saisir + le montant total alloué dans la case "total chargé". La simulation peut + ensuite être affinée en répondant aux différentes questions. +

+ + ) +} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Salarié.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Salarié.tsx new file mode 100644 index 000000000..2fd3b2474 --- /dev/null +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/Salarié.tsx @@ -0,0 +1,168 @@ +import Banner from 'Components/Banner' +import PreviousSimulationBanner from 'Components/PreviousSimulationBanner' +import RuleLink from 'Components/RuleLink' +import SalaryExplanation from 'Components/SalaryExplanation' +import Simulation from 'Components/Simulation' +import salariéConfig from 'Components/simulationConfigs/salarié.yaml' +import { IsEmbeddedContext } from 'Components/utils/embeddedContext' +import Meta from 'Components/utils/Meta' +import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { default as React, useContext } from 'react' +import { Trans, useTranslation } from 'react-i18next' +import { Link } from 'react-router-dom' +import urlIllustrationNetBrutEn from './images/illustration-net-brut-en.png' +import urlIllustrationNetBrut from './images/illustration-net-brut.png' +import salaireBrutNetPreviewEN from './images/SalaireBrutNetPreviewEN.png' +import salaireBrutNetPreviewFR from './images/SalaireBrutNetPreviewFR.png' + +export default function Salarié() { + const { t, i18n } = useTranslation() + const META = { + title: t( + 'pages.simulateurs.salarié.meta.titre', + 'Salaire brut / net : le convertisseur Urssaf' + ), + description: t( + 'pages.simulateurs.salarié.meta.description', + "Calcul du salaire net, net après impôt et coût total employeur. Beaucoup d'options disponibles (cadre, stage, apprentissage, heures supplémentaires, etc.)" + ), + ogTitle: t( + 'pages.simulateurs.salarié.meta.ogTitle', + 'Salaire brut, net, net après impôt, coût total : le simulateur ultime pour salariés et employeurs' + ), + ogDescription: t( + 'pages.simulateurs.salarié.meta.ogDescription', + "En tant que salarié, calculez immédiatement votre revenu net après impôt à partir du brut mensuel ou annuel. En tant qu'employé, estimez le coût total d'une embauche à partir du brut. Ce simulateur est développé avec les experts de l'Urssaf, et il adapte les calculs à votre situation (statut cadre, stage, apprentissage, heures supplémentaire, titre-restaurants, mutuelle, temps partiel, convention collective, etc.)" + ), + ogImage: + i18n.language === 'fr' ? salaireBrutNetPreviewFR : salaireBrutNetPreviewEN + } + const isEmbedded = React.useContext(IsEmbeddedContext) + return ( + <> + +

+ + Simulateur de revenus pour salarié + +

+
+ + {!isEmbedded && } + + ) +} + +function SeoExplanations() { + const { i18n } = useTranslation() + + return ( + +

Comment calculer le salaire net ?

+ +

+ Lors de l'entretien d'embauche l'employeur propose en général une + rémunération exprimée en « brut ». Le montant annoncé inclut ainsi les + cotisations salariales, qui servent à financer la protection sociale du + salarié et qui sont retranchées du salaire « net » perçu par le salarié. +

+

+ Vous pouvez utiliser notre simulateur pour convertir le{' '} + salaire brut en net : il vous suffit pour cela saisir + la rémunération annoncée dans la case salaire brut. La simulation + peut-être affinée en répondant aux différentes questions (CDD, statut + cadre, heures supplémentaires, temps partiel, titre-restaurants, etc.). +

+ +

+ Par ailleurs depuis 2019, l' + impôt sur le revenu est prélevé + à la source. Pour ce faire, la direction générale des finances publiques + (DGFiP) transmet à l'employeur le taux d'imposition calculé à partir de + la déclaration de revenu du salarié. Si ce taux est inconnu, par exemple + lors d'une première année d'activité, l'employeur utilise le{' '} + + taux neutre + + . +

+ +

Comment calculer le coût d'embauche ?

+ +

+ Si vous cherchez à embaucher, vous pouvez calculer le coût total de la + rémunération de votre salarié, ainsi que les montants de cotisations + patronales et salariales correspondants. Cela vous permet de définir le + niveau de rémunération en connaissant le montant global de charge que + cela représente pour votre entreprise. +

+ +

+ En plus du salaire, notre simulateur prend en compte le calcul des + avantages en nature (téléphone, véhicule de fonction, etc.), ainsi que + la mutuelle santé obligatoire. +

+ +

+ Il existe des{' '} + + aides différées + {' '} + à l'embauche qui ne sont pas toutes prises en compte par notre + simulateur, vous pouvez les retrouver sur{' '} + + le portail officiel + + . +

+ + ) +} + +export const SalarySimulation = () => { + const sitePaths = useContext(SitePathsContext) + return ( + <> + } + customEndMessages={ + <> + + Vous pouvez maintenant concrétiser votre projet d'embauche. + +
+ + + Connaître les démarches + + +
+ + } + /> +
+ + + + Vous êtes dirigeant d'une SAS(U) ?{' '} + + Accéder au simulateur de revenu dédié + + + + + ) +} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/SalariéSimulation.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/SalariéSimulation.tsx deleted file mode 100644 index 5a6ec5028..000000000 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/SalariéSimulation.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import Banner from 'Components/Banner' -import PreviousSimulationBanner from 'Components/PreviousSimulationBanner' -import Simulation from 'Components/Simulation' -import SalaryExplanation from 'Components/simulationExplanation/SalaryExplanation' -import { SitePathsContext } from 'Components/utils/SitePathsContext' -import { default as React, useContext } from 'react' -import { Trans } from 'react-i18next' -import { Link } from 'react-router-dom' - -export default function SalariéSimulation() { - const sitePaths = useContext(SitePathsContext) - return ( - <> - } - customEndMessages={ - <> - - Vous pouvez maintenant concrétiser votre projet d'embauche. - -
- - - Connaître les démarches - - -
- - } - /> -
- - - - Vous êtes dirigeant d'une SAS(U) ?{' '} - - Accéder au simulateur de revenu dédié - - - - - ) -} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/SchemeComparaison.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/SchemeComparaison.tsx index 212d20fa1..efcc9b8eb 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/SchemeComparaison.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/SchemeComparaison.tsx @@ -1,11 +1,34 @@ import SchemeComparaison from 'Components/SchemeComparaison' import React from 'react' +import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' export default function SchemeComparaisonPage() { const { t } = useTranslation() return ( <> + + + {t( + 'comparaisonRégimes.page.titre', + 'Indépendant, assimilé salarié ou auto-entrepreneur : découvrez le régime qui vous correspond le mieux' + )} + + + +

+ + Indépendant, assimilé salarié ou{' '} + auto-entrepreneur : quel + régime choisir ? + +

Lorsque vous créez votre société, le choix du statut juridique va diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/images/illustration-simulateur.svg b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/images/illustration-simulateur.svg deleted file mode 100644 index e986caa09..000000000 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/images/illustration-simulateur.svg +++ /dev/null @@ -1 +0,0 @@ -Calculator \ No newline at end of file diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/index.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/index.tsx index 9c6ac4088..2781d9480 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/index.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/index.tsx @@ -1,12 +1,19 @@ import { usePersistingState } from 'Components/utils/persistState' import { ScrollToTop } from 'Components/utils/Scroll' import { SitePathsContext } from 'Components/utils/SitePathsContext' -import { default as React, useContext, useEffect, useMemo } from 'react' +import React, { useContext, useEffect } from 'react' import { Trans } from 'react-i18next' import { Link, Route, Switch, useLocation } from 'react-router-dom' -import useSimulatorsData from './metadata' -import SimulateurPage from './Page' +import ArtisteAuteur from './ArtisteAuteur' +import AssimiléSalarié from './RémunérationSASU' +import ChômagePartiel from './ChômagePartiel' +import ProfessionLibérale from './ProfessionLibérale' +import AutoEntrepreneur from './AutoEntrepreneur' import Home from './Home' +import Indépendant from './Indépendant' +import Salarié from './Salarié' +import SchemeComparaison from './SchemeComparaison' +import ÉconomieCollaborative from './ÉconomieCollaborative' export default function Simulateurs() { const sitePaths = useContext(SitePathsContext) @@ -19,20 +26,7 @@ export default function Simulateurs() { setLastState(state) } }, [setLastState, state]) - const simulatorsData = useSimulatorsData() - const simulatorRoutes = useMemo( - () => - Object.values(simulatorsData) - .filter(({ path }) => path.startsWith(sitePaths.simulateurs.index)) - .map(s => ( - } - /> - )), - [simulatorsData, sitePaths] - ) + return ( <> @@ -66,7 +60,36 @@ export default function Simulateurs() { )} - {simulatorRoutes} + + + + + + + + + ) diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/metadata.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/metadata.tsx deleted file mode 100644 index 11b8c9341..000000000 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/metadata.tsx +++ /dev/null @@ -1,745 +0,0 @@ -import RuleLink from 'Components/RuleLink' -import SimulateurWarning from 'Components/SimulateurWarning' -import Simulation from 'Components/Simulation' -import AutoEntrepreneurExplanation from 'Components/simulationExplanation/AutoEntrepreneurExplanation' -import SalaryExplanation from 'Components/simulationExplanation/SalaryExplanation' -import Emoji from 'Components/utils/Emoji' -import { SitePathsContext } from 'Components/utils/SitePathsContext' -import React, { useContext, useMemo } from 'react' -import { Trans, useTranslation } from 'react-i18next' -import { SimulationConfig } from 'Reducers/rootReducer' -import { constructLocalizedSitePath } from '../../sitePaths' -import { RessourceAutoEntrepreneur } from '../Créer/CreationChecklist' -import AideDéclarationIndépendant from '../Gérer/AideDéclarationIndépendant' -import FormulaireMobilitéIndépendant from '../Gérer/DemandeMobilite' -import ArtisteAuteur from './ArtisteAuteur' -import ChômagePartielComponent from './ChômagePartiel' -import autoEntrepreneurConfig from './configs/auto-entrepreneur.yaml' -import chômageParielConfig from './configs/chômage-partiel.yaml' -import sasuConfig from './configs/dirigeant-sasu.yaml' -import indépendantConfig from './configs/indépendant.yaml' -import professionLibéraleConfig from './configs/profession-libérale.yaml' -import salariéConfig from './configs/salarié.yaml' -import AutoEntrepreneurPreview from './images/AutoEntrepreneurPreview.png' -import ChômagePartielPreview from './images/ChômagePartielPreview.png' -import urlIllustrationNetBrutEn from './images/illustration-net-brut-en.png' -import urlIllustrationNetBrut from './images/illustration-net-brut.png' -import RémunérationSASUPreview from './images/RémunérationSASUPreview.png' -import salaireBrutNetPreviewEN from './images/SalaireBrutNetPreviewEN.png' -import salaireBrutNetPreviewFR from './images/SalaireBrutNetPreviewFR.png' -import IndépendantSimulation from './IndépendantSimulation' -import SalariéSimulation from './SalariéSimulation' -import SchemeComparaisonPage from './SchemeComparaison' -import ÉconomieCollaborative from './ÉconomieCollaborative' - -const simulateurs = [ - 'salarié', - 'auto-entrepreneur', - 'indépendant', - 'sasu', - 'chômage-partiel', - 'artiste-auteur', - 'comparaison-statuts', - 'économie-collaborative', - 'aide-déclaration-indépendant', - 'demande-mobilité', - 'profession-libérale', - 'médecin', - 'chirurgien-dentiste', - 'sage-femme', - 'auxiliaire-médical' -] as const - -export type SimulatorData = Record< - typeof simulateurs[number], - { - meta?: { - title: string - description: string - ogTitle?: string - ogDescription?: string - ogImage?: string - } - icône: string - shortName: string - path: string - iframe?: string - title?: string - config?: SimulationConfig - seoExplanations?: React.ReactNode - private?: true - component: () => JSX.Element - } -> - -export function getSimulatorsData({ - t = (_, text) => text, - sitePaths = constructLocalizedSitePath('fr'), - language = 'fr' -}): SimulatorData { - return { - salarié: { - config: salariéConfig, - component: SalariéSimulation, - icône: '🤝', - title: t( - 'pages.simulateurs.salarié.title', - 'Simulateur de revenus pour salarié' - ), - iframe: 'simulateur-embauche', - meta: { - description: t( - 'pages.simulateurs.salarié.meta.description', - "Calcul du salaire net, net après impôt et coût total employeur. Beaucoup d'options disponibles (cadre, stage, apprentissage, heures supplémentaires, etc.)" - ), - ogDescription: t( - 'pages.simulateurs.salarié.meta.ogDescription', - "En tant que salarié, calculez immédiatement votre revenu net après impôt à partir du brut mensuel ou annuel. En tant qu'employé, estimez le coût total d'une embauche à partir du brut. Ce simulateur est développé avec les experts de l'Urssaf, et il adapte les calculs à votre situation (statut cadre, stage, apprentissage, heures supplémentaire, titre-restaurants, mutuelle, temps partiel, convention collective, etc.)" - ), - ogImage: - language === 'fr' ? salaireBrutNetPreviewFR : salaireBrutNetPreviewEN, - ogTitle: t( - 'pages.simulateurs.salarié.meta.ogTitle', - 'Salaire brut, net, net après impôt, coût total : le simulateur ultime pour salariés et employeurs' - ), - title: t( - 'pages.simulateurs.salarié.meta.titre', - 'Salaire brut / net : le convertisseur Urssaf' - ) - }, - path: sitePaths.simulateurs.salarié, - shortName: t('pages.simulateurs.salarié.shortname', 'Salarié'), - seoExplanations: ( - -

Comment calculer le salaire net ?

-

- Lors de l'entretien d'embauche l'employeur propose en général une - rémunération exprimée en « brut ». Le montant annoncé inclut ainsi - les cotisations salariales, qui servent à financer la protection - sociale du salarié et qui sont retranchées du salaire « net » perçu - par le salarié. -

-

- Vous pouvez utiliser notre simulateur pour convertir le{' '} - salaire brut en net : il vous suffit pour cela - saisir la rémunération annoncée dans la case salaire brut. La - simulation peut-être affinée en répondant aux différentes questions - (CDD, statut cadre, heures supplémentaires, temps partiel, - titre-restaurants, etc.). -

- -

- Par ailleurs depuis 2019, l' - impôt sur le revenu est - prélevé à la source. Pour ce faire, la direction générale des - finances publiques (DGFiP) transmet à l'employeur le taux - d'imposition calculé à partir de la déclaration de revenu du - salarié. Si ce taux est inconnu, par exemple lors d'une première - année d'activité, l'employeur utilise le{' '} - - taux neutre - - . -

-

Comment calculer le coût d'embauche ?

-

- Si vous cherchez à embaucher, vous pouvez calculer le coût total de - la rémunération de votre salarié, ainsi que les montants de - cotisations patronales et salariales correspondants. Cela vous - permet de définir le niveau de rémunération en connaissant le - montant global de charge que cela représente pour votre entreprise. -

-

- En plus du salaire, notre simulateur prend en compte le calcul des - avantages en nature (téléphone, véhicule de fonction, etc.), ainsi - que la mutuelle santé obligatoire. -

-

- Il existe des{' '} - - aides différées - {' '} - à l'embauche qui ne sont pas toutes prises en compte par notre - simulateur, vous pouvez les retrouver sur{' '} - - le portail officiel - - . -

- - ) - }, - 'auto-entrepreneur': { - config: autoEntrepreneurConfig, - icône: '🚶‍♂️', - iframe: 'simulateur-autoentrepreneur', - meta: { - description: t( - 'pages.simulateurs.auto-entrepreneur.meta.description', - "Calcul du revenu à partir du chiffre d'affaires, après déduction des cotisations et des impôts" - ), - ogDescription: t( - 'pages.simulateurs.auto-entrepreneur.meta.ogDescription', - "Grâce au simulateur de revenu auto-entrepreneur développé par l'Urssaf, vous pourrez estimer le montant de vos revenus en fonction de votre chiffre d'affaire mensuel ou annuel pour mieux gérer votre trésorerie. Ou dans le sens inverse : savoir quel montant facturer pour atteindre un certain revenu." - ), - ogImage: AutoEntrepreneurPreview, - ogTitle: t( - 'pages.simulateurs.auto-entrepreneur.meta.ogTitle', - 'Auto-entrepreneur : calculez rapidement votre revenu net à partir du CA et vice-versa' - ), - title: t( - 'pages.simulateurs.auto-entrepreneur.meta.titre', - 'Auto-entrepreneurs : simulateur de revenus' - ) - }, - component: function AutoEntrepreneurSimulation() { - return ( - <> - - } /> - - ) - }, - path: sitePaths.simulateurs['auto-entrepreneur'], - shortName: t( - 'pages.simulateurs.auto-entrepreneur.shortname', - 'Auto-entrepreneur' - ), - title: t( - 'pages.simulateurs.auto-entrepreneur.title', - 'Simulateur de revenus auto-entrepreneur' - ), - seoExplanations: ( - -

Comment calculer le revenu net d'un auto-entrepreneur ?

-

- Un auto-entrepreneur doit payer des cotisations sociales à - l'administration. Ces cotisations servent au financement de la - sécurité sociale, et ouvrent des droits pour la retraite ou pour - l'assurance maladie. Elle permettent également de financer la - formation professionnelle. Leur montant varie en fonction du type - d'activité. -

-

- {' '} - - Voir le détail du calcul des cotisations - -

-

- Il ne faut pas oublier de retrancher toutes les dépenses effectuées - dans le cadre de l'activité professionnelle (équipements, matière - premières, local, transport). Bien qu'elles ne soient pas utilisées - pour le calcul des cotisations et de l'impôt, elles doivent être - prises en compte pour vérifier si l'activité est viable - économiquement. -

-

- La formule de calcul complète est donc : -

- - Revenu net = Chiffres d'affaires − Cotisations sociales − - Dépenses professionnelles - -
-

-

- Comment calculer l'impôt sur le revenu pour un auto-entrepreneur ? -

-

- Si vous avez opté pour le versement libératoire lors de la création - de votre auto-entreprise, l'impôt sur le revenu est payé en même - temps que les cotisations sociales. -

-

- {' '} - - Voir comment est calculé le montant du versement libératoire - -

-

- Sinon, vous serez imposé selon le barème standard de l'impôt sur le - revenu. Le revenu imposable est alors calculé comme un pourcentage - du chiffre d'affaires. C'est qu'on appel l'abattement forfaitaire. - Ce pourcentage varie en fonction du type d'activité excercé. On dit - qu'il est forfaitaire car il ne prends pas en compte les dépenses - réelles effectuées dans le cadre de l'activité. -

-

- {' '} - - Voir le détail du calcul du revenu abattu pour un - auto-entrepreneur - -

-

- Ressources utiles -

-
- -
- - ) - }, - indépendant: { - config: indépendantConfig, - icône: '🏃', - iframe: 'simulateur-independant', - path: sitePaths.simulateurs.indépendant, - shortName: t('pages.simulateurs.indépendant.shortname', 'Indépendant'), - title: t( - 'pages.simulateurs.indépendant.title', - 'Simulateur de revenus pour indépendant' - ), - meta: { - title: t( - 'pages.simulateurs.indépendant.meta.title', - 'Indépendant : simulateur de revenus Urssaf' - ), - description: t( - 'pages.simulateurs.indépendant.meta.description', - "Calcul du revenu net après impôt et des cotisations à partir du chiffre d'affaires et inversement" - ) - }, - component: IndépendantSimulation - }, - sasu: { - config: sasuConfig, - icône: '👨‍✈️', - iframe: 'simulateur-assimilesalarie', - meta: { - description: t( - 'pages.simulateurs.sasu.meta.description', - 'Calcul du salaire net à partir du total alloué à la rémunération et inversement' - ), - ogDescription: t( - 'pages.simulateurs.sasu.meta.ogDescription', - 'En tant que dirigeant assimilé-salarié, calculez immédiatement votre revenu net après impôt à partir du total alloué à votre rémunération.' - ), - ogImage: RémunérationSASUPreview, - ogTitle: t( - 'pages.simulateurs.sasu.meta.ogTitle', - 'Rémunération du dirigeant de SASU : un simulateur pour connaître votre salaire net' - ), - title: t( - 'pages.simulateurs.sasu.meta.titre', - 'Dirigeant de SASU : simulateur de revenus Urssaf' - ) - }, - path: sitePaths.simulateurs.SASU, - shortName: t('pages.simulateurs.sasu.shortname', 'Dirigeant de SASU'), - title: t( - 'pages.simulateurs.sasu.title', - 'Simulateur de revenus pour dirigeant de SASU' - ), - component: function SasuSimulation() { - return ( - <> - - } /> - - ) - }, - seoExplanations: ( - -

Comment calculer le salaire d'un dirigeant de SASU ?

-

- Comme pour un salarié classique, le{' '} - dirigeant de sasu paye des cotisations sociales sur - la rémunération qu'il se verse. Les cotisations sont calculées de la - même manière que pour le salarié : elles sont décomposées en partie - employeur et partie salarié et sont exprimées comme un pourcentage - du salaire brut. -

-

- Le dirigeant assimilé-salarié ne paye pas de{' '} - cotisations chômage. Par ailleurs, il ne bénéficie - pas de la{' '} - - réduction générale de cotisations - {' '} - ni des dispositifs encadrés par le code du travail comme les{' '} - - heures supplémentaires - {' '} - ou les primes. -

-

- Il peut en revanche prétendre à la{' '} - - réduction ACRE - {' '} - en debut d'activité, sous certaines conditions. -

-

- Vous pouvez utiliser notre simulateur pour calculer la{' '} - rémunération nette à partir d'un montant superbrut - alloué à la rémunération du dirigeant. Il vous suffit pour cela - saisir le montant total alloué dans la case "total chargé". La - simulation peut ensuite être affinée en répondant aux différentes - questions. -

- - ) - }, - 'artiste-auteur': { - icône: '👩‍🎨', - iframe: 'simulateur-artiste-auteur', - meta: { - title: t( - 'pages.simulateurs.artiste-auteur.meta.title', - 'Artiste-auteur: calcul des cotisations Urssaf' - ), - description: t( - 'pages.simulateurs.artiste-auteur.meta.description', - "Estimez les cotisations sociales sur les droits d'auteur et sur le revenu BNC" - ), - ogTitle: 'Artiste-auteur : estimez vos cotisations Urssaf', - ogDescription: - "Renseignez vos revenus (droits d'auteur et bnc) et découvrez immédiatement le montant des cotisations que vous aurez à payer sur l'année." - }, - path: sitePaths.simulateurs['artiste-auteur'], - title: t( - 'pages.simulateurs.artiste-auteur.title', - 'Estimer mes cotisations d’artiste-auteur' - ), - shortName: t( - 'pages.simulateurs.artiste-auteur.shortname', - 'Artiste-auteur' - ), - component: ArtisteAuteur - }, - 'chômage-partiel': { - component: ChômagePartielComponent, - config: chômageParielConfig, - path: sitePaths.simulateurs['chômage-partiel'], - icône: '😷', - iframe: 'simulateur-chomage-partiel', - meta: { - description: t( - 'pages.simulateurs.chômage-partiel.meta.description', - "Calcul du revenu net pour l'employé et du reste à charge pour l'employeur après remboursement de l'Etat, en prenant en compte toutes les cotisations sociales." - ), - ogDescription: t( - 'pages.simulateurs.chômage-partiel.meta.ogDescription', - "Accédez à une première estimation en saisissant à partir d'un salaire brut. Vous pourrez ensuite personaliser votre situation (temps partiel, convention, etc). Prends en compte la totalité des cotisations, y compris celles spécifiques à l'indemnité (CSG et CRDS)." - ), - ogImage: ChômagePartielPreview, - ogTitle: t( - 'pages.simulateurs.chômage-partiel.meta.ogTitle', - "Simulateur chômage partiel : découvrez l'impact sur le revenu net salarié et le coût total employeur." - ), - title: t( - 'pages.simulateurs.chômage-partiel.meta.titre', - "Calcul de l'indemnité chômage partiel : le simulateur Urssaf" - ) - }, - shortName: t( - 'pages.simulateurs.chômage-partiel.shortname', - 'Chômage partiel' - ), - title: t( - 'pages.simulateurs.chômage-partiel.title', - 'Covid-19 : Simulateur de chômage partiel' - ), - seoExplanations: ( - -

Comment calculer l'indemnité d'activité partielle ?

-

- L'indemnité d'activité partielle de base est fixée par la loi à{' '} - 70% du brut. Elle est proratisée en fonction du - nombre d'heures chômées. Pour un salarié à 2300 € brut mensuel, qui - travaille à 50% de son temps usuel, cela donne{' '} - 2300 € × 50% × 70% = 805 € -

-

- A cette indemnité de base s'ajoute l'indemnité complémentaire pour - les salaires proches du SMIC. Ce complément intervient lorsque le - cumul de la rémunération et de l'indemnité de base est en dessous - d'un SMIC net. Ces indemnités sont prises en charge par l'employeur, - qui sera ensuite remboursé en parti ou en totalité par l'Etat. -

-

- 👉{' '} - - Voir le détail du calcul de l'indemnité - -

-

Comment calculer la part remboursée par l'État ?

-

- L'Etat prend en charge une partie de l'indemnité partielle pour les - salaires allant jusqu'à **4,5 SMIC**, avec un minimum à 8,03€ par - heures chômée. Concrètement, cela abouti à une prise en charge à - 100% pour les salaires proches du SMIC. Celle-ci - diminue progressivement jusqu'à se stabiliser à **93%** pour les - salaires compris entre 2000 € et 7000 € (salaire - correspondant à la limite de 4.5 SMIC). -

-

- 👉{' '} - - Voir le détail du calcul du remboursement de l'indemnité - -

-

Comment déclarer une activité partielle ?

-

- Face à la crise du coronavirus, les modalités de passage en activité - partielle ont été allégées. L'employeur est autorisé a placer ses - salariés en activité partielle avant que la demande officielle ne - soit déposée. Celui-ci dispose ensuite d'un délai de{' '} - 30 jours pour se mettre en règle. Les indemnités - seront versées avec un effet rétro-actif débutant à la mise en place - du chômage partiel. -

-

- 👉{' '} - - Effectuer la demande de chômage partiel - -

-

- {' '} - Quelles sont les cotisations sociales à payer pour l'indemnité - d'activité partielle ? -

-

- L'indemnité d'activité partielle est soumise à la CSG/CRDS et à une - contribution maladie dans certains cas. Pour en savoir plus, voir la - page explicative sur{' '} - - le site de l'URSSAF - - . -

- - ) - }, - 'comparaison-statuts': { - component: SchemeComparaisonPage, - icône: '📊', - path: sitePaths.simulateurs.comparaison, - title: t( - 'pages.simulateurs.comparaison.title', - 'Indépendant, assimilé salarié ou auto-entrepreneur : quel régime choisir ?' - ), - meta: { - description: t( - 'pages.simulateurs.comparaison.meta.description', - 'Auto-entrepreneur, indépendant ou assimilé salarié ? Avec ce comparatif, trouvez le régime qui vous correspond le mieux' - ), - title: t( - 'pages.simulateurs.comparaison.meta.title', - "Création d'entreprise : le comparatif des régimes sociaux" - ) - }, - shortName: t( - 'pages.simulateurs.comparaison.shortname', - 'Comparaison des statuts' - ) - }, - 'économie-collaborative': { - component: ÉconomieCollaborative, - meta: { - title: t( - 'pages.économie-collaborative.meta.title', - 'Déclaration des revenus des plateforme en ligne : guide intéractif' - ), - description: t( - 'pages.économie-collaborative.meta.description', - 'Airbnb, Drivy, Blablacar, Leboncoin... Découvrez comment être en règle dans vos déclarations' - ) - }, - icône: '🙋', - path: sitePaths.simulateurs.économieCollaborative.index, - shortName: t( - 'pages.économie-collaborative.shortname', - 'Guide économie collaborative' - ) - }, - 'aide-déclaration-indépendant': { - component: AideDéclarationIndépendant, - icône: '✍️', - meta: { - description: t( - 'pages.gérer.aide-déclaration-indépendant.meta.description', - 'Calculer facilement les montants des charges sociales à reporter dans votre déclaration de revenu 2019.' - ), - title: t( - 'pages.gérer.aide-déclaration-indépendant.meta.title', - 'Déclaration de revenus indépendant : calcul du montant des cotisations' - ) - }, - path: sitePaths.gérer.déclarationIndépendant, - shortName: t( - 'pages.gérer.aide-déclaration-indépendant.shortname', - 'Aide à la déclaration de revenu' - ), - title: t( - 'pages.gérer.aide-déclaration-indépendant.title', - "Aide à la déclaration de revenus au titre de l'année 2019" - ) - }, - 'demande-mobilité': { - component: FormulaireMobilitéIndépendant, - icône: '🧳', - meta: { - title: t( - 'pages.gérer.demande-mobilité.meta.title', - 'Travailleur indépendant : demande de mobilité en Europe' - ), - description: t( - 'pages.gérer.demande-mobilité.meta.description', - "Formulaire interactif à compléter pour les indépendants souhaitant exercer leur activité dans d'autres pays d'Europe" - ) - }, - path: sitePaths.gérer.formulaireMobilité, - shortName: t( - 'pages.gérer.demande-mobilité.shortname', - 'Demande de mobilité en Europe' - ), - private: true, - iframe: 'demande-mobilité' - }, - médecin: { - config: médecinConfig, - private: true, - icône: '⚕️', - iframe: 'médecin', - path: sitePaths.simulateurs['profession-libérale'].médecin, - shortName: t('pages.simulateurs.médecin.shortname', 'Médecin'), - title: t( - 'pages.simulateurs.médecin.title', - 'Simulateur de revenus pour médecin en libéral' - ), - component: IndépendantSimulation - }, - 'chirurgien-dentiste': { - private: true, - config: dentisteConfig, - icône: '🦷', - iframe: 'chirurgien-dentiste', - path: sitePaths.simulateurs['profession-libérale']['chirurgien-dentiste'], - shortName: t( - 'pages.simulateurs.chirurgien-dentiste.shortname', - 'Chirurgien-dentiste' - ), - title: t( - 'pages.simulateurs.chirurgien-dentiste.title', - 'Simulateur de revenus pour chirurgien-dentiste en libéral' - ), - component: IndépendantSimulation - }, - 'sage-femme': { - private: true, - config: sageFemmeConfig, - icône: '👶', - iframe: 'sage-femme', - path: sitePaths.simulateurs['profession-libérale']['sage-femme'], - shortName: t('pages.simulateurs.sage-femme.shortname', 'Sage-femme'), - title: t( - 'pages.simulateurs.sage-femme.title', - 'Simulateur de revenus pour sage-femme en libéral' - ), - component: IndépendantSimulation - }, - 'auxiliaire-médical': { - private: true, - config: auxiliaireConfig, - icône: '🩹', - iframe: 'auxiliaire-médical', - path: sitePaths.simulateurs['profession-libérale'].auxiliaire, - shortName: t( - 'pages.simulateurs.auxiliaire.shortname', - 'Axiliaire médical' - ), - title: t( - 'pages.simulateurs.auxiliaire.title', - 'Simulateur de revenus pour auxiliaire médical en libéral' - ), - component: IndépendantSimulation - }, - 'profession-libérale': { - private: true, - config: professionLibéraleConfig, - icône: '💻', - meta: { - title: t( - 'pages.simulateurs.profession-libérale.meta.title', - 'Professions libérale : le simulateur Urssaf' - ), - description: t( - 'pages.simulateurs.profession-libérale.meta.description', - "Calcul du revenu net pour les indépendants en libéral à l'impôt sur le revenu (IR, BNC)" - ) - }, - iframe: 'profession-liberale', - path: sitePaths.simulateurs['profession-libérale'].index, - shortName: t( - 'pages.simulateurs.profession-libérale.shortname', - 'Profession libérale' - ), - title: t( - 'pages.simulateurs.profession-libérale.title', - 'Simulateur de revenus pour profession libérale' - ), - component: IndépendantSimulation - } - } -} - -export default function useSimulatorsData(): SimulatorData { - const { t, i18n } = useTranslation() - const sitePaths = useContext(SitePathsContext) - - return useMemo( - () => getSimulatorsData({ t, sitePaths, language: i18n.language }), - [t, sitePaths, i18n.language] - ) -} - -professionLibéraleConfig as SimulationConfig - -const auxiliaireConfig: SimulationConfig = { - ...professionLibéraleConfig, - situation: { - ...professionLibéraleConfig.situation, - "entreprise . catégorie d'activité . libérale règlementée": 'oui', - 'dirigeant . indépendant . PL . métier': "'santé . auxiliaire médical'" - } -} - -const dentisteConfig: SimulationConfig = { - ...professionLibéraleConfig, - situation: { - ...professionLibéraleConfig.situation, - "entreprise . catégorie d'activité . libérale règlementée": 'oui', - 'dirigeant . indépendant . PL . métier': "'santé . chirurgien-dentiste'" - } -} - -const médecinConfig: SimulationConfig = { - ...professionLibéraleConfig, - situation: { - ...professionLibéraleConfig.situation, - "entreprise . catégorie d'activité . libérale règlementée": 'oui', - 'dirigeant . indépendant . PL . métier': "'santé . médecin'" - } -} - -const sageFemmeConfig: SimulationConfig = { - ...professionLibéraleConfig, - situation: { - ...professionLibéraleConfig.situation, - "entreprise . catégorie d'activité . libérale règlementée": 'oui', - 'dirigeant . indépendant . PL . métier': "'santé . sage-femme'" - } -} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ÉconomieCollaborative/ActivitésSelection.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ÉconomieCollaborative/ActivitésSelection.tsx index f051873cc..6f27861e2 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ÉconomieCollaborative/ActivitésSelection.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Simulateurs/ÉconomieCollaborative/ActivitésSelection.tsx @@ -1,14 +1,15 @@ import classnames from 'classnames' -import Animate from 'Components/ui/animate' -import Checkbox from 'Components/ui/Checkbox' -import InfoBulle from 'Components/ui/InfoBulle' import { ScrollToTop } from 'Components/utils/Scroll' import { SitePathsContext } from 'Components/utils/SitePathsContext' import { intersection } from 'ramda' import React, { useCallback, useContext } from 'react' import emoji from 'react-easy-emoji' +import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' import { Link } from 'react-router-dom' +import Animate from 'Components/ui/animate' +import Checkbox from 'Components/ui/Checkbox' +import InfoBulle from 'Components/ui/InfoBulle' import { debounce } from '../../../../../utils' import { toggleActivité } from './actions' import { activités, getTranslatedActivité } from './activitésData' @@ -27,6 +28,9 @@ export default function ActivitésSelection() { ) return ( <> + + {titre} +

{titre}

@@ -146,15 +150,11 @@ export const ActivitéCard = ({ selected, interactive }), - style: { - flex: 1, - minWidth: '15rem' - }, key: title, ...(interactive && { tabIndex: -1 }), onMouseDown: toggle }, -
+
{selected !== undefined && (
diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Stats/Stats.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Stats/Stats.tsx index bf73f262b..5af2b77f3 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/Stats/Stats.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/Stats/Stats.tsx @@ -24,7 +24,7 @@ import styled from 'styled-components' import statsJson from '../../../../data/stats.json' import { capitalise0 } from '../../../../utils' import Privacy from '../../layout/Footer/Privacy' -import useSimulatorsData from '../Simulateurs/metadata' +import { useSimulatorsMetadata } from '../Simulateurs/Home' const stats: StatsData = statsJson as any @@ -78,7 +78,7 @@ export default function Stats() { 'oneMonthAgo' ) const { palettes } = useContext(ThemeColorsContext) - const simulators = Object.values(useSimulatorsData()) + const simulatorsMetadata = useSimulatorsMetadata() return ( <> @@ -130,7 +130,9 @@ export default function Stats() { {stats.simulators[choicesimulators].visites.map( ({ label, nb_visits }) => { - const details = simulators.find(({ path }) => path.includes(label)) + const details = simulatorsMetadata.find(({ sitePath }) => + sitePath.includes(label) + ) if (!details) { return null } @@ -140,12 +142,12 @@ export default function Stats() { value={nb_visits} title={ <> - {details.shortName}{' '} + {details.name}{' '} import('../Dev/ColorPicker')) function IntegrationCustomizer() { const { search } = useLocation() - const simulators = useSimulatorsData() - const integrableModuleNames = useMemo( - () => - Object.values(simulators) - .filter(s => s.iframe && !s.private) - .map(s => s.iframe), - [simulators] - ) const defaultModuleFromUrl = new URLSearchParams(search ?? '').get('module') ?? '' const [currentModule, setCurrentModule] = React.useState( diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/pages/integration/index.tsx b/mon-entreprise/source/sites/mon-entreprise.fr/pages/integration/index.tsx index 29adff825..b15106b53 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/pages/integration/index.tsx +++ b/mon-entreprise/source/sites/mon-entreprise.fr/pages/integration/index.tsx @@ -16,11 +16,16 @@ export default function Integration() { {pathname !== sitePaths.integration.index && (
- 🛠{' '} - - Outils pour les développeurs - {' '} - 🛠 +

+ 🛠{' '} + + Outils pour les développeurs + {' '} + 🛠 +

)} diff --git a/mon-entreprise/source/sites/mon-entreprise.fr/sitePaths.ts b/mon-entreprise/source/sites/mon-entreprise.fr/sitePaths.ts index 79988d372..f146489c8 100644 --- a/mon-entreprise/source/sites/mon-entreprise.fr/sitePaths.ts +++ b/mon-entreprise/source/sites/mon-entreprise.fr/sitePaths.ts @@ -55,14 +55,8 @@ const sitePathsFr = { comparaison: '/comparaison-régimes-sociaux', salarié: '/salaire-brut-net', 'artiste-auteur': '/artiste-auteur', - 'profession-libérale': { - index: '/profession-liberale', - médecin: '/medecin', - auxiliaire: '/auxiliaire-médical', - 'chirurgien-dentiste': '/chirurgien-dentiste', - 'sage-femme': '/sage-femme' - }, 'chômage-partiel': '/chômage-partiel', + 'profession-libérale': '/profession-libérale/:subsimulator?', économieCollaborative: { index: '/économie-collaborative', votreSituation: '/votre-situation' @@ -113,13 +107,6 @@ const sitePathsEn = { salarié: '/salary', 'artiste-auteur': '/artist-author', 'chômage-partiel': '/partial-unemployement', - 'profession-libérale': { - index: '/liberal-profession', - médecin: '/doctor', - auxiliaire: '/medical-auxiliary', - 'chirurgien-dentiste': '/dental-surgeon', - 'sage-femme': '/midwife' - }, économieCollaborative: { index: '/sharing-economy', votreSituation: '/your-situation' diff --git a/mon-entreprise/test/regressions/__snapshots__/simulations.jest.js.snap b/mon-entreprise/test/regressions/__snapshots__/simulations.jest.js.snap index 6424c9e6a..2268b108e 100644 --- a/mon-entreprise/test/regressions/__snapshots__/simulations.jest.js.snap +++ b/mon-entreprise/test/regressions/__snapshots__/simulations.jest.js.snap @@ -83,30 +83,15 @@ exports[`calculate simulations-artiste-auteur: salarié 2`] = `"[1603]"`; exports[`calculate simulations-artiste-auteur: salarié 3`] = `"[12410]"`; -exports[`calculate simulations-auto-entrepreneur: ACRE 1`] = ` -"[20686,57,1667,0,20000] -Notifications affichées : dirigeant . auto-entrepreneur . notification valeur annuelle" -`; +exports[`calculate simulations-auto-entrepreneur: ACRE 1`] = `"[20686,57,1667,0,20000]"`; -exports[`calculate simulations-auto-entrepreneur: ACRE 2`] = ` -"[33228,269,2500,0,30000] -Notifications affichées : dirigeant . auto-entrepreneur . notification valeur annuelle" -`; +exports[`calculate simulations-auto-entrepreneur: ACRE 2`] = `"[33228,269,2500,0,30000]"`; -exports[`calculate simulations-auto-entrepreneur: ACRE 3`] = ` -"[45267,439,3333,0,40000] -Notifications affichées : dirigeant . auto-entrepreneur . notification valeur annuelle" -`; +exports[`calculate simulations-auto-entrepreneur: ACRE 3`] = `"[45267,439,3333,0,40000]"`; -exports[`calculate simulations-auto-entrepreneur: aides 1`] = ` -"[5171,14,417,0,5000] -Notifications affichées : dirigeant . auto-entrepreneur . notification valeur annuelle" -`; +exports[`calculate simulations-auto-entrepreneur: aides 1`] = `"[5171,14,417,0,5000]"`; -exports[`calculate simulations-auto-entrepreneur: aides 2`] = ` -"[51714,143,4167,0,50000] -Notifications affichées : dirigeant . auto-entrepreneur . notification valeur annuelle" -`; +exports[`calculate simulations-auto-entrepreneur: aides 2`] = `"[51714,143,4167,0,50000]"`; exports[`calculate simulations-auto-entrepreneur: impôt sur le revenu 1`] = `"[32092,591,2083,706,24294]"`; @@ -289,20 +274,11 @@ exports[`calculate simulations-rémunération-dirigeant (assimilé salarié): é exports[`calculate simulations-rémunération-dirigeant (assimilé salarié): échelle de rémunération 8`] = `"[4751,0,0,52684,4,46]"`; -exports[`calculate simulations-rémunération-dirigeant (auto-entrepreneur): ACRE 1`] = ` -"[0,0,806,2046,2,0] -Notifications affichées : dirigeant . auto-entrepreneur . notification valeur annuelle" -`; +exports[`calculate simulations-rémunération-dirigeant (auto-entrepreneur): ACRE 1`] = `"[0,0,806,2046,2,0]"`; -exports[`calculate simulations-rémunération-dirigeant (auto-entrepreneur): ACRE 2`] = ` -"[0,0,1611,4093,3,8] -Notifications affichées : dirigeant . auto-entrepreneur . notification valeur annuelle" -`; +exports[`calculate simulations-rémunération-dirigeant (auto-entrepreneur): ACRE 2`] = `"[0,0,1611,4093,3,8]"`; -exports[`calculate simulations-rémunération-dirigeant (auto-entrepreneur): ACRE 3`] = ` -"[0,0,2337,6139,4,12] -Notifications affichées : dirigeant . auto-entrepreneur . notification valeur annuelle" -`; +exports[`calculate simulations-rémunération-dirigeant (auto-entrepreneur): ACRE 3`] = `"[0,0,2337,6139,4,12]"`; exports[`calculate simulations-rémunération-dirigeant (auto-entrepreneur): Contrats Madelin 1`] = `"[0,0,2070,8186,4,16]"`; diff --git a/mon-entreprise/test/regressions/simulations.jest.js b/mon-entreprise/test/regressions/simulations.jest.js index abd371913..4969352fe 100644 --- a/mon-entreprise/test/regressions/simulations.jest.js +++ b/mon-entreprise/test/regressions/simulations.jest.js @@ -8,11 +8,11 @@ /* eslint-disable no-undef */ import Engine from 'publicodes' import rules from '../../source/rules' -import artisteAuteurConfig from '../../source/sites/mon-entreprise.fr/pages/Simulateurs/configs/artiste-auteur.yaml' -import autoentrepreneurConfig from '../../source/sites/mon-entreprise.fr/pages/Simulateurs/configs/auto-entrepreneur.yaml' -import independantConfig from '../../source/sites/mon-entreprise.fr/pages/Simulateurs/configs/indépendant.yaml' -import remunerationDirigeantConfig from '../../source/sites/mon-entreprise.fr/pages/Simulateurs/configs/rémunération-dirigeant.yaml' -import employeeConfig from '../../source/sites/mon-entreprise.fr/pages/Simulateurs/configs/salarié.yaml' +import artisteAuteurConfig from '../../source/components/simulationConfigs/artiste-auteur.yaml' +import autoentrepreneurConfig from '../../source/components/simulationConfigs/auto-entrepreneur.yaml' +import independantConfig from '../../source/components/simulationConfigs/indépendant.yaml' +import remunerationDirigeantConfig from '../../source/components/simulationConfigs/rémunération-dirigeant.yaml' +import employeeConfig from '../../source/components/simulationConfigs/salarié.yaml' import aideDéclarationConfig from '../../source/sites/mon-entreprise.fr/pages/Gérer/AideDéclarationIndépendant/config.yaml' import artisteAuteurSituations from './simulations-artiste-auteur.yaml' import autoEntrepreneurSituations from './simulations-auto-entrepreneur.yaml'