diff --git a/public/app/features/alerting/unified/Analytics.ts b/public/app/features/alerting/unified/Analytics.ts index 3cf5526c250..a58c0d2b503 100644 --- a/public/app/features/alerting/unified/Analytics.ts +++ b/public/app/features/alerting/unified/Analytics.ts @@ -8,6 +8,7 @@ import { contextSrv } from 'app/core/core'; import { RuleNamespace } from '../../../types/unified-alerting'; import { RulerRulesConfigDTO } from '../../../types/unified-alerting-dto'; +import { FilterType } from './components/rules/central-state-history/EventListSceneObject'; import { getSearchFilterFromQuery, RulesFilter } from './search/rulesSearchParser'; import { RuleFormType } from './types/rule-form'; @@ -24,6 +25,7 @@ export const LogMessages = { cancelSavingAlertRule: 'user canceled alert rule creation', successSavingAlertRule: 'alert rule saved successfully', unknownMessageFromError: 'unknown messageFromError', + loadedCentralAlertStateHistory: 'loaded central alert state history', }; const { logInfo, logError, logMeasurement } = createMonitoringLogger('features.alerting', { module: 'Alerting' }); @@ -254,6 +256,17 @@ export function trackUseCustomInputInTemplate() { export function trackUseSingleTemplateInInput() { reportInteraction('grafana_alerting_contact_point_form_use_single_template_in_input'); } +export function trackUseCentralHistoryFilterByClicking(payload: { type: FilterType; key: string; value: string }) { + reportInteraction('grafana_alerting_central_alert_state_history_filter_by_clicking', payload); +} + +export function trackUseCentralHistoryExpandRow() { + reportInteraction('grafana_alerting_central_alert_state_history_expand_row'); +} + +export function trackUseCentralHistoryMaxEventsReached(payload: { from: number; to: number }) { + reportInteraction('grafana_alerting_central_alert_state_history_max_events_reached', payload); +} export type AlertRuleTrackingProps = { user_id: number; diff --git a/public/app/features/alerting/unified/components/rules/central-state-history/CentralAlertHistoryScene.tsx b/public/app/features/alerting/unified/components/rules/central-state-history/CentralAlertHistoryScene.tsx index 4b91d0cfd7e..35a90efe365 100644 --- a/public/app/features/alerting/unified/components/rules/central-state-history/CentralAlertHistoryScene.tsx +++ b/public/app/features/alerting/unified/components/rules/central-state-history/CentralAlertHistoryScene.tsx @@ -1,4 +1,5 @@ import { css } from '@emotion/css'; +import { useEffect } from 'react'; import { GrafanaTheme2, VariableHide } from '@grafana/data'; import { @@ -34,6 +35,7 @@ import { } from '@grafana/ui'; import { Trans } from 'app/core/internationalization'; +import { LogMessages, logInfo } from '../../../Analytics'; import { DataSourceInformation } from '../../../home/Insights'; import { alertStateHistoryDatasource, useRegisterHistoryRuntimeDataSource } from './CentralHistoryRuntimeDataSource'; @@ -60,6 +62,11 @@ export const StateFilterValues = { } as const; export const CentralAlertHistoryScene = () => { + //track the loading of the central alert state history + useEffect(() => { + logInfo(LogMessages.loadedCentralAlertStateHistory); + }, []); + // create the variables for the filters // textbox variable for filtering by labels const labelsFilterVariable = new TextBoxVariable({ diff --git a/public/app/features/alerting/unified/components/rules/central-state-history/EventDetails.tsx b/public/app/features/alerting/unified/components/rules/central-state-history/EventDetails.tsx index 107f76f6cdb..2e3fff3dac2 100644 --- a/public/app/features/alerting/unified/components/rules/central-state-history/EventDetails.tsx +++ b/public/app/features/alerting/unified/components/rules/central-state-history/EventDetails.tsx @@ -1,12 +1,13 @@ import { css } from '@emotion/css'; import { capitalize, groupBy } from 'lodash'; -import { useMemo } from 'react'; +import { useEffect, useMemo } from 'react'; import { DataFrame, DataFrameJSON, GrafanaTheme2, TimeRange } from '@grafana/data'; import { Icon, Stack, Text, useStyles2, useTheme2 } from '@grafana/ui'; import { Trans, t } from 'app/core/internationalization'; import { CombinedRule } from 'app/types/unified-alerting'; +import { trackUseCentralHistoryExpandRow } from '../../../Analytics'; import { stateHistoryApi } from '../../../api/stateHistoryApi'; import { useCombinedRule } from '../../../hooks/useCombinedRule'; import { labelsMatchMatchers } from '../../../utils/alertmanager'; @@ -29,6 +30,11 @@ interface EventDetailsProps { timeRange: TimeRange; } export function EventDetails({ record, addFilter, timeRange }: EventDetailsProps) { + // track the usage of the expand row + useEffect(() => { + trackUseCentralHistoryExpandRow(); + }, []); + // get the rule from the ruleUID const ruleUID = record.line?.ruleUID ?? ''; const labelsInInstance = record.line?.labels; diff --git a/public/app/features/alerting/unified/components/rules/central-state-history/EventListSceneObject.tsx b/public/app/features/alerting/unified/components/rules/central-state-history/EventListSceneObject.tsx index 30e99dcee4a..5a848459e90 100644 --- a/public/app/features/alerting/unified/components/rules/central-state-history/EventListSceneObject.tsx +++ b/public/app/features/alerting/unified/components/rules/central-state-history/EventListSceneObject.tsx @@ -22,6 +22,7 @@ import { mapStateWithReasonToReason, } from 'app/types/unified-alerting-dto'; +import { trackUseCentralHistoryFilterByClicking, trackUseCentralHistoryMaxEventsReached } from '../../../Analytics'; import { stateHistoryApi } from '../../../api/stateHistoryApi'; import { usePagination } from '../../../hooks/usePagination'; import { combineMatcherStrings, labelsMatchMatchers } from '../../../utils/alertmanager'; @@ -88,6 +89,9 @@ export const HistoryEventsList = ({ } const maximumEventsReached = !isLoading && stateHistory?.data?.values?.[0]?.length === LIMIT_EVENTS; + if (maximumEventsReached) { + trackUseCentralHistoryMaxEventsReached({ from, to }); + } return ( <> @@ -515,14 +519,15 @@ export function HistoryEventsListObjectRenderer({ model }: SceneComponentProps { const newFilterToAdd = `${key}=${value}`; + trackUseCentralHistoryFilterByClicking({ type, key, value }); if (type === 'stateTo') { stateToFilterVariable.changeValueTo(value); } if (type === 'stateFrom') { stateFromFilterVariable.changeValueTo(value); } + const finalFilter = combineMatcherStrings(valueInfilterTextBox.toString(), newFilterToAdd); if (type === 'label') { - const finalFilter = combineMatcherStrings(valueInfilterTextBox.toString(), newFilterToAdd); labelsFiltersVariable.setValue(finalFilter); } };