diff --git a/public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataQueriesTab.tsx b/public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataQueriesTab.tsx index ce2784758be..668b8612851 100644 --- a/public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataQueriesTab.tsx +++ b/public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataQueriesTab.tsx @@ -376,6 +376,7 @@ export function PanelDataQueriesTabRendered({ model }: SceneComponentProps @@ -393,7 +394,9 @@ export function PanelDataQueriesTabRendered({ model }: SceneComponentProps - openQueryLibraryDrawer(getDatasourceNames(datasource, queries), onSelectQueryFromLibrary) + openQueryLibraryDrawer(getDatasourceNames(datasource, queries), onSelectQueryFromLibrary, { + context: CoreApp.PanelEditor, + }) } variant="secondary" data-testid={selectors.components.QueryTab.addQueryFromLibrary} diff --git a/public/app/features/explore/QueryLibrary/QueryLibraryContext.tsx b/public/app/features/explore/QueryLibrary/QueryLibraryContext.tsx index 90640203d48..9037182c156 100644 --- a/public/app/features/explore/QueryLibrary/QueryLibraryContext.tsx +++ b/public/app/features/explore/QueryLibrary/QueryLibraryContext.tsx @@ -1,5 +1,6 @@ import { createContext, ReactNode, useContext } from 'react'; +import { CoreApp } from '@grafana/data'; import { DataQuery } from '@grafana/schema'; import { OnSelectQueryType } from './types'; @@ -17,7 +18,7 @@ export type QueryLibraryContextType = { * @param datasourceFilters Data source names that will be used for initial filter in the library. * @param queryActionButton Action button will be shown in the library next to the query and can implement context * specific actions with the library, like running the query or updating some query in the current app. - * @param options.context Used for tracking. Should identify the context this is called from, like 'explore' or + * @param options.context Used for QueryEditor. Should identify the context this is called from, like 'explore' or * 'dashboard'. */ openDrawer: ( @@ -32,7 +33,7 @@ export type QueryLibraryContextType = { * Opens a modal for adding a query to the library. * @param query Query to be saved * @param options.onSave Callback that will be called after the query is saved. - * @param options.context Used for tracking. Should identify the context this is called from, like 'explore' or + * @param options.context Used for rendering QueryEditor. Should identify the context this is called from, like 'explore' or * 'dashboard'. * @param options.title Default title for the modal, can be overridden by the query title. */ @@ -46,8 +47,9 @@ export type QueryLibraryContextType = { * Returns a predefined small button that can be used to save a query to the library. * @param query */ - renderSaveQueryButton: (query: DataQuery) => ReactNode; + renderSaveQueryButton: (query: DataQuery, app?: CoreApp) => ReactNode; queryLibraryEnabled: boolean; + context: string; }; export const QueryLibraryContext = createContext({ @@ -63,6 +65,7 @@ export const QueryLibraryContext = createContext({ }, queryLibraryEnabled: false, + context: 'unknown', }); export function useQueryLibraryContext() { diff --git a/public/app/features/explore/QueryLibrary/mocks.tsx b/public/app/features/explore/QueryLibrary/mocks.tsx index 9126fdabe42..e59732870a9 100644 --- a/public/app/features/explore/QueryLibrary/mocks.tsx +++ b/public/app/features/explore/QueryLibrary/mocks.tsx @@ -17,6 +17,7 @@ export function QueryLibraryContextProviderMock(props: PropsWithChildren) closeAddQueryModal: jest.fn(), renderSaveQueryButton: jest.fn(), queryLibraryEnabled: Boolean(props.queryLibraryEnabled), + context: 'explore', }} > {props.children} diff --git a/public/app/features/explore/RichHistory/RichHistoryAddToLibrary.tsx b/public/app/features/explore/RichHistory/RichHistoryAddToLibrary.tsx index 6c70ac1bf89..e99c0e6cebc 100644 --- a/public/app/features/explore/RichHistory/RichHistoryAddToLibrary.tsx +++ b/public/app/features/explore/RichHistory/RichHistoryAddToLibrary.tsx @@ -22,7 +22,7 @@ export const RichHistoryAddToLibrary = ({ query }: Props) => { variant="secondary" aria-label={buttonLabel} onClick={() => { - openAddQueryModal(query, { onSave: () => setHasBeenSaved(true), context: 'richHistory' }); + openAddQueryModal(query, { onSave: () => setHasBeenSaved(true), context: 'rich-history' }); }} > {buttonLabel} diff --git a/public/app/features/explore/SecondaryActions.tsx b/public/app/features/explore/SecondaryActions.tsx index cd9d25b860b..b5b30aaae1d 100644 --- a/public/app/features/explore/SecondaryActions.tsx +++ b/public/app/features/explore/SecondaryActions.tsx @@ -1,6 +1,6 @@ import { css } from '@emotion/css'; -import { GrafanaTheme2 } from '@grafana/data'; +import { CoreApp, GrafanaTheme2 } from '@grafana/data'; import { selectors } from '@grafana/e2e-selectors'; import { Trans, t } from '@grafana/i18n'; import { ToolbarButton, useTheme2 } from '@grafana/ui'; @@ -76,7 +76,11 @@ export function SecondaryActions({ data-testid={selectors.pages.Explore.General.addFromQueryLibrary} aria-label={t('explore.secondary-actions.add-from-query-library', 'Add query from library')} variant="canvas" - onClick={() => openQueryLibraryDrawer(activeDatasources, onSelectQueryFromLibrary)} + onClick={() => + openQueryLibraryDrawer(activeDatasources, onSelectQueryFromLibrary, { + context: CoreApp.Explore, + }) + } icon="plus" > Add query from library diff --git a/public/app/features/query/components/QueryEditorRow.tsx b/public/app/features/query/components/QueryEditorRow.tsx index 352451481d0..b711b76d8c8 100644 --- a/public/app/features/query/components/QueryEditorRow.tsx +++ b/public/app/features/query/components/QueryEditorRow.tsx @@ -380,7 +380,7 @@ export class QueryEditorRow extends PureComponent )} {this.renderExtraActions()} - + extends PureComponent {!hideHideQueryButton ? ( { datasourceFilters: string[]; onSelectQuery: (query: DataQuery) => void; + app?: CoreApp; } function ReplaceQueryFromLibrary({ datasourceFilters, onSelectQuery, + app, }: ReplaceQueryFromLibraryProps) { const { openDrawer, queryLibraryEnabled } = useQueryLibraryContext(); const onReplaceQueryFromLibrary = () => { - openDrawer(datasourceFilters, onSelectQuery, { isReplacingQuery: true }); + openDrawer(datasourceFilters, onSelectQuery, { isReplacingQuery: true, context: app }); }; return queryLibraryEnabled ? (