From 18d72ab32753787785cf60cd020c04e89149e857 Mon Sep 17 00:00:00 2001
From: Andrej Ocenas <mr.ocenas@gmail.com>
Date: Tue, 29 Oct 2019 09:38:59 +0100
Subject: [PATCH] Add some typings for react events (#20038)

---
 .../datasource/stackdriver/components/AliasBy.tsx     |  2 +-
 .../stackdriver/components/SimpleSelect.tsx           |  4 ++--
 .../stackdriver/components/VariableQueryEditor.tsx    | 10 +++++-----
 public/app/plugins/panel/graph2/GraphLegendEditor.tsx | 11 +++++------
 4 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/public/app/plugins/datasource/stackdriver/components/AliasBy.tsx b/public/app/plugins/datasource/stackdriver/components/AliasBy.tsx
index e1f56c050ee..654d1a836d8 100644
--- a/public/app/plugins/datasource/stackdriver/components/AliasBy.tsx
+++ b/public/app/plugins/datasource/stackdriver/components/AliasBy.tsx
@@ -30,7 +30,7 @@ export class AliasBy extends Component<Props, State> {
     }
   }
 
-  onChange = (e: any) => {
+  onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     this.setState({ value: e.target.value });
     this.propagateOnChange(e.target.value);
   };
diff --git a/public/app/plugins/datasource/stackdriver/components/SimpleSelect.tsx b/public/app/plugins/datasource/stackdriver/components/SimpleSelect.tsx
index 8abba1e18f1..db931d012a7 100644
--- a/public/app/plugins/datasource/stackdriver/components/SimpleSelect.tsx
+++ b/public/app/plugins/datasource/stackdriver/components/SimpleSelect.tsx
@@ -1,7 +1,7 @@
-import React, { FC } from 'react';
+import React, { ChangeEvent, FC } from 'react';
 
 interface Props {
-  onValueChange: (e: any) => void;
+  onValueChange: (e: ChangeEvent<HTMLSelectElement>) => void;
   options: any[];
   value: string;
   label: string;
diff --git a/public/app/plugins/datasource/stackdriver/components/VariableQueryEditor.tsx b/public/app/plugins/datasource/stackdriver/components/VariableQueryEditor.tsx
index 5e62703aa55..3817a268b39 100644
--- a/public/app/plugins/datasource/stackdriver/components/VariableQueryEditor.tsx
+++ b/public/app/plugins/datasource/stackdriver/components/VariableQueryEditor.tsx
@@ -1,4 +1,4 @@
-import React, { PureComponent } from 'react';
+import React, { ChangeEvent, PureComponent } from 'react';
 import { VariableQueryProps } from 'app/types/plugins';
 import SimpleSelect from './SimpleSelect';
 import { getMetricTypes, getLabelKeys, extractServicesFromMetricDescriptors } from '../functions';
@@ -63,7 +63,7 @@ export class StackdriverVariableQueryEditor extends PureComponent<VariableQueryP
     this.setState(state);
   }
 
-  async onQueryTypeChange(event: any) {
+  async onQueryTypeChange(event: ChangeEvent<HTMLSelectElement>) {
     const state: any = {
       selectedQueryType: event.target.value,
       ...(await this.getLabels(this.state.selectedMetricType, event.target.value)),
@@ -71,7 +71,7 @@ export class StackdriverVariableQueryEditor extends PureComponent<VariableQueryP
     this.setState(state);
   }
 
-  async onServiceChange(event: any) {
+  async onServiceChange(event: ChangeEvent<HTMLSelectElement>) {
     const { metricTypes, selectedMetricType } = getMetricTypes(
       this.state.metricDescriptors,
       this.state.selectedMetricType,
@@ -87,12 +87,12 @@ export class StackdriverVariableQueryEditor extends PureComponent<VariableQueryP
     this.setState(state);
   }
 
-  async onMetricTypeChange(event: any) {
+  async onMetricTypeChange(event: ChangeEvent<HTMLSelectElement>) {
     const state: any = { selectedMetricType: event.target.value, ...(await this.getLabels(event.target.value)) };
     this.setState(state);
   }
 
-  onLabelKeyChange(event: any) {
+  onLabelKeyChange(event: ChangeEvent<HTMLSelectElement>) {
     this.setState({ labelKey: event.target.value });
   }
 
diff --git a/public/app/plugins/panel/graph2/GraphLegendEditor.tsx b/public/app/plugins/panel/graph2/GraphLegendEditor.tsx
index 5f91d6ced70..2cf43d86a99 100644
--- a/public/app/plugins/panel/graph2/GraphLegendEditor.tsx
+++ b/public/app/plugins/panel/graph2/GraphLegendEditor.tsx
@@ -23,17 +23,16 @@ export const GraphLegendEditor: React.FunctionComponent<GraphLegendEditorProps>
     });
   };
 
-  const onOptionToggle = (option: keyof LegendOptions) => (event?: React.SyntheticEvent<HTMLInputElement>) => {
-    const newOption = {};
+  const onOptionToggle = (option: keyof LegendOptions) => (event?: React.ChangeEvent<HTMLInputElement>) => {
+    const newOption: Partial<LegendOptions> = {};
     if (!event) {
       return;
     }
-    // TODO: fix the ignores
-    // @ts-ignore
-    newOption[option] = event.target.checked;
+
     if (option === 'placement') {
-      // @ts-ignore
       newOption[option] = event.target.checked ? 'right' : 'under';
+    } else {
+      newOption[option] = event.target.checked;
     }
 
     onChange({