Skip to content

Commit

Permalink
refactor: localstorage should not send events
Browse files Browse the repository at this point in the history
  • Loading branch information
victor committed Jan 23, 2025
1 parent cd6dec3 commit a98a410
Show file tree
Hide file tree
Showing 9 changed files with 84 additions and 55 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -19,17 +19,27 @@ type Props = {
onAgreementSelect: (agreement?: EnterpriseAgreement, mode?: string) => void;
onDisplayClick: (ev: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void;
contribution: Contribution;
defaultAgreement?: EnterpriseAgreement;
};

export function ContributionGenericAgreementSearch({
contribution,
onAgreementSelect,
onDisplayClick,
defaultAgreement,
}: Props) {
const { slug, isNoCDT } = contribution;

const [selectedAgreement, setSelectedAgreement] =
useState<EnterpriseAgreement>();
const [isValid, setIsValid] = useState(
defaultAgreement ? isAgreementValid(contribution, defaultAgreement) : false
);
useEffect(() => {
setIsValid(
isAgreementValid(contribution, selectedAgreement ?? defaultAgreement)
);
}, [selectedAgreement, defaultAgreement]);
const selectedAgreementAlert = (agreement: EnterpriseAgreement) => {
const isSupported = isCCSupported(contribution, agreement);
const isUnextended = isCCUnextended(contribution, agreement);
Expand Down Expand Up @@ -98,13 +108,14 @@ export function ContributionGenericAgreementSearch({
? "La convention collective est nécessaire pour obtenir une réponse car le code du travail ne prévoit rien sur ce sujet."
: "La réponse dépend de la convention collective à laquelle votre entreprise est rattachée. Veuillez renseigner votre situation afin d’obtenir une réponse adaptée."
}
defaultAgreement={defaultAgreement}
/>
{(!contribution.isNoCDT || selectedAgreement) && (
{((contribution.isNoCDT && isValid) || !contribution.isNoCDT) && (
<Button
className={fr.cx("fr-mt-2w")}
linkProps={{
href: selectedAgreement
? `/contribution/${selectedAgreement.num}-${slug}`
href: isValid
? `/contribution/${(selectedAgreement ?? defaultAgreement)?.num}-${slug}`
: "",
onClick: onDisplayClick,
}}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import { ContributionAgreementSelect } from "./ContributionAgreemeentSelect";
import { ContributionAgreementContent } from "./ContributionAgreementContent";
import { Contribution } from "./type";
import { A11yLink } from "../../common/A11yLink";
import { useLocalStorageForAgreement } from "../common/useLocalStorage";

type Props = {
contribution: Contribution;
Expand All @@ -37,7 +38,7 @@ export function ContributionLayout({ contribution }: Props) {

const [displayGeneric, setDisplayGeneric] = useState(false);
const [selectedAgreement, setSelectedAgreement] =
useState<EnterpriseAgreement>();
useLocalStorageForAgreement();
const {
emitAgreementTreatedEvent,
emitAgreementUntreatedEvent,
Expand Down Expand Up @@ -101,6 +102,7 @@ export function ContributionLayout({ contribution }: Props) {
contribution={contribution}
onAgreementSelect={(agreement, mode) => {
setSelectedAgreement(agreement);
setDisplayGeneric(false);
if (!agreement) return;
switch (mode) {
case "p1":
Expand Down Expand Up @@ -133,6 +135,7 @@ export function ContributionLayout({ contribution }: Props) {
emitDisplayAgreementContent(getTitle());
}
}}
defaultAgreement={selectedAgreement}
/>
</>
) : (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -52,18 +52,18 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
class="fr-accordion__title"
>
<button
aria-controls="b95d9272-7473-4694-b02a-7f46f641cd8d-collapse"
aria-controls="fb3e4700-1a45-42e0-9277-15475b951211-collapse"
aria-expanded="false"
class="fr-accordion__btn"
id="b95d9272-7473-4694-b02a-7f46f641cd8d__toggle-btn"
id="fb3e4700-1a45-42e0-9277-15475b951211__toggle-btn"
type="button"
>
Congés payés
</button>
</h4>
<div
class="fr-collapse"
id="b95d9272-7473-4694-b02a-7f46f641cd8d-collapse"
id="fb3e4700-1a45-42e0-9277-15475b951211-collapse"
>
<div>
<div
Expand All @@ -80,10 +80,10 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
class="fr-accordion__title"
>
<button
aria-controls="c5a9a538-7207-4675-99ff-0805b22fe1e6-collapse"
aria-controls="44f5add2-42a4-4bec-8845-5e3e658473b9-collapse"
aria-expanded="false"
class="fr-accordion__btn"
id="c5a9a538-7207-4675-99ff-0805b22fe1e6__toggle-btn"
id="44f5add2-42a4-4bec-8845-5e3e658473b9__toggle-btn"
type="button"
>
Expand All @@ -93,7 +93,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
</h5>
<div
class="fr-collapse"
id="c5a9a538-7207-4675-99ff-0805b22fe1e6-collapse"
id="44f5add2-42a4-4bec-8845-5e3e658473b9-collapse"
>
<div>
<p>
Expand All @@ -114,10 +114,10 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
class="fr-accordion__title"
>
<button
aria-controls="24022d69-ef1f-49b1-94c7-e91dae4e8ad1-collapse"
aria-controls="d0aa7deb-a17e-478e-97cc-6b35300dc578-collapse"
aria-expanded="false"
class="fr-accordion__btn"
id="24022d69-ef1f-49b1-94c7-e91dae4e8ad1__toggle-btn"
id="d0aa7deb-a17e-478e-97cc-6b35300dc578__toggle-btn"
type="button"
>
Expand All @@ -127,7 +127,7 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
</h5>
<div
class="fr-collapse"
id="24022d69-ef1f-49b1-94c7-e91dae4e8ad1-collapse"
id="d0aa7deb-a17e-478e-97cc-6b35300dc578-collapse"
>
<div>
<p>
Expand All @@ -149,18 +149,18 @@ exports[`DisplayContentContribution Accordions should not fail if no summary tag
class="fr-accordion__title"
>
<button
aria-controls="817700f8-ba7c-4643-a6dc-5cfcb1d0feb1-collapse"
aria-controls="ea238161-2712-4e62-bde2-410e4b904934-collapse"
aria-expanded="false"
class="fr-accordion__btn"
id="817700f8-ba7c-4643-a6dc-5cfcb1d0feb1__toggle-btn"
id="ea238161-2712-4e62-bde2-410e4b904934__toggle-btn"
type="button"
>
Licenciement notifié pendant les congés payés
</button>
</h5>
<div
class="fr-collapse"
id="817700f8-ba7c-4643-a6dc-5cfcb1d0feb1-collapse"
id="ea238161-2712-4e62-bde2-410e4b904934-collapse"
>
<div>
<p>
Expand Down Expand Up @@ -273,18 +273,18 @@ exports[`DisplayContentContribution Accordions should replace details element wi
class="fr-accordion__title"
>
<button
aria-controls="44ee4e1a-3945-4fee-b603-cae2e71de684-collapse"
aria-controls="8dec1493-8d8a-4c7d-bade-12c7d13ae062-collapse"
aria-expanded="false"
class="fr-accordion__btn"
id="44ee4e1a-3945-4fee-b603-cae2e71de684__toggle-btn"
id="8dec1493-8d8a-4c7d-bade-12c7d13ae062__toggle-btn"
type="button"
>
Ceci est un sous titre
</button>
</h4>
<div
class="fr-collapse"
id="44ee4e1a-3945-4fee-b603-cae2e71de684-collapse"
id="8dec1493-8d8a-4c7d-bade-12c7d13ae062-collapse"
>
<div>
<p>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,7 @@ describe("<ContributionLayout />", () => {
rendering = render(<ContributionLayout contribution={contribution} />);
});
it("should display correctly when no agreement is selected", async () => {
fireEvent.click(ccUi.radio.agreementSearchOption.get());
expect(ccUi.buttonDisplayInfo.query()).toBeInTheDocument();
expect(ui.generic.linkDisplayInfo.query()).toBeInTheDocument();
expect(ui.generic.title.query()).toBeInTheDocument();
Expand All @@ -113,6 +114,7 @@ describe("<ContributionLayout />", () => {
},
])
);
fireEvent.click(ccUi.radio.agreementSearchOption.get());
expect(ui.generic.linkDisplayInfo.query()).toBeInTheDocument();
fireEvent.change(ccUi.searchByName.input.get(), {
target: { value: "16" },
Expand All @@ -125,21 +127,21 @@ describe("<ContributionLayout />", () => {
"/contribution/16-slug"
);
expect(ccUi.warning.nonTreatedAgreement.query()).not.toBeInTheDocument();
expect(sendEvent).toHaveBeenLastCalledWith({
expect(sendEvent).toHaveBeenCalledWith({
action: "cc_select_traitée",
category: "outil",
name: "0016",
});
});

it("should display correctly when a selecting agreement 3239", async () => {
fireEvent.click(entrepriseUi.radio.enterpriseSearchOption.get());
fireEvent.click(ccUi.radio.enterpriseSearchOption.get());
fireEvent.click(ccUi.searchByEnterprise.noEnterprise.get());
expect(ccUi.buttonDisplayInfo.query()).toHaveAttribute(
"href",
"/contribution/3239-slug"
);
expect(sendEvent).toHaveBeenLastCalledWith({
expect(sendEvent).toHaveBeenCalledWith({
action: "cc_select_traitée",
category: "outil",
name: "3239",
Expand All @@ -163,6 +165,7 @@ describe("<ContributionLayout />", () => {
},
])
);
fireEvent.click(ccUi.radio.agreementSearchOption.get());
fireEvent.change(ccUi.searchByName.input.get(), {
target: { value: "1388" },
});
Expand All @@ -174,7 +177,7 @@ describe("<ContributionLayout />", () => {
expect(ccUi.buttonDisplayInfo.query()).toHaveAttribute("href", "");
expect(ccUi.warning.title.query()).toBeInTheDocument();
expect(ccUi.warning.nonTreatedAgreement.query()).toBeInTheDocument();
expect(sendEvent).toHaveBeenLastCalledWith({
expect(sendEvent).toHaveBeenCalledWith({
action: "cc_select_non_traitée",
category: "outil",
name: "1388",
Expand All @@ -194,6 +197,7 @@ describe("<ContributionLayout />", () => {
);
});
it("should display correctly when no agreement is selected", () => {
fireEvent.click(ccUi.radio.agreementSearchOption.get());
expect(ui.generic.noCdtDescription.query()).toBeInTheDocument();
expect(ui.generic.linkDisplayInfo.query()).not.toBeInTheDocument();
expect(ccUi.buttonDisplayInfo.query()).not.toBeInTheDocument();
Expand All @@ -214,6 +218,7 @@ describe("<ContributionLayout />", () => {
},
])
);
fireEvent.click(ccUi.radio.agreementSearchOption.get());
expect(ccUi.buttonDisplayInfo.query()).not.toBeInTheDocument();
fireEvent.change(ccUi.searchByName.input.get(), {
target: { value: "16" },
Expand All @@ -225,7 +230,7 @@ describe("<ContributionLayout />", () => {
"/contribution/16-slug"
);
expect(ccUi.warning.nonTreatedAgreement.query()).not.toBeInTheDocument();
expect(sendEvent).toHaveBeenLastCalledWith({
expect(sendEvent).toHaveBeenCalledWith({
action: "cc_select_traitée",
category: "outil",
name: "0016",
Expand All @@ -249,6 +254,7 @@ describe("<ContributionLayout />", () => {
},
])
);
fireEvent.click(ccUi.radio.agreementSearchOption.get());
fireEvent.change(ccUi.searchByName.input.get(), {
target: { value: "1388" },
});
Expand All @@ -263,7 +269,7 @@ describe("<ContributionLayout />", () => {
expect(
rendering.getByText(new RegExp(contribution.messageBlockGenericNoCDT))
).toBeInTheDocument();
expect(sendEvent).toHaveBeenLastCalledWith({
expect(sendEvent).toHaveBeenCalledWith({
action: "cc_select_non_traitée",
category: "outil",
name: "1388",
Expand All @@ -288,6 +294,7 @@ describe("<ContributionLayout />", () => {
},
])
);
fireEvent.click(ccUi.radio.agreementSearchOption.get());
fireEvent.change(ccUi.searchByName.input.get(), {
target: { value: "29" },
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,17 +15,18 @@ type Props = {
selectedAgreementAlert?: (
agreement?: EnterpriseAgreement
) => NonNullable<ReactNode> | undefined;
defaultAgreement?: EnterpriseAgreement;
};

export const AgreementSearchForm = ({
description,
onAgreementSelect,
selectedAgreementAlert,
defaultAgreement,
}: Props) => {
const [storageAgreement, setStorageAgreement] = useLocalStorageForAgreement();
const [mode, setMode] = useState<
"agreementSearch" | "enterpriseSearch" | "noSearch" | undefined
>(!!storageAgreement ? "agreementSearch" : undefined);
>(!!defaultAgreement ? "agreementSearch" : undefined);

return (
<>
Expand Down Expand Up @@ -58,17 +59,15 @@ export const AgreementSearchForm = ({
<AgreementSearchInput
onAgreementSelect={(agreement) => {
if (onAgreementSelect) onAgreementSelect(agreement, "p1");
setStorageAgreement(agreement);
}}
selectedAgreementAlert={selectedAgreementAlert}
defaultAgreement={storageAgreement}
defaultAgreement={defaultAgreement}
/>
)}
{mode === "enterpriseSearch" && (
<EnterpriseAgreementSearchInput
onAgreementSelect={(agreement) => {
if (onAgreementSelect) onAgreementSelect(agreement, "p2");
setStorageAgreement(agreement);
}}
selectedAgreementAlert={selectedAgreementAlert}
/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,6 @@ export const AgreementSearchInput = ({
defaultAgreement,
}: Props) => {
const [selectedAgreement, setSelectedAgreement] = useState(defaultAgreement);
useEffect(() => {
if (onAgreementSelect) onAgreementSelect(selectedAgreement);
}, [selectedAgreement]);
const [searchState, setSearchState] = useState<
"noSearch" | "lowSearch" | "notFoundSearch" | "errorSearch" | "fullSearch"
>("noSearch");
Expand Down Expand Up @@ -86,6 +83,7 @@ export const AgreementSearchInput = ({
stateRelatedMessage={getStateMessage()}
onChange={(agreement) => {
setSelectedAgreement(agreement);
if (onAgreementSelect) onAgreementSelect(agreement);
if (agreement) {
emitSelectEvent(`idcc${agreement.id}`);
}
Expand Down
Loading

0 comments on commit a98a410

Please sign in to comment.