diff --git a/public/scripts/tarteaucitron/lang/tarteaucitron.fr.js b/public/scripts/tarteaucitron/lang/tarteaucitron.fr.js index 961ab3d051..bb6d84b737 100644 --- a/public/scripts/tarteaucitron/lang/tarteaucitron.fr.js +++ b/public/scripts/tarteaucitron/lang/tarteaucitron.fr.js @@ -81,6 +81,7 @@ tarteaucitron.lang = { floodlight: '

Finalité : Les campagnes d’informations gouvernementales permettent le partage d’informations utiles diffusées dans le cadre de grandes campagnes d’information, ou en cas de crise. Dans le détail : le traceur Googletagmanager est utilisé par la régie Floodlight.

Conséquences en cas de refus : En cas de refus, vos visites sur les pages concernés ne sont pas comptabilisés dans les statistiques de suivi de campagne.

Consentement : Oui nécessaire

Durée de conservation : 13 mois

', azerion: '

Finalité : Les campagnes d’informations gouvernementales permettent le partage d’informations utiles diffusées dans le cadre de grandes campagnes d’information, ou en cas de crise. Dans le détail : le traceur Azerion est utilisé par la régie Azerion.

Conséquences en cas de refus : En cas de refus, vos visites sur les pages concernés ne sont pas comptabilisés dans les statistiques de suivi de campagne.

Consentement : Oui nécessaire

Durée de conservation : 13 mois

', tiktok: '

Finalité : Les campagnes d’informations gouvernementales permettent le partage d’informations utiles diffusées dans le cadre de grandes campagnes d’information, ou en cas de crise. Dans le détail : le traceur Tiktok est utilisé par la régie Tiktok.

Conséquences en cas de refus : En cas de refus, vos visites sur les pages concernés ne sont pas comptabilisés dans les statistiques de suivi de campagne.

Consentement : Oui nécessaire

Durée de conservation : 13 mois

', + 'snapchat-custom': '

Finalité : Les campagnes d’informations gouvernementales permettent le partage d’informations utiles diffusées dans le cadre de grandes campagnes d’information, ou en cas de crise. Dans le détail : le traceur Snapchat est utilisé par la régie Snapchat.

Conséquences en cas de refus : En cas de refus, vos visites sur les pages concernés ne sont pas comptabilisés dans les statistiques de suivi de campagne.

Consentement : Oui nécessaire

Durée de conservation : 13 mois

', meta: '

Finalité : Les campagnes d’informations gouvernementales permettent le partage d’informations utiles diffusées dans le cadre de grandes campagnes d’information, ou en cas de crise. Dans le détail : le traceur Facebook est utilisé par la régie Meta.

Conséquences en cas de refus : En cas de refus, vos visites sur les pages concernés ne sont pas comptabilisés dans les statistiques de suivi de campagne.

Consentement : Oui nécessaire

Durée de conservation : 13 mois

', video: { details: 'Les services de partage de vidéo permettent d‘enrichir le site de contenu multimédia et augmentent sa visibilité.', diff --git a/src/client/dependencies.container.ts b/src/client/dependencies.container.ts index d81f3505a6..2230ca1dd7 100644 --- a/src/client/dependencies.container.ts +++ b/src/client/dependencies.container.ts @@ -39,6 +39,7 @@ import { MarketingService } from '~/client/services/marketing/marketing.service' import MetaMarketingService from '~/client/services/marketing/meta/meta.marketing.service'; import { NullMarketingService } from '~/client/services/marketing/null/null.marketing.service'; import SeedtagMarketingService from '~/client/services/marketing/seedtag/seedtag.marketing.service'; +import SnapchatMarketingService from '~/client/services/marketing/snapchat/snapchat.marketing.service'; import TiktokMarketingService from '~/client/services/marketing/TikTok/tiktok.marketing.service'; import { BffAlternanceMetierService } from '~/client/services/metiers/bff.alternance.metier.service'; import { MetierService } from '~/client/services/metiers/metier.service'; @@ -103,6 +104,7 @@ export type Dependencies = { amnetService: MarketingService metaService: MarketingService floodlightService: MarketingService + snapchatService: MarketingService } class DependencyInitException extends Error { @@ -134,6 +136,7 @@ export default function dependenciesContainer(sessionId?: string): Dependencies const seedtagService = new SeedtagMarketingService(cookiesService, googleTagManagerService); const floodlightService = new FloodlightMarketingService(cookiesService, googleTagManagerService); const tiktokService = new TiktokMarketingService(cookiesService); + const snapchatService = new SnapchatMarketingService(cookiesService); const azerionService = new AzerionMarketingService(cookiesService); const amnetService = new AmnetMarketingService(cookiesService); const metaService = new MetaMarketingService(cookiesService); @@ -204,6 +207,7 @@ export default function dependenciesContainer(sessionId?: string): Dependencies rechercheClientService, seedtagService, sessionStorageService, + snapchatService, stage3eEt2deService, stageDeposerOffreEtape1PersistenceService, stageDeposerOffreEtape2PersistenceService, diff --git a/src/client/services/marketing/snapchat/snapchat.marketing.service.ts b/src/client/services/marketing/snapchat/snapchat.marketing.service.ts new file mode 100644 index 0000000000..76db72c33c --- /dev/null +++ b/src/client/services/marketing/snapchat/snapchat.marketing.service.ts @@ -0,0 +1,71 @@ +// eslint-disable-next-line @typescript-eslint/ban-ts-comment +// @ts-nocheck +import { CookiesService } from '~/client/services/cookies/cookies.service'; +import { TarteAuCitron } from '~/client/services/cookies/tarteaucitron/tarteAuCitron.cookies.service'; + +import { MarketingService } from '../marketing.service'; + +export default class SnapchatMarketingService implements MarketingService { + private static SERVICE_NAME = 'snapchat-custom'; + private ready = false; + + constructor(private readonly cookiesService: CookiesService) { + this.cookiesService.addUser('snapchatId', 'd48efe29-caa9-4f0c-86e8-353fc35a8b3f'); + // eslint-disable-next-line @typescript-eslint/no-this-alias + const service = this; + // eslint-disable-next-line + type ConfigObject = any; + const config: TarteAuCitron.ServiceConfig = { + cookies: [], + js: function () { + 'use strict'; + + // eslint-disable-next-line no-undef + if (tarteaucitron.user.snapchatId === undefined) { + return; + } + + const a = window.snaptr = function () { + // eslint-disable-next-line prefer-rest-params, prefer-spread + a.handleRequest ? a.handleRequest.apply(a, arguments) : a.queue.push(arguments); + }; + a.queue = []; + // eslint-disable-next-line no-undef + window.snaptr('init', tarteaucitron.user.snapchatId, {}); + + // eslint-disable-next-line no-undef + tarteaucitron.addScript('https://sc-static.net/scevent.min.js', undefined, () => { + service.ready = true; + document.dispatchEvent(new CustomEvent('snapchat_ready')); + }); + + // eslint-disable-next-line no-undef + if (typeof tarteaucitron.user.snapchatMore === 'function') { + // eslint-disable-next-line no-undef + tarteaucitron.user.snapchatMore(); + } + }, + key: SnapchatMarketingService.SERVICE_NAME, + name: 'Snapchat', + needConsent: true, + type: 'analytic', + uri: 'https://snap.com/fr-FR/privacy/privacy-policy', + }; + this.cookiesService.addService(SnapchatMarketingService.SERVICE_NAME, config); + } + + // eslint-disable-next-line + trackPage(pagename: string): void { + const cookiesService = this.cookiesService; + function sendAnalytics() { + if (!cookiesService.isServiceAllowed(SnapchatMarketingService.SERVICE_NAME)) { return; } + + window.snaptr('track', 'PAGE_VIEW'); + } + if (this.ready) { + sendAnalytics(); + } else { + document.addEventListener('snapchat_ready', sendAnalytics); + } + } +} diff --git a/src/pages/choisir-apprentissage/index.page.test.tsx b/src/pages/choisir-apprentissage/index.page.test.tsx index f421bf596a..a9287a1e29 100644 --- a/src/pages/choisir-apprentissage/index.page.test.tsx +++ b/src/pages/choisir-apprentissage/index.page.test.tsx @@ -103,6 +103,7 @@ describe('Page Apprentissage Jeunes', () => { tiktokService={aMarketingService()} analyticsService={aManualAnalyticsService()} floodlightService={aMarketingService()} + snapchatService={aMarketingService()} youtubeService={aVideoService()}> ); @@ -130,6 +131,7 @@ describe('Page Apprentissage Jeunes', () => { metaService={aMarketingService()} tiktokService={aMarketingService()} floodlightService={aMarketingService()} + snapchatService={aMarketingService()} analyticsService={analyticsService} youtubeService={aVideoService()}> @@ -149,6 +151,7 @@ describe('Page Apprentissage Jeunes', () => { amnetService={aMarketingService()} metaService={aMarketingService()} tiktokService={aMarketingService()} + snapchatService={aMarketingService()} floodlightService={aMarketingService()} analyticsService={analyticsService}> @@ -167,6 +170,7 @@ describe('Page Apprentissage Jeunes', () => { marketingService={aMarketingService()} amnetService={aMarketingService()} metaService={aMarketingService()} + snapchatService={aMarketingService()} tiktokService={aMarketingService()} floodlightService={aMarketingService()} analyticsService={analyticsService}> @@ -188,6 +192,7 @@ describe('Page Apprentissage Jeunes', () => { marketingService={aMarketingService()} amnetService={aMarketingService()} metaService={aMarketingService()} + snapchatService={aMarketingService()} tiktokService={aMarketingService()} floodlightService={aMarketingService()} analyticsService={analyticsService}> diff --git a/src/pages/choisir-apprentissage/index.page.tsx b/src/pages/choisir-apprentissage/index.page.tsx index 6a3affa08c..dd840d35a6 100644 --- a/src/pages/choisir-apprentissage/index.page.tsx +++ b/src/pages/choisir-apprentissage/index.page.tsx @@ -29,16 +29,16 @@ export default function ApprentissageJeunes(props: ApprentissageJeunesPageProps) return () => adformService.trackPage(undefined); // eslint-disable-next-line }, []); - const tiktokService: MarketingService = useDependency('tiktokService'); - tiktokService.trackPage(''); + const snapchatService: MarketingService = useDependency('snapchatService'); useEffect(() => { - return () => { - tiktokService.trackPage('off'); - }; + snapchatService.trackPage(''); // eslint-disable-next-line }, []); const amnetService: MarketingService = useDependency('amnetService'); - amnetService.trackPage(''); + useEffect(() => { + amnetService.trackPage(''); + // eslint-disable-next-line + }, []); useEffect(() => { return () => { amnetService.trackPage('off');