fix(editor): Revert Fix telemetry initialization (no-changelog) (#6968)

Reverts commit b312f2ee54 and
808a92809e

packages/editor-ui/src/plugins/telemetry/index.ts

@@ -1,9 +1,9 @@
 import type { Plugin } from 'vue';
-import type { IDataObject, ITelemetrySettings, ITelemetryTrackProperties } from 'n8n-workflow';
+import type { ITelemetrySettings, ITelemetryTrackProperties, IDataObject } from 'n8n-workflow';
 import type { RouteLocation } from 'vue-router';
 
 import type { INodeCreateElement, IUpdateInformation } from '@/Interface';
-import type { IUserNodesPanelSession, RudderStack } from './telemetry.types';
+import type { IUserNodesPanelSession } from './telemetry.types';
 import { useSettingsStore } from '@/stores/settings.store';
 import { useRootStore } from '@/stores/n8nRoot.store';
 import { useTelemetryStore } from '@/stores/telemetry.store';
@@ -11,19 +11,26 @@ import { SLACK_NODE_TYPE } from '@/constants';
 import { usePostHog } from '@/stores/posthog.store';
 
 export class Telemetry {
-	constructor(
-		private rudderStack: RudderStack,
-		private userNodesPanelSession: IUserNodesPanelSession = {
-			sessionId: '',
-			data: {
-				nodeFilter: '',
-				resultsNodes: [],
-				filterMode: 'Regular',
-			},
+	private pageEventQueue: Array<{ route: RouteLocation }>;
+	private previousPath: string;
+
+	private get rudderStack() {
+		return window.rudderanalytics;
+	}
+
+	private userNodesPanelSession: IUserNodesPanelSession = {
+		sessionId: '',
+		data: {
+			nodeFilter: '',
+			resultsNodes: [],
+			filterMode: 'Regular',
 		},
-		private pageEventQueue: Array<{ route: RouteLocation }> = [],
-		private previousPath: string = '',
-	) {}
+	};
+
+	constructor() {
+		this.pageEventQueue = [];
+		this.previousPath = '';
+	}
 
 	init(
 		telemetrySettings: ITelemetrySettings,
@@ -37,7 +44,7 @@ export class Telemetry {
 			versionCli: string;
 		},
 	) {
-		if (!telemetrySettings.enabled || !telemetrySettings.config) return;
+		if (!telemetrySettings.enabled || !telemetrySettings.config || this.rudderStack) return;
 
 		const {
 			config: { key, url },
@@ -102,12 +109,17 @@ export class Telemetry {
 
 			const pageName = route.name;
 			let properties: { [key: string]: string } = {};
-			if (route.meta?.telemetry && typeof route.meta.telemetry.getProperties === 'function') {
+			if (
+				route.meta &&
+				route.meta.telemetry &&
+				typeof route.meta.telemetry.getProperties === 'function'
+			) {
 				properties = route.meta.telemetry.getProperties(route);
 			}
 
-			const category = route.meta?.telemetry?.pageCategory || 'Editor';
-			this.rudderStack.page(category, pageName, properties);
+			const category =
+				(route.meta && route.meta.telemetry && route.meta.telemetry.pageCategory) || 'Editor';
+			this.rudderStack.page(category, pageName!, properties);
 		} else {
 			this.pageEventQueue.push({
 				route,
@@ -245,6 +257,8 @@ export class Telemetry {
 	}
 
 	private initRudderStack(key: string, url: string, options: IDataObject) {
+		window.rudderanalytics = window.rudderanalytics || [];
+
 		this.rudderStack.methods = [
 			'load',
 			'page',
@@ -271,20 +285,26 @@ export class Telemetry {
 			this.rudderStack[method] = this.rudderStack.factory(method);
 		}
 
+		this.rudderStack.loadJS = () => {
+			const script = document.createElement('script');
+
+			script.type = 'text/javascript';
+			script.async = !0;
+			script.src = 'https://cdn-rs.n8n.io/v1/ra.min.js';
+
+			const element: Element = document.getElementsByTagName('script')[0];
+
+			if (element && element.parentNode) {
+				element.parentNode.insertBefore(script, element);
+			}
+		};
+
+		this.rudderStack.loadJS();
 		this.rudderStack.load(key, url, options);
 	}
 }
 
-export const telemetry = new Telemetry(
-	window.rudderanalytics ?? {
-		identify: () => {},
-		reset: () => {},
-		track: () => {},
-		page: () => {},
-		push: () => {},
-		load: () => {},
-	},
-);
+export const telemetry = new Telemetry();
 
 export const TelemetryPlugin: Plugin<{}> = {
 	install(app) {

packages/editor-ui/src/plugins/telemetry/telemetry.types.ts

@@ -17,15 +17,17 @@ interface IUserNodesPanelSessionData {
 
 /**
  * Simplified version of:
- * https://github.com/rudderlabs/rudder-sdk-js/blob/production-staging/packages/npm/index.d.ts
+ * https://github.com/rudderlabs/rudder-sdk-js/blob/master/dist/rudder-sdk-js/index.d.ts
  */
-export interface RudderStack {
+interface RudderStack extends Array<unknown> {
 	[key: string]: unknown;
 
 	methods: string[];
 
 	factory: (method: string) => (...args: unknown[]) => RudderStack;
 
+	loadJS(): void;
+
 	/**
 	 * Native methods
 	 */