feat(editor): Add telemetry events for data tables (no-changelog) (#19091)

packages/frontend/editor-ui/src/components/ParameterInput.vue

@@ -931,6 +931,7 @@ function valueChanged(untypedValue: unknown) {
 			is_custom: value === CUSTOM_API_CALL_KEY,
 			push_ref: ndvStore.pushRef,
 			parameter: props.parameter.name,
+			value: value as string,
 		});
 	}
 	// Track workflow input data mode change

packages/frontend/editor-ui/src/components/layouts/ResourcesListLayout.vue

@@ -345,11 +345,11 @@ const setSorting = async (sort: string, persistUpdate = true) => {
 	sortBy.value = sort;
 	if (persistUpdate) {
 		await savePaginationPreferences();
+		sendSortingTelemetry();
 	}
 	emit('update:pagination-and-sort', {
 		sort,
 	});
-	sendSortingTelemetry();
 };
 
 const setCurrentPage = async (page: number, persistUpdate = true) => {

packages/frontend/editor-ui/src/features/dataStore/components/AddDataStoreModal.vue

@@ -6,6 +6,7 @@ import { useUIStore } from '@/stores/ui.store';
 import { useToast } from '@/composables/useToast';
 import { useRoute, useRouter } from 'vue-router';
 import { DATA_STORE_DETAILS, PROJECT_DATA_STORES } from '@/features/dataStore/constants';
+import { useTelemetry } from '@/composables/useTelemetry';
 
 type Props = {
 	modalName: string;
@@ -20,6 +21,7 @@ const route = useRoute();
 const router = useRouter();
 const i18n = useI18n();
 const toast = useToast();
+const telemetry = useTelemetry();
 
 const dataStoreName = ref('');
 const inputRef = ref<HTMLInputElement | null>(null);
@@ -37,14 +39,18 @@ const onSubmit = async () => {
 			dataStoreName.value,
 			route.params.projectId as string,
 		);
+		telemetry.track('User created data table', {
+			data_table_id: newDataStore.id,
+			data_table_project_id: newDataStore.project?.id,
+		});
+		dataStoreName.value = '';
+		uiStore.closeModal(props.modalName);
 		void router.push({
 			name: DATA_STORE_DETAILS,
 			params: {
 				id: newDataStore.id,
 			},
 		});
-		dataStoreName.value = '';
-		uiStore.closeModal(props.modalName);
 	} catch (error) {
 		toast.showError(error, i18n.baseText('dataStore.add.error'));
 	}

packages/frontend/editor-ui/src/features/dataStore/components/DataStoreActions.vue

@@ -8,6 +8,7 @@ import { useMessage } from '@/composables/useMessage';
 import { MODAL_CONFIRM } from '@/constants';
 import { useDataStoreStore } from '@/features/dataStore/dataStore.store';
 import { useToast } from '@/composables/useToast';
+import { useTelemetry } from '@/composables/useTelemetry';
 
 type Props = {
 	dataStore: DataStore;
@@ -34,6 +35,7 @@ const dataStoreStore = useDataStoreStore();
 const i18n = useI18n();
 const message = useMessage();
 const toast = useToast();
+const telemetry = useTelemetry();
 
 const actions = computed<Array<UserAction<IUser>>>(() => {
 	const availableActions = [
@@ -93,6 +95,10 @@ const deleteDataStore = async () => {
 			throw new Error(i18n.baseText('generic.unknownError'));
 		}
 		emit('onDeleted');
+		telemetry.track('User deleted data table', {
+			data_table_id: props.dataStore.id,
+			data_table_project_id: props.dataStore.projectId,
+		});
 	} catch (error) {
 		toast.showError(error, i18n.baseText('dataStore.delete.error'));
 	}

packages/frontend/editor-ui/src/features/dataStore/components/DataStoreBreadcrumbs.vue

@@ -8,6 +8,7 @@ import DataStoreActions from '@/features/dataStore/components/DataStoreActions.v
 import { PROJECT_DATA_STORES } from '@/features/dataStore/constants';
 import { useDataStoreStore } from '@/features/dataStore/dataStore.store';
 import { useToast } from '@/composables/useToast';
+import { telemetry } from '@/plugins/telemetry';
 
 const BREADCRUMBS_SEPARATOR = '/';
 
@@ -77,6 +78,10 @@ const onNameSubmit = async (name: string) => {
 			throw new Error(i18n.baseText('generic.unknownError'));
 		}
 		editableName.value = name;
+		telemetry.track('User renamed data table', {
+			data_table_id: props.dataStore.id,
+			data_table_project_id: props.dataStore.projectId,
+		});
 	} catch (error) {
 		// Revert to original name if rename fails
 		editableName.value = props.dataStore.name;

packages/frontend/editor-ui/src/features/dataStore/components/dataGrid/DataStoreTable.vue

@@ -71,6 +71,7 @@ import ElDatePickerCellEditor from '@/features/dataStore/components/dataGrid/ElD
 import { onClickOutside } from '@vueuse/core';
 import { useClipboard } from '@/composables/useClipboard';
 import { reorderItem } from '@/features/dataStore/utils';
+import { useTelemetry } from '@/composables/useTelemetry';
 
 // Register only the modules we actually use
 ModuleRegistry.registerModules([
@@ -105,6 +106,7 @@ const i18n = useI18n();
 const toast = useToast();
 const message = useMessage();
 const { mapToAGCellType } = useDataStoreTypes();
+const telemetry = useTelemetry();
 
 const dataStoreStore = useDataStoreStore();
 
@@ -226,6 +228,11 @@ const onDeleteColumn = async (columnId: string) => {
 			props.dataStore.projectId,
 			columnId,
 		);
+		telemetry.track('User deleted data table column', {
+			column_id: columnId,
+			column_type: columnToDelete.cellDataType,
+			data_table_id: props.dataStore.id,
+		});
 	} catch (error) {
 		toast.showError(error, i18n.baseText('dataStore.deleteColumn.error'));
 		colDefs.value.splice(columnToDeleteIndex, 0, columnToDelete);
@@ -253,6 +260,11 @@ const onAddColumn = async (column: DataStoreColumnCreatePayload) => {
 			return { ...row, [newColumn.name]: null };
 		});
 		refreshGridData();
+		telemetry.track('User added data table column', {
+			column_id: newColumn.id,
+			column_type: newColumn.type,
+			data_table_id: props.dataStore.id,
+		});
 		return true;
 	} catch (error) {
 		toast.showError(error, i18n.baseText('dataStore.addColumn.error'));
@@ -421,6 +433,9 @@ const onAddRowClick = async () => {
 		refreshGridData();
 		await nextTick();
 		focusFirstEditableCell(newRow.id as number);
+		telemetry.track('User added row to data table', {
+			data_table_id: props.dataStore.id,
+		});
 	} catch (error) {
 		toast.showError(error, i18n.baseText('dataStore.addRow.error'));
 	} finally {
@@ -529,6 +544,12 @@ const onCellValueChanged = async (params: CellValueChangedEvent<DataStoreRow>) =
 		await dataStoreStore.updateRow(props.dataStore.id, props.dataStore.projectId, id, {
 			[fieldName]: value,
 		});
+
+		telemetry.track('User edited data table content', {
+			data_table_id: props.dataStore.id,
+			column_id: colDef.colId,
+			column_type: colDef.cellDataType,
+		});
 	} catch (error) {
 		// Revert cell to original value if the update fails
 		const validOldValue = isDataStoreValue(oldValue) ? oldValue : null;
@@ -764,6 +785,11 @@ const handleDeleteSelected = async () => {
 			message: '',
 			type: 'success',
 		});
+
+		telemetry.track('User deleted rows in data table', {
+			data_table_id: props.dataStore.id,
+			deleted_row_count: idsToDelete.length,
+		});
 	} catch (error) {
 		toast.showError(error, i18n.baseText('dataStore.deleteRows.error'));
 	} finally {