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/FunctionEditor/FunctionEditorControls.tsx
+++ b/src/datasource/components/FunctionEditor/FunctionEditorControls.tsx
@@ -0,0 +1,45 @@
+import React from 'react';
+import { Icon } from '@grafana/ui';
+import { MetricFunc } from '../../types';
+
+const DOCS_FUNC_REF_URL = 'https://alexanderzobnin.github.io/grafana-zabbix/reference/functions/';
+
+export interface FunctionEditorControlsProps {
+  onMoveLeft: (func: MetricFunc) => void;
+  onMoveRight: (func: MetricFunc) => void;
+  onRemove: (func: MetricFunc) => void;
+}
+
+const FunctionHelpButton = (props: { description?: string; name: string }) => {
+  return (
+    <Icon
+      className="pointer"
+      name="question-circle"
+      onClick={() => {
+        window.open(`${DOCS_FUNC_REF_URL}#${props.name}`, '_blank');
+      }}
+    />
+  );
+};
+
+export const FunctionEditorControls = (
+  props: FunctionEditorControlsProps & {
+    func: MetricFunc;
+  }
+) => {
+  const { func, onMoveLeft, onMoveRight, onRemove } = props;
+  return (
+    <div
+      style={{
+        display: 'flex',
+        width: '60px',
+        justifyContent: 'space-between',
+      }}
+    >
+      <Icon className="pointer" name="arrow-left" onClick={() => onMoveLeft(func)} />
+      <FunctionHelpButton name={func.def.name} description={func.def.description} />
+      <Icon className="pointer" name="times" onClick={() => onRemove(func)} />
+      <Icon className="pointer" name="arrow-right" onClick={() => onMoveRight(func)} />
+    </div>
+  );
+};