Build plugin with grafana toolkit (#1539)

* Use grafana toolkit template for building plugin * Fix linter and type errors * Update styles building * Fix sass deprecation warning * Remove empty js files produced by webpack building sass * Fix signing script * Replace classnames with cx * Fix data source config page * Use custom webpack config instead of overriding original one * Use gpx_ prefix for plugin executable * Remove unused configs * Roll back react hooks dependencies usage * Move plugin-specific ts config to root config file * Temporary do not use rst2html for function description tooltip * Remove unused code * remove unused dependencies * update react table dependency * Migrate tests to typescript * remove unused dependencies * Remove old webpack configs * Add sign target to makefile * Add magefile * Update CI test job * Update go packages * Update build instructions * Downgrade go version to 1.18 * Fix go version in ci * Fix metric picker * Add comment to webpack config * remove angular mocks * update bra config * Rename datasource-zabbix to datasource (fix mage build) * Add instructions for building backend with mage * Fix webpack targets * Fix ci backend tests * Add initial e2e tests * Fix e2e ci tests * Update docker compose for cypress tests * build grafana docker image * Fix docker stop task * CI: add Grafana compatibility check
2022-12-09 14:14:34 +03:00
parent 26ed740945
commit e3e896742b
136 changed files with 5765 additions and 4636 deletions
--- a/src/datasource/components/ZabbixInput.tsx
+++ b/src/datasource/components/ZabbixInput.tsx
@@ -0,0 +1,60 @@
+import React, { FC } from 'react';
+import { css } from '@emotion/css';
+import { EventsWithValidation, ValidationEvents, useStyles2 } from '@grafana/ui';
+import { GrafanaTheme2 } from '@grafana/data';
+import { isRegex, variableRegex } from '../utils';
+
+import * as grafanaUi from '@grafana/ui';
+const Input = (grafanaUi as any).LegacyForms?.Input || (grafanaUi as any).Input;
+
+const variablePattern = RegExp(`^${variableRegex.source}`);
+
+const getStyles = (theme: GrafanaTheme2) => ({
+  inputRegex: css`
+    color: ${theme.colors.warning.main};
+  `,
+  inputVariable: css`
+    color: ${theme.colors.action.focus};
+  `,
+});
+
+const zabbixInputValidationEvents: ValidationEvents = {
+  [EventsWithValidation.onBlur]: [
+    {
+      rule: (value) => {
+        if (!value) {
+          return true;
+        }
+        if (value.length > 1 && value[0] === '/') {
+          if (value[value.length - 1] !== '/') {
+            return false;
+          }
+        }
+        return true;
+      },
+      errorMessage: 'Not a valid regex',
+    },
+    {
+      rule: (value) => {
+        if (value === '*') {
+          return false;
+        }
+        return true;
+      },
+      errorMessage: 'Wildcards not supported. Use /.*/ instead',
+    },
+  ],
+};
+
+export const ZabbixInput: FC<any> = ({ value, ref, validationEvents, ...restProps }) => {
+  const styles = useStyles2(getStyles);
+
+  let inputClass = styles.inputRegex;
+  if (variablePattern.test(value as string)) {
+    inputClass = styles.inputVariable;
+  } else if (isRegex(value)) {
+    inputClass = styles.inputRegex;
+  }
+
+  return <Input className={inputClass} value={value} validationEvents={zabbixInputValidationEvents} {...restProps} />;
+};