Chore: eslint react hook fix for public folder (#31174)

* Fixes under public/app/plugins

* Fixes under public/app/plugins/datasource

* Fixes under public/app/features

* Fixes under public/app/features

* Fixes under public/app/features

* Fixes under public/app/components

* Fix PanelNotSupported test

* Fix one more warning

* Fix warning in usePanelSave

* Fix traceview empty response

* Azure monitor fixes

* More fixes

* Fix tests for azure monitor

* Fixes after merging master

* Add comment for disabled rules

* Fixes after merging master

* Fixes after merging master

* Adress review comments

* Fix azure tests

* Address review feedbacks

public/app/plugins/datasource/cloudwatch/components/ConfigEditor.tsx

@@ -15,6 +15,7 @@ export type Props = DataSourcePluginOptionsEditorProps<CloudWatchJsonData, Cloud
 
 export const ConfigEditor: FC<Props> = (props: Props) => {
   const [datasource, setDatasource] = useState<CloudWatchDatasource>();
+  const { options } = props;
 
   const addWarning = (message: string) => {
     store.dispatch(notifyApp(createWarningNotification('CloudWatch Authentication', message)));
@@ -22,23 +23,19 @@ export const ConfigEditor: FC<Props> = (props: Props) => {
 
   useEffect(() => {
     getDatasourceSrv()
-      .loadDatasource(props.options.name)
+      .loadDatasource(options.name)
       .then((datasource: CloudWatchDatasource) => setDatasource(datasource));
 
-    if (props.options.jsonData.authType === 'arn') {
+    if (options.jsonData.authType === 'arn') {
       addWarning('Since grafana 7.3 authentication type "arn" is deprecated, falling back to default SDK provider');
-    } else if (
-      props.options.jsonData.authType === 'credentials' &&
-      !props.options.jsonData.profile &&
-      !props.options.jsonData.database
-    ) {
+    } else if (options.jsonData.authType === 'credentials' && !options.jsonData.profile && !options.jsonData.database) {
       addWarning(
         'As of grafana 7.3 authentication type "credentials" should be used only for shared file credentials. \
              If you don\'t have a credentials file, switch to the default SDK provider for extracting credentials \
              from environment variables or IAM roles'
       );
     }
-  }, []);
+  }, [options.jsonData.authType, options.jsonData.database, options.jsonData.profile, options.name]);
 
   return (
     <>
@@ -53,7 +50,7 @@ export const ConfigEditor: FC<Props> = (props: Props) => {
           <Input
             width={60}
             placeholder="Namespace1,Namespace2"
-            value={props.options.jsonData.customMetricsNamespaces || ''}
+            value={options.jsonData.customMetricsNamespaces || ''}
             onChange={onUpdateDatasourceJsonDataOption(props, 'customMetricsNamespaces')}
           />
         </InlineField>

public/app/plugins/datasource/cloudwatch/components/Dimensions.tsx

@@ -28,7 +28,7 @@ export const Dimensions: FunctionComponent<Props> = ({ dimensions, loadValues, l
     if (!isEqual(completeDimensions, dimensions)) {
       onChange(completeDimensions);
     }
-  }, [data]);
+  }, [data, dimensions, onChange]);
 
   const excludeUsedKeys = (options: SelectableStrings) => {
     return options.filter(({ value }) => !Object.keys(data).includes(value!));

public/app/plugins/datasource/cloudwatch/components/MetricsQueryFieldsEditor.tsx

@@ -44,15 +44,15 @@ export function MetricsQueryFieldsEditor({
 
     Promise.all([datasource.metricFindQuery('regions()'), datasource.metricFindQuery('namespaces()')]).then(
       ([regions, namespaces]) => {
-        setState({
-          ...state,
+        setState((prevState) => ({
+          ...prevState,
           regions: [...regions, variableOptionGroup],
           namespaces: [...namespaces, variableOptionGroup],
           variableOptionGroup,
-        });
+        }));
       }
     );
-  }, []);
+  }, [datasource]);
 
   const loadMetricNames = async () => {
     const { namespace, region } = query;