Merge pull request #14699 from grafana/davkal/fix-14398

Explore: Remember last used datasource

public/app/core/utils/explore.test.ts

@@ -14,7 +14,6 @@ const DEFAULT_EXPLORE_STATE: ExploreState = {
   datasourceError: null,
   datasourceLoading: null,
   datasourceMissing: false,
-  datasourceName: '',
   exploreDatasources: [],
   graphInterval: 1000,
   history: [],
@@ -69,7 +68,7 @@ describe('state functions', () => {
     it('returns url parameter value for a state object', () => {
       const state = {
         ...DEFAULT_EXPLORE_STATE,
-        datasourceName: 'foo',
+        initialDatasource: 'foo',
         range: {
           from: 'now-5h',
           to: 'now',
@@ -94,7 +93,7 @@ describe('state functions', () => {
     it('returns url parameter value for a state object', () => {
       const state = {
         ...DEFAULT_EXPLORE_STATE,
-        datasourceName: 'foo',
+        initialDatasource: 'foo',
         range: {
           from: 'now-5h',
           to: 'now',
@@ -120,7 +119,7 @@ describe('state functions', () => {
     it('can parse the serialized state into the original state', () => {
       const state = {
         ...DEFAULT_EXPLORE_STATE,
-        datasourceName: 'foo',
+        initialDatasource: 'foo',
         range: {
           from: 'now - 5h',
           to: 'now',
@@ -144,7 +143,7 @@ describe('state functions', () => {
       const resultState = {
         ...rest,
         datasource: DEFAULT_EXPLORE_STATE.datasource,
-        datasourceName: datasource,
+        initialDatasource: datasource,
         initialQueries: queries,
       };
 

public/app/core/utils/explore.ts

@@ -105,7 +105,7 @@ export function parseUrlState(initial: string | undefined): ExploreUrlState {
 
 export function serializeStateToUrlParam(state: ExploreState, compact?: boolean): string {
   const urlState: ExploreUrlState = {
-    datasource: state.datasourceName,
+    datasource: state.initialDatasource,
     queries: state.initialQueries.map(clearQueryKeys),
     range: state.range,
   };

public/app/features/explore/Explore.tsx

@@ -40,6 +40,8 @@ import ErrorBoundary from './ErrorBoundary';
 import { Alert } from './Error';
 import TimePicker, { parseTime } from './TimePicker';
 
+const LAST_USED_DATASOURCE_KEY = 'grafana.explore.datasource';
+
 interface ExploreProps {
   datasourceSrv: DatasourceSrv;
   onChangeSplit: (split: boolean, state?: ExploreState) => void;
@@ -90,6 +92,10 @@ interface ExploreProps {
 export class Explore extends React.PureComponent<ExploreProps, ExploreState> {
   el: any;
   exploreEvents: Emitter;
+  /**
+   * Set via URL or local storage
+   */
+  initialDatasource: string;
   /**
    * Current query expressions of the rows including their modifications, used for running queries.
    * Not kept in component state to prevent edit-render roundtrips.
@@ -115,6 +121,7 @@ export class Explore extends React.PureComponent<ExploreProps, ExploreState> {
       initialQueries = splitState.initialQueries;
     } else {
       const { datasource, queries, range } = props.urlState as ExploreUrlState;
+      const initialDatasource = datasource || store.get(LAST_USED_DATASOURCE_KEY);
       initialQueries = ensureQueries(queries);
       const initialRange = { from: parseTime(range.from), to: parseTime(range.to) } || { ...DEFAULT_RANGE };
       // Millies step for helper bar charts
@@ -124,10 +131,10 @@ export class Explore extends React.PureComponent<ExploreProps, ExploreState> {
         datasourceError: null,
         datasourceLoading: null,
         datasourceMissing: false,
-        datasourceName: datasource,
         exploreDatasources: [],
         graphInterval: initialGraphInterval,
         graphResult: [],
+        initialDatasource,
         initialQueries,
         history: [],
         logsResult: null,
@@ -151,7 +158,7 @@ export class Explore extends React.PureComponent<ExploreProps, ExploreState> {
 
   async componentDidMount() {
     const { datasourceSrv } = this.props;
-    const { datasourceName } = this.state;
+    const { initialDatasource } = this.state;
     if (!datasourceSrv) {
       throw new Error('No datasource service passed as props.');
     }
@@ -165,10 +172,10 @@ export class Explore extends React.PureComponent<ExploreProps, ExploreState> {
 
     if (datasources.length > 0) {
       this.setState({ datasourceLoading: true, exploreDatasources });
-      // Priority: datasource in url, default datasource, first explore datasource
+      // Priority for datasource preselection: URL, localstorage, default datasource
       let datasource;
-      if (datasourceName) {
-        datasource = await datasourceSrv.get(datasourceName);
+      if (initialDatasource) {
+        datasource = await datasourceSrv.get(initialDatasource);
       } else {
         datasource = await datasourceSrv.get();
       }
@@ -253,13 +260,15 @@ export class Explore extends React.PureComponent<ExploreProps, ExploreState> {
         supportsLogs,
         supportsTable,
         datasourceLoading: false,
-        datasourceName: datasource.name,
+        initialDatasource: datasource.name,
         initialQueries: nextQueries,
         logsHighlighterExpressions: undefined,
         showingStartPage: Boolean(StartPage),
       },
       () => {
         if (datasourceError === null) {
+          // Save last-used datasource
+          store.set(LAST_USED_DATASOURCE_KEY, datasource.name);
           this.onSubmit();
         }
       }

public/app/types/explore.ts

@@ -155,11 +155,11 @@ export interface ExploreState {
   datasourceError: any;
   datasourceLoading: boolean | null;
   datasourceMissing: boolean;
-  datasourceName?: string;
   exploreDatasources: DataSourceSelectItem[];
   graphInterval: number; // in ms
   graphResult?: any[];
   history: HistoryItem[];
+  initialDatasource?: string;
   initialQueries: DataQuery[];
   logsHighlighterExpressions?: string[];
   logsResult?: LogsModel;