Azure Monitor: Fix Application Insights API key field to allow input (#21738)

* Fix update api key input

* update snapshot

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

@@ -296,7 +296,12 @@ export class ConfigEditor extends PureComponent<Props, State> {
           onLoadWorkspaces={this.getWorkspaces}
           onLoadWorkspaces={this.getWorkspaces}
         />
         />
 
 
-        <InsightsConfig options={options} onUpdateOption={this.updateOption} onResetOptionKey={this.resetKey} />
+        <InsightsConfig
+          options={options}
+          onUpdateOption={this.updateOption}
+          onUpdateSecureOption={this.updateSecureOption}
+          onResetOptionKey={this.resetKey}
+        />
       </>
       </>
     );
     );
   }
   }

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

@@ -35,6 +35,7 @@ const setup = (propOverrides?: object) => {
       readOnly: false,
       readOnly: false,
     },
     },
     onUpdateOption: jest.fn(),
     onUpdateOption: jest.fn(),
+    onUpdateSecureOption: jest.fn(),
     onResetOptionKey: jest.fn(),
     onResetOptionKey: jest.fn(),
   };
   };
 
 

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

@@ -4,16 +4,17 @@ import { AzureDataSourceSettings } from '../types';
 
 
 export interface Props {
 export interface Props {
   options: AzureDataSourceSettings;
   options: AzureDataSourceSettings;
-  onUpdateOption: (key: string, val: any, secure: boolean) => void;
+  onUpdateOption: (key: string, val: any) => void;
+  onUpdateSecureOption: (key: string, val: any) => void;
   onResetOptionKey: (key: string) => void;
   onResetOptionKey: (key: string) => void;
 }
 }
 export class InsightsConfig extends PureComponent<Props> {
 export class InsightsConfig extends PureComponent<Props> {
   onAppInsightsAppIdChange = (event: ChangeEvent<HTMLInputElement>) => {
   onAppInsightsAppIdChange = (event: ChangeEvent<HTMLInputElement>) => {
-    this.props.onUpdateOption('appInsightsAppId', event.target.value, false);
+    this.props.onUpdateOption('appInsightsAppId', event.target.value);
   };
   };
 
 
   onAppInsightsApiKeyChange = (event: ChangeEvent<HTMLInputElement>) => {
   onAppInsightsApiKeyChange = (event: ChangeEvent<HTMLInputElement>) => {
-    this.props.onUpdateOption('appInsightsApiKey', event.target.value, true);
+    this.props.onUpdateSecureOption('appInsightsApiKey', event.target.value);
   };
   };
 
 
   onAppInsightsResetApiKey = () => {
   onAppInsightsResetApiKey = () => {

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

@@ -80,6 +80,7 @@ exports[`Render should render component 1`] = `
   <InsightsConfig
   <InsightsConfig
     onResetOptionKey={[Function]}
     onResetOptionKey={[Function]}
     onUpdateOption={[Function]}
     onUpdateOption={[Function]}
+    onUpdateSecureOption={[Function]}
     options={
     options={
       Object {
       Object {
         "access": "proxy",
         "access": "proxy",