Fixed data source selection in explore

public/app/features/explore/state/actionTypes.ts

@@ -123,7 +123,7 @@ export interface LoadDatasourcePendingAction {
   type: ActionTypes.LoadDatasourcePending;
   payload: {
     exploreId: ExploreId;
-    datasourceId: number;
+    datasourceName: string;
   };
 }
 

public/app/features/explore/state/actions.ts

@@ -33,7 +33,7 @@ import {
 } from 'app/types/explore';
 
 import { Emitter } from 'app/core/core';
-import { RawTimeRange, TimeRange } from '@grafana/ui';
+import { RawTimeRange, TimeRange, DataSourceApi } from '@grafana/ui';
 import {
   Action as ThunkableAction,
   ActionTypes,
@@ -216,11 +216,11 @@ export const loadDatasourceMissing = (exploreId: ExploreId): LoadDatasourceMissi
 /**
  * Start the async process of loading a datasource to display a loading indicator
  */
-export const loadDatasourcePending = (exploreId: ExploreId, datasourceId: number): LoadDatasourcePendingAction => ({
+export const loadDatasourcePending = (exploreId: ExploreId, datasourceName: string): LoadDatasourcePendingAction => ({
   type: ActionTypes.LoadDatasourcePending,
   payload: {
     exploreId,
-    datasourceId,
+    datasourceName,
   },
 });
 
@@ -266,12 +266,12 @@ export const loadDatasourceSuccess = (
 /**
  * Main action to asynchronously load a datasource. Dispatches lots of smaller actions for feedback.
  */
-export function loadDatasource(exploreId: ExploreId, instance: any): ThunkResult<void> {
+export function loadDatasource(exploreId: ExploreId, instance: DataSourceApi): ThunkResult<void> {
   return async (dispatch, getState) => {
-    const datasourceId = instance.meta.id;
+    const datasourceName = instance.name;
 
     // Keep ID to track selection
-    dispatch(loadDatasourcePending(exploreId, datasourceId));
+    dispatch(loadDatasourcePending(exploreId, datasourceName));
 
     let datasourceError = null;
     try {
@@ -280,12 +280,13 @@ export function loadDatasource(exploreId: ExploreId, instance: any): ThunkResult
     } catch (error) {
       datasourceError = (error && error.statusText) || 'Network error';
     }
+
     if (datasourceError) {
       dispatch(loadDatasourceFailure(exploreId, datasourceError));
       return;
     }
 
-    if (datasourceId !== getState().explore[exploreId].requestedDatasourceId) {
+    if (datasourceName !== getState().explore[exploreId].requestedDatasourceName) {
       // User already changed datasource again, discard results
       return;
     }
@@ -311,7 +312,7 @@ export function loadDatasource(exploreId: ExploreId, instance: any): ThunkResult
       }
     }
 
-    if (datasourceId !== getState().explore[exploreId].requestedDatasourceId) {
+    if (datasourceName !== getState().explore[exploreId].requestedDatasourceName) {
       // User already changed datasource again, discard results
       return;
     }

public/app/features/explore/state/reducers.ts

@@ -185,7 +185,7 @@ const itemReducer = (state, action: Action): ExploreItemState => {
     }
 
     case ActionTypes.LoadDatasourcePending: {
-      return { ...state, datasourceLoading: true, requestedDatasourceId: action.payload.datasourceId };
+      return { ...state, datasourceLoading: true, requestedDatasourceName: action.payload.datasourceName };
     }
 
     case ActionTypes.LoadDatasourceSuccess: {
@@ -217,6 +217,7 @@ const itemReducer = (state, action: Action): ExploreItemState => {
         supportsTable,
         datasourceLoading: false,
         datasourceMissing: false,
+        datasourceError: null,
         logsHighlighterExpressions: undefined,
         modifiedQueries: initialQueries.slice(),
         queryTransactions: [],

public/app/types/explore.ts

@@ -186,7 +186,7 @@ export interface ExploreItemState {
    * Allows the selection to be discarded if something went wrong during the asynchronous
    * loading of the datasource.
    */
-  requestedDatasourceId?: number;
+  requestedDatasourceName?: string;
   /**
    * Time range for this Explore. Managed by the time picker and used by all query runs.
    */