From 17a876375152a5e515c242619469ac8aaefa0fbe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9my=20Rialland?= <wiinxt@gmail.com>
Date: Thu, 23 Feb 2023 17:00:21 +0100
Subject: [PATCH] Rename and convert to ts entry-iframe script

---
 ...-integration-script.js => entry-iframe.ts} | 55 ++++++++++++-------
 site/source/pages/integration/Iframe.tsx      |  4 +-
 site/vite-iframe-script.config.ts             |  2 +-
 3 files changed, 38 insertions(+), 23 deletions(-)
 rename site/source/{iframe-integration-script.js => entry-iframe.ts} (69%)

diff --git a/site/source/iframe-integration-script.js b/site/source/entry-iframe.ts
similarity index 69%
rename from site/source/iframe-integration-script.js
rename to site/source/entry-iframe.ts
index 415814d73..b841113d9 100644
--- a/site/source/iframe-integration-script.js
+++ b/site/source/entry-iframe.ts
@@ -10,10 +10,16 @@
  **/
 
 import { hexToHSL } from './hexToHSL'
+// @ts-ignore ignore file not exist error
 import simulationData from './public/simulation-data-title.json'
 
 const script = document.currentScript
-const moduleName = script.dataset.module || 'simulateur-embauche'
+if (!script) {
+	throw new Error('document.currentScript is null or undefined')
+}
+const moduleName =
+	(script.dataset.module as keyof typeof simulationData | undefined) ||
+	'salarié'
 
 const moduleData = simulationData[moduleName]
 
@@ -30,10 +36,10 @@ const src = new URL(
 		? import.meta.env.VITE_FR_BASE_URL
 		: import.meta.env.VITE_EN_BASE_URL) +
 		'/iframes/' +
-		moduleName
+		(moduleName as string)
 )
 
-src.searchParams.set('iframe', true)
+src.searchParams.set('iframe', 'true')
 src.searchParams.set(
 	'integratorUrl',
 	encodeURIComponent(window.location.href.toString())
@@ -49,13 +55,16 @@ const iframeAttributes = {
 	src: src.toString(),
 	style: 'border: none; width: 100%; display: block; height: 700px',
 	allow: 'clipboard-write',
-	allowfullscreen: true,
-	webkitallowfullscreen: true,
-	mozallowfullscreen: true,
+	allowfullscreen: 'true',
+	webkitallowfullscreen: 'true',
+	mozallowfullscreen: 'true',
 	title: moduleIframeTitle,
 }
-for (var key in iframeAttributes) {
-	iframe.setAttribute(key, iframeAttributes[key])
+for (const key in iframeAttributes) {
+	iframe.setAttribute(
+		key,
+		iframeAttributes[key as keyof typeof iframeAttributes]
+	)
 }
 
 const links = document.createElement('div')
@@ -67,7 +76,10 @@ const moduleToSitePath = {
 }
 
 const simulateurLink =
-	import.meta.env.VITE_FR_BASE_URL + (moduleToSitePath[moduleName] ?? '/')
+	import.meta.env.VITE_FR_BASE_URL +
+	(moduleName in moduleToSitePath
+		? moduleToSitePath[moduleName as keyof typeof moduleToSitePath]
+		: '/')
 
 const url = new URL(simulateurLink)
 
@@ -91,15 +103,18 @@ links.innerHTML = `
 script.before(iframe)
 script.before(links)
 
-window.addEventListener('message', function (evt) {
-	if (evt.data.kind === 'resize-height') {
-		iframe.style.height = evt.data.value + 'px'
+window.addEventListener(
+	'message',
+	function (evt: MessageEvent<{ kind: string; value: number }>) {
+		if (evt.data.kind === 'resize-height') {
+			iframe.style.height = `${evt.data.value}px`
+		}
+		if (evt.data.kind === 'get-offset') {
+			const iframePosition = iframe.getBoundingClientRect()
+			iframe.contentWindow?.postMessage(
+				{ kind: 'offset', value: Math.max(iframePosition.top * -1, 0) },
+				'*'
+			)
+		}
 	}
-	if (evt.data.kind === 'get-offset') {
-		const iframePosition = iframe.getBoundingClientRect()
-		iframe.contentWindow?.postMessage(
-			{ kind: 'offset', value: Math.max(iframePosition.top * -1, 0) },
-			'*'
-		)
-	}
-})
+)
diff --git a/site/source/pages/integration/Iframe.tsx b/site/source/pages/integration/Iframe.tsx
index 3dbd332c1..ed18cd1be 100644
--- a/site/source/pages/integration/Iframe.tsx
+++ b/site/source/pages/integration/Iframe.tsx
@@ -79,9 +79,9 @@ function IntegrationCustomizer() {
 	useEffect(() => {
 		window.addEventListener(
 			'message',
-			function (evt: MessageEvent<{ kind: string; value: string }>) {
+			function (evt: MessageEvent<{ kind: string; value: number }>) {
 				if (iframeRef.current && evt.data.kind === 'resize-height') {
-					iframeRef.current.style.height = evt.data.value + 'px'
+					iframeRef.current.style.height = `${evt.data.value}px`
 				}
 			}
 		)
diff --git a/site/vite-iframe-script.config.ts b/site/vite-iframe-script.config.ts
index 0441ed49c..0912e3670 100644
--- a/site/vite-iframe-script.config.ts
+++ b/site/vite-iframe-script.config.ts
@@ -9,7 +9,7 @@ export default defineConfig({
 	},
 	build: {
 		lib: {
-			entry: './source/iframe-integration-script.js',
+			entry: './source/entry-iframe.ts',
 			name: 'monEntrepriseIframe',
 			formats: ['iife'],
 			fileName: () => 'simulateur-iframe-integration.js',