Going to Explore from a panel with mixed data sources now works (#18784)

Closes #18597

public/app/core/services/keybindingSrv.ts

@@ -199,7 +199,7 @@ 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.targets, datasource, this.datasourceSrv, this.timeSrv);
           if (url) {
             this.$timeout(() => this.$location.url(url));
           }

public/app/core/utils/explore.ts

@@ -65,37 +65,25 @@ 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: any,
-  panelTargets: any[],
-  panelDatasource: any,
-  datasourceSrv: any,
-  timeSrv: any
-) {
+export async function getExploreUrl(panelTargets: any[], panelDatasource: any, datasourceSrv: any, timeSrv: any) {
   let exploreDatasource = panelDatasource;
   let exploreTargets: DataQuery[] = panelTargets;
   let url: string;
 
   // Mixed datasources need to choose only one datasource
-  if (panelDatasource.meta.id === 'mixed' && panelTargets) {
+  if (panelDatasource.meta.id === 'mixed' && exploreTargets) {
     // Find first explore datasource among targets
-    let mixedExploreDatasource: any;
-    for (const t of panel.targets) {
+    for (const t of exploreTargets) {
       const datasource = await datasourceSrv.get(t.datasource);
-      if (datasource && datasource.meta.explore) {
-        mixedExploreDatasource = datasource;
+      if (datasource) {
+        exploreDatasource = datasource;
+        exploreTargets = panelTargets.filter(t => t.datasource === datasource.name);
         break;
       }
     }
-
-    // Add all its targets
-    if (mixedExploreDatasource) {
-      exploreDatasource = mixedExploreDatasource;
-      exploreTargets = panelTargets.filter(t => t.datasource === mixedExploreDatasource.name);
-    }
   }
 
-  if (panelDatasource) {
+  if (exploreDatasource) {
     const range = timeSrv.timeRangeForUrl();
     let state: Partial<ExploreUrlState> = { range };
     if (exploreDatasource.getExploreState) {
@@ -103,8 +91,8 @@ export async function getExploreUrl(
     } else {
       state = {
         ...state,
-        datasource: panelDatasource.name,
-        queries: exploreTargets.map(t => ({ ...t, datasource: panelDatasource.name })),
+        datasource: exploreDatasource.name,
+        queries: exploreTargets.map(t => ({ ...t, datasource: exploreDatasource.name })),
       };
     }
 

public/app/features/panel/metrics_panel_ctrl.ts

@@ -253,7 +253,7 @@ class MetricsPanelCtrl extends PanelCtrl {
   }
 
   async explore() {
-    const url = await getExploreUrl(this.panel, this.panel.targets, this.datasource, this.datasourceSrv, this.timeSrv);
+    const url = await getExploreUrl(this.panel.targets, this.datasource, this.datasourceSrv, this.timeSrv);
     if (url) {
       this.$timeout(() => this.$location.url(url));
     }