From c1fd3d8ef0d153b54bc137cbe32a7915da659f72 Mon Sep 17 00:00:00 2001 From: Victor Zeinstra Date: Fri, 13 Dec 2024 13:24:45 +0100 Subject: [PATCH] fix: ajout du tracking sur outil recherche cc (#6366) * fix: ajout du tracking sur outil recherche cc * chore: review * chore: review --------- Co-authored-by: victor --- .../AgreementSearch/AgreementSearchInput.tsx | 5 ++++ .../__tests__/AgreementSearchByName.test.tsx | 15 +++++++++++ .../modules/convention-collective/tracking.ts | 24 ++++++++++++++++++ .../EnterpriseAgreementSearchInput.tsx | 5 ++++ .../EnterpriseAgreementSearch.test.tsx | 15 +++++++++++ .../EnterpriseAgreementSearch/tracking.ts | 25 +++++++++++++++++++ 6 files changed, 89 insertions(+) create mode 100644 packages/code-du-travail-frontend/src/modules/convention-collective/tracking.ts create mode 100644 packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/tracking.ts diff --git a/packages/code-du-travail-frontend/src/modules/convention-collective/AgreementSearch/AgreementSearchInput.tsx b/packages/code-du-travail-frontend/src/modules/convention-collective/AgreementSearch/AgreementSearchInput.tsx index d362fc048e..b2fd1ace0f 100644 --- a/packages/code-du-travail-frontend/src/modules/convention-collective/AgreementSearch/AgreementSearchInput.tsx +++ b/packages/code-du-travail-frontend/src/modules/convention-collective/AgreementSearch/AgreementSearchInput.tsx @@ -7,6 +7,7 @@ import { useState } from "react"; import { Autocomplete } from "../../common/Autocomplete/Autocomplete"; import { Agreement } from "../../../outils/types"; import { searchAgreement } from "../search"; +import { useAgreementSearchTracking } from "../tracking"; type Props = { onSearch?: (query: string, value?: Agreement[]) => void; @@ -17,6 +18,7 @@ export const AgreementSearchInput = ({ onSearch }: Props) => { "noSearch" | "lowSearch" | "notFoundSearch" | "errorSearch" | "fullSearch" >("noSearch"); const [error, setError] = useState(""); + const { emitAgreementSearchInputEvent } = useAgreementSearchTracking(); const getStateMessage = () => { switch (searchState) { case "lowSearch": @@ -73,6 +75,9 @@ export const AgreementSearchInput = ({ onSearch }: Props) => { }} search={searchAgreement} onSearch={(query, agreements) => { + if (query) { + emitAgreementSearchInputEvent(query); + } if (onSearch) onSearch(query, agreements); if (!query) { setSearchState("noSearch"); diff --git a/packages/code-du-travail-frontend/src/modules/convention-collective/__tests__/AgreementSearchByName.test.tsx b/packages/code-du-travail-frontend/src/modules/convention-collective/__tests__/AgreementSearchByName.test.tsx index f85e7edea9..e61d1ba9ad 100644 --- a/packages/code-du-travail-frontend/src/modules/convention-collective/__tests__/AgreementSearchByName.test.tsx +++ b/packages/code-du-travail-frontend/src/modules/convention-collective/__tests__/AgreementSearchByName.test.tsx @@ -6,6 +6,15 @@ import { ui } from "./ui"; import { wait } from "@testing-library/user-event/dist/utils"; import { act } from "react-dom/test-utils"; import { searchAgreement } from "../search"; +import { sendEvent } from "../../utils"; + +jest.mock("../../utils", () => ({ + sendEvent: jest.fn(), +})); + +jest.mock("uuid", () => ({ + v4: jest.fn(() => ""), +})); jest.mock("../search", () => ({ searchAgreement: jest.fn(), @@ -37,6 +46,12 @@ describe("Trouver sa CC - recherche par nom de CC", () => { userAction = new UserAction(); userAction.setInput(ui.searchByName.input.get(), "16"); await wait(); + expect(sendEvent).toHaveBeenCalledTimes(1); + expect(sendEvent).toHaveBeenCalledWith({ + action: "Trouver sa convention collective", + category: "cc_search", + name: '{"query":"16"}', + }); expect( ui.searchByName.autocompleteLines.IDCC16.name.query() ).toBeInTheDocument(); diff --git a/packages/code-du-travail-frontend/src/modules/convention-collective/tracking.ts b/packages/code-du-travail-frontend/src/modules/convention-collective/tracking.ts new file mode 100644 index 0000000000..43922ba1ef --- /dev/null +++ b/packages/code-du-travail-frontend/src/modules/convention-collective/tracking.ts @@ -0,0 +1,24 @@ +import { v4 as generateUUID } from "uuid"; +import { sendEvent } from "../utils"; + +export enum TrackingAgreementSearchEvent { + CC_SEARCH = "cc_search", + ENTERPRISE_SEARCH = "enterprise_search", +} + +export const AGREEMENT_SEARCH_ACTION = "Trouver sa convention collective"; + +export const useAgreementSearchTracking = () => { + const emitAgreementSearchInputEvent = (query: string) => { + sendEvent({ + category: TrackingAgreementSearchEvent.CC_SEARCH, + action: AGREEMENT_SEARCH_ACTION, + name: JSON.stringify({ query }), + value: generateUUID(), + }); + }; + + return { + emitAgreementSearchInputEvent, + }; +}; diff --git a/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/EnterpriseAgreementSearchInput.tsx b/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/EnterpriseAgreementSearchInput.tsx index c7f8e41022..529aa2a1cd 100644 --- a/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/EnterpriseAgreementSearchInput.tsx +++ b/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/EnterpriseAgreementSearchInput.tsx @@ -15,6 +15,7 @@ import { searchEnterprises } from "../queries"; import { Enterprise } from "../types"; import { ApiGeoResult } from "../../Location/searchCities"; import { CardTitleStyle, ButtonStyle } from "../../convention-collective/style"; +import { useEnterpriseAgreementSearchTracking } from "./tracking"; type Props = { widgetMode?: boolean; @@ -30,6 +31,9 @@ export const EnterpriseAgreementSearchInput = ({ const [searchState, setSearchState] = useState< "noSearch" | "notFoundSearch" | "errorSearch" | "fullSearch" | "required" >("noSearch"); + const { emitEnterpriseAgreementSearchInputEvent } = + useEnterpriseAgreementSearchTracking(); + const [search, setSearch] = useState(defaultSearch); const [loading, setLoading] = useState(false); const [location, setLocation] = useState( @@ -85,6 +89,7 @@ export const EnterpriseAgreementSearchInput = ({ setSearchState("required"); return; } + emitEnterpriseAgreementSearchInputEvent(search, location); setLoading(true); try { const result = await searchEnterprises({ diff --git a/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/__tests__/EnterpriseAgreementSearch.test.tsx b/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/__tests__/EnterpriseAgreementSearch.test.tsx index 00e56302dc..a7c09522f0 100644 --- a/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/__tests__/EnterpriseAgreementSearch.test.tsx +++ b/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/__tests__/EnterpriseAgreementSearch.test.tsx @@ -5,6 +5,15 @@ import { EnterpriseAgreementSearch } from "../EnterpriseAgreementSearch"; import { ui } from "./ui"; import { wait } from "@testing-library/user-event/dist/utils"; import { searchEnterprises } from "../../queries"; +import { sendEvent } from "../../../utils"; + +jest.mock("../../../utils", () => ({ + sendEvent: jest.fn(), +})); + +jest.mock("uuid", () => ({ + v4: jest.fn(() => ""), +})); jest.mock("../../queries", () => ({ searchEnterprises: jest.fn(), @@ -58,6 +67,12 @@ describe("Trouver sa CC - recherche par nom d'entreprise CC", () => { ); userAction.click(ui.enterpriseAgreementSearch.submitButton.get()); await wait(); + expect(sendEvent).toHaveBeenCalledTimes(1); + expect(sendEvent).toHaveBeenCalledWith({ + action: "Trouver sa convention collective", + category: "enterprise_search", + name: '{"query":"carrefour"}', + }); expect( ui.enterpriseAgreementSearch.resultLines.carrefour.title.query() ).toBeInTheDocument(); diff --git a/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/tracking.ts b/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/tracking.ts new file mode 100644 index 0000000000..3b1a137d67 --- /dev/null +++ b/packages/code-du-travail-frontend/src/modules/enterprise/EnterpriseAgreementSearch/tracking.ts @@ -0,0 +1,25 @@ +import { v4 as generateUUID } from "uuid"; +import { sendEvent } from "../../utils"; +import { ApiGeoResult } from "src/modules/Location/searchCities"; +import { + AGREEMENT_SEARCH_ACTION, + TrackingAgreementSearchEvent, +} from "src/modules/convention-collective/tracking"; + +export const useEnterpriseAgreementSearchTracking = () => { + const emitEnterpriseAgreementSearchInputEvent = ( + query: string, + apiGeoResult?: ApiGeoResult + ) => { + sendEvent({ + category: TrackingAgreementSearchEvent.ENTERPRISE_SEARCH, + action: AGREEMENT_SEARCH_ACTION, + name: JSON.stringify({ query, apiGeoResult }), + value: generateUUID(), + }); + }; + + return { + emitEnterpriseAgreementSearchInputEvent, + }; +};