Auth race condition (#167)

packages/client/src/analytics/analytics.ts

@@ -1,3 +1,4 @@
+import { analyticsReady } from '../events';
 import { initAmplitude, logAmplitudeEvent, logPageView } from './amplitude';
 import { AnalyticsEventArgs } from './constants';
 import {
@@ -8,6 +9,7 @@ import {
 export const initAnalytics = () => {
   initAmplitude();
   initTaskAnalytics();
+  dispatchEvent(analyticsReady);
 };
 
 // Connects to partytown forwarding
@@ -37,6 +39,7 @@ window.analyticsEvent = function (props: AnalyticsEventArgs) {
     'decorator_next',
   );
 };
+
 window.logPageView = logPageView;
 window.logAmplitudeEvent = logAmplitudeEvent;
 window.startTaskAnalyticsSurvey = startTaskAnalyticsSurvey;

packages/client/src/events.ts

@@ -0,0 +1,11 @@
+import { Auth } from "./api"
+
+export const analyticsReady = new CustomEvent('analytics-ready-event', {
+    bubbles: true,
+})
+
+export type AnalyticsLoaded = CustomEvent<Auth>
+
+export const analyticsLoaded = new CustomEvent<Auth>('analytics-loaded-event', {
+    bubbles: true,
+})

packages/client/src/main.ts

@@ -26,6 +26,7 @@ import './views/search-input';
 import './views/search-menu';
 import { Auth } from './api';
 import { addFaroMetaData } from './faro';
+import { analyticsLoaded, analyticsReady } from './events';
 
 import.meta.glob('./styles/*.css', { eager: true });
 
@@ -134,11 +135,16 @@ async function populateLoggedInMenu(authObject: Auth) {
 
 //
 // await populateLoggedInMenu(response);
+
 const init = async () => {
     const response = await api.checkAuth();
 
-    window.logPageView(window.__DECORATOR_DATA__.params, response);
-    window.startTaskAnalyticsSurvey(window.__DECORATOR_DATA__);
+    dispatchEvent(
+        new CustomEvent(analyticsLoaded.type, {
+            bubbles: true,
+            detail: { response },
+        })
+    );
 
     if (!response.authenticated) {
         return;
@@ -149,6 +155,14 @@ const init = async () => {
 
 init();
 
+window.addEventListener(analyticsReady.type, () => {
+    window.addEventListener(analyticsLoaded.type, (e) => {
+        const response = (e as CustomEvent<Auth>).detail;
+        window.logPageView(window.__DECORATOR_DATA__.params, response);
+        window.startTaskAnalyticsSurvey(window.__DECORATOR_DATA__);
+    });
+});
+
 function handleLogin() {
     const loginLevel = window.__DECORATOR_DATA__.params.level || 'Level4';
     document.getElementById('login-button')?.addEventListener('click', async () => {

packages/server/src/views/index.ts

@@ -84,15 +84,10 @@ const getEnvAssets = async () => {
       [
         'http://localhost:5173/@vite/client',
         `http://localhost:5173/${entryPointPath}`,
+        `http://localhost:5173/${entryPointPathAnalytics}`,
       ]
         .map(script)
         .join(''),
-      [
-        vendorScripts.taskAnalytics,
-        hostUrl(`/public/${manifest[entryPointPathAnalytics].file}`),
-      ]
-        .map(asyncScript)
-        .join(''),
       [inlineVendorScripts.hotjar].map(partytownInlineScript).join(''),
     ].join(''),
   };