From 5af890174fd1f616d860a88bb41c90b514868efb Mon Sep 17 00:00:00 2001
From: Ricardo Olsen <olsen.ricardo@gmail.com>
Date: Wed, 29 Nov 2023 10:38:03 -0300
Subject: [PATCH] Added manifest and other files.

---
 .config/.eslintrc                      |  13 ++
 .config/.prettierrc.js                 |  16 ++
 .config/Dockerfile                     |  16 ++
 .config/README.md                      | 164 ++++++++++++++++++++
 .config/jest-setup.js                  |  25 +++
 .config/jest.config.js                 |  43 ++++++
 .config/jest/mocks/react-inlinesvg.tsx |  25 +++
 .config/jest/utils.js                  |  29 ++++
 .config/tsconfig.json                  |  26 ++++
 .config/types/custom.d.ts              |  37 +++++
 .config/webpack/constants.ts           |   2 +
 .config/webpack/tsconfig.webpack.json  |   9 ++
 .config/webpack/utils.ts               |  40 +++++
 .config/webpack/webpack.config.ts      | 202 +++++++++++++++++++++++++
 .eslintrc                              |   3 +
 .gitignore                             |   5 +-
 .nvmrc                                 |   1 +
 .prettierrc.js                         |   4 +
 dist/CHANGELOG.md                      |  34 ++++-
 dist/MANIFEST.txt                      |  57 +++++++
 dist/README.md                         |   4 +-
 21 files changed, 749 insertions(+), 6 deletions(-)
 create mode 100644 .config/.eslintrc
 create mode 100644 .config/.prettierrc.js
 create mode 100644 .config/Dockerfile
 create mode 100644 .config/README.md
 create mode 100644 .config/jest-setup.js
 create mode 100644 .config/jest.config.js
 create mode 100644 .config/jest/mocks/react-inlinesvg.tsx
 create mode 100644 .config/jest/utils.js
 create mode 100644 .config/tsconfig.json
 create mode 100644 .config/types/custom.d.ts
 create mode 100644 .config/webpack/constants.ts
 create mode 100644 .config/webpack/tsconfig.webpack.json
 create mode 100644 .config/webpack/utils.ts
 create mode 100644 .config/webpack/webpack.config.ts
 create mode 100644 .eslintrc
 create mode 100644 .nvmrc
 create mode 100644 .prettierrc.js
 create mode 100644 dist/MANIFEST.txt

