feat: Ajoute le service floodlight

src/client/dependencies.container.ts

@@ -33,6 +33,8 @@ import { LoggerService } from '~/client/services/logger.service';
 import { AdformMarketingService } from '~/client/services/marketing/adform/adform.marketing.service';
 import AmnetMarketingService from '~/client/services/marketing/amnet/amnet.marketing.service';
 import AzerionMarketingService from '~/client/services/marketing/azerion/azerion.marketing.service';
+import FloodlightMarketingService from '~/client/services/marketing/floodlight/floodlight.marketing.service';
+import GoogleTagManagerService from '~/client/services/marketing/googleTagManager.service';
 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';
@@ -100,6 +102,7 @@ export type Dependencies = {
 	azerionService: MarketingService
 	amnetService: MarketingService
 	metaService: MarketingService
+	floodlightService: MarketingService
 }
 
 class DependencyInitException extends Error {
@@ -127,7 +130,9 @@ export default function dependenciesContainer(sessionId?: string): Dependencies
 	const emploiEuropeService = new BffEmploiEuropeService(httpClientService);
 	const stageService = new BffStageService(httpClientService);
 	const cookiesService = getCookieService();
-	const seedtagService = new SeedtagMarketingService(cookiesService);
+	const googleTagManagerService = new GoogleTagManagerService();
+	const seedtagService = new SeedtagMarketingService(cookiesService, googleTagManagerService);
+	const floodlightService = new FloodlightMarketingService(cookiesService, googleTagManagerService);
 	const tiktokService = new TiktokMarketingService(cookiesService);
 	const azerionService = new AzerionMarketingService(cookiesService);
 	const amnetService = new AmnetMarketingService(cookiesService);
@@ -187,6 +192,7 @@ export default function dependenciesContainer(sessionId?: string): Dependencies
 		dateService,
 		demandeDeContactService,
 		emploiEuropeService,
+		floodlightService,
 		formationInitialeService,
 		localStorageService,
 		localisationService,

src/client/services/marketing/floodlight/floodlight.marketing.service.ts

@@ -0,0 +1,42 @@
+import { CookiesService } from '~/client/services/cookies/cookies.service';
+import { TarteAuCitron } from '~/client/services/cookies/tarteaucitron/tarteAuCitron.cookies.service';
+
+import GoogleTagManagerService from '../googleTagManager.service';
+import { MarketingService } from '../marketing.service';
+
+export default class FloodlightMarketingService implements MarketingService {
+	static readonly SERVICE_NAME = 'floodlight';
+
+	constructor(private readonly cookiesService: CookiesService, private readonly gtagService: GoogleTagManagerService) {
+		// eslint-disable-next-line
+		type ConfigObject = any;
+		const config: TarteAuCitron.ServiceConfig<ConfigObject> = {
+			cookies: this.gtagService.cookies(),
+			js: function () {
+				'use strict';
+				gtagService.mount();
+			},
+			key: FloodlightMarketingService.SERVICE_NAME,
+			name: 'Floodlight',
+			needConsent: true,
+			type: 'ads',
+			uri: 'https://policies.google.com/technologies/cookies',
+		};
+		this.cookiesService.addService(FloodlightMarketingService.SERVICE_NAME, config);
+	}
+
+	// eslint-disable-next-line
+	trackPage(pagename: string): void {
+		function sendAnalytics() {
+			// eslint-disable-next-line
+			// @ts-ignore
+			window.gtag('event', 'conversion', {
+				allow_custom_scripts: true,
+				send_to: 'DC-3048978/appre0/24appren+unique',
+				u1: '[URL]',
+			});
+
+		}
+		document.addEventListener('gtag_ready', sendAnalytics);
+	}
+}

src/client/services/marketing/googleTagManager.service.ts

@@ -0,0 +1,43 @@
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-nocheck
+
+export default class GoogleTagManagerService {
+	static readonly ADS_ID = 'DC-10089018';
+	private mounted = false;
+
+	mount() {
+		if (this.mounted) { return; }
+
+		window.dataLayer = window.dataLayer || [];
+		window.tarteaucitron.addScript('https://www.googletagmanager.com/gtag/js?id=' + GoogleTagManagerService.ADS_ID, '', function () {
+			window.gtag = function gtag() {
+				// eslint-disable-next-line prefer-rest-params
+				window.dataLayer.push(arguments);
+			};
+			window.gtag('js', new Date());
+			const additional_config_info = (window.timeExpire !== undefined) ? {
+				anonymize_ip: true,
+				cookie_expires: window.timeExpire / 1000,
+			} : { anonymize_ip: true };
+
+			window.gtag('config', GoogleTagManagerService.ADS_ID, additional_config_info);
+
+			if (typeof window.tarteaucitron.user.googleadsMore === 'function') {
+				window.tarteaucitron.user.googleadsMore();
+			}
+			document.dispatchEvent(new CustomEvent('gtag_ready'));
+		});
+		this.mounted = true;
+	}
+
+	cookies() {
+		const googleIdentifier = GoogleTagManagerService.ADS_ID;
+		let	tagUaCookie = '_gat_gtag_' + googleIdentifier,
+			tagGCookie = '_ga_' + googleIdentifier;
+
+		tagUaCookie = tagUaCookie.replace(/-/g, '_');
+		tagGCookie = tagGCookie.replace(/G-/g, '');
+
+		return ['_ga', '_gat', '_gid', '__utma', '__utmb', '__utmc', '__utmt', '__utmz', tagUaCookie, tagGCookie, '_gcl_au'];
+	}
+}

src/client/services/marketing/seedtag/seedtag.marketing.service.ts

@@ -1,64 +1,20 @@
 import { CookiesService } from '~/client/services/cookies/cookies.service';
+import GoogleTagManagerService from '~/client/services/marketing/googleTagManager.service';
 
 import { TarteAuCitron } from '../../cookies/tarteaucitron/tarteAuCitron.cookies.service';
 import { MarketingService } from '../marketing.service';
 
 export default class SeedtagMarketingService implements MarketingService {
 	static readonly SEEDTAG_SERVICE_NAME = 'seedtag';
-	static readonly ADS_ID = 'DC-10089018';
 
-	constructor(private readonly cookiesService: CookiesService) {
+	constructor(private readonly cookiesService: CookiesService, private readonly gtagService: GoogleTagManagerService) {
 		// eslint-disable-next-line
 		type ConfigObject = any;
 		const config: TarteAuCitron.ServiceConfig<ConfigObject> = {
-			cookies: (function () {
-				// eslint-disable-next-line
-				let googleIdentifier = SeedtagMarketingService.ADS_ID,
-					tagUaCookie = '_gat_gtag_' + googleIdentifier,
-					tagGCookie = '_ga_' + googleIdentifier;
-
-				tagUaCookie = tagUaCookie.replace(/-/g, '_');
-				tagGCookie = tagGCookie.replace(/G-/g, '');
-
-				return ['_ga', '_gat', '_gid', '__utma', '__utmb', '__utmc', '__utmt', '__utmz', tagUaCookie, tagGCookie, '_gcl_au'];
-			})(),
+			cookies: this.gtagService.cookies(),
 			js: function () {
 				'use strict';
-				// eslint-disable-next-line
-				// @ts-ignore
-				window.dataLayer = window.dataLayer || [];
-				// eslint-disable-next-line
-				// @ts-ignore
-				window.tarteaucitron.addScript('https://www.googletagmanager.com/gtag/js?id=' + SeedtagMarketingService.ADS_ID, '', function () {
-					// eslint-disable-next-line
-					// @ts-ignore
-					// eslint-disable-next-line
-					window.gtag = function gtag() { dataLayer.push(arguments); };
-					// eslint-disable-next-line
-					// @ts-ignore
-					// eslint-disable-next-line
-					gtag('js', new Date());
-					// eslint-disable-next-line
-					// @ts-ignore
-					// eslint-disable-next-line
-					const additional_config_info = (timeExpire !== undefined) ? { anonymize_ip: true, cookie_expires: timeExpire / 1000 } : { anonymize_ip: true };
-
-					// eslint-disable-next-line
-					// @ts-ignore
-					// eslint-disable-next-line
-					gtag('config', SeedtagMarketingService.ADS_ID, additional_config_info);
-
-					// eslint-disable-next-line
-					// @ts-ignore
-					// eslint-disable-next-line
-					if (typeof tarteaucitron.user.googleadsMore === 'function') {
-						// eslint-disable-next-line
-						// @ts-ignore
-						// eslint-disable-next-line
-						tarteaucitron.user.googleadsMore();
-					}
-					document.dispatchEvent(new CustomEvent('seedtag_ready'));
-				});
+				gtagService.mount();
 			},
 			key: SeedtagMarketingService.SEEDTAG_SERVICE_NAME,
 			name: 'Seedtag',
@@ -76,13 +32,11 @@ export default class SeedtagMarketingService implements MarketingService {
 			// @ts-ignore
 			window.gtag('event', 'conversion', {
 				allow_custom_scripts: true,
-				send_to: `${SeedtagMarketingService.ADS_ID}/invmedia/fr_ga005+standard`,
+				send_to: `${GoogleTagManagerService.ADS_ID}/invmedia/fr_ga005+standard`,
 				u2: '[URL_Info]',
 			});
 
 		}
-		document.addEventListener(`${SeedtagMarketingService.SEEDTAG_SERVICE_NAME}_ready`, sendAnalytics);
-		// document.addEventListener(`${SeedtagMarketingService.SEEDTAG_SERVICE_NAME}_loaded`, sendAnalytics);
-		// document.addEventListener(`${SeedtagMarketingService.SEEDTAG_SERVICE_NAME}_added`, sendAnalytics);
+		document.addEventListener('gtag_ready', sendAnalytics);
 	}
 }

src/pages/apprentissage-entreprises/index.page.test.tsx

@@ -50,6 +50,7 @@ describe('<ApprentissageEntreprises />', () => {
 				seedtagService={aMarketingService()}
 				azerionService={aMarketingService()}
 				analyticsService={aManualAnalyticsService()}
+				floodlightService={aMarketingService()}
 				youtubeService={aVideoService()}>
 				<ApprentissageEntreprises videos={videos} />
 			</DependenciesProvider> );
@@ -74,6 +75,7 @@ describe('<ApprentissageEntreprises />', () => {
 				seedtagService={aMarketingService()}
 				azerionService={aMarketingService()}
 				analyticsService={aManualAnalyticsService()}
+				floodlightService={aMarketingService()}
 				youtubeService={aVideoService()}>
 				<ApprentissageEntreprises videos={videos} />);
 			</DependenciesProvider>);

src/pages/apprentissage-entreprises/index.page.tsx

@@ -28,9 +28,11 @@ export default function ApprentissageEntreprises ({ videos }: ApprentissageEntre
 		// eslint-disable-next-line
 	}, []);
 	const seedtagService: MarketingService = useDependency('seedtagService');
+	const floodlightService: MarketingService = useDependency('floodlightService');
 	useEffect(() => {
 		seedtagService.trackPage('');
-	}, [seedtagService]);
+		floodlightService.trackPage('');
+	}, [floodlightService, seedtagService]);
 
 	const azerionService: MarketingService = useDependency('azerionService');
 	azerionService.trackPage('');

src/pages/choisir-apprentissage/index.page.test.tsx

@@ -102,6 +102,7 @@ describe('Page Apprentissage Jeunes', () => {
 					metaService={aMarketingService()}
 					tiktokService={aMarketingService()}
 					analyticsService={aManualAnalyticsService()}
+					floodlightService={aMarketingService()}
 					youtubeService={aVideoService()}>
 					<ApprentissageJeunes videos={videos} />
 				</DependenciesProvider>);
@@ -128,6 +129,7 @@ describe('Page Apprentissage Jeunes', () => {
 					amnetService={aMarketingService()}
 					metaService={aMarketingService()}
 					tiktokService={aMarketingService()}
+					floodlightService={aMarketingService()}
 					analyticsService={analyticsService}
 					youtubeService={aVideoService()}>
 					<ApprentissageJeunes videos={videos} />
@@ -147,6 +149,7 @@ describe('Page Apprentissage Jeunes', () => {
 					amnetService={aMarketingService()}
 					metaService={aMarketingService()}
 					tiktokService={aMarketingService()}
+					floodlightService={aMarketingService()}
 					analyticsService={analyticsService}>
 					<ApprentissageJeunes videos={[]} />
 				</DependenciesProvider>,
@@ -165,6 +168,7 @@ describe('Page Apprentissage Jeunes', () => {
 					amnetService={aMarketingService()}
 					metaService={aMarketingService()}
 					tiktokService={aMarketingService()}
+					floodlightService={aMarketingService()}
 					analyticsService={analyticsService}>
 					<ApprentissageJeunes videos={[]} />
 				</DependenciesProvider>,
@@ -185,6 +189,7 @@ describe('Page Apprentissage Jeunes', () => {
 					amnetService={aMarketingService()}
 					metaService={aMarketingService()}
 					tiktokService={aMarketingService()}
+					floodlightService={aMarketingService()}
 					analyticsService={analyticsService}>
 					<ApprentissageJeunes videos={[]} />
 				</DependenciesProvider>,

src/pages/choisir-apprentissage/index.page.tsx

@@ -53,6 +53,10 @@ export default function ApprentissageJeunes(props: ApprentissageJeunesPageProps)
 		};
 		// eslint-disable-next-line
 	}, []);
+	const floodlightService = useDependency<MarketingService>('floodlightService');
+	useEffect(() => {
+		floodlightService.trackPage('');
+	});
 
 	return (
 		<>