AzureMonitor: Remove deprecated configuration parameters (#45860)

.betterer.results

@@ -326,7 +326,7 @@ exports[`no enzyme tests`] = {
     "public/app/plugins/datasource/elasticsearch/configuration/DataLinks.test.tsx:2916632804": [
       [1, 17, 13, "RegExp match", "2409514259"]
     ],
-    "public/app/plugins/datasource/grafana-azure-monitor-datasource/components/InsightsConfig.test.tsx:866257119": [
+    "public/app/plugins/datasource/grafana-azure-monitor-datasource/components/deprecated/components/InsightsConfig.test.tsx:1635510338": [
       [1, 19, 13, "RegExp match", "2409514259"]
     ],
     "public/app/plugins/datasource/influxdb/components/ConfigEditor.test.tsx:767000341": [

public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ConfigEditor.tsx

@@ -1,21 +1,15 @@
-import React, { PureComponent } from 'react';
-import {
-  DataSourcePluginOptionsEditorProps,
-  SelectableValue,
-  updateDatasourcePluginJsonDataOption,
-  updateDatasourcePluginOption,
-  updateDatasourcePluginResetOption,
-  updateDatasourcePluginSecureJsonDataOption,
-} from '@grafana/data';
-import { Alert } from '@grafana/ui';
-import { MonitorConfig } from './MonitorConfig';
-import { AnalyticsConfig } from './AnalyticsConfig';
+import { DataSourcePluginOptionsEditorProps, SelectableValue, updateDatasourcePluginOption } from '@grafana/data';
 import { getBackendSrv, getTemplateSrv, TemplateSrv } from '@grafana/runtime';
-import { InsightsConfig } from './InsightsConfig';
+import { Alert } from '@grafana/ui';
+import React, { PureComponent } from 'react';
+
 import ResponseParser from '../azure_monitor/response_parser';
 import { AzureDataSourceJsonData, AzureDataSourceSecureJsonData, AzureDataSourceSettings } from '../types';
-import { isAppInsightsConfigured } from '../credentials';
 import { routeNames } from '../utils/common';
+import { AnalyticsConfig } from './deprecated/components/AnalyticsConfig';
+import { InsightsConfig } from './deprecated/components/InsightsConfig';
+import { gtGrafana9, isAppInsightsConfigured } from './deprecated/utils';
+import { MonitorConfig } from './MonitorConfig';
 
 export type Props = DataSourcePluginOptionsEditorProps<AzureDataSourceJsonData, AzureDataSourceSecureJsonData>;
 
@@ -27,7 +21,6 @@ interface ErrorMessage {
 
 export interface State {
   unsaved: boolean;
-  appInsightsInitiallyConfigured: boolean;
   error?: ErrorMessage;
 }
 
@@ -40,7 +33,6 @@ export class ConfigEditor extends PureComponent<Props, State> {
 
     this.state = {
       unsaved: false,
-      appInsightsInitiallyConfigured: isAppInsightsConfigured(props.options),
     };
     this.baseURL = `/api/datasources/${this.props.options.id}/resources/${routeNames.azureMonitor}/subscriptions`;
   }
@@ -90,24 +82,6 @@ export class ConfigEditor extends PureComponent<Props, State> {
     }
   };
 
-  // TODO: Used only by InsightsConfig
-  private onUpdateJsonDataOption =
-    (key: keyof AzureDataSourceJsonData) => (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => {
-      updateDatasourcePluginJsonDataOption(this.props, key, event.currentTarget.value);
-    };
-
-  // TODO: Used only by InsightsConfig
-  private onUpdateSecureJsonDataOption =
-    (key: keyof AzureDataSourceSecureJsonData) =>
-    (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => {
-      updateDatasourcePluginSecureJsonDataOption(this.props, key, event.currentTarget.value);
-    };
-
-  // TODO: Used only by InsightsConfig
-  private resetSecureKey = (key: keyof AzureDataSourceSecureJsonData) => {
-    updateDatasourcePluginResetOption(this.props, key);
-  };
-
   render() {
     const { options } = this.props;
     const { error } = this.state;
@@ -115,16 +89,14 @@ export class ConfigEditor extends PureComponent<Props, State> {
     return (
       <>
         <MonitorConfig options={options} updateOptions={this.updateOptions} getSubscriptions={this.getSubscriptions} />
-        <AnalyticsConfig options={options} updateOptions={this.updateOptions} />
-        {this.state.appInsightsInitiallyConfigured && (
-          <InsightsConfig
-            options={options}
-            onUpdateJsonDataOption={this.onUpdateJsonDataOption}
-            onUpdateSecureJsonDataOption={this.onUpdateSecureJsonDataOption}
-            onResetOptionKey={this.resetSecureKey}
-          />
+        {/* Remove with Grafana 9 */}
+        {!gtGrafana9() && (
+          <>
+            <AnalyticsConfig options={options} updateOptions={this.updateOptions} />
+            {isAppInsightsConfigured(options) && <InsightsConfig {...this.props} />}
+          </>
         )}
-
+        {/* ===================== */}
         {error && (
           <Alert severity="error" title={error.title}>
             <p>{error.description}</p>

public/app/plugins/datasource/grafana-azure-monitor-datasource/components/deprecated/components/AnalyticsConfig.test.tsx

@@ -1,7 +1,8 @@
-import React from 'react';
 import { render, screen } from '@testing-library/react';
-import AnalyticsConfig, { Props } from './AnalyticsConfig';
 import userEvent from '@testing-library/user-event';
+import React from 'react';
+
+import AnalyticsConfig, { Props } from './AnalyticsConfig';
 
 const setup = (propsFunc?: (props: Props) => Props) => {
   let props: Props = {

public/app/plugins/datasource/grafana-azure-monitor-datasource/components/deprecated/components/AnalyticsConfig.tsx

@@ -1,8 +1,9 @@
+import { Alert, Button } from '@grafana/ui';
 import React, { FunctionComponent, useMemo } from 'react';
-import { AzureCredentialsForm } from './AzureCredentialsForm';
-import { Button, Alert } from '@grafana/ui';
-import { AzureDataSourceSettings } from '../types';
-import { getCredentials } from '../credentials';
+
+import { getCredentials } from '../../../credentials';
+import { AzureDataSourceSettings } from '../../../types';
+import { AzureCredentialsForm } from '../../AzureCredentialsForm';
 
 export interface Props {
   options: AzureDataSourceSettings;

public/app/plugins/datasource/grafana-azure-monitor-datasource/components/deprecated/components/InsightsConfig.test.tsx

@@ -1,7 +1,10 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import InsightsConfig, { Props } from './InsightsConfig';
 import { Button, LegacyForms } from '@grafana/ui';
+import { shallow } from 'enzyme';
+import React from 'react';
+
+import { Props } from '../../ConfigEditor';
+import InsightsConfig from './InsightsConfig';
+
 const { Input } = LegacyForms;
 
 const setup = (propOverrides?: object) => {
@@ -33,9 +36,7 @@ const setup = (propOverrides?: object) => {
       version: 1,
       readOnly: false,
     },
-    onUpdateJsonDataOption: jest.fn(),
-    onUpdateSecureJsonDataOption: jest.fn(),
-    onResetOptionKey: jest.fn(),
+    onOptionsChange: jest.fn(),
   };
 
   Object.assign(props, propOverrides);

public/app/plugins/datasource/grafana-azure-monitor-datasource/components/deprecated/components/InsightsConfig.tsx

@@ -1,25 +1,38 @@
+import {
+  updateDatasourcePluginJsonDataOption,
+  updateDatasourcePluginResetOption,
+  updateDatasourcePluginSecureJsonDataOption,
+} from '@grafana/data';
+import { Alert, Button, InlineFormLabel, LegacyForms } from '@grafana/ui';
 import React, { PureComponent } from 'react';
-import { InlineFormLabel, Button, LegacyForms, Alert } from '@grafana/ui';
+
+import { AzureDataSourceJsonData, AzureDataSourceSecureJsonData } from '../../../types';
+import { Props } from '../../ConfigEditor';
+
 const { Input } = LegacyForms;
-import { AzureDataSourceSettings, AzureDataSourceJsonData, AzureDataSourceSecureJsonData } from '../types';
 
-export interface Props {
-  options: AzureDataSourceSettings;
-  onUpdateJsonDataOption: (
-    key: keyof AzureDataSourceJsonData
-  ) => (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => void;
-  onUpdateSecureJsonDataOption: (
-    key: keyof AzureDataSourceSecureJsonData
-  ) => (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => void;
-  onResetOptionKey: (key: keyof AzureDataSourceSecureJsonData) => void;
-}
 export class InsightsConfig extends PureComponent<Props> {
-  onAppInsightsResetApiKey = () => {
-    this.props.onResetOptionKey('appInsightsApiKey');
+  private onAppInsightsResetApiKey = () => {
+    this.resetSecureKey('appInsightsApiKey');
+  };
+
+  private onUpdateJsonDataOption =
+    (key: keyof AzureDataSourceJsonData) => (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => {
+      updateDatasourcePluginJsonDataOption(this.props, key, event.currentTarget.value);
+    };
+
+  private onUpdateSecureJsonDataOption =
+    (key: keyof AzureDataSourceSecureJsonData) =>
+    (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => {
+      updateDatasourcePluginSecureJsonDataOption(this.props, key, event.currentTarget.value);
+    };
+
+  private resetSecureKey = (key: keyof AzureDataSourceSecureJsonData) => {
+    updateDatasourcePluginResetOption(this.props, key);
   };
 
   render() {
-    const { options, onUpdateJsonDataOption, onUpdateSecureJsonDataOption } = this.props;
+    const { options } = this.props;
     return (
       <>
         <h3 className="page-heading">Azure Application Insights</h3>
@@ -55,7 +68,7 @@ export class InsightsConfig extends PureComponent<Props> {
                     className="width-30"
                     placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"
                     value={options.secureJsonData!.appInsightsApiKey || ''}
-                    onChange={onUpdateSecureJsonDataOption('appInsightsApiKey')}
+                    onChange={this.onUpdateSecureJsonDataOption('appInsightsApiKey')}
                     disabled={this.props.options.readOnly}
                   />
                 </div>
@@ -69,7 +82,7 @@ export class InsightsConfig extends PureComponent<Props> {
                 <Input
                   className="width-30"
                   value={options.jsonData.appInsightsAppId || ''}
-                  onChange={onUpdateJsonDataOption('appInsightsAppId')}
+                  onChange={this.onUpdateJsonDataOption('appInsightsAppId')}
                   disabled={this.props.options.readOnly}
                 />
               </div>

public/app/plugins/datasource/grafana-azure-monitor-datasource/components/deprecated/components/__snapshots__/InsightsConfig.test.tsx.snap

@@ -65,6 +65,7 @@ exports[`Render should disable insights api key input 1`] = `
         >
           <Input
             className="width-30"
+            onChange={[Function]}
             value="cddcc020-2c94-460a-a3d0-df3147ffa792"
           />
         </div>
@@ -106,6 +107,7 @@ exports[`Render should enable insights api key input 1`] = `
         >
           <Input
             className="width-30"
+            onChange={[Function]}
             placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"
             value="e7f3f661-a933-4b3f-8176-51c4f982ec48"
           />
@@ -128,6 +130,7 @@ exports[`Render should enable insights api key input 1`] = `
         >
           <Input
             className="width-30"
+            onChange={[Function]}
             value="cddcc020-2c94-460a-a3d0-df3147ffa792"
           />
         </div>
@@ -170,6 +173,7 @@ exports[`Render should render component 1`] = `
           <Input
             className="width-30"
             disabled={false}
+            onChange={[Function]}
             placeholder="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"
             value=""
           />
@@ -193,6 +197,7 @@ exports[`Render should render component 1`] = `
           <Input
             className="width-30"
             disabled={false}
+            onChange={[Function]}
             value=""
           />
         </div>

public/app/plugins/datasource/grafana-azure-monitor-datasource/components/deprecated/utils.tsx

@@ -0,0 +1,13 @@
+import { config } from '@grafana/runtime';
+import { gt, valid } from 'semver';
+
+import { AzureDataSourceSettings } from '../../types';
+
+export function isAppInsightsConfigured(options: AzureDataSourceSettings) {
+  return !!(options.jsonData.appInsightsAppId && options.secureJsonFields.appInsightsApiKey);
+}
+
+export function gtGrafana9() {
+  // AppInsights configuration will be removed with Grafana 9
+  return valid(config.buildInfo.version) && gt(config.buildInfo.version, '9.0.0-beta1');
+}

public/app/plugins/datasource/grafana-azure-monitor-datasource/credentials.ts

@@ -1,4 +1,5 @@
 import { config } from '@grafana/runtime';
+
 import {
   AzureAuthType,
   AzureCloud,
@@ -165,7 +166,3 @@ export function updateCredentials(
       return options;
   }
 }
-
-export function isAppInsightsConfigured(options: AzureDataSourceSettings) {
-  return !!(options.jsonData.appInsightsAppId && options.secureJsonFields.appInsightsApiKey);
-}