diff --git a/.config/.eslintrc b/.config/.eslintrc
new file mode 100644
index 0000000..3f8c381
--- /dev/null
+++ b/.config/.eslintrc
@@ -0,0 +1,13 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * In order to extend the configuration follow the steps in
+ * https://grafana.github.io/plugin-tools/docs/advanced-configuration#extending-the-eslint-config
+ */
+ {
+  "extends": ["@grafana/eslint-config"],
+  "root": true,
+  "rules": {
+    "react/prop-types": "off"
+  }
+}
diff --git a/.config/.prettierrc.js b/.config/.prettierrc.js
new file mode 100644
index 0000000..66a76ec
--- /dev/null
+++ b/.config/.prettierrc.js
@@ -0,0 +1,16 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * In order to extend the configuration follow the steps in .config/README.md
+ */
+
+module.exports = {
+  "endOfLine": "auto",
+  "printWidth": 120,
+  "trailingComma": "es5",
+  "semi": true,
+  "jsxSingleQuote": false,
+  "singleQuote": true,
+  "useTabs": false,
+  "tabWidth": 2
+};
\ No newline at end of file
diff --git a/.config/Dockerfile b/.config/Dockerfile
new file mode 100644
index 0000000..35d89bd
--- /dev/null
+++ b/.config/Dockerfile
@@ -0,0 +1,16 @@
+ARG grafana_version=latest
+ARG grafana_image=grafana-enterprise
+
+FROM grafana/${grafana_image}:${grafana_version}
+
+# Make it as simple as possible to access the grafana instance for development purposes
+# Do NOT enable these settings in a public facing / production grafana instance
+ENV GF_AUTH_ANONYMOUS_ORG_ROLE "Admin"
+ENV GF_AUTH_ANONYMOUS_ENABLED "true"
+ENV GF_AUTH_BASIC_ENABLED "false"
+# Set development mode so plugins can be loaded without the need to sign
+ENV GF_DEFAULT_APP_MODE "development"
+
+# Inject livereload script into grafana index.html
+USER root
+RUN sed -i 's/<\/body><\/html>/<script src=\"http:\/\/localhost:35729\/livereload.js\"><\/script><\/body><\/html>/g' /usr/share/grafana/public/views/index.html
\ No newline at end of file
diff --git a/.config/README.md b/.config/README.md
new file mode 100644
index 0000000..f1ded34
--- /dev/null
+++ b/.config/README.md
@@ -0,0 +1,164 @@
+# Default build configuration by Grafana
+
+**This is an auto-generated directory and is not intended to be changed! ⚠️**
+
+The `.config/` directory holds basic configuration for the different tools
+that are used to develop, test and build the project. In order to make it updates easier we ask you to
+not edit files in this folder to extend configuration.
+
+## How to extend the basic configs?
+
+Bear in mind that you are doing it at your own risk, and that extending any of the basic configuration can lead
+to issues around working with the project.
+
+### Extending the ESLint config
+
+Edit the `.eslintrc` file in the project root in order to extend the ESLint configuration.
+
+**Example:**
+
+```json
+{
+  "extends": "./.config/.eslintrc",
+  "rules": {
+    "react/prop-types": "off"
+  }
+}
+```
+
+---
+
+### Extending the Prettier config
+
+Edit the `.prettierrc.js` file in the project root in order to extend the Prettier configuration.
+
+**Example:**
+
+```javascript
+module.exports = {
+  // Prettier configuration provided by Grafana scaffolding
+  ...require('./.config/.prettierrc.js'),
+
+  semi: false,
+};
+```
+
+---
+
+### Extending the Jest config
+
+There are two configuration in the project root that belong to Jest: `jest-setup.js` and `jest.config.js`.
+
+**`jest-setup.js`:** A file that is run before each test file in the suite is executed. We are using it to
+set up the Jest DOM for the testing library and to apply some polyfills. ([link to Jest docs](https://jestjs.io/docs/configuration#setupfilesafterenv-array))
+
+**`jest.config.js`:** The main Jest configuration file that extends the Grafana recommended setup. ([link to Jest docs](https://jestjs.io/docs/configuration))
+
+#### ESM errors with Jest
+
+A common issue found with the current jest config involves importing an npm package which only offers an ESM build. These packages cause jest to error with `SyntaxError: Cannot use import statement outside a module`. To work around this we provide a list of known packages to pass to the `[transformIgnorePatterns](https://jestjs.io/docs/configuration#transformignorepatterns-arraystring)` jest configuration property. If need be this can be extended in the following way:
+
+```javascript
+process.env.TZ = 'UTC';
+const { grafanaESModules, nodeModulesToTransform } = require('./config/jest/utils');
+
+module.exports = {
+  // Jest configuration provided by Grafana
+  ...require('./.config/jest.config'),
+  // Inform jest to only transform specific node_module packages.
+  transformIgnorePatterns: [nodeModulesToTransform([...grafanaESModules, 'packageName'])],
+};
+```
+
+---
+
+### Extending the TypeScript config
+
+Edit the `tsconfig.json` file in the project root in order to extend the TypeScript configuration.
+
+**Example:**
+
+```json
+{
+  "extends": "./.config/tsconfig.json",
+  "compilerOptions": {
+    "preserveConstEnums": true
+  }
+}
+```
+
+---
+
+### Extending the Webpack config
+
+Follow these steps to extend the basic Webpack configuration that lives under `.config/`:
+
+#### 1. Create a new Webpack configuration file
+
+Create a new config file that is going to extend the basic one provided by Grafana.
+It can live in the project root, e.g. `webpack.config.ts`.
+
+#### 2. Merge the basic config provided by Grafana and your custom setup
+
+We are going to use [`webpack-merge`](https://github.com/survivejs/webpack-merge) for this.
+
+```typescript
+// webpack.config.ts
+import type { Configuration } from 'webpack';
+import { merge } from 'webpack-merge';
+import grafanaConfig from './.config/webpack/webpack.config';
+
+const config = async (env): Promise<Configuration> => {
+  const baseConfig = await grafanaConfig(env);
+
+  return merge(baseConfig, {
+    // Add custom config here...
+    output: {
+      asyncChunks: true,
+    },
+  });
+};
+
+export default config;
+```
+
+#### 3. Update the `package.json` to use the new Webpack config
+
+We need to update the `scripts` in the `package.json` to use the extended Webpack configuration.
+
+**Update for `build`:**
+
+```diff
+-"build": "webpack -c ./.config/webpack/webpack.config.ts --env production",
++"build": "webpack -c ./webpack.config.ts --env production",
+```
+
+**Update for `dev`:**
+
+```diff
+-"dev": "webpack -w -c ./.config/webpack/webpack.config.ts --env development",
++"dev": "webpack -w -c ./webpack.config.ts --env development",
+```
+
+### Configure grafana image to use when running docker
+
+By default `grafana-enterprise` will be used as the docker image for all docker related commands. If you want to override this behaviour simply alter the `docker-compose.yaml` by adding the following build arg `grafana_image`. 
+
+**Example:**
+
+```yaml
+version: '3.7'
+
+services:
+  grafana:
+    container_name: 'myorg-basic-app'
+    build:
+      context: ./.config
+      args:
+        grafana_version: ${GRAFANA_VERSION:-9.1.2}
+        grafana_image: ${GRAFANA_IMAGE:-grafana}
+```
+
+In this example we are assigning the environment variable `GRAFANA_IMAGE` to the build arg `grafana_image` with a default value of `grafana`. This will give you the possibility to set the value while running the docker-compose commands which might be convinent in some scenarios.
+
+---
diff --git a/.config/jest-setup.js b/.config/jest-setup.js
new file mode 100644
index 0000000..575b354
--- /dev/null
+++ b/.config/jest-setup.js
@@ -0,0 +1,25 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * In order to extend the configuration follow the steps in
+ * https://grafana.github.io/plugin-tools/docs/advanced-configuration#extending-the-jest-config
+ */
+
+import '@testing-library/jest-dom';
+
+// https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
+Object.defineProperty(global, 'matchMedia', {
+  writable: true,
+  value: jest.fn().mockImplementation((query) => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: jest.fn(), // deprecated
+    removeListener: jest.fn(), // deprecated
+    addEventListener: jest.fn(),
+    removeEventListener: jest.fn(),
+    dispatchEvent: jest.fn(),
+  })),
+});
+
+HTMLCanvasElement.prototype.getContext = () => {};
diff --git a/.config/jest.config.js b/.config/jest.config.js
new file mode 100644
index 0000000..3cb011e
--- /dev/null
+++ b/.config/jest.config.js
@@ -0,0 +1,43 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * In order to extend the configuration follow the steps in
+ * https://grafana.github.io/plugin-tools/docs/advanced-configuration#extending-the-jest-config
+ */
+
+const path = require('path');
+const { grafanaESModules, nodeModulesToTransform } = require('./jest/utils');
+
+module.exports = {
+  moduleNameMapper: {
+    '\\.(css|scss|sass)$': 'identity-obj-proxy',
+    'react-inlinesvg': path.resolve(__dirname, 'jest', 'mocks', 'react-inlinesvg.tsx'),
+  },
+  modulePaths: ['<rootDir>/src'],
+  setupFilesAfterEnv: ['<rootDir>/jest-setup.js'],
+  testEnvironment: 'jest-environment-jsdom',
+  testMatch: [
+    '<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}',
+    '<rootDir>/src/**/*.{spec,test,jest}.{js,jsx,ts,tsx}',
+    '<rootDir>/src/**/*.{spec,test,jest}.{js,jsx,ts,tsx}',
+  ],
+  transform: {
+    '^.+\\.(t|j)sx?$': [
+      '@swc/jest',
+      {
+        sourceMaps: 'inline',
+        jsc: {
+          parser: {
+            syntax: 'typescript',
+            tsx: true,
+            decorators: false,
+            dynamicImport: true,
+          },
+        },
+      },
+    ],
+  },
+  // Jest will throw `Cannot use import statement outside module` if it tries to load an
+  // ES module without it being transformed first. ./config/README.md#esm-errors-with-jest
+  transformIgnorePatterns: [nodeModulesToTransform(grafanaESModules)],
+};
diff --git a/.config/jest/mocks/react-inlinesvg.tsx b/.config/jest/mocks/react-inlinesvg.tsx
new file mode 100644
index 0000000..d540f3a
--- /dev/null
+++ b/.config/jest/mocks/react-inlinesvg.tsx
@@ -0,0 +1,25 @@
+// Due to the grafana/ui Icon component making fetch requests to
+// `/public/img/icon/<icon_name>.svg` we need to mock react-inlinesvg to prevent
+// the failed fetch requests from displaying errors in console.
+
+import React from 'react';
+
+type Callback = (...args: any[]) => void;
+
+export interface StorageItem {
+  content: string;
+  queue: Callback[];
+  status: string;
+}
+
+export const cacheStore: { [key: string]: StorageItem } = Object.create(null);
+
+const SVG_FILE_NAME_REGEX = /(.+)\/(.+)\.svg$/;
+
+const InlineSVG = ({ src }: { src: string }) => {
+  // testId will be the file name without extension (e.g. `public/img/icons/angle-double-down.svg` -> `angle-double-down`)
+  const testId = src.replace(SVG_FILE_NAME_REGEX, '$2');
+  return <svg xmlns="http://www.w3.org/2000/svg" data-testid={testId} viewBox="0 0 24 24" />;
+};
+
+export default InlineSVG;
diff --git a/.config/jest/utils.js b/.config/jest/utils.js
new file mode 100644
index 0000000..f8ae417
--- /dev/null
+++ b/.config/jest/utils.js
@@ -0,0 +1,29 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * In order to extend the configuration follow the steps in .config/README.md
+ */
+
+/*
+ * This utility function is useful in combination with jest `transformIgnorePatterns` config
+ * to transform specific packages (e.g.ES modules) in a projects node_modules folder.
+ */
+const nodeModulesToTransform = (moduleNames) => `node_modules\/(?!(${moduleNames.join('|')})\/)`;
+
+// Array of known nested grafana package dependencies that only bundle an ESM version
+const grafanaESModules = [
+  '.pnpm', // Support using pnpm symlinked packages
+  'd3',
+  'd3-color',
+  'd3-force',
+  'd3-interpolate',
+  'd3-scale-chromatic',
+  'ol',
+  'react-colorful',
+  'uuid',
+];
+
+module.exports = {
+  nodeModulesToTransform,
+  grafanaESModules
+}
\ No newline at end of file
diff --git a/.config/tsconfig.json b/.config/tsconfig.json
new file mode 100644
index 0000000..64b3769
--- /dev/null
+++ b/.config/tsconfig.json
@@ -0,0 +1,26 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * In order to extend the configuration follow the steps in
+ * https://grafana.github.io/plugin-tools/docs/advanced-configuration#extending-the-typescript-config
+ */
+ {
+  "compilerOptions": {
+    "alwaysStrict": true,
+    "declaration": false,
+    "rootDir": "../src",
+    "baseUrl": "../src",
+    "typeRoots": ["../node_modules/@types"],
+    "resolveJsonModule": true
+  },
+  "ts-node": {
+    "compilerOptions": {
+      "module": "commonjs",
+      "target": "es5",
+      "esModuleInterop": true
+    },
+    "transpileOnly": true
+  },
+  "include": ["../src", "./types"],
+  "extends": "@grafana/tsconfig"
+}
diff --git a/.config/types/custom.d.ts b/.config/types/custom.d.ts
new file mode 100644
index 0000000..64e6eaa
--- /dev/null
+++ b/.config/types/custom.d.ts
@@ -0,0 +1,37 @@
+// Image declarations
+declare module '*.gif' {
+  const src: string;
+  export default src;
+}
+
+declare module '*.jpg' {
+  const src: string;
+  export default src;
+}
+
+declare module '*.jpeg' {
+  const src: string;
+  export default src;
+}
+
+declare module '*.png' {
+  const src: string;
+  export default src;
+}
+
+declare module '*.webp' {
+  const src: string;
+  export default src;
+}
+
+declare module '*.svg' {
+  const content: string;
+  export default content;
+}
+
+// Font declarations
+declare module '*.woff';
+declare module '*.woff2';
+declare module '*.eot';
+declare module '*.ttf';
+declare module '*.otf';
diff --git a/.config/webpack/constants.ts b/.config/webpack/constants.ts
new file mode 100644
index 0000000..071e4fd
--- /dev/null
+++ b/.config/webpack/constants.ts
@@ -0,0 +1,2 @@
+export const SOURCE_DIR = 'src';
+export const DIST_DIR = 'dist';
diff --git a/.config/webpack/tsconfig.webpack.json b/.config/webpack/tsconfig.webpack.json
new file mode 100644
index 0000000..f616089
--- /dev/null
+++ b/.config/webpack/tsconfig.webpack.json
@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "module": "commonjs",
+    "target": "es5",
+    "esModuleInterop": true
+  },
+  "transpileOnly": true,
+  "transpiler": "ts-node/transpilers/swc-experimental"
+}
diff --git a/.config/webpack/utils.ts b/.config/webpack/utils.ts
new file mode 100644
index 0000000..c2691e6
--- /dev/null
+++ b/.config/webpack/utils.ts
@@ -0,0 +1,40 @@
+import fs from 'fs';
+import path from 'path';
+import util from 'util';
+import { glob } from 'glob';
+import { SOURCE_DIR } from './constants';
+
+export function getPackageJson() {
+  return require(path.resolve(process.cwd(), 'package.json'));
+}
+
+export function getPluginJson() {
+  return require(path.resolve(process.cwd(), `${SOURCE_DIR}/plugin.json`));
+}
+
+export function hasReadme() {
+  return fs.existsSync(path.resolve(process.cwd(), SOURCE_DIR, 'README.md'));
+}
+
+// Support bundling nested plugins by finding all plugin.json files in src directory
+// then checking for a sibling module.[jt]sx? file.
+export async function getEntries(): Promise<Record<string, string>> {
+  const pluginsJson = await glob('**/src/**/plugin.json', { absolute: true });
+
+  const plugins = await Promise.all(pluginsJson.map((pluginJson) => {
+      const folder = path.dirname(pluginJson);
+      return glob(`${folder}/module.{ts,tsx,js,jsx}`, { absolute: true });
+    })
+  );
+
+  return plugins.reduce((result, modules) => {
+    return modules.reduce((result, module) => {
+      const pluginPath = path.dirname(module);
+      const pluginName = path.relative(process.cwd(), pluginPath).replace(/src\/?/i, '');
+      const entryName = pluginName === '' ? 'module' : `${pluginName}/module`;
+
+      result[entryName] = module;
+      return result;
+    }, result);
+  }, {});
+}
diff --git a/.config/webpack/webpack.config.ts b/.config/webpack/webpack.config.ts
new file mode 100644
index 0000000..31502b5
--- /dev/null
+++ b/.config/webpack/webpack.config.ts
@@ -0,0 +1,202 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * In order to extend the configuration follow the steps in
+ * https://grafana.github.io/plugin-tools/docs/advanced-configuration#extending-the-webpack-config
+ */
+
+import CopyWebpackPlugin from 'copy-webpack-plugin';
+import ESLintPlugin from 'eslint-webpack-plugin';
+import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
+import LiveReloadPlugin from 'webpack-livereload-plugin';
+import path from 'path';
+import ReplaceInFileWebpackPlugin from 'replace-in-file-webpack-plugin';
+import { Configuration } from 'webpack';
+
+import { getPackageJson, getPluginJson, hasReadme, getEntries } from './utils';
+import { SOURCE_DIR, DIST_DIR } from './constants';
+
+const pluginJson = getPluginJson();
+
+const config = async (env): Promise<Configuration> => ({
+  cache: {
+    type: 'filesystem',
+    buildDependencies: {
+      config: [__filename],
+    },
+  },
+
+  context: path.join(process.cwd(), SOURCE_DIR),
+
+  devtool: env.production ? 'source-map' : 'eval-source-map',
+
+  entry: await getEntries(),
+
+  externals: [
+    'lodash',
+    'jquery',
+    'moment',
+    'slate',
+    'emotion',
+    '@emotion/react',
+    '@emotion/css',
+    'prismjs',
+    'slate-plain-serializer',
+    '@grafana/slate-react',
+    'react',
+    'react-dom',
+    'react-redux',
+    'redux',
+    'rxjs',
+    'react-router',
+    'react-router-dom',
+    'd3',
+    'angular',
+    '@grafana/ui',
+    '@grafana/runtime',
+    '@grafana/data',
+
+    // Mark legacy SDK imports as external if their name starts with the "grafana/" prefix
+    ({ request }, callback) => {
+      const prefix = 'grafana/';
+      const hasPrefix = (request) => request.indexOf(prefix) === 0;
+      const stripPrefix = (request) => request.substr(prefix.length);
+
+      if (hasPrefix(request)) {
+        return callback(undefined, stripPrefix(request));
+      }
+
+      callback();
+    },
+  ],
+
+  mode: env.production ? 'production' : 'development',
+
+  module: {
+    rules: [
+      {
+        exclude: /(node_modules)/,
+        test: /\.[tj]sx?$/,
+        use: {
+          loader: 'swc-loader',
+          options: {
+            jsc: {
+              baseUrl: './src',
+              target: 'es2015',
+              loose: false,
+              parser: {
+                syntax: 'typescript',
+                tsx: true,
+                decorators: false,
+                dynamicImport: true,
+              },
+            },
+          },
+        },
+      },
+      {
+        test: /\.css$/,
+        use: ["style-loader", "css-loader"]
+      },
+      {
+        test: /\.s[ac]ss$/,
+        use: ['style-loader', 'css-loader', 'sass-loader'],
+      },
+      {
+        test: /\.(png|jpe?g|gif|svg)$/,
+        type: 'asset/resource',
+        generator: {
+          // Keep publicPath relative for host.com/grafana/ deployments
+          publicPath: `public/plugins/${pluginJson.id}/img/`,
+          outputPath: 'img/',
+          filename: Boolean(env.production) ? '[hash][ext]' : '[name][ext]',
+        },
+      },
+      {
+        test: /\.(woff|woff2|eot|ttf|otf)(\?v=\d+\.\d+\.\d+)?$/,
+        type: 'asset/resource',
+        generator: {
+          // Keep publicPath relative for host.com/grafana/ deployments
+          publicPath: `public/plugins/${pluginJson.id}/fonts/`,
+          outputPath: 'fonts/',
+          filename: Boolean(env.production) ? '[hash][ext]' : '[name][ext]',
+        },
+      },
+    ],
+  },
+
+  output: {
+    clean: {
+      keep: new RegExp(`.*?_(amd64|arm(64)?)(.exe)?`),
+    },
+    filename: '[name].js',
+    library: {
+      type: 'amd',
+    },
+    path: path.resolve(process.cwd(), DIST_DIR),
+    publicPath: '/',
+  },
+
+  plugins: [
+    new CopyWebpackPlugin({
+      patterns: [
+        // If src/README.md exists use it; otherwise the root README
+        // To `compiler.options.output`
+        { from: hasReadme() ? 'README.md' : '../README.md', to: '.', force: true },
+        { from: 'plugin.json', to: '.' },
+        { from: '../LICENSE', to: '.' },
+        { from: '../CHANGELOG.md', to: '.', force: true },
+        { from: '**/*.json', to: '.' }, // TODO<Add an error for checking the basic structure of the repo>
+        { from: '**/*.svg', to: '.', noErrorOnMissing: true }, // Optional
+        { from: '**/*.png', to: '.', noErrorOnMissing: true }, // Optional
+        { from: '**/*.html', to: '.', noErrorOnMissing: true }, // Optional
+        { from: 'img/**/*', to: '.', noErrorOnMissing: true }, // Optional
+        { from: 'libs/**/*', to: '.', noErrorOnMissing: true }, // Optional
+        { from: 'static/**/*', to: '.', noErrorOnMissing: true }, // Optional
+        { from: '**/*.js', to: '.', noErrorOnMissing: true }, // Optional
+      ],
+    }),
+    // Replace certain template-variables in the README and plugin.json
+    new ReplaceInFileWebpackPlugin([
+      {
+        dir: DIST_DIR,
+        files: ['plugin.json', 'README.md'],
+        rules: [
+          {
+            search: /\%VERSION\%/g,
+            replace: getPackageJson().version,
+          },
+          {
+            search: /\%TODAY\%/g,
+            replace: new Date().toISOString().substring(0, 10),
+          },
+          {
+            search: /\%PLUGIN_ID\%/g,
+            replace: pluginJson.id,
+          },
+        ],
+      },
+    ]),
+    new ForkTsCheckerWebpackPlugin({
+      async: Boolean(env.development),
+      issue: {
+        include: [{ file: '**/*.{ts,tsx}' }],
+      },
+      typescript: { configFile: path.join(process.cwd(), 'tsconfig.json') },
+    }),
+    new ESLintPlugin({
+      extensions: ['.ts', '.tsx'],
+      lintDirtyModulesOnly: Boolean(env.development), // don't lint on start, only lint changed files
+    }),
+    ...(env.development ? [new LiveReloadPlugin()] : []),
+  ],
+
+  resolve: {
+    extensions: ['.js', '.jsx', '.ts', '.tsx'],
+    // handle resolving "rootDir" paths
+    modules: [path.resolve(process.cwd(), 'src'), 'node_modules'],
+    unsafeCache: true,
+  },
+});
+
+export default config;
diff --git a/.eslintrc b/.eslintrc
new file mode 100644
index 0000000..01e61df
--- /dev/null
+++ b/.eslintrc
@@ -0,0 +1,3 @@
+{
+  "extends": "./.config/.eslintrc"
+}
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
index abf7ee3..d5a2c61 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,7 @@
+scadavis-synoptic-panel
+scadavis-synoptic-panel.zip
+yarn.lock
+
 # Logs
 logs
 *.log
@@ -20,7 +24,6 @@ lib-cov
 coverage
 
 # Compiled binary addons (https://nodejs.org/api/addons.html)
-dist/
 artifacts/
 work/
 ci/
diff --git a/.nvmrc b/.nvmrc
new file mode 100644
index 0000000..209e3ef
--- /dev/null
+++ b/.nvmrc
@@ -0,0 +1 @@
+20
diff --git a/.prettierrc.js b/.prettierrc.js
new file mode 100644
index 0000000..aaa5045
--- /dev/null
+++ b/.prettierrc.js
@@ -0,0 +1,4 @@
+module.exports = {
+  // Prettier configuration provided by Grafana scaffolding
+  ...require("./.config/.prettierrc.js")
+};
\ No newline at end of file
diff --git a/dist/CHANGELOG.md b/dist/CHANGELOG.md
index 4451c49..3cf849b 100644
--- a/dist/CHANGELOG.md
+++ b/dist/CHANGELOG.md
@@ -1,5 +1,35 @@
 # Changelog
 
-## 1.0.0 (Unreleased)
+## Version 2.0.0
 
-Initial release.
\ No newline at end of file
+* Plugin updated for React.
+* Internet connectivity not required.
+* Compatible with Grafana 9.* and 10.*.
+
+## Version 1.0.4
+
+* Added "Load SVG from local file" config option.
+* Better auto resize handling.
+* Internet connectivity required.
+* Compatible also with Grafana 6.7, 7 and 8.
+* For Grafana 7.* and 8.*, use this version and apply the "Prepare Time Series" / "Multi-frame time series" transform operation to the data source.
+
+## Version 1.0.3
+
+* Added "Auto Resize" config option.
+* Supported Grafana Templating Variables.
+* More efficient data update and display rendering.
+* Generic tagging (@1, @2, @3, ...) compatible with the Power BI plugin.
+* Better responsiveness to configuration changes.
+
+## Version 1.0.2
+
+* Better README.md.
+
+## Version 1.0.1
+
+* Revised version. Watermark removed.
+
+## Version 1.0.0
+
+* Initial version.
diff --git a/dist/MANIFEST.txt b/dist/MANIFEST.txt
new file mode 100644
index 0000000..8bf1d2b
--- /dev/null
+++ b/dist/MANIFEST.txt
@@ -0,0 +1,57 @@
+
+-----BEGIN PGP SIGNED MESSAGE-----
+Hash: SHA512
+
+{
+  "manifestVersion": "2.0.0",
+  "signatureType": "community",
+  "signedByOrg": "scadavis",
+  "signedByOrgName": "scadavis",
+  "plugin": "scadavis-synoptic-panel",
+  "version": "2.0.0",
+  "time": 1701264593757,
+  "keyId": "7e4d0c6a708866e7",
+  "files": {
+    "CHANGELOG.md": "d4dd3947b08f8153ed779ab34d1c7d3fbb3096ed7f20d76fc357e8084974f01f",
+    "img/scadavis-donuts-radar.png": "dd9d9a92d44e0c43b6f5afe3f73ae9d96f367b8376abbdbe75a0a24e366efe7c",
+    "img/scadavis-large.png": "fe13d3634daa2ef415de3a9c530dd05f9b8c9b9fd7fe07f745d36d395bdeb2f0",
+    "img/scadavis-options.png": "299f804da97176c4c338ad5efddb48b09a3dfeced1dbbad9cb3ae11bc8b47930",
+    "img/scadavis-power.png": "3a554bbed4143f6139307437f32f1b578e6055fec34359ac2ecd3eee457b66b1",
+    "img/scadavis-small.png": "b270b4ed5bdd37a65a0fd6961058b9624e9af2b1a5486593b68283b5d10ae073",
+    "img/scadavis-speedometer.png": "0f6b33b475767852de20aa63859893f65f32c6b7473f1e23edb80fef8f6b099f",
+    "LICENSE": "3972dc9744f6499f0f9b2dbf76696f2ae7ad8af9b23dde66d6af86c9dfb36986",
+    "module.js": "b78f6e556d6f254110d63d2a6c3ba7f3eec4b5de0b1466e57351e08b48d04835",
+    "module.js.map": "76edb6d8a5052d3ffaa2e7c1d72d1a223769dfd5e57142d84d1b69a13416ac7e",
+    "plugin.json": "be67e55d6d0d25ef7fc7807ba7ece216b1370ede93a63d4bd6745da8ca0cec9b",
+    "README.md": "50a46493f6ede4e9d97d478171ea86d64297b94eeea59f8a24e623d98c1cd72a",
+    "synoptic/cdn/chroma.min.js": "b886a36b0727ff20c7ee27cae930604a94021c65cc402e0efedd3e27fb6a2301",
+    "synoptic/cdn/chroma.min.js.LICENSE.txt": "d8923c44c3015ba9b9f0f1c8fb1b77e1c0857b6bd0015383c906a8c10877b4f3",
+    "synoptic/cdn/d3.v7.min.js": "b3b27a546f09a2aabcaec01554ee42f9f690f44c21c89011a2e7f186c3d73a6d",
+    "synoptic/cdn/jquery-3.6.1.min.js": "cdb85e11146fa8b6d810f156abded3176cc87646e65074c7c5074080c92d3243",
+    "synoptic/cdn/jquery-3.6.1.min.js.LICENSE.txt": "44ea2c125c5ab20d5835d86d2e4a8a005105ad5031d7e5daefd8b15cddc2fd00",
+    "synoptic/cdn/snap.svg-min.js": "6fbce655671d5cd0e786f208342dd98d6cb985376079689a3189de5eb89591b5",
+    "synoptic/cdn/vega-lite.min-5.5.0.js": "e1883227e996ce672097b45eb42a9de1874132257545fbcfa82ef2439cdb61da",
+    "synoptic/cdn/vega.min-5.22.1.js": "dfa719f8e447a2c0e373a6ac9ddcbbb21e14c371c9b1fa9c3c14d5a1b516c0bf",
+    "synoptic/config_viewers_default.js": "a41f14dcb0506c97a26019c584a8d6c8de62b70792ce5ea80cc0c61db42155f3",
+    "synoptic/getjsondata.js": "bf833ad8c8fc7fb88198c5d16914ef681d1818823a7e56b8242eb7d1c92d6e1f",
+    "synoptic/images/move.svg": "1af8cfbacdc74f7c2cb266f45d29434725f2341dd5197e7eb2a90e069aa2c3ce",
+    "synoptic/images/scadavis.svg": "bb77c113d62eff9df65c2da88bb5b616bd5e0a8ab97a70d86c09332ffb291946",
+    "synoptic/images/zoom-in.svg": "f48ac21d434a18f3ca08dc6efa6c22b72b0b6c9e1bd66bc3986013b26ee84d64",
+    "synoptic/images/zoom-out.svg": "1e29ef2ea2711c80ca439b35c6ad769e2993819a958b11194c9ad9a9161e19af",
+    "synoptic/legacy_options.js": "1dd9059f91b79050c9c7a5c5ac0a7395a07f5a9cbf8d448c347a2c4faaf3fccd",
+    "synoptic/synoptic.html": "3c8e8c57c415f00dfc77d040d6af87dabf4b9f4257269a977efe105ac48d44e8",
+    "synoptic/vega_websage.js": "88e0ca815a879b6f5c92afc50f2272da07804db4e8a2eea31bc93692ae848816",
+    "synoptic/websage.js": "2a8816383ee91cab9061d9eed72d23e02d62f06ec283f37efc9101e00f664105"
+  }
+}
+-----BEGIN PGP SIGNATURE-----
+Version: OpenPGP.js v4.10.10
+Comment: https://openpgpjs.org
+
+wrcEARMKAAYFAmVnPNEAIQkQfk0ManCIZucWIQTzOyW2kQdOhGNlcPN+TQxq
+cIhm5zebAgdzYL6gUbbw+/DZ2y8rVFEbrNOfzWbBf313AKOb4KQQGARM1cFq
+ookGqyBcckW7OY+PyjwSResiIGfJA84FqxvS8wIHXs0CrTZpWHK6EY5p3LCh
+94jEPvJzGIhnWSZlsVm7I1cc0mH9bWpkOao7ijj/v9domHpz/a/sqg/Gwpmi
+qnoQgp8=
+=zitP
+-----END PGP SIGNATURE-----
diff --git a/dist/README.md b/dist/README.md
index d8c8d69..7eb8bac 100644
--- a/dist/README.md
+++ b/dist/README.md
@@ -73,7 +73,7 @@ needs read access to the directory.
 
 # Changelog
 
-## Version 2.0.
+## Version 2.0.0
 
 * Plugin updated for React.
 * Internet connectivity not required.
@@ -107,5 +107,3 @@ needs read access to the directory.
 
 * Initial version.
 
-
-