chore: add customerio to frontend (#7062)

.github/workflows/push.yaml

@@ -68,6 +68,8 @@ jobs:
           echo 'TUNNEL_URL="${{ secrets.TUNNEL_URL }}"' >> frontend/.env
           echo 'TUNNEL_DOMAIN="${{ secrets.TUNNEL_DOMAIN }}"' >> frontend/.env
           echo 'POSTHOG_KEY="${{ secrets.POSTHOG_KEY }}"' >> frontend/.env
+          echo 'CUSTOMERIO_ID="${{ secrets.CUSTOMERIO_ID }}"' >> frontend/.env
+          echo 'CUSTOMERIO_SITE_ID="${{ secrets.CUSTOMERIO_SITE_ID }}"' >> frontend/.env
       - name: Setup golang
         uses: actions/setup-go@v4
         with:

frontend/package.json

@@ -92,7 +92,7 @@
 		"overlayscrollbars": "^2.8.1",
 		"overlayscrollbars-react": "^0.5.6",
 		"papaparse": "5.4.1",
-		"posthog-js": "1.160.3",
+		"posthog-js": "1.215.5",
 		"rc-tween-one": "3.0.6",
 		"react": "18.2.0",
 		"react-addons-update": "15.6.3",

frontend/src/index.html.ejs

@@ -98,7 +98,23 @@
 				}
 			})();
 		</script>
-
+		<script async>
+			const CUSTOMERIO_ID = '<%= htmlWebpackPlugin.options.CUSTOMERIO_ID %>';
+			const CUSTOMERIO_SITE_ID = '<%= htmlWebpackPlugin.options.CUSTOMERIO_SITE_ID %>';
+			!function(){var i="cioanalytics", analytics=(window[i]=window[i]||[]);if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on","addSourceMiddleware","addIntegrationMiddleware","setAnonymousId","addDestinationMiddleware"];analytics.factory=function(e){return function(){var t=Array.prototype.slice.call(arguments);t.unshift(e);analytics.push(t);return analytics}};for(var e=0;e<analytics.methods.length;e++){var key=analytics.methods[e];analytics[key]=analytics.factory(key)}analytics.load=function(key,e){var t=document.createElement("script");t.type="text/javascript";t.async=!0;t.setAttribute('data-global-segment-analytics-key', i);t.setAttribute('data-global-segment-analytics-key', i);t.src="https://cdp.customer.io/v1/analytics-js/snippet/" + key + "/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n);analytics._writeKey=key;analytics._loadOptions=e};analytics.SNIPPET_VERSION="4.15.3";
+				analytics.load(
+				CUSTOMERIO_ID,
+				{
+				"integrations": {
+					"Customer.io In-App Plugin": {
+					siteId: CUSTOMERIO_SITE_ID
+					}
+				}
+				}
+				);
+				analytics.page();
+			}}();
+		</script>
 		<script>
 			//Set your SEGMENT_ID
 			const SEGMENT_ID = '<%= htmlWebpackPlugin.options.SEGMENT_ID %>';

frontend/webpack.config.js

@@ -22,6 +22,8 @@ const plugins = [
 		template: 'src/index.html.ejs',
 		INTERCOM_APP_ID: process.env.INTERCOM_APP_ID,
 		SEGMENT_ID: process.env.SEGMENT_ID,
+		CUSTOMERIO_SITE_ID: process.env.CUSTOMERIO_SITE_ID,
+		CUSTOMERIO_ID: process.env.CUSTOMERIO_ID,
 		POSTHOG_KEY: process.env.POSTHOG_KEY,
 		SENTRY_AUTH_TOKEN: process.env.SENTRY_AUTH_TOKEN,
 		SENTRY_ORG: process.env.SENTRY_ORG,
@@ -40,6 +42,8 @@ const plugins = [
 			WEBSOCKET_API_ENDPOINT: process.env.WEBSOCKET_API_ENDPOINT,
 			INTERCOM_APP_ID: process.env.INTERCOM_APP_ID,
 			SEGMENT_ID: process.env.SEGMENT_ID,
+			CUSTOMERIO_SITE_ID: process.env.CUSTOMERIO_SITE_ID,
+			CUSTOMERIO_ID: process.env.CUSTOMERIO_ID,
 			POSTHOG_KEY: process.env.POSTHOG_KEY,
 			SENTRY_AUTH_TOKEN: process.env.SENTRY_AUTH_TOKEN,
 			SENTRY_ORG: process.env.SENTRY_ORG,

frontend/webpack.config.prod.js

@@ -27,6 +27,8 @@ const plugins = [
 		template: 'src/index.html.ejs',
 		INTERCOM_APP_ID: process.env.INTERCOM_APP_ID,
 		SEGMENT_ID: process.env.SEGMENT_ID,
+		CUSTOMERIO_SITE_ID: process.env.CUSTOMERIO_SITE_ID,
+		CUSTOMERIO_ID: process.env.CUSTOMERIO_ID,
 		POSTHOG_KEY: process.env.POSTHOG_KEY,
 		SENTRY_AUTH_TOKEN: process.env.SENTRY_AUTH_TOKEN,
 		SENTRY_ORG: process.env.SENTRY_ORG,
@@ -50,6 +52,8 @@ const plugins = [
 			WEBSOCKET_API_ENDPOINT: process.env.WEBSOCKET_API_ENDPOINT,
 			INTERCOM_APP_ID: process.env.INTERCOM_APP_ID,
 			SEGMENT_ID: process.env.SEGMENT_ID,
+			CUSTOMERIO_SITE_ID: process.env.CUSTOMERIO_SITE_ID,
+			CUSTOMERIO_ID: process.env.CUSTOMERIO_ID,
 			POSTHOG_KEY: process.env.POSTHOG_KEY,
 			SENTRY_AUTH_TOKEN: process.env.SENTRY_AUTH_TOKEN,
 			SENTRY_ORG: process.env.SENTRY_ORG,