diff --git a/packages/code-du-travail-frontend/src/e2e/contributions.e2e.ts b/packages/code-du-travail-frontend/src/e2e/contributions.e2e.ts index e65f0c5ce3..3619bcfc39 100644 --- a/packages/code-du-travail-frontend/src/e2e/contributions.e2e.ts +++ b/packages/code-du-travail-frontend/src/e2e/contributions.e2e.ts @@ -69,9 +69,10 @@ test.describe("Contributions", () => { ); await page - .getByRole("button", { - name: "Afficher les informations sans sélectionner une convention collective", - }) + .getByLabel("Je ne souhaite pas renseigner ma convention collective.") + .check({ force: true }); + await page + .getByRole("button", { name: "Afficher les informations" }) .click(); await expect( page.getByText( diff --git a/packages/code-du-travail-frontend/src/modules/contributions/ContributionGeneric.tsx b/packages/code-du-travail-frontend/src/modules/contributions/ContributionGeneric.tsx index 3e21bef1f5..f3d35abcbf 100644 --- a/packages/code-du-travail-frontend/src/modules/contributions/ContributionGeneric.tsx +++ b/packages/code-du-travail-frontend/src/modules/contributions/ContributionGeneric.tsx @@ -10,8 +10,6 @@ import { } from "../utils/useLocalStorage"; import { useRouter } from "next/navigation"; import { ContributionGenericAgreementSearch } from "./ContributionGenericAgreementSearch"; -import { Button } from "@codegouvfr/react-dsfr/Button"; -import { fr } from "@codegouvfr/react-dsfr"; type Props = { contribution: Contribution; @@ -33,8 +31,6 @@ export function ContributionGeneric({ contribution }: Props) { emitAgreementUntreatedEvent, emitDisplayAgreementContent, emitDisplayGeneralContent, - emitDisplayGenericContent, - emitClickP3, } = useContributionTracking(); const genericTitleRef = useRef(null); @@ -94,8 +90,6 @@ export function ContributionGeneric({ contribution }: Props) { scrollToTitle(); if (selectedAgreement) { emitDisplayGeneralContent(getTitle()); - } else { - emitDisplayGenericContent(getTitle()); } } else { emitDisplayAgreementContent(getTitle()); @@ -106,40 +100,24 @@ export function ContributionGeneric({ contribution }: Props) { /> {!isNoCDT && !isAgreementValid(contribution, selectedAgreement) && ( - <> - {!displayGeneric && ( - - )} - - - Cette réponse correspond à ce que prévoit le code du - travail, elle ne tient pas compte des spécificités de la{" "} - {selectedAgreement.shortTitle} - -

- ) - } - /> - + + + Cette réponse correspond à ce que prévoit le code du travail, + elle ne tient pas compte des spécificités de la{" "} + {selectedAgreement.shortTitle} + +

+ ) + } + /> )} ); diff --git a/packages/code-du-travail-frontend/src/modules/contributions/ContributionGenericAgreementSearch.tsx b/packages/code-du-travail-frontend/src/modules/contributions/ContributionGenericAgreementSearch.tsx index 64d8a793a5..d4fa5747d8 100644 --- a/packages/code-du-travail-frontend/src/modules/contributions/ContributionGenericAgreementSearch.tsx +++ b/packages/code-du-travail-frontend/src/modules/contributions/ContributionGenericAgreementSearch.tsx @@ -6,7 +6,10 @@ import Image from "next/image"; import AgreementSearch from "../convention-collective/AgreementSearch.svg"; import { useRouter } from "next/navigation"; -import { Agreement } from "src/modules/outils/indemnite-depart/types"; +import { + Agreement, + AgreementRoute, +} from "src/modules/outils/indemnite-depart/types"; import { isAgreementSupported, isAgreementUnextended, @@ -16,6 +19,7 @@ import { Contribution } from "./type"; import Link from "../common/Link"; import BlueCard from "../common/BlueCard"; import { AgreementSearchForm } from "../convention-collective/AgreementSearch/AgreementSearchForm"; +import { AccessibleAlert } from "../outils/common/components/AccessibleAlert"; type Props = { onAgreementSelect: (agreement?: Agreement) => void; @@ -26,6 +30,9 @@ type Props = { personalizeTitleRef: React.RefObject; }; +const MISSING_ROUTE_ERROR = + "Veuillez sélectionner l'une des options ci-dessus pour afficher les informations."; + export function ContributionGenericAgreementSearch({ contribution, onAgreementSelect, @@ -35,8 +42,12 @@ export function ContributionGenericAgreementSearch({ personalizeTitleRef, }: Props) { const router = useRouter(); - const { slug } = contribution; + const { slug, isNoCDT } = contribution; const [isValid, setIsValid] = useState(false); + const [selectedRoute, setSelectedRoute] = useState< + AgreementRoute | undefined + >(); + const [showMissingRouteError, setShowMissingRouteError] = useState(false); useEffect(() => { setIsValid(isAgreementValid(contribution, selectedAgreement)); @@ -45,7 +56,7 @@ export function ContributionGenericAgreementSearch({ const selectedAgreementAlert = (agreement: Agreement) => { const isSupported = isAgreementSupported(contribution, agreement); const isUnextended = isAgreementUnextended(contribution, agreement); - if (contribution.isNoCDT) { + if (isNoCDT) { if (isUnextended && agreement.url) return ( <> @@ -90,6 +101,27 @@ export function ContributionGenericAgreementSearch({ if (!isSupported) return <>Vous pouvez consulter les informations générales ci-dessous.; }; + + const noAgreementBanner = ( + + Vous pouvez passer cette étape et poursuivre la simulation qui vous + fournira un résultat basé sur le code du travail. Nous vous + recommandons de renseigner votre convention collective qui peut + prévoir un résultat plus favorable que celui définit par le code du + travail. +

+ } + severity="info" + className={["fr-mt-2w"]} + data-testid="no-agreement-banner" + /> + ); + + const isButtonDisplayed = (isNoCDT && isValid) || !isNoCDT; + return (
@@ -123,12 +155,30 @@ export function ContributionGenericAgreementSearch({ ); personalizeTitle?.focus(); }} + showNoAgreementOption={!isNoCDT} + noAgreementContent={noAgreementBanner} + onRouteChange={(route) => { + setSelectedRoute(route); + setShowMissingRouteError(false); + }} + error={showMissingRouteError ? MISSING_ROUTE_ERROR : undefined} /> - {((contribution.isNoCDT && isValid) || !contribution.isNoCDT) && ( + {isButtonDisplayed && (