More datasource funcs poc (#21047)

* remove anon funcs, removed options from state, removed update method, static selects as constants

* cancellable promise

* cancel promise on unmount

* use new datasource funcs for dryer component

* event handler funcs

* updated funcs and moved to utils, updating config editors

* S has no keys. never will never work

* remove report json

* update azure snapshot

* DataSourceSettings keyof

* rename reset funcs

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

@@ -279,64 +279,6 @@ export abstract class DataSourceApi<
   interpolateVariablesInQueries?(queries: TQuery[]): TQuery[];
 }
 
-export function updateDatasourcePluginOption(props: DataSourcePluginOptionsEditorProps, key: string, val: any) {
-  let config = props.options;
-
-  config = {
-    ...config,
-    [key]: val,
-  };
-
-  props.onOptionsChange(config);
-}
-
-export function updateDatasourcePluginJsonDataOption(
-  props: DataSourcePluginOptionsEditorProps,
-  key: string,
-  val: any,
-  secure: boolean
-) {
-  let config = props.options;
-
-  if (secure) {
-    config = {
-      ...config,
-      secureJsonData: {
-        ...config.secureJsonData,
-        [key]: val,
-      },
-    };
-  } else {
-    config = {
-      ...config,
-      jsonData: {
-        ...config.jsonData,
-        [key]: val,
-      },
-    };
-  }
-
-  props.onOptionsChange(config);
-}
-
-export function updateDatasourcePluginResetKeyOption(props: DataSourcePluginOptionsEditorProps, key: string) {
-  let config = props.options;
-
-  config = {
-    ...config,
-    secureJsonData: {
-      ...config.secureJsonData,
-      [key]: '',
-    },
-    secureJsonFields: {
-      ...config.secureJsonFields,
-      [key]: false,
-    },
-  };
-
-  props.onOptionsChange(config);
-}
-
 export interface MetadataInspectorProps<
   DSType extends DataSourceApi<TQuery, TOptions>,
   TQuery extends DataQuery = DataQuery,

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

@@ -0,0 +1,102 @@
+import { DataSourcePluginOptionsEditorProps, SelectableValue, KeyValue, DataSourceSettings } from '../types';
+
+export const onUpdateDatasourceOption = (props: DataSourcePluginOptionsEditorProps, key: keyof DataSourceSettings) => (
+  event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>
+) => {
+  updateDatasourcePluginOption(props, key, event.currentTarget.value);
+};
+
+export const onUpdateDatasourceJsonDataOption = <J, S, K extends keyof J>(
+  props: DataSourcePluginOptionsEditorProps<J, S>,
+  key: K
+) => (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => {
+  updateDatasourcePluginJsonDataOption(props, key, event.currentTarget.value);
+};
+
+export const onUpdateDatasourceSecureJsonDataOption = <J, S extends {} = KeyValue>(
+  props: DataSourcePluginOptionsEditorProps<J, S>,
+  key: string
+) => (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => {
+  updateDatasourcePluginSecureJsonDataOption(props, key, event.currentTarget.value);
+};
+
+export const onUpdateDatasourceJsonDataOptionSelect = <J, S, K extends keyof J>(
+  props: DataSourcePluginOptionsEditorProps<J, S>,
+  key: K
+) => (selected: SelectableValue) => {
+  updateDatasourcePluginJsonDataOption(props, key, selected.value);
+};
+
+export const onUpdateDatasourceSecureJsonDataOptionSelect = <J, S extends {} = KeyValue>(
+  props: DataSourcePluginOptionsEditorProps<J, S>,
+  key: string
+) => (selected: SelectableValue) => {
+  updateDatasourcePluginSecureJsonDataOption(props, key, selected.value);
+};
+
+export const onUpdateDatasourceResetOption = (props: DataSourcePluginOptionsEditorProps, key: string) => (
+  event: React.MouseEvent<HTMLButtonElement, MouseEvent>
+) => {
+  updateDatasourcePluginResetOption(props, key);
+};
+
+export function updateDatasourcePluginOption(
+  props: DataSourcePluginOptionsEditorProps,
+  key: keyof DataSourceSettings,
+  val: any
+) {
+  const config = props.options;
+
+  props.onOptionsChange({
+    ...config,
+    [key]: val,
+  });
+}
+
+export const updateDatasourcePluginJsonDataOption = <J, S, K extends keyof J>(
+  props: DataSourcePluginOptionsEditorProps<J, S>,
+  key: K,
+  val: any
+) => {
+  const config = props.options;
+
+  props.onOptionsChange({
+    ...config,
+    jsonData: {
+      ...config.jsonData,
+      [key]: val,
+    },
+  });
+};
+
+export const updateDatasourcePluginSecureJsonDataOption = <J, S extends {} = KeyValue>(
+  props: DataSourcePluginOptionsEditorProps<J, S>,
+  key: string,
+  val: any
+) => {
+  const config = props.options;
+
+  props.onOptionsChange({
+    ...config,
+    secureJsonData: {
+      ...config.secureJsonData!,
+      [key]: val,
+    },
+  });
+};
+
+export function updateDatasourcePluginResetOption(props: DataSourcePluginOptionsEditorProps, key: string) {
+  const config = props.options;
+
+  props.onOptionsChange({
+    ...config,
+    secureJsonData: {
+      ...config.secureJsonData,
+      [key]: '',
+    },
+    secureJsonFields: {
+      ...config.secureJsonFields,
+      [key]: false,
+    },
+  });
+}

packages/grafana-data/src/utils/index.ts

@@ -1,4 +1,5 @@
 export * from './Registry';
+export * from './datasource';
 export * from './deprecationWarning';
 export * from './csv';
 export * from './logs';