DataSourceSettings: Hide caching settings for non-backend datasources (#34083)

* add  field to plugin meta

* only show cache settings if pluginMeta has "isBackend"

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

packages/grafana-data/src/types/datasource.ts

@@ -127,6 +127,7 @@ export interface DataSourcePluginMeta<T extends KeyValue = {}> extends PluginMet
   sort?: number;
   streaming?: boolean;
   unlicensed?: boolean;
+  isBackend?: boolean;
 }
 
 interface PluginMetaQueryOptions {

public/app/features/datasources/settings/DataSourceSettingsPage.tsx

@@ -22,7 +22,7 @@ import { getNavModel } from 'app/core/selectors/navModel';
 import { StoreState } from 'app/types/';
 import { DataSourceSettings } from '@grafana/data';
 import { Alert, Button, LinkButton } from '@grafana/ui';
-import { getDataSourceLoadingNav } from '../state/navModel';
+import { getDataSourceLoadingNav, buildNavModel, getDataSourceNav } from '../state/navModel';
 import PluginStateinfo from 'app/features/plugins/PluginStateInfo';
 import { dataSourceLoaded, setDataSourceName, setIsDefault } from '../state/reducers';
 import { selectors } from '@grafana/e2e-selectors';
@@ -41,12 +41,17 @@ function mapStateToProps(state: StoreState, props: OwnProps) {
   const { plugin, loadError, testingStatus } = state.dataSourceSettings;
   const page = params.get('page');
 
+  const nav = plugin
+    ? getDataSourceNav(buildNavModel(dataSource, plugin), page || 'settings')
+    : getDataSourceLoadingNav('settings');
+
+  const navModel = getNavModel(
+    state.navIndex,
+    page ? `datasource-page-${page}` : `datasource-settings-${dataSourceId}`,
+    nav
+  );
+
   return {
-    navModel: getNavModel(
-      state.navIndex,
-      page ? `datasource-page-${page}` : `datasource-settings-${dataSourceId}`,
-      getDataSourceLoadingNav('settings')
-    ),
     dataSource: getDataSource(state.dataSources, dataSourceId),
     dataSourceMeta: getDataSourceMeta(state.dataSources, dataSource.type),
     dataSourceId: dataSourceId,
@@ -54,6 +59,7 @@ function mapStateToProps(state: StoreState, props: OwnProps) {
     plugin,
     loadError,
     testingStatus,
+    navModel,
   };
 }
 

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

@@ -1,12 +1,16 @@
-import config from '../../../core/config';
+import { DataSourcePluginMeta, DataSourceSettings, locationUtil } from '@grafana/data';
+import { DataSourceWithBackend, getDataSourceSrv, locationService } from '@grafana/runtime';
+import { updateNavIndex } from 'app/core/actions';
 import { getBackendSrv } from 'app/core/services/backend_srv';
 import { getDatasourceSrv } from 'app/features/plugins/datasource_srv';
-import { updateNavIndex } from 'app/core/actions';
-import { buildNavModel } from './navModel';
-import { DataSourcePluginMeta, DataSourceSettings, locationUtil } from '@grafana/data';
-import { DataSourcePluginCategory, ThunkResult, ThunkDispatch } from 'app/types';
-import { getPluginSettings } from 'app/features/plugins/PluginSettingsCache';
 import { importDataSourcePlugin } from 'app/features/plugins/plugin_loader';
+import { getPluginSettings } from 'app/features/plugins/PluginSettingsCache';
+import { DataSourcePluginCategory, ThunkDispatch, ThunkResult } from 'app/types';
+
+import config from '../../../core/config';
+
+import { buildCategories } from './buildCategories';
+import { buildNavModel } from './navModel';
 import {
   dataSourceLoaded,
   dataSourceMetaLoaded,
@@ -15,13 +19,11 @@ import {
   dataSourcesLoaded,
   initDataSourceSettingsFailed,
   initDataSourceSettingsSucceeded,
+  testDataSourceFailed,
   testDataSourceStarting,
   testDataSourceSucceeded,
-  testDataSourceFailed,
 } from './reducers';
-import { buildCategories } from './buildCategories';
 import { getDataSource, getDataSourceMeta } from './selectors';
-import { getDataSourceSrv, locationService } from '@grafana/runtime';
 
 export interface DataSourceTypesLoadedPayload {
   plugins: DataSourcePluginMeta[];
@@ -118,9 +120,15 @@ export function loadDataSource(uid: string): ThunkResult<void> {
     const dataSource = await getDataSourceUsingUidOrId(uid);
     const pluginInfo = (await getPluginSettings(dataSource.type)) as DataSourcePluginMeta;
     const plugin = await importDataSourcePlugin(pluginInfo);
-
+    const isBackend = plugin.DataSourceClass.prototype instanceof DataSourceWithBackend;
+    const meta = {
+      ...pluginInfo,
+      isBackend: isBackend,
+    };
     dispatch(dataSourceLoaded(dataSource));
-    dispatch(dataSourceMetaLoaded(pluginInfo));
+    dispatch(dataSourceMetaLoaded(meta));
+
+    plugin.meta = meta;
     dispatch(updateNavIndex(buildNavModel(dataSource, plugin)));
   };
 }
@@ -157,9 +165,11 @@ async function getDataSourceUsingUidOrId(uid: string): Promise<DataSourceSetting
       })
       .toPromise();
 
-    // Not ideal to do a full page reload here but so tricky to handle this otherwise
-    // We can update the location using react router, but need to fully reload the route as the nav model
-    // page index is not matching with the url in that case. And react router has no way to unmount remount a route
+    // Not ideal to do a full page reload here but so tricky to handle this
+    // otherwise We can update the location using react router, but need to
+    // fully reload the route as the nav model page index is not matching with
+    // the url in that case. And react router has no way to unmount remount a
+    // route
     if (response.ok && response.data.id.toString() === uid) {
       window.location.href = locationUtil.assureBaseUrl(`/datasources/edit/${response.data.uid}`);
       return {} as DataSourceSettings; // avoids flashing an error

public/app/features/datasources/state/navModel.ts

@@ -68,12 +68,30 @@ export function buildNavModel(dataSource: DataSourceSettings, plugin: GenericDat
       id: `datasource-cache-${dataSource.id}`,
       text: 'Cache',
       url: `datasources/edit/${dataSource.id}/cache`,
+      hideFromTabs: !pluginMeta.isBackend,
     });
   }
 
   return navModel;
 }
 
+export function getDataSourceNav(main: NavModelItem, pageName: string): NavModel {
+  let node: NavModelItem;
+
+  // find active page
+  for (const child of main.children!) {
+    if (child.id!.indexOf(pageName) > 0) {
+      child.active = true;
+      node = child;
+      break;
+    }
+  }
+
+  return {
+    main: main,
+    node: node!,
+  };
+}
 export function getDataSourceLoadingNav(pageName: string): NavModel {
   const main = buildNavModel(
     {
@@ -125,21 +143,7 @@ export function getDataSourceLoadingNav(pageName: string): NavModel {
     } as any
   );
 
-  let node: NavModelItem;
-
-  // find active page
-  for (const child of main.children!) {
-    if (child.id!.indexOf(pageName) > 0) {
-      child.active = true;
-      node = child;
-      break;
-    }
-  }
-
-  return {
-    main: main,
-    node: node!,
-  };
+  return getDataSourceNav(main, pageName);
 }
 
 function hasDashboards(includes: PluginInclude[]): boolean {