diff --git a/public/app/features/logs/components/panel/LogLineDetailsDisplayedFields.tsx b/public/app/features/logs/components/panel/LogLineDetailsDisplayedFields.tsx index 50e997ad80e..e5bce32bd86 100644 --- a/public/app/features/logs/components/panel/LogLineDetailsDisplayedFields.tsx +++ b/public/app/features/logs/components/panel/LogLineDetailsDisplayedFields.tsx @@ -10,12 +10,13 @@ import { LOG_LINE_BODY_FIELD_NAME } from '../LogDetailsBody'; import { LogLineDetailsMode } from './LogLineDetails'; import { useLogListContext } from './LogListContext'; +import { reportInteractionOnce } from './analytics'; export const LogLineDetailsDisplayedFields = () => { const { displayedFields, setDisplayedFields } = useLogListContext(); const reorganizeDisplayedFields = useCallback( - (srcIndex: number, destIndex: number) => { + (srcIndex: number, destIndex: number, mode: 'drag' | 'button') => { const newDisplayedFields = [...displayedFields]; const element = displayedFields[srcIndex]; @@ -23,6 +24,11 @@ export const LogLineDetailsDisplayedFields = () => { newDisplayedFields.splice(destIndex, 0, element); setDisplayedFields?.(newDisplayedFields); + + reportInteractionOnce('logs_log_line_details_organized_fields', { + quantity: newDisplayedFields.length, + mode, + }); }, [displayedFields, setDisplayedFields] ); @@ -32,7 +38,7 @@ export const LogLineDetailsDisplayedFields = () => { if (result.destination == null) { return; } - reorganizeDisplayedFields(result.source.index, result.destination.index); + reorganizeDisplayedFields(result.source.index, result.destination.index, 'drag'); }, [reorganizeDisplayedFields] ); @@ -65,7 +71,7 @@ export const LogLineDetailsDisplayedFields = () => { interface DraggableDisplayedFieldProps { field: string; index: number; - moveField: (srcIndex: number, destIndex: number) => void; + moveField: (srcIndex: number, destIndex: number, mode: 'drag' | 'button') => void; } const DraggableDisplayedField = ({ field, index, moveField }: DraggableDisplayedFieldProps) => { @@ -99,12 +105,12 @@ const DisplayedField = ({ <> moveField(index, nextIndex)} + onClick={() => moveField(index, nextIndex, 'button')} tooltip={t('logs.log-line-details.move-displayed-field-down', 'Move down')} /> moveField(index, prevIndex)} + onClick={() => moveField(index, prevIndex, 'button')} tooltip={t('logs.log-line-details.move-displayed-field-up', 'Move up')} /> diff --git a/public/app/features/logs/components/panel/LogLineDetailsTrace.tsx b/public/app/features/logs/components/panel/LogLineDetailsTrace.tsx index a9f80b841a4..28f49069dba 100644 --- a/public/app/features/logs/components/panel/LogLineDetailsTrace.tsx +++ b/public/app/features/logs/components/panel/LogLineDetailsTrace.tsx @@ -4,7 +4,7 @@ import { isObservable, lastValueFrom } from 'rxjs'; import { DataFrame, DataQueryRequest, DataSourceApi, GrafanaTheme2, TimeRange } from '@grafana/data'; import { t } from '@grafana/i18n'; -import { getDataSourceSrv } from '@grafana/runtime'; +import { getDataSourceSrv, reportInteraction } from '@grafana/runtime'; import { Icon, Spinner, Tooltip, useStyles2 } from '@grafana/ui'; import { TraceView } from 'app/features/explore/TraceView/TraceView'; import { transformDataFrames } from 'app/features/explore/TraceView/utils/transform'; @@ -76,6 +76,14 @@ export const LogLineDetailsTrace = ({ timeRange, timeZone, traceRef }: Props) => const traceProp = useMemo(() => (dataFrames?.length ? transformDataFrames(dataFrames[0]) : undefined), [dataFrames]); + useEffect(() => { + if (dataSource && Array.isArray(dataFrames) && traceProp) { + reportInteraction('logs_log_line_details_trace_displayed'); + } else if (dataFrames === null) { + reportInteraction('logs_log_line_details_trace_display_failed'); + } + }, [dataFrames, dataSource, traceProp]); + return (
{dataSource && Array.isArray(dataFrames) && traceProp && ( diff --git a/public/app/features/logs/components/panel/LogListContext.tsx b/public/app/features/logs/components/panel/LogListContext.tsx index 5ba76f50518..7e5c4154213 100644 --- a/public/app/features/logs/components/panel/LogListContext.tsx +++ b/public/app/features/logs/components/panel/LogListContext.tsx @@ -24,7 +24,7 @@ import { store, } from '@grafana/data'; import { t } from '@grafana/i18n'; -import { config, getDataSourceSrv, reportInteraction } from '@grafana/runtime'; +import { config, getDataSourceSrv } from '@grafana/runtime'; import { PopoverContent } from '@grafana/ui'; import { checkLogsError, checkLogsSampled, downloadLogs as download, DownloadFormat } from '../../utils'; @@ -34,6 +34,7 @@ import { LogLineTimestampResolution } from './LogLine'; import { LogLineDetailsMode } from './LogLineDetails'; import { GetRowContextQueryFn, LogLineMenuCustomItem } from './LogLineMenu'; import { LogListFontSize } from './LogList'; +import { reportInteractionOnce } from './analytics'; import { LogListModel } from './processing'; import { getScrollbarWidth, LOG_LIST_CONTROLS_WIDTH, LOG_LIST_MIN_WIDTH } from './virtualization'; @@ -710,15 +711,6 @@ export function removeDetailsScrollPosition(log: LogListModel) { detailsScrollMap.delete(log.uid); } -const reportInteractionOnce = (interactionName: string, properties?: Record) => { - const key = `logs.log-list-context.events.${interactionName}`; - if (sessionStorage.getItem(key)) { - return; - } - sessionStorage.setItem(key, '1'); - reportInteraction(interactionName, properties); -}; - async function handleOpenAssistant(openAssistant: (props: OpenAssistantProps) => void, log: LogListModel) { const datasource = await getDataSourceSrv().get(log.datasourceUid); const context = []; diff --git a/public/app/features/logs/components/panel/analytics.ts b/public/app/features/logs/components/panel/analytics.ts new file mode 100644 index 00000000000..39ec415b939 --- /dev/null +++ b/public/app/features/logs/components/panel/analytics.ts @@ -0,0 +1,10 @@ +import { reportInteraction } from '@grafana/runtime'; + +export const reportInteractionOnce = (interactionName: string, properties?: Record) => { + const key = `logs.interactions.${interactionName}`; + if (sessionStorage.getItem(key)) { + return; + } + sessionStorage.setItem(key, '1'); + reportInteraction(interactionName, properties); +};