Skip to content

Commit 4015711

Browse files
harisrozajacharisrozajac
authored
Query Library: Interaction events for query library (grafana#92159)
* interaction events for query library * track adding or editing description * Update to specify it's in explore
1 parent bef7139 commit 4015711

File tree

5 files changed

+89
-6
lines changed

5 files changed

+89
-6
lines changed

‎public/app/features/explore/ExplorePage.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import { ExploreActions } from './ExploreActions';
2121
import { ExploreDrawer } from './ExploreDrawer';
2222
import { ExplorePaneContainer } from './ExplorePaneContainer';
2323
import { QueriesDrawerContextProvider, useQueriesDrawerContext } from './QueriesDrawer/QueriesDrawerContext';
24+
import { queryLibraryTrackAddFromQueryRow } from './QueryLibrary/QueryLibraryAnalyticsEvents';
2425
import { QueryTemplateForm } from './QueryLibrary/QueryTemplateForm';
2526
import RichHistoryContainer from './RichHistory/RichHistoryContainer';
2627
import { useExplorePageTitle } from './hooks/useExplorePageTitle';
@@ -143,6 +144,7 @@ function ExplorePageContent(props: GrafanaRouteComponentProps<{}, ExploreQueryPa
143144
onSave={(isSuccess) => {
144145
if (isSuccess) {
145146
setQueryToAdd(undefined);
147+
queryLibraryTrackAddFromQueryRow(queryToAdd?.datasource?.type || '');
146148
}
147149
}}
148150
queryToAdd={queryToAdd!}

‎public/app/features/explore/QueriesDrawer/QueriesDrawerDropdown.tsx

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ import { css } from '@emotion/css';
33
import { Button, ButtonGroup, Dropdown, Menu, ToolbarButton } from '@grafana/ui';
44
import { useStyles2 } from '@grafana/ui/';
55

6+
import { queryLibraryTrackToggle } from '../QueryLibrary/QueryLibraryAnalyticsEvents';
7+
68
import { Tabs, useQueriesDrawerContext } from './QueriesDrawerContext';
79
import { i18n } from './utils';
810

@@ -21,6 +23,8 @@ export function QueriesDrawerDropdown({ variant }: Props) {
2123
}
2224

2325
function toggle(tab: Tabs) {
26+
tab === Tabs.QueryLibrary && queryLibraryTrackToggle(!drawerOpened);
27+
2428
setSelectedTab(tab);
2529
setDrawerOpened(false);
2630
setDrawerOpened(true);
@@ -38,7 +42,10 @@ export function QueriesDrawerDropdown({ variant }: Props) {
3842
<ToolbarButton
3943
icon="book"
4044
variant={drawerOpened ? 'active' : 'canvas'}
41-
onClick={() => setDrawerOpened(!drawerOpened)}
45+
onClick={() => {
46+
setDrawerOpened(!drawerOpened);
47+
selectedTab === Tabs.QueryLibrary && queryLibraryTrackToggle(!drawerOpened);
48+
}}
4249
aria-label={selectedTab}
4350
>
4451
{variant === 'full' ? selectedTab : undefined}
@@ -48,7 +55,10 @@ export function QueriesDrawerDropdown({ variant }: Props) {
4855
className={styles.close}
4956
variant="secondary"
5057
icon="times"
51-
onClick={() => setDrawerOpened(false)}
58+
onClick={() => {
59+
setDrawerOpened(false);
60+
selectedTab === Tabs.QueryLibrary && queryLibraryTrackToggle(false);
61+
}}
5262
></Button>
5363
) : (
5464
<Dropdown overlay={menu}>

‎public/app/features/explore/QueryLibrary/QueryLibraryAnalyticsEvents.ts

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import { reportInteraction } from '@grafana/runtime';
2+
3+
const QUERY_LIBRARY_EXPLORE_EVENT = 'query_library_explore_clicked';
4+
5+
export function queryLibraryTrackToggle(open: boolean) {
6+
reportInteraction(QUERY_LIBRARY_EXPLORE_EVENT, {
7+
item: 'query_library_toggle',
8+
type: open ? 'open' : 'close',
9+
});
10+
}
11+
12+
export function queryLibraryTrackAddFromQueryHistory(datasourceType: string) {
13+
reportInteraction(QUERY_LIBRARY_EXPLORE_EVENT, {
14+
item: 'add_query_from_query_history',
15+
type: datasourceType,
16+
});
17+
}
18+
19+
export function queryLibraryTrackAddFromQueryHistoryAddModalShown() {
20+
reportInteraction(QUERY_LIBRARY_EXPLORE_EVENT, {
21+
item: 'add_query_modal_from_query_history',
22+
type: 'open',
23+
});
24+
}
25+
26+
export function queryLibraryTrackAddFromQueryRow(datasourceType: string) {
27+
reportInteraction(QUERY_LIBRARY_EXPLORE_EVENT, {
28+
item: 'add_query_from_query_row',
29+
type: datasourceType,
30+
});
31+
}
32+
33+
export function queryLibaryTrackDeleteQuery() {
34+
reportInteraction(QUERY_LIBRARY_EXPLORE_EVENT, {
35+
item: 'delete_query',
36+
});
37+
}
38+
39+
export function queryLibraryTrackRunQuery(datasourceType: string) {
40+
reportInteraction(QUERY_LIBRARY_EXPLORE_EVENT, {
41+
item: 'run_query',
42+
type: datasourceType,
43+
});
44+
}
45+
46+
export function queryLibraryTrackAddOrEditDescription() {
47+
reportInteraction(QUERY_LIBRARY_EXPLORE_EVENT, {
48+
item: 'add_or_edit_description',
49+
});
50+
}

‎public/app/features/explore/QueryLibrary/QueryTemplatesTable/ActionsCell.tsx

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useState } from 'react';
22

3-
import { reportInteraction, getAppEvents } from '@grafana/runtime';
3+
import { getAppEvents } from '@grafana/runtime';
44
import { IconButton, Modal } from '@grafana/ui';
55
import { notifyApp } from 'app/core/actions';
66
import { createSuccessNotification } from 'app/core/copy/appNotification';
@@ -11,6 +11,11 @@ import { ShowConfirmModalEvent } from 'app/types/events';
1111

1212
import ExploreRunQueryButton from '../../ExploreRunQueryButton';
1313
import { useQueriesDrawerContext } from '../../QueriesDrawer/QueriesDrawerContext';
14+
import {
15+
queryLibaryTrackDeleteQuery,
16+
queryLibraryTrackAddOrEditDescription,
17+
queryLibraryTrackRunQuery,
18+
} from '../QueryLibraryAnalyticsEvents';
1419
import { QueryTemplateForm } from '../QueryTemplateForm';
1520

1621
import { useQueryLibraryListStyles } from './styles';
@@ -32,7 +37,7 @@ function ActionsCell({ queryTemplate, rootDatasourceUid, queryUid }: ActionsCell
3237
const performDelete = (queryUid: string) => {
3338
deleteQueryTemplate({ uid: queryUid });
3439
dispatch(notifyApp(createSuccessNotification(t('explore.query-library.query-deleted', 'Query deleted'))));
35-
reportInteraction('grafana_explore_query_library_deleted');
40+
queryLibaryTrackDeleteQuery();
3641
};
3742

3843
getAppEvents().publish(
@@ -71,12 +76,16 @@ function ActionsCell({ queryTemplate, rootDatasourceUid, queryUid }: ActionsCell
7176
tooltip={t('explore.query-library.add-edit-description', 'Add/edit description')}
7277
onClick={() => {
7378
setEditFormOpen(true);
79+
queryLibraryTrackAddOrEditDescription();
7480
}}
7581
/>
7682
<ExploreRunQueryButton
7783
queries={queryTemplate.query ? [queryTemplate.query] : []}
7884
rootDatasourceUid={rootDatasourceUid}
79-
onClick={() => setDrawerOpened(false)}
85+
onClick={() => {
86+
setDrawerOpened(false);
87+
queryLibraryTrackRunQuery(queryTemplate.datasourceType || '');
88+
}}
8089
/>
8190
<Modal
8291
title={t('explore.query-template-modal.edit-title', 'Edit query')}

‎public/app/features/explore/RichHistory/RichHistoryAddToLibrary.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ import { DataQuery } from '@grafana/schema';
55
import { Button, Modal } from '@grafana/ui';
66
import { isQueryLibraryEnabled } from 'app/features/query-library';
77

8+
import {
9+
queryLibraryTrackAddFromQueryHistory,
10+
queryLibraryTrackAddFromQueryHistoryAddModalShown,
11+
} from '../QueryLibrary/QueryLibraryAnalyticsEvents';
812
import { QueryTemplateForm } from '../QueryLibrary/QueryTemplateForm';
913

1014
type Props = {
@@ -19,7 +23,14 @@ export const RichHistoryAddToLibrary = ({ query }: Props) => {
1923

2024
return isQueryLibraryEnabled() && !hasBeenSaved ? (
2125
<>
22-
<Button variant="secondary" aria-label={buttonLabel} onClick={() => setIsOpen(true)}>
26+
<Button
27+
variant="secondary"
28+
aria-label={buttonLabel}
29+
onClick={() => {
30+
setIsOpen(true);
31+
queryLibraryTrackAddFromQueryHistoryAddModalShown();
32+
}}
33+
>
2334
{buttonLabel}
2435
</Button>
2536
<Modal
@@ -34,6 +45,7 @@ export const RichHistoryAddToLibrary = ({ query }: Props) => {
3445
if (isSuccess) {
3546
setIsOpen(false);
3647
setHasBeenSaved(true);
48+
queryLibraryTrackAddFromQueryHistory(query.datasource?.type || '');
3749
}
3850
}}
3951
/>

0 commit comments

Comments
 (0)