ReactPanels: Adds Explore menu item (#20236)

* Fix: Adds Explore menuitem to React Panels
Fixes #19865

* Refactor: Adds CMD|CTRL+click to Explore menu item

public/app/core/services/keybindingSrv.ts

@@ -5,13 +5,13 @@ import appEvents from 'app/core/app_events';
 import { getExploreUrl } from 'app/core/utils/explore';
 import locationUtil from 'app/core/utils/location_util';
 import { store } from 'app/store/store';
-import { CoreEvents, AppEventEmitter } from 'app/types';
+import { AppEventEmitter, CoreEvents } from 'app/types';
 
 import Mousetrap from 'mousetrap';
 import { PanelEvents } from '@grafana/data';
 import 'mousetrap-global-bind';
 import { ContextSrv } from './context_srv';
-import { ILocationService, ITimeoutService, IRootScopeService } from 'angular';
+import { ILocationService, IRootScopeService, ITimeoutService } from 'angular';
 import { GrafanaRootScope } from 'app/routes/GrafanaCtrl';
 import { getLocationSrv } from '@grafana/runtime';
 
@@ -224,7 +224,13 @@ export class KeybindingSrv {
         if (dashboard.meta.focusPanelId) {
           const panel = dashboard.getPanelById(dashboard.meta.focusPanelId);
           const datasource = await this.datasourceSrv.get(panel.datasource);
-          const url = await getExploreUrl(panel, panel.targets, datasource, this.datasourceSrv, this.timeSrv);
+          const url = await getExploreUrl({
+            panel,
+            panelTargets: panel.targets,
+            panelDatasource: datasource,
+            datasourceSrv: this.datasourceSrv,
+            timeSrv: this.timeSrv,
+          });
           const urlWithoutBase = locationUtil.stripBaseFromUrl(url);
 
           if (urlWithoutBase) {

public/app/core/utils/explore.ts

@@ -3,34 +3,34 @@ import _ from 'lodash';
 import { Unsubscribable } from 'rxjs';
 // Services & Utils
 import {
-  dateMath,
-  toUtc,
-  TimeRange,
-  RawTimeRange,
-  TimeZone,
-  TimeFragment,
-  LogRowModel,
-  LogsModel,
-  LogsDedupStrategy,
-  IntervalValues,
-  DefaultTimeZone,
   DataQuery,
-  DataSourceApi,
   DataQueryError,
   DataQueryRequest,
-  PanelModel,
+  DataSourceApi,
+  dateMath,
+  DefaultTimeZone,
   HistoryItem,
+  IntervalValues,
+  LogRowModel,
+  LogsDedupStrategy,
+  LogsModel,
+  PanelModel,
+  RawTimeRange,
+  TimeFragment,
+  TimeRange,
+  TimeZone,
+  toUtc,
 } from '@grafana/data';
 import { renderUrl } from 'app/core/utils/url';
 import store from 'app/core/store';
 import kbn from 'app/core/utils/kbn';
 import { getNextRefIdChar } from './query';
-
 // Types
 import { RefreshPicker } from '@grafana/ui';
-import { ExploreUrlState, QueryTransaction, QueryOptions, ExploreMode } from 'app/types/explore';
+import { ExploreMode, ExploreUrlState, QueryOptions, QueryTransaction } from 'app/types/explore';
 import { config } from '../config';
 import { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
+import { DataSourceSrv } from '@grafana/runtime';
 
 export const DEFAULT_RANGE = {
   from: 'now-1h',
@@ -57,13 +57,15 @@ export const lastUsedDatasourceKeyForOrgId = (orgId: number) => `${LAST_USED_DAT
  * @param datasourceSrv Datasource service to query other datasources in case the panel datasource is mixed
  * @param timeSrv Time service to get the current dashboard range from
  */
-export async function getExploreUrl(
-  panel: PanelModel,
-  panelTargets: DataQuery[],
-  panelDatasource: any,
-  datasourceSrv: any,
-  timeSrv: TimeSrv
-) {
+export interface GetExploreUrlArguments {
+  panel: PanelModel;
+  panelTargets: DataQuery[];
+  panelDatasource: DataSourceApi;
+  datasourceSrv: DataSourceSrv;
+  timeSrv: TimeSrv;
+}
+export async function getExploreUrl(args: GetExploreUrlArguments) {
+  const { panel, panelTargets, panelDatasource, datasourceSrv, timeSrv } = args;
   let exploreDatasource = panelDatasource;
   let exploreTargets: DataQuery[] = panelTargets;
   let url: string;