feat(core): Add telemetry for Evaluation feature (no-changelog) (#15562)

Co-authored-by: Yiorgis Gozadinos <yiorgis@n8n.io>

packages/frontend/editor-ui/src/views/Evaluations.ee/EvaluationsRootView.vue

@@ -4,12 +4,14 @@ import { useUsageStore } from '@/stores/usage.store';
 import { useAsyncState } from '@vueuse/core';
 import { PLACEHOLDER_EMPTY_WORKFLOW_ID } from '@/constants';
 import { useCanvasOperations } from '@/composables/useCanvasOperations';
+import { useTelemetry } from '@/composables/useTelemetry';
 import { useToast } from '@/composables/useToast';
 import { useI18n } from '@/composables/useI18n';
 import { useRouter } from 'vue-router';
-import { useNodeTypesStore } from '@/stores/nodeTypes.store';
 import { useEvaluationStore } from '@/stores/evaluation.store.ee';
-import { computed } from 'vue';
+import { useNodeTypesStore } from '@/stores/nodeTypes.store';
+
+import { computed, watch } from 'vue';
 import { N8nLink, N8nText } from '@n8n/design-system';
 import EvaluationsPaywall from '@/components/Evaluations.ee/Paywall/EvaluationsPaywall.vue';
 import SetupWizard from '@/components/Evaluations.ee/SetupWizard/SetupWizard.vue';
@@ -21,10 +23,11 @@ const props = defineProps<{
 const workflowsStore = useWorkflowsStore();
 const usageStore = useUsageStore();
 const evaluationStore = useEvaluationStore();
+const nodeTypesStore = useNodeTypesStore();
+const telemetry = useTelemetry();
 const router = useRouter();
 const toast = useToast();
 const locale = useI18n();
-const nodeTypesStore = useNodeTypesStore();
 
 const { initializeWorkspace } = useCanvasOperations({ router });
 
@@ -32,13 +35,18 @@ const evaluationsLicensed = computed(() => {
 	return usageStore.workflowsWithEvaluationsLimit !== 0;
 });
 
-const showWizard = computed(() => {
-	const runs = Object.values(evaluationStore.testRunsById ?? {}).filter(
+const runs = computed(() => {
+	return Object.values(evaluationStore.testRunsById ?? {}).filter(
 		({ workflowId }) => workflowId === props.name,
 	);
-	return runs.length === 0;
 });
 
+const hasRuns = computed(() => {
+	return runs.value.length > 0;
+});
+
+const showWizard = computed(() => !hasRuns.value);
+
 // Method to run a test - will be used by the SetupWizard component
 async function runTest() {
 	try {
@@ -54,6 +62,14 @@ async function runTest() {
 	}
 }
 
+const evaluationsQuotaExceeded = computed(() => {
+	return (
+		usageStore.workflowsWithEvaluationsLimit !== -1 &&
+		usageStore.workflowsWithEvaluationsCount >= usageStore.workflowsWithEvaluationsLimit &&
+		!hasRuns.value
+	);
+});
+
 const { isReady } = useAsyncState(async () => {
 	try {
 		await usageStore.getLicenseInfo();
@@ -83,6 +99,33 @@ const { isReady } = useAsyncState(async () => {
 		}
 	}
 }, undefined);
+
+watch(
+	isReady,
+	(ready) => {
+		if (ready) {
+			if (showWizard.value) {
+				telemetry.track('User viewed tests tab', {
+					workflow_id: props.name,
+					test_type: 'evaluation',
+					view: 'setup',
+					trigger_set_up: evaluationStore.evaluationTriggerExists,
+					output_set_up: evaluationStore.evaluationSetOutputsNodeExist,
+					metrics_set_up: evaluationStore.evaluationSetMetricsNodeExist,
+					quota_reached: evaluationsQuotaExceeded.value,
+				});
+			} else {
+				telemetry.track('User viewed tests tab', {
+					workflow_id: props.name,
+					test_type: 'evaluation',
+					view: 'overview',
+					run_count: runs.value.length,
+				});
+			}
+		}
+	},
+	{ immediate: true },
+);
 </script>
 
 <template>