Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
e540d2d473 |
@@ -1,3 +0,0 @@
|
||||
{
|
||||
"version": "6.1.0"
|
||||
}
|
||||
@@ -1,16 +0,0 @@
|
||||
/*
|
||||
* ⚠️⚠️⚠️ 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,
|
||||
};
|
||||
@@ -1,54 +0,0 @@
|
||||
ARG grafana_version=latest
|
||||
ARG grafana_image=grafana-enterprise
|
||||
|
||||
FROM grafana/${grafana_image}:${grafana_version}
|
||||
|
||||
ARG anonymous_auth_enabled=true
|
||||
ARG development=false
|
||||
ARG TARGETARCH
|
||||
|
||||
|
||||
ENV DEV "${development}"
|
||||
|
||||
# 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 "${anonymous_auth_enabled}"
|
||||
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"
|
||||
|
||||
|
||||
LABEL maintainer="Grafana Labs <hello@grafana.com>"
|
||||
|
||||
ENV GF_PATHS_HOME="/usr/share/grafana"
|
||||
WORKDIR $GF_PATHS_HOME
|
||||
|
||||
USER root
|
||||
|
||||
# Installing supervisor and inotify-tools
|
||||
RUN if [ "${development}" = "true" ]; then \
|
||||
if grep -i -q alpine /etc/issue; then \
|
||||
apk add supervisor inotify-tools git; \
|
||||
elif grep -i -q ubuntu /etc/issue; then \
|
||||
DEBIAN_FRONTEND=noninteractive && \
|
||||
apt-get update && \
|
||||
apt-get install -y supervisor inotify-tools git && \
|
||||
rm -rf /var/lib/apt/lists/*; \
|
||||
else \
|
||||
echo 'ERROR: Unsupported base image' && /bin/false; \
|
||||
fi \
|
||||
fi
|
||||
|
||||
COPY supervisord/supervisord.conf /etc/supervisor.d/supervisord.ini
|
||||
COPY supervisord/supervisord.conf /etc/supervisor/conf.d/supervisord.conf
|
||||
|
||||
|
||||
|
||||
# Inject livereload script into grafana index.html
|
||||
RUN sed -i 's|</body>|<script src="http://localhost:35729/livereload.js"></script></body>|g' /usr/share/grafana/public/views/index.html
|
||||
|
||||
|
||||
COPY entrypoint.sh /entrypoint.sh
|
||||
RUN chmod +x /entrypoint.sh
|
||||
ENTRYPOINT ["/entrypoint.sh"]
|
||||
@@ -1,176 +0,0 @@
|
||||
# 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 `eslint.config.mjs` file in the project root to extend the ESLint configuration. The following example disables deprecation notices for source files.
|
||||
|
||||
**Example:**
|
||||
|
||||
```javascript
|
||||
import { defineConfig } from 'eslint/config';
|
||||
import baseConfig from './.config/eslint.config.mjs';
|
||||
|
||||
export default defineConfig([
|
||||
{
|
||||
ignores: [
|
||||
//...
|
||||
],
|
||||
},
|
||||
...baseConfig,
|
||||
{
|
||||
files: ['src/**/*.{ts,tsx}'],
|
||||
rules: {
|
||||
'@typescript-eslint/no-deprecated': '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 with the current jest config involves importing an npm package that 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, { type Env } from './.config/webpack/webpack.config';
|
||||
|
||||
const config = async (env: 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 behavior, simply alter the `docker-compose.yaml` by adding the following build arg `grafana_image`.
|
||||
|
||||
**Example:**
|
||||
|
||||
```yaml
|
||||
version: '3.7'
|
||||
|
||||
services:
|
||||
grafana:
|
||||
extends:
|
||||
file: .config/docker-compose-base.yaml
|
||||
service: grafana
|
||||
build:
|
||||
args:
|
||||
grafana_version: ${GRAFANA_VERSION:-9.1.2}
|
||||
grafana_image: ${GRAFANA_IMAGE:-grafana}
|
||||
```
|
||||
|
||||
In this example, we assign the environment variable `GRAFANA_IMAGE` to the build arg `grafana_image` with a default value of `grafana`. This will allow you to set the value while running the docker compose commands, which might be convenient in some scenarios.
|
||||
|
||||
---
|
||||
@@ -1,43 +0,0 @@
|
||||
import type { Configuration, ExternalItemFunctionData } from 'webpack';
|
||||
|
||||
type ExternalsType = Configuration['externals'];
|
||||
|
||||
export const externals: ExternalsType = [
|
||||
// Required for dynamic publicPath resolution
|
||||
{ 'amd-module': 'module' },
|
||||
'lodash',
|
||||
'jquery',
|
||||
'moment',
|
||||
'slate',
|
||||
'emotion',
|
||||
'@emotion/react',
|
||||
'@emotion/css',
|
||||
'prismjs',
|
||||
'slate-plain-serializer',
|
||||
'@grafana/slate-react',
|
||||
'react',
|
||||
'react-dom',
|
||||
'react-redux',
|
||||
'redux',
|
||||
'rxjs',
|
||||
'i18next',
|
||||
'react-router',
|
||||
'd3',
|
||||
'angular',
|
||||
/^@grafana\/ui/i,
|
||||
/^@grafana\/runtime/i,
|
||||
/^@grafana\/data/i,
|
||||
|
||||
// Mark legacy SDK imports as external if their name starts with the "grafana/" prefix
|
||||
({ request }: ExternalItemFunctionData, callback: (error?: Error, result?: string) => void) => {
|
||||
const prefix = 'grafana/';
|
||||
const hasPrefix = (request: string) => request.indexOf(prefix) === 0;
|
||||
const stripPrefix = (request: string) => request.slice(prefix.length);
|
||||
|
||||
if (request && hasPrefix(request)) {
|
||||
return callback(undefined, stripPrefix(request));
|
||||
}
|
||||
|
||||
callback();
|
||||
},
|
||||
];
|
||||
@@ -1,25 +0,0 @@
|
||||
services:
|
||||
grafana:
|
||||
user: root
|
||||
container_name: 'andydixon-chargevizbattery-panel'
|
||||
|
||||
build:
|
||||
context: .
|
||||
args:
|
||||
grafana_image: ${GRAFANA_IMAGE:-grafana-enterprise}
|
||||
grafana_version: ${GRAFANA_VERSION:-12.2.0}
|
||||
development: ${DEVELOPMENT:-false}
|
||||
anonymous_auth_enabled: ${ANONYMOUS_AUTH_ENABLED:-true}
|
||||
ports:
|
||||
- 3000:3000/tcp
|
||||
volumes:
|
||||
- ../dist:/var/lib/grafana/plugins/andydixon-chargevizbattery-panel
|
||||
- ../provisioning:/etc/grafana/provisioning
|
||||
- ..:/root/andydixon-chargevizbattery-panel
|
||||
|
||||
environment:
|
||||
NODE_ENV: development
|
||||
GF_LOG_FILTERS: plugin.andydixon-chargevizbattery-panel:debug
|
||||
GF_LOG_LEVEL: debug
|
||||
GF_DATAPROXY_LOGGING: 1
|
||||
GF_PLUGINS_ALLOW_LOADING_UNSIGNED_PLUGINS: andydixon-chargevizbattery-panel
|
||||
@@ -1,18 +0,0 @@
|
||||
#!/bin/sh
|
||||
|
||||
if [ "${DEV}" = "false" ]; then
|
||||
echo "Starting test mode"
|
||||
exec /run.sh
|
||||
fi
|
||||
|
||||
echo "Starting development mode"
|
||||
|
||||
if grep -i -q alpine /etc/issue; then
|
||||
exec /usr/bin/supervisord -c /etc/supervisord.conf
|
||||
elif grep -i -q ubuntu /etc/issue; then
|
||||
exec /usr/bin/supervisord -c /etc/supervisor/supervisord.conf
|
||||
else
|
||||
echo 'ERROR: Unsupported base image'
|
||||
exit 1
|
||||
fi
|
||||
|
||||
@@ -1,38 +0,0 @@
|
||||
/*
|
||||
* ⚠️⚠️⚠️ 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.com/developers/plugin-tools/how-to-guides/extend-configurations#extend-the-eslint-config
|
||||
*/
|
||||
|
||||
import { defineConfig } from 'eslint/config';
|
||||
import grafanaConfig from '@grafana/eslint-config/flat.js';
|
||||
|
||||
export default defineConfig([
|
||||
...grafanaConfig,
|
||||
{
|
||||
rules: {
|
||||
'react/prop-types': 'off',
|
||||
},
|
||||
},
|
||||
{
|
||||
files: ['src/**/*.{ts,tsx}'],
|
||||
|
||||
languageOptions: {
|
||||
parserOptions: {
|
||||
project: './tsconfig.json',
|
||||
},
|
||||
},
|
||||
|
||||
rules: {
|
||||
'@typescript-eslint/no-deprecated': 'warn',
|
||||
},
|
||||
},
|
||||
{
|
||||
files: ['./tests/**/*'],
|
||||
|
||||
rules: {
|
||||
'react-hooks/rules-of-hooks': 'off',
|
||||
},
|
||||
},
|
||||
]);
|
||||
@@ -1,28 +0,0 @@
|
||||
/*
|
||||
* ⚠️⚠️⚠️ 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.com/developers/plugin-tools/how-to-guides/extend-configurations#extend-the-jest-config
|
||||
*/
|
||||
|
||||
import '@testing-library/jest-dom';
|
||||
import { TextEncoder, TextDecoder } from 'util';
|
||||
|
||||
Object.assign(global, { TextDecoder, TextEncoder });
|
||||
|
||||
// https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
|
||||
Object.defineProperty(global, 'matchMedia', {
|
||||
writable: true,
|
||||
value: (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 = () => {};
|
||||
@@ -1,44 +0,0 @@
|
||||
/*
|
||||
* ⚠️⚠️⚠️ 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.com/developers/plugin-tools/how-to-guides/extend-configurations#extend-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)],
|
||||
watchPathIgnorePatterns: ['<rootDir>/node_modules', '<rootDir>/dist'],
|
||||
};
|
||||
@@ -1,25 +0,0 @@
|
||||
// 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;
|
||||
@@ -1,37 +0,0 @@
|
||||
/*
|
||||
* ⚠️⚠️⚠️ 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
|
||||
'@grafana/schema',
|
||||
'@wojtekmaj/date-utils',
|
||||
'd3',
|
||||
'd3-color',
|
||||
'd3-force',
|
||||
'd3-interpolate',
|
||||
'd3-scale-chromatic',
|
||||
'get-user-locale',
|
||||
'marked',
|
||||
'memoize',
|
||||
'mimic-function',
|
||||
'ol',
|
||||
'react-calendar',
|
||||
'react-colorful',
|
||||
'rxjs',
|
||||
'uuid',
|
||||
];
|
||||
|
||||
module.exports = {
|
||||
nodeModulesToTransform,
|
||||
grafanaESModules,
|
||||
};
|
||||
@@ -1,15 +0,0 @@
|
||||
[supervisord]
|
||||
nodaemon=true
|
||||
user=root
|
||||
|
||||
[program:grafana]
|
||||
user=root
|
||||
directory=/var/lib/grafana
|
||||
command=/run.sh
|
||||
stdout_logfile=/dev/fd/1
|
||||
stdout_logfile_maxbytes=0
|
||||
redirect_stderr=true
|
||||
killasgroup=true
|
||||
stopasgroup=true
|
||||
autostart=true
|
||||
|
||||
@@ -1,26 +0,0 @@
|
||||
/*
|
||||
* ⚠️⚠️⚠️ 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.com/developers/plugin-tools/how-to-guides/extend-configurations#extend-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"
|
||||
}
|
||||
Vendored
-37
@@ -1,37 +0,0 @@
|
||||
// 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 src: string;
|
||||
export default src;
|
||||
}
|
||||
|
||||
// Font declarations
|
||||
declare module '*.woff';
|
||||
declare module '*.woff2';
|
||||
declare module '*.eot';
|
||||
declare module '*.ttf';
|
||||
declare module '*.otf';
|
||||
Vendored
-83
@@ -1,83 +0,0 @@
|
||||
declare module 'replace-in-file-webpack-plugin' {
|
||||
import { Compiler, Plugin } from 'webpack';
|
||||
|
||||
interface ReplaceRule {
|
||||
search: string | RegExp;
|
||||
replace: string | ((match: string) => string);
|
||||
}
|
||||
|
||||
interface ReplaceOption {
|
||||
dir?: string;
|
||||
files?: string[];
|
||||
test?: RegExp | RegExp[];
|
||||
rules: ReplaceRule[];
|
||||
}
|
||||
|
||||
class ReplaceInFilePlugin extends Plugin {
|
||||
constructor(options?: ReplaceOption[]);
|
||||
options: ReplaceOption[];
|
||||
apply(compiler: Compiler): void;
|
||||
}
|
||||
|
||||
export = ReplaceInFilePlugin;
|
||||
}
|
||||
|
||||
declare module 'webpack-livereload-plugin' {
|
||||
import { ServerOptions } from 'https';
|
||||
import { Compiler, Plugin, Stats, Compilation } from 'webpack';
|
||||
|
||||
interface Options extends Pick<ServerOptions, 'cert' | 'key' | 'pfx'> {
|
||||
/**
|
||||
* protocol for livereload `<script>` src attribute value
|
||||
* @default protocol of the page, either `http` or `https`
|
||||
*/
|
||||
protocol?: string | undefined;
|
||||
/**
|
||||
* The desired port for the livereload server.
|
||||
* If you define port 0, an available port will be searched for, starting from 35729.
|
||||
* @default 35729
|
||||
*/
|
||||
port?: number | undefined;
|
||||
/**
|
||||
* he desired hostname for the appended `<script>` (if present) to point to
|
||||
* @default hostname of the page, like `localhost` or 10.0.2.2
|
||||
*/
|
||||
hostname?: string | undefined;
|
||||
/**
|
||||
* livereload `<script>` automatically to `<head>`.
|
||||
* @default false
|
||||
*/
|
||||
appendScriptTag?: boolean | undefined;
|
||||
/**
|
||||
* RegExp of files to ignore. Null value means ignore nothing.
|
||||
* It is also possible to define an array and use multiple anymatch patterns
|
||||
*/
|
||||
ignore?: RegExp | RegExp[] | null | undefined;
|
||||
/**
|
||||
* amount of milliseconds by which to delay the live reload (in case build takes longer)
|
||||
* @default 0
|
||||
*/
|
||||
delay?: number | undefined;
|
||||
/**
|
||||
* create hash for each file source and only notify livereload if hash has changed
|
||||
* @default false
|
||||
*/
|
||||
useSourceHash?: boolean | undefined;
|
||||
}
|
||||
|
||||
class LiveReloadPlugin extends Plugin {
|
||||
readonly isRunning: boolean;
|
||||
constructor(options?: Options);
|
||||
|
||||
apply(compiler: Compiler): void;
|
||||
|
||||
start(watching: any, cb: () => void): void;
|
||||
done(stats: Stats): void;
|
||||
failed(): void;
|
||||
autoloadJs(): string;
|
||||
scriptTag(source: string): string;
|
||||
applyCompilation(compilation: Compilation): void;
|
||||
}
|
||||
|
||||
export = LiveReloadPlugin;
|
||||
}
|
||||
@@ -1,33 +0,0 @@
|
||||
import webpack, { type Compiler } from 'webpack';
|
||||
|
||||
const PLUGIN_NAME = 'BuildModeWebpack';
|
||||
|
||||
export class BuildModeWebpackPlugin {
|
||||
apply(compiler: webpack.Compiler) {
|
||||
compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation) => {
|
||||
compilation.hooks.processAssets.tap(
|
||||
{
|
||||
name: PLUGIN_NAME,
|
||||
stage: webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONS,
|
||||
},
|
||||
async () => {
|
||||
const assets = compilation.getAssets();
|
||||
for (const asset of assets) {
|
||||
if (asset.name.endsWith('plugin.json')) {
|
||||
const pluginJsonString = asset.source.source().toString();
|
||||
const pluginJsonWithBuildMode = JSON.stringify(
|
||||
{
|
||||
...JSON.parse(pluginJsonString),
|
||||
buildMode: compilation.options.mode,
|
||||
},
|
||||
null,
|
||||
4
|
||||
);
|
||||
compilation.updateAsset(asset.name, new webpack.sources.RawSource(pluginJsonWithBuildMode));
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -1,2 +0,0 @@
|
||||
export const SOURCE_DIR = 'src';
|
||||
export const DIST_DIR = 'dist';
|
||||
@@ -1,68 +0,0 @@
|
||||
import fs from 'fs';
|
||||
import process from 'process';
|
||||
import os from 'os';
|
||||
import path from 'path';
|
||||
import { glob } from 'glob';
|
||||
import { SOURCE_DIR } from './constants.ts';
|
||||
|
||||
export function isWSL() {
|
||||
if (process.platform !== 'linux') {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (os.release().toLowerCase().includes('microsoft')) {
|
||||
return true;
|
||||
}
|
||||
|
||||
try {
|
||||
return fs.readFileSync('/proc/version', 'utf8').toLowerCase().includes('microsoft');
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function loadJson(path: string) {
|
||||
const rawJson = fs.readFileSync(path, 'utf8');
|
||||
return JSON.parse(rawJson);
|
||||
}
|
||||
|
||||
export function getPackageJson() {
|
||||
return loadJson(path.resolve(process.cwd(), 'package.json'));
|
||||
}
|
||||
|
||||
export function getPluginJson() {
|
||||
return loadJson(path.resolve(process.cwd(), `${SOURCE_DIR}/plugin.json`));
|
||||
}
|
||||
|
||||
export function getCPConfigVersion() {
|
||||
const cprcJson = path.resolve(process.cwd(), './.config', '.cprc.json');
|
||||
return fs.existsSync(cprcJson) ? loadJson(cprcJson).version : { version: 'unknown' };
|
||||
}
|
||||
|
||||
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() {
|
||||
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<Record<string, string>>((result, modules) => {
|
||||
return modules.reduce((innerResult, module) => {
|
||||
const pluginPath = path.dirname(module);
|
||||
const pluginName = path.relative(process.cwd(), pluginPath).replace(/src\/?/i, '');
|
||||
const entryName = pluginName === '' ? 'module' : `${pluginName}/module`;
|
||||
|
||||
innerResult[entryName] = module;
|
||||
return innerResult;
|
||||
}, result);
|
||||
}, {});
|
||||
}
|
||||
@@ -1,247 +0,0 @@
|
||||
/*
|
||||
* ⚠️⚠️⚠️ 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.com/developers/plugin-tools/how-to-guides/extend-configurations#extend-the-webpack-config
|
||||
*/
|
||||
|
||||
import CopyWebpackPlugin from 'copy-webpack-plugin';
|
||||
import ESLintPlugin from 'eslint-webpack-plugin';
|
||||
import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
|
||||
import path from 'path';
|
||||
import ReplaceInFileWebpackPlugin from 'replace-in-file-webpack-plugin';
|
||||
import TerserPlugin from 'terser-webpack-plugin';
|
||||
import { SubresourceIntegrityPlugin } from 'webpack-subresource-integrity';
|
||||
import webpack, { type Configuration } from 'webpack';
|
||||
import LiveReloadPlugin from 'webpack-livereload-plugin';
|
||||
import VirtualModulesPlugin from 'webpack-virtual-modules';
|
||||
|
||||
import { BuildModeWebpackPlugin } from './BuildModeWebpackPlugin.ts';
|
||||
import { DIST_DIR, SOURCE_DIR } from './constants.ts';
|
||||
import { getCPConfigVersion, getEntries, getPackageJson, getPluginJson, hasReadme, isWSL } from './utils.ts';
|
||||
import { externals } from '../bundler/externals.ts';
|
||||
|
||||
const pluginJson = getPluginJson();
|
||||
const cpVersion = getCPConfigVersion();
|
||||
const pluginVersion = getPackageJson().version;
|
||||
|
||||
const virtualPublicPath = new VirtualModulesPlugin({
|
||||
'node_modules/grafana-public-path.js': `
|
||||
import amdMetaModule from 'amd-module';
|
||||
|
||||
__webpack_public_path__ =
|
||||
amdMetaModule && amdMetaModule.uri
|
||||
? amdMetaModule.uri.slice(0, amdMetaModule.uri.lastIndexOf('/') + 1)
|
||||
: 'public/plugins/${pluginJson.id}/';
|
||||
`,
|
||||
});
|
||||
|
||||
export type Env = {
|
||||
[key: string]: true | string | Env;
|
||||
};
|
||||
|
||||
const config = async (env: Env): Promise<Configuration> => {
|
||||
const baseConfig: Configuration = {
|
||||
cache: {
|
||||
type: 'filesystem',
|
||||
buildDependencies: {
|
||||
// __filename doesn't work in Node 24
|
||||
config: [path.resolve(process.cwd(), '.config', 'webpack', 'webpack.config.ts')],
|
||||
},
|
||||
},
|
||||
|
||||
context: path.join(process.cwd(), SOURCE_DIR),
|
||||
|
||||
devtool: env.production ? 'source-map' : 'eval-source-map',
|
||||
|
||||
entry: await getEntries(),
|
||||
|
||||
externals,
|
||||
|
||||
// Support WebAssembly according to latest spec - makes WebAssembly module async
|
||||
experiments: {
|
||||
asyncWebAssembly: true,
|
||||
},
|
||||
|
||||
mode: env.production ? 'production' : 'development',
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
// This must come first in the rules array otherwise it breaks sourcemaps.
|
||||
{
|
||||
test: /src\/(?:.*\/)?module\.tsx?$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'imports-loader',
|
||||
options: {
|
||||
imports: `side-effects grafana-public-path`,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
exclude: /(node_modules)/,
|
||||
test: /\.[tj]sx?$/,
|
||||
use: {
|
||||
loader: 'swc-loader',
|
||||
options: {
|
||||
jsc: {
|
||||
baseUrl: path.resolve(process.cwd(), SOURCE_DIR),
|
||||
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: {
|
||||
filename: Boolean(env.production) ? '[hash][ext]' : '[file]',
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.(woff|woff2|eot|ttf|otf)(\?v=\d+\.\d+\.\d+)?$/,
|
||||
type: 'asset/resource',
|
||||
generator: {
|
||||
filename: Boolean(env.production) ? '[hash][ext]' : '[file]',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
optimization: {
|
||||
minimize: Boolean(env.production),
|
||||
minimizer: [
|
||||
new TerserPlugin({
|
||||
terserOptions: {
|
||||
format: {
|
||||
comments: (_, { type, value }) => type === 'comment2' && value.trim().startsWith('[create-plugin]'),
|
||||
},
|
||||
compress: {
|
||||
drop_console: ['log', 'info'],
|
||||
},
|
||||
},
|
||||
}),
|
||||
],
|
||||
},
|
||||
|
||||
output: {
|
||||
clean: {
|
||||
keep: new RegExp(`(.*?_(amd64|arm(64)?)(.exe)?|go_plugin_build_manifest)`),
|
||||
},
|
||||
filename: '[name].js',
|
||||
chunkFilename: env.production ? '[name].js?_cache=[contenthash]' : '[name].js',
|
||||
library: {
|
||||
type: 'amd',
|
||||
},
|
||||
path: path.resolve(process.cwd(), DIST_DIR),
|
||||
publicPath: `public/plugins/${pluginJson.id}/`,
|
||||
uniqueName: pluginJson.id,
|
||||
crossOriginLoading: 'anonymous',
|
||||
},
|
||||
|
||||
plugins: [
|
||||
new BuildModeWebpackPlugin(),
|
||||
virtualPublicPath,
|
||||
// Insert create plugin version information into the bundle
|
||||
new webpack.BannerPlugin({
|
||||
banner: `/* [create-plugin] version: ${cpVersion} */
|
||||
/* [create-plugin] plugin: ${pluginJson.id}@${pluginVersion} */`,
|
||||
raw: true,
|
||||
entryOnly: true,
|
||||
}),
|
||||
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: '.' },
|
||||
{ from: '**/*.svg', to: '.', noErrorOnMissing: true },
|
||||
{ from: '**/*.png', to: '.', noErrorOnMissing: true },
|
||||
{ from: '**/*.html', to: '.', noErrorOnMissing: true },
|
||||
{ from: 'img/**/*', to: '.', noErrorOnMissing: true },
|
||||
{ from: 'libs/**/*', to: '.', noErrorOnMissing: true },
|
||||
{ from: 'static/**/*', to: '.', noErrorOnMissing: true },
|
||||
{ from: '**/query_help.md', to: '.', noErrorOnMissing: true },
|
||||
],
|
||||
}),
|
||||
// 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: pluginVersion,
|
||||
},
|
||||
{
|
||||
search: /\%TODAY\%/g,
|
||||
replace: new Date().toISOString().substring(0, 10),
|
||||
},
|
||||
{
|
||||
search: /\%PLUGIN_ID\%/g,
|
||||
replace: pluginJson.id,
|
||||
},
|
||||
],
|
||||
},
|
||||
]),
|
||||
new SubresourceIntegrityPlugin({
|
||||
hashFuncNames: ['sha256'],
|
||||
}),
|
||||
...(env.development
|
||||
? [
|
||||
new LiveReloadPlugin(),
|
||||
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
|
||||
failOnError: Boolean(env.production),
|
||||
}),
|
||||
]
|
||||
: []),
|
||||
],
|
||||
|
||||
resolve: {
|
||||
extensions: ['.js', '.jsx', '.ts', '.tsx'],
|
||||
// handle resolving "rootDir" paths
|
||||
modules: [path.resolve(process.cwd(), 'src'), 'node_modules'],
|
||||
unsafeCache: true,
|
||||
},
|
||||
};
|
||||
|
||||
if (isWSL()) {
|
||||
baseConfig.watchOptions = {
|
||||
poll: 3000,
|
||||
ignored: /node_modules/,
|
||||
};
|
||||
}
|
||||
|
||||
return baseConfig;
|
||||
};
|
||||
|
||||
export default config;
|
||||
@@ -1,7 +0,0 @@
|
||||
{
|
||||
"features": {
|
||||
"bundleGrafanaUI": false,
|
||||
"useReactRouterV6": true,
|
||||
"useExperimentalRspack": false
|
||||
}
|
||||
}
|
||||
@@ -1,27 +0,0 @@
|
||||
name: Bundle Stats
|
||||
|
||||
on:
|
||||
workflow_dispatch:
|
||||
pull_request:
|
||||
branches:
|
||||
- main
|
||||
push:
|
||||
branches:
|
||||
- main
|
||||
|
||||
permissions:
|
||||
contents: write
|
||||
pull-requests: write
|
||||
actions: read
|
||||
|
||||
jobs:
|
||||
compare:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- uses: grafana/plugin-actions/bundle-size@main # zizmor: ignore[unpinned-uses] provided by grafana
|
||||
@@ -1,241 +0,0 @@
|
||||
name: CI
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
- main
|
||||
pull_request:
|
||||
branches:
|
||||
- master
|
||||
- main
|
||||
|
||||
jobs:
|
||||
build:
|
||||
name: Build, lint and unit tests
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
contents: read
|
||||
outputs:
|
||||
plugin-id: ${{ steps.metadata.outputs.plugin-id }}
|
||||
plugin-version: ${{ steps.metadata.outputs.plugin-version }}
|
||||
has-e2e: ${{ steps.check-for-e2e.outputs.has-e2e }}
|
||||
has-backend: ${{ steps.check-for-backend.outputs.has-backend }}
|
||||
env:
|
||||
GRAFANA_ACCESS_POLICY_TOKEN: ${{ secrets.GRAFANA_ACCESS_POLICY_TOKEN }}
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: '22'
|
||||
cache: 'npm'
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Check types
|
||||
run: npm run typecheck
|
||||
- name: Lint
|
||||
run: npm run lint
|
||||
- name: Unit tests
|
||||
run: npm run test:ci
|
||||
- name: Build frontend
|
||||
run: npm run build
|
||||
|
||||
- name: Check for backend
|
||||
id: check-for-backend
|
||||
run: |
|
||||
if [ -f "Magefile.go" ]
|
||||
then
|
||||
echo "has-backend=true" >> $GITHUB_OUTPUT
|
||||
fi
|
||||
|
||||
- name: Setup Go environment
|
||||
if: steps.check-for-backend.outputs.has-backend == 'true'
|
||||
uses: actions/setup-go@v5
|
||||
with:
|
||||
go-version: '1.22'
|
||||
|
||||
- name: Test backend
|
||||
if: steps.check-for-backend.outputs.has-backend == 'true'
|
||||
uses: magefile/mage-action@6f50bbb8ea47d56e62dee92392788acbc8192d0b # v3.1.0
|
||||
with:
|
||||
version: latest
|
||||
args: coverage
|
||||
|
||||
- name: Build backend
|
||||
if: steps.check-for-backend.outputs.has-backend == 'true'
|
||||
uses: magefile/mage-action@6f50bbb8ea47d56e62dee92392788acbc8192d0b # v3.1.0
|
||||
with:
|
||||
version: latest
|
||||
args: buildAll
|
||||
|
||||
- name: Check for E2E
|
||||
id: check-for-e2e
|
||||
run: |
|
||||
if [ -f "playwright.config.ts" ]
|
||||
then
|
||||
echo "has-e2e=true" >> $GITHUB_OUTPUT
|
||||
fi
|
||||
|
||||
- name: Sign plugin
|
||||
run: npm run sign
|
||||
if: ${{ env.GRAFANA_ACCESS_POLICY_TOKEN != '' }}
|
||||
|
||||
- name: Get plugin metadata
|
||||
id: metadata
|
||||
run: |
|
||||
sudo apt-get install jq
|
||||
|
||||
export GRAFANA_PLUGIN_ID=$(cat dist/plugin.json | jq -r .id)
|
||||
export GRAFANA_PLUGIN_VERSION=$(cat dist/plugin.json | jq -r .info.version)
|
||||
export GRAFANA_PLUGIN_ARTIFACT=${GRAFANA_PLUGIN_ID}-${GRAFANA_PLUGIN_VERSION}.zip
|
||||
|
||||
echo "plugin-id=${GRAFANA_PLUGIN_ID}" >> $GITHUB_OUTPUT
|
||||
echo "plugin-version=${GRAFANA_PLUGIN_VERSION}" >> $GITHUB_OUTPUT
|
||||
echo "archive=${GRAFANA_PLUGIN_ARTIFACT}" >> $GITHUB_OUTPUT
|
||||
|
||||
- name: Package plugin
|
||||
id: package-plugin
|
||||
run: |
|
||||
mv dist ${PLUGIN_ID}
|
||||
zip ${ARCHIVE} ${PLUGIN_ID} -r
|
||||
env:
|
||||
ARCHIVE: ${{ steps.metadata.outputs.archive }}
|
||||
PLUGIN_ID: ${{ steps.metadata.outputs.plugin-id }}
|
||||
|
||||
- name: Check plugin.json
|
||||
run: |
|
||||
docker run --pull=always \
|
||||
-v $PWD/${ARCHIVE}:/archive.zip \
|
||||
grafana/plugin-validator-cli -analyzer=metadatavalid /archive.zip
|
||||
env:
|
||||
ARCHIVE: ${{ steps.metadata.outputs.archive }}
|
||||
|
||||
- name: Archive Build
|
||||
uses: actions/upload-artifact@v4
|
||||
with:
|
||||
name: ${{ steps.metadata.outputs.plugin-id }}-${{ steps.metadata.outputs.plugin-version }}
|
||||
path: ${{ steps.metadata.outputs.plugin-id }}
|
||||
retention-days: 5
|
||||
|
||||
resolve-versions:
|
||||
name: Resolve e2e images
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
contents: read
|
||||
timeout-minutes: 3
|
||||
needs: build
|
||||
if: ${{ needs.build.outputs.has-e2e == 'true' }}
|
||||
outputs:
|
||||
matrix: ${{ steps.resolve-versions.outputs.matrix }}
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- name: Resolve Grafana E2E versions
|
||||
id: resolve-versions
|
||||
uses: grafana/plugin-actions/e2e-version@main # zizmor: ignore[unpinned-uses] provided by grafana
|
||||
|
||||
playwright-tests:
|
||||
needs: [resolve-versions, build]
|
||||
timeout-minutes: 15
|
||||
permissions:
|
||||
contents: read
|
||||
id-token: write
|
||||
pull-requests: write
|
||||
strategy:
|
||||
fail-fast: false
|
||||
matrix:
|
||||
GRAFANA_IMAGE: ${{fromJson(needs.resolve-versions.outputs.matrix)}}
|
||||
name: e2e test ${{ matrix.GRAFANA_IMAGE.name }}@${{ matrix.GRAFANA_IMAGE.VERSION }}
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- name: Download plugin
|
||||
uses: actions/download-artifact@v4
|
||||
with:
|
||||
path: dist
|
||||
name: ${{ needs.build.outputs.plugin-id }}-${{ needs.build.outputs.plugin-version }}
|
||||
|
||||
- name: Execute permissions on binary
|
||||
if: needs.build.outputs.has-backend == 'true'
|
||||
run: |
|
||||
chmod +x ./dist/gpx_*
|
||||
|
||||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: '22'
|
||||
cache: 'npm'
|
||||
|
||||
- name: Install dev dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Start Grafana
|
||||
run: |
|
||||
docker compose pull
|
||||
ANONYMOUS_AUTH_ENABLED=false DEVELOPMENT=false GRAFANA_VERSION=${{ matrix.GRAFANA_IMAGE.VERSION }} GRAFANA_IMAGE=${{ matrix.GRAFANA_IMAGE.NAME }} docker compose up -d
|
||||
|
||||
- name: Wait for grafana server
|
||||
uses: grafana/plugin-actions/wait-for-grafana@main # zizmor: ignore[unpinned-uses] provided by grafana
|
||||
with:
|
||||
url: http://localhost:3000/login
|
||||
|
||||
- name: Install Playwright Browsers
|
||||
run: npm exec playwright install chromium --with-deps
|
||||
|
||||
- name: Run Playwright tests
|
||||
id: run-tests
|
||||
run: npm run e2e
|
||||
|
||||
- name: Upload e2e test summary
|
||||
uses: grafana/plugin-actions/playwright-gh-pages/upload-report-artifacts@main # zizmor: ignore[unpinned-uses] provided by grafana
|
||||
if: ${{ always() && !cancelled() }}
|
||||
with:
|
||||
upload-report: false
|
||||
github-token: ${{ secrets.GITHUB_TOKEN }}
|
||||
test-outcome: ${{ steps.run-tests.outcome }}
|
||||
|
||||
- name: Docker logs
|
||||
if: ${{ always() && steps.run-tests.outcome == 'failure' }}
|
||||
run: |
|
||||
docker logs andydixon-chargevizbattery-panel >& grafana-server.log
|
||||
|
||||
- name: Stop grafana docker
|
||||
run: docker compose down
|
||||
|
||||
# Uncomment this step to upload the server log to Github artifacts. Remember Github artifacts are public on the Internet if the repository is public.
|
||||
# - name: Upload server log
|
||||
# uses: actions/upload-artifact@v4
|
||||
# if: ${{ always() && steps.run-tests.outcome == 'failure' }}
|
||||
# with:
|
||||
# name: ${{ matrix.GRAFANA_IMAGE.NAME }}-v${{ matrix.GRAFANA_IMAGE.VERSION }}-${{github.run_id}}-server-log
|
||||
# path: grafana-server.log
|
||||
# retention-days: 5
|
||||
|
||||
publish-report:
|
||||
if: ${{ always() && !cancelled() }}
|
||||
permissions:
|
||||
contents: write
|
||||
id-token: write
|
||||
pull-requests: write
|
||||
needs: [playwright-tests]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
with:
|
||||
# required for playwright-gh-pages
|
||||
persist-credentials: true
|
||||
- name: Publish report
|
||||
uses: grafana/plugin-actions/playwright-gh-pages/deploy-report-pages@main # zizmor: ignore[unpinned-uses] provided by grafana
|
||||
with:
|
||||
github-token: ${{ secrets.GITHUB_TOKEN }}
|
||||
@@ -1,26 +0,0 @@
|
||||
name: Create Plugin Update
|
||||
|
||||
on:
|
||||
workflow_dispatch:
|
||||
schedule:
|
||||
- cron: '0 0 1 * *' # run once a month on the 1st day
|
||||
|
||||
# To use the default github token with the following elevated permissions make sure to check:
|
||||
# **Allow GitHub Actions to create and approve pull requests** in https://github.com/ORG_NAME/REPO_NAME/settings/actions.
|
||||
# Alternatively create a fine-grained personal access token for your repository with
|
||||
# `contents: read and write` and `pull requests: read and write` and pass it to the action.
|
||||
|
||||
permissions:
|
||||
contents: write
|
||||
pull-requests: write
|
||||
|
||||
jobs:
|
||||
release:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: grafana/plugin-actions/create-plugin-update@main # zizmor: ignore[unpinned-uses] provided by grafana
|
||||
# Uncomment to use a fine-grained personal access token instead of default github token
|
||||
# (For more info on how to generate the token see https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/managing-your-personal-access-tokens)
|
||||
# with:
|
||||
# Make sure to save the token in your repository secrets
|
||||
# token: $
|
||||
@@ -1,37 +0,0 @@
|
||||
name: Latest Grafana API compatibility check
|
||||
on: [pull_request]
|
||||
|
||||
jobs:
|
||||
compatibilitycheck:
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
contents: read
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0
|
||||
with:
|
||||
node-version: '22'
|
||||
cache: 'npm'
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Build plugin
|
||||
run: npm run build
|
||||
|
||||
- name: Find module.ts or module.tsx
|
||||
id: find-module-ts
|
||||
run: |
|
||||
MODULETS="$(find ./src -type f \( -name "module.ts" -o -name "module.tsx" \))"
|
||||
echo "modulets=${MODULETS}" >> $GITHUB_OUTPUT
|
||||
|
||||
- name: Compatibility check
|
||||
uses: grafana/plugin-actions/is-compatible@main
|
||||
with:
|
||||
module: ${{ steps.find-module-ts.outputs.modulets }}
|
||||
comment-pr: 'no'
|
||||
fail-if-incompatible: 'yes'
|
||||
@@ -1,29 +0,0 @@
|
||||
# This GitHub Action automates the process of building Grafana plugins.
|
||||
# (For more information, see https://github.com/grafana/plugin-actions/blob/main/build-plugin/README.md)
|
||||
name: Release
|
||||
|
||||
on:
|
||||
push:
|
||||
tags:
|
||||
- 'v*' # Run workflow on version tags, e.g. v1.0.0.
|
||||
|
||||
permissions: read-all
|
||||
|
||||
jobs:
|
||||
release:
|
||||
permissions:
|
||||
contents: write
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- uses: grafana/plugin-actions/build-plugin@main # zizmor: ignore[unpinned-uses] provided by grafana
|
||||
# Uncomment to enable plugin signing
|
||||
# (For more info on how to generate the access policy token see https://grafana.com/developers/plugin-tools/publish-a-plugin/sign-a-plugin#generate-an-access-policy-token)
|
||||
#with:
|
||||
# Make sure to save the token in your repository secrets
|
||||
#policy_token: $
|
||||
# Usage of GRAFANA_API_KEY is deprecated, prefer `policy_token` option above
|
||||
#grafana_token: $
|
||||
-46
@@ -1,46 +0,0 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
.pnpm-debug.log*
|
||||
|
||||
node_modules/
|
||||
|
||||
# yarn
|
||||
.yarn/cache
|
||||
.yarn/unplugged
|
||||
.yarn/build-state.yml
|
||||
.yarn/install-state.gz
|
||||
.pnp.*
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
|
||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||
dist/
|
||||
artifacts/
|
||||
work/
|
||||
ci/
|
||||
|
||||
# e2e test directories
|
||||
/test-results/
|
||||
/playwright-report/
|
||||
/blob-report/
|
||||
/playwright/.cache/
|
||||
/playwright/.auth/
|
||||
|
||||
# Editor
|
||||
.idea
|
||||
|
||||
.eslintcache
|
||||
@@ -1,4 +0,0 @@
|
||||
module.exports = {
|
||||
// Prettier configuration provided by Grafana scaffolding
|
||||
...require('./.config/.prettierrc.js'),
|
||||
};
|
||||
@@ -0,0 +1,5 @@
|
||||
GRAFANA_IMAGE=grafana-enterprise
|
||||
GRAFANA_VERSION=10.4.19
|
||||
OUTPUT=failure
|
||||
PLUGIN_NAME=
|
||||
UPLOAD_REPORT_ENABLED=false
|
||||
@@ -0,0 +1,5 @@
|
||||
GRAFANA_IMAGE=grafana-enterprise
|
||||
GRAFANA_VERSION=11.2.10
|
||||
OUTPUT=failure
|
||||
PLUGIN_NAME=
|
||||
UPLOAD_REPORT_ENABLED=false
|
||||
@@ -0,0 +1,5 @@
|
||||
GRAFANA_IMAGE=grafana-enterprise
|
||||
GRAFANA_VERSION=11.6.16
|
||||
OUTPUT=failure
|
||||
PLUGIN_NAME=
|
||||
UPLOAD_REPORT_ENABLED=false
|
||||
@@ -0,0 +1,5 @@
|
||||
GRAFANA_IMAGE=grafana-enterprise
|
||||
GRAFANA_VERSION=12.3.8
|
||||
OUTPUT=failure
|
||||
PLUGIN_NAME=
|
||||
UPLOAD_REPORT_ENABLED=false
|
||||
@@ -0,0 +1,5 @@
|
||||
GRAFANA_IMAGE=grafana-enterprise
|
||||
GRAFANA_VERSION=13.1.0
|
||||
OUTPUT=failure
|
||||
PLUGIN_NAME=
|
||||
UPLOAD_REPORT_ENABLED=false
|
||||
@@ -0,0 +1,5 @@
|
||||
GRAFANA_IMAGE=grafana-enterprise
|
||||
GRAFANA_VERSION=nightly
|
||||
OUTPUT=failure
|
||||
PLUGIN_NAME=
|
||||
UPLOAD_REPORT_ENABLED=false
|
||||
@@ -1,5 +0,0 @@
|
||||
# Changelog
|
||||
|
||||
## 1.0.0 (Unreleased)
|
||||
|
||||
Initial release.
|
||||
@@ -1,674 +0,0 @@
|
||||
GNU GENERAL PUBLIC LICENSE
|
||||
Version 3, 29 June 2007
|
||||
|
||||
Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
|
||||
Everyone is permitted to copy and distribute verbatim copies
|
||||
of this license document, but changing it is not allowed.
|
||||
|
||||
Preamble
|
||||
|
||||
The GNU General Public License is a free, copyleft license for
|
||||
software and other kinds of works.
|
||||
|
||||
The licenses for most software and other practical works are designed
|
||||
to take away your freedom to share and change the works. By contrast,
|
||||
the GNU General Public License is intended to guarantee your freedom to
|
||||
share and change all versions of a program--to make sure it remains free
|
||||
software for all its users. We, the Free Software Foundation, use the
|
||||
GNU General Public License for most of our software; it applies also to
|
||||
any other work released this way by its authors. You can apply it to
|
||||
your programs, too.
|
||||
|
||||
When we speak of free software, we are referring to freedom, not
|
||||
price. Our General Public Licenses are designed to make sure that you
|
||||
have the freedom to distribute copies of free software (and charge for
|
||||
them if you wish), that you receive source code or can get it if you
|
||||
want it, that you can change the software or use pieces of it in new
|
||||
free programs, and that you know you can do these things.
|
||||
|
||||
To protect your rights, we need to prevent others from denying you
|
||||
these rights or asking you to surrender the rights. Therefore, you have
|
||||
certain responsibilities if you distribute copies of the software, or if
|
||||
you modify it: responsibilities to respect the freedom of others.
|
||||
|
||||
For example, if you distribute copies of such a program, whether
|
||||
gratis or for a fee, you must pass on to the recipients the same
|
||||
freedoms that you received. You must make sure that they, too, receive
|
||||
or can get the source code. And you must show them these terms so they
|
||||
know their rights.
|
||||
|
||||
Developers that use the GNU GPL protect your rights with two steps:
|
||||
(1) assert copyright on the software, and (2) offer you this License
|
||||
giving you legal permission to copy, distribute and/or modify it.
|
||||
|
||||
For the developers' and authors' protection, the GPL clearly explains
|
||||
that there is no warranty for this free software. For both users' and
|
||||
authors' sake, the GPL requires that modified versions be marked as
|
||||
changed, so that their problems will not be attributed erroneously to
|
||||
authors of previous versions.
|
||||
|
||||
Some devices are designed to deny users access to install or run
|
||||
modified versions of the software inside them, although the manufacturer
|
||||
can do so. This is fundamentally incompatible with the aim of
|
||||
protecting users' freedom to change the software. The systematic
|
||||
pattern of such abuse occurs in the area of products for individuals to
|
||||
use, which is precisely where it is most unacceptable. Therefore, we
|
||||
have designed this version of the GPL to prohibit the practice for those
|
||||
products. If such problems arise substantially in other domains, we
|
||||
stand ready to extend this provision to those domains in future versions
|
||||
of the GPL, as needed to protect the freedom of users.
|
||||
|
||||
Finally, every program is threatened constantly by software patents.
|
||||
States should not allow patents to restrict development and use of
|
||||
software on general-purpose computers, but in those that do, we wish to
|
||||
avoid the special danger that patents applied to a free program could
|
||||
make it effectively proprietary. To prevent this, the GPL assures that
|
||||
patents cannot be used to render the program non-free.
|
||||
|
||||
The precise terms and conditions for copying, distribution and
|
||||
modification follow.
|
||||
|
||||
TERMS AND CONDITIONS
|
||||
|
||||
0. Definitions.
|
||||
|
||||
"This License" refers to version 3 of the GNU General Public License.
|
||||
|
||||
"Copyright" also means copyright-like laws that apply to other kinds of
|
||||
works, such as semiconductor masks.
|
||||
|
||||
"The Program" refers to any copyrightable work licensed under this
|
||||
License. Each licensee is addressed as "you". "Licensees" and
|
||||
"recipients" may be individuals or organizations.
|
||||
|
||||
To "modify" a work means to copy from or adapt all or part of the work
|
||||
in a fashion requiring copyright permission, other than the making of an
|
||||
exact copy. The resulting work is called a "modified version" of the
|
||||
earlier work or a work "based on" the earlier work.
|
||||
|
||||
A "covered work" means either the unmodified Program or a work based
|
||||
on the Program.
|
||||
|
||||
To "propagate" a work means to do anything with it that, without
|
||||
permission, would make you directly or secondarily liable for
|
||||
infringement under applicable copyright law, except executing it on a
|
||||
computer or modifying a private copy. Propagation includes copying,
|
||||
distribution (with or without modification), making available to the
|
||||
public, and in some countries other activities as well.
|
||||
|
||||
To "convey" a work means any kind of propagation that enables other
|
||||
parties to make or receive copies. Mere interaction with a user through
|
||||
a computer network, with no transfer of a copy, is not conveying.
|
||||
|
||||
An interactive user interface displays "Appropriate Legal Notices"
|
||||
to the extent that it includes a convenient and prominently visible
|
||||
feature that (1) displays an appropriate copyright notice, and (2)
|
||||
tells the user that there is no warranty for the work (except to the
|
||||
extent that warranties are provided), that licensees may convey the
|
||||
work under this License, and how to view a copy of this License. If
|
||||
the interface presents a list of user commands or options, such as a
|
||||
menu, a prominent item in the list meets this criterion.
|
||||
|
||||
1. Source Code.
|
||||
|
||||
The "source code" for a work means the preferred form of the work
|
||||
for making modifications to it. "Object code" means any non-source
|
||||
form of a work.
|
||||
|
||||
A "Standard Interface" means an interface that either is an official
|
||||
standard defined by a recognized standards body, or, in the case of
|
||||
interfaces specified for a particular programming language, one that
|
||||
is widely used among developers working in that language.
|
||||
|
||||
The "System Libraries" of an executable work include anything, other
|
||||
than the work as a whole, that (a) is included in the normal form of
|
||||
packaging a Major Component, but which is not part of that Major
|
||||
Component, and (b) serves only to enable use of the work with that
|
||||
Major Component, or to implement a Standard Interface for which an
|
||||
implementation is available to the public in source code form. A
|
||||
"Major Component", in this context, means a major essential component
|
||||
(kernel, window system, and so on) of the specific operating system
|
||||
(if any) on which the executable work runs, or a compiler used to
|
||||
produce the work, or an object code interpreter used to run it.
|
||||
|
||||
The "Corresponding Source" for a work in object code form means all
|
||||
the source code needed to generate, install, and (for an executable
|
||||
work) run the object code and to modify the work, including scripts to
|
||||
control those activities. However, it does not include the work's
|
||||
System Libraries, or general-purpose tools or generally available free
|
||||
programs which are used unmodified in performing those activities but
|
||||
which are not part of the work. For example, Corresponding Source
|
||||
includes interface definition files associated with source files for
|
||||
the work, and the source code for shared libraries and dynamically
|
||||
linked subprograms that the work is specifically designed to require,
|
||||
such as by intimate data communication or control flow between those
|
||||
subprograms and other parts of the work.
|
||||
|
||||
The Corresponding Source need not include anything that users
|
||||
can regenerate automatically from other parts of the Corresponding
|
||||
Source.
|
||||
|
||||
The Corresponding Source for a work in source code form is that
|
||||
same work.
|
||||
|
||||
2. Basic Permissions.
|
||||
|
||||
All rights granted under this License are granted for the term of
|
||||
copyright on the Program, and are irrevocable provided the stated
|
||||
conditions are met. This License explicitly affirms your unlimited
|
||||
permission to run the unmodified Program. The output from running a
|
||||
covered work is covered by this License only if the output, given its
|
||||
content, constitutes a covered work. This License acknowledges your
|
||||
rights of fair use or other equivalent, as provided by copyright law.
|
||||
|
||||
You may make, run and propagate covered works that you do not
|
||||
convey, without conditions so long as your license otherwise remains
|
||||
in force. You may convey covered works to others for the sole purpose
|
||||
of having them make modifications exclusively for you, or provide you
|
||||
with facilities for running those works, provided that you comply with
|
||||
the terms of this License in conveying all material for which you do
|
||||
not control copyright. Those thus making or running the covered works
|
||||
for you must do so exclusively on your behalf, under your direction
|
||||
and control, on terms that prohibit them from making any copies of
|
||||
your copyrighted material outside their relationship with you.
|
||||
|
||||
Conveying under any other circumstances is permitted solely under
|
||||
the conditions stated below. Sublicensing is not allowed; section 10
|
||||
makes it unnecessary.
|
||||
|
||||
3. Protecting Users' Legal Rights From Anti-Circumvention Law.
|
||||
|
||||
No covered work shall be deemed part of an effective technological
|
||||
measure under any applicable law fulfilling obligations under article
|
||||
11 of the WIPO copyright treaty adopted on 20 December 1996, or
|
||||
similar laws prohibiting or restricting circumvention of such
|
||||
measures.
|
||||
|
||||
When you convey a covered work, you waive any legal power to forbid
|
||||
circumvention of technological measures to the extent such circumvention
|
||||
is effected by exercising rights under this License with respect to
|
||||
the covered work, and you disclaim any intention to limit operation or
|
||||
modification of the work as a means of enforcing, against the work's
|
||||
users, your or third parties' legal rights to forbid circumvention of
|
||||
technological measures.
|
||||
|
||||
4. Conveying Verbatim Copies.
|
||||
|
||||
You may convey verbatim copies of the Program's source code as you
|
||||
receive it, in any medium, provided that you conspicuously and
|
||||
appropriately publish on each copy an appropriate copyright notice;
|
||||
keep intact all notices stating that this License and any
|
||||
non-permissive terms added in accord with section 7 apply to the code;
|
||||
keep intact all notices of the absence of any warranty; and give all
|
||||
recipients a copy of this License along with the Program.
|
||||
|
||||
You may charge any price or no price for each copy that you convey,
|
||||
and you may offer support or warranty protection for a fee.
|
||||
|
||||
5. Conveying Modified Source Versions.
|
||||
|
||||
You may convey a work based on the Program, or the modifications to
|
||||
produce it from the Program, in the form of source code under the
|
||||
terms of section 4, provided that you also meet all of these conditions:
|
||||
|
||||
a) The work must carry prominent notices stating that you modified
|
||||
it, and giving a relevant date.
|
||||
|
||||
b) The work must carry prominent notices stating that it is
|
||||
released under this License and any conditions added under section
|
||||
7. This requirement modifies the requirement in section 4 to
|
||||
"keep intact all notices".
|
||||
|
||||
c) You must license the entire work, as a whole, under this
|
||||
License to anyone who comes into possession of a copy. This
|
||||
License will therefore apply, along with any applicable section 7
|
||||
additional terms, to the whole of the work, and all its parts,
|
||||
regardless of how they are packaged. This License gives no
|
||||
permission to license the work in any other way, but it does not
|
||||
invalidate such permission if you have separately received it.
|
||||
|
||||
d) If the work has interactive user interfaces, each must display
|
||||
Appropriate Legal Notices; however, if the Program has interactive
|
||||
interfaces that do not display Appropriate Legal Notices, your
|
||||
work need not make them do so.
|
||||
|
||||
A compilation of a covered work with other separate and independent
|
||||
works, which are not by their nature extensions of the covered work,
|
||||
and which are not combined with it such as to form a larger program,
|
||||
in or on a volume of a storage or distribution medium, is called an
|
||||
"aggregate" if the compilation and its resulting copyright are not
|
||||
used to limit the access or legal rights of the compilation's users
|
||||
beyond what the individual works permit. Inclusion of a covered work
|
||||
in an aggregate does not cause this License to apply to the other
|
||||
parts of the aggregate.
|
||||
|
||||
6. Conveying Non-Source Forms.
|
||||
|
||||
You may convey a covered work in object code form under the terms
|
||||
of sections 4 and 5, provided that you also convey the
|
||||
machine-readable Corresponding Source under the terms of this License,
|
||||
in one of these ways:
|
||||
|
||||
a) Convey the object code in, or embodied in, a physical product
|
||||
(including a physical distribution medium), accompanied by the
|
||||
Corresponding Source fixed on a durable physical medium
|
||||
customarily used for software interchange.
|
||||
|
||||
b) Convey the object code in, or embodied in, a physical product
|
||||
(including a physical distribution medium), accompanied by a
|
||||
written offer, valid for at least three years and valid for as
|
||||
long as you offer spare parts or customer support for that product
|
||||
model, to give anyone who possesses the object code either (1) a
|
||||
copy of the Corresponding Source for all the software in the
|
||||
product that is covered by this License, on a durable physical
|
||||
medium customarily used for software interchange, for a price no
|
||||
more than your reasonable cost of physically performing this
|
||||
conveying of source, or (2) access to copy the
|
||||
Corresponding Source from a network server at no charge.
|
||||
|
||||
c) Convey individual copies of the object code with a copy of the
|
||||
written offer to provide the Corresponding Source. This
|
||||
alternative is allowed only occasionally and noncommercially, and
|
||||
only if you received the object code with such an offer, in accord
|
||||
with subsection 6b.
|
||||
|
||||
d) Convey the object code by offering access from a designated
|
||||
place (gratis or for a charge), and offer equivalent access to the
|
||||
Corresponding Source in the same way through the same place at no
|
||||
further charge. You need not require recipients to copy the
|
||||
Corresponding Source along with the object code. If the place to
|
||||
copy the object code is a network server, the Corresponding Source
|
||||
may be on a different server (operated by you or a third party)
|
||||
that supports equivalent copying facilities, provided you maintain
|
||||
clear directions next to the object code saying where to find the
|
||||
Corresponding Source. Regardless of what server hosts the
|
||||
Corresponding Source, you remain obligated to ensure that it is
|
||||
available for as long as needed to satisfy these requirements.
|
||||
|
||||
e) Convey the object code using peer-to-peer transmission, provided
|
||||
you inform other peers where the object code and Corresponding
|
||||
Source of the work are being offered to the general public at no
|
||||
charge under subsection 6d.
|
||||
|
||||
A separable portion of the object code, whose source code is excluded
|
||||
from the Corresponding Source as a System Library, need not be
|
||||
included in conveying the object code work.
|
||||
|
||||
A "User Product" is either (1) a "consumer product", which means any
|
||||
tangible personal property which is normally used for personal, family,
|
||||
or household purposes, or (2) anything designed or sold for incorporation
|
||||
into a dwelling. In determining whether a product is a consumer product,
|
||||
doubtful cases shall be resolved in favor of coverage. For a particular
|
||||
product received by a particular user, "normally used" refers to a
|
||||
typical or common use of that class of product, regardless of the status
|
||||
of the particular user or of the way in which the particular user
|
||||
actually uses, or expects or is expected to use, the product. A product
|
||||
is a consumer product regardless of whether the product has substantial
|
||||
commercial, industrial or non-consumer uses, unless such uses represent
|
||||
the only significant mode of use of the product.
|
||||
|
||||
"Installation Information" for a User Product means any methods,
|
||||
procedures, authorization keys, or other information required to install
|
||||
and execute modified versions of a covered work in that User Product from
|
||||
a modified version of its Corresponding Source. The information must
|
||||
suffice to ensure that the continued functioning of the modified object
|
||||
code is in no case prevented or interfered with solely because
|
||||
modification has been made.
|
||||
|
||||
If you convey an object code work under this section in, or with, or
|
||||
specifically for use in, a User Product, and the conveying occurs as
|
||||
part of a transaction in which the right of possession and use of the
|
||||
User Product is transferred to the recipient in perpetuity or for a
|
||||
fixed term (regardless of how the transaction is characterized), the
|
||||
Corresponding Source conveyed under this section must be accompanied
|
||||
by the Installation Information. But this requirement does not apply
|
||||
if neither you nor any third party retains the ability to install
|
||||
modified object code on the User Product (for example, the work has
|
||||
been installed in ROM).
|
||||
|
||||
The requirement to provide Installation Information does not include a
|
||||
requirement to continue to provide support service, warranty, or updates
|
||||
for a work that has been modified or installed by the recipient, or for
|
||||
the User Product in which it has been modified or installed. Access to a
|
||||
network may be denied when the modification itself materially and
|
||||
adversely affects the operation of the network or violates the rules and
|
||||
protocols for communication across the network.
|
||||
|
||||
Corresponding Source conveyed, and Installation Information provided,
|
||||
in accord with this section must be in a format that is publicly
|
||||
documented (and with an implementation available to the public in
|
||||
source code form), and must require no special password or key for
|
||||
unpacking, reading or copying.
|
||||
|
||||
7. Additional Terms.
|
||||
|
||||
"Additional permissions" are terms that supplement the terms of this
|
||||
License by making exceptions from one or more of its conditions.
|
||||
Additional permissions that are applicable to the entire Program shall
|
||||
be treated as though they were included in this License, to the extent
|
||||
that they are valid under applicable law. If additional permissions
|
||||
apply only to part of the Program, that part may be used separately
|
||||
under those permissions, but the entire Program remains governed by
|
||||
this License without regard to the additional permissions.
|
||||
|
||||
When you convey a copy of a covered work, you may at your option
|
||||
remove any additional permissions from that copy, or from any part of
|
||||
it. (Additional permissions may be written to require their own
|
||||
removal in certain cases when you modify the work.) You may place
|
||||
additional permissions on material, added by you to a covered work,
|
||||
for which you have or can give appropriate copyright permission.
|
||||
|
||||
Notwithstanding any other provision of this License, for material you
|
||||
add to a covered work, you may (if authorized by the copyright holders of
|
||||
that material) supplement the terms of this License with terms:
|
||||
|
||||
a) Disclaiming warranty or limiting liability differently from the
|
||||
terms of sections 15 and 16 of this License; or
|
||||
|
||||
b) Requiring preservation of specified reasonable legal notices or
|
||||
author attributions in that material or in the Appropriate Legal
|
||||
Notices displayed by works containing it; or
|
||||
|
||||
c) Prohibiting misrepresentation of the origin of that material, or
|
||||
requiring that modified versions of such material be marked in
|
||||
reasonable ways as different from the original version; or
|
||||
|
||||
d) Limiting the use for publicity purposes of names of licensors or
|
||||
authors of the material; or
|
||||
|
||||
e) Declining to grant rights under trademark law for use of some
|
||||
trade names, trademarks, or service marks; or
|
||||
|
||||
f) Requiring indemnification of licensors and authors of that
|
||||
material by anyone who conveys the material (or modified versions of
|
||||
it) with contractual assumptions of liability to the recipient, for
|
||||
any liability that these contractual assumptions directly impose on
|
||||
those licensors and authors.
|
||||
|
||||
All other non-permissive additional terms are considered "further
|
||||
restrictions" within the meaning of section 10. If the Program as you
|
||||
received it, or any part of it, contains a notice stating that it is
|
||||
governed by this License along with a term that is a further
|
||||
restriction, you may remove that term. If a license document contains
|
||||
a further restriction but permits relicensing or conveying under this
|
||||
License, you may add to a covered work material governed by the terms
|
||||
of that license document, provided that the further restriction does
|
||||
not survive such relicensing or conveying.
|
||||
|
||||
If you add terms to a covered work in accord with this section, you
|
||||
must place, in the relevant source files, a statement of the
|
||||
additional terms that apply to those files, or a notice indicating
|
||||
where to find the applicable terms.
|
||||
|
||||
Additional terms, permissive or non-permissive, may be stated in the
|
||||
form of a separately written license, or stated as exceptions;
|
||||
the above requirements apply either way.
|
||||
|
||||
8. Termination.
|
||||
|
||||
You may not propagate or modify a covered work except as expressly
|
||||
provided under this License. Any attempt otherwise to propagate or
|
||||
modify it is void, and will automatically terminate your rights under
|
||||
this License (including any patent licenses granted under the third
|
||||
paragraph of section 11).
|
||||
|
||||
However, if you cease all violation of this License, then your
|
||||
license from a particular copyright holder is reinstated (a)
|
||||
provisionally, unless and until the copyright holder explicitly and
|
||||
finally terminates your license, and (b) permanently, if the copyright
|
||||
holder fails to notify you of the violation by some reasonable means
|
||||
prior to 60 days after the cessation.
|
||||
|
||||
Moreover, your license from a particular copyright holder is
|
||||
reinstated permanently if the copyright holder notifies you of the
|
||||
violation by some reasonable means, this is the first time you have
|
||||
received notice of violation of this License (for any work) from that
|
||||
copyright holder, and you cure the violation prior to 30 days after
|
||||
your receipt of the notice.
|
||||
|
||||
Termination of your rights under this section does not terminate the
|
||||
licenses of parties who have received copies or rights from you under
|
||||
this License. If your rights have been terminated and not permanently
|
||||
reinstated, you do not qualify to receive new licenses for the same
|
||||
material under section 10.
|
||||
|
||||
9. Acceptance Not Required for Having Copies.
|
||||
|
||||
You are not required to accept this License in order to receive or
|
||||
run a copy of the Program. Ancillary propagation of a covered work
|
||||
occurring solely as a consequence of using peer-to-peer transmission
|
||||
to receive a copy likewise does not require acceptance. However,
|
||||
nothing other than this License grants you permission to propagate or
|
||||
modify any covered work. These actions infringe copyright if you do
|
||||
not accept this License. Therefore, by modifying or propagating a
|
||||
covered work, you indicate your acceptance of this License to do so.
|
||||
|
||||
10. Automatic Licensing of Downstream Recipients.
|
||||
|
||||
Each time you convey a covered work, the recipient automatically
|
||||
receives a license from the original licensors, to run, modify and
|
||||
propagate that work, subject to this License. You are not responsible
|
||||
for enforcing compliance by third parties with this License.
|
||||
|
||||
An "entity transaction" is a transaction transferring control of an
|
||||
organization, or substantially all assets of one, or subdividing an
|
||||
organization, or merging organizations. If propagation of a covered
|
||||
work results from an entity transaction, each party to that
|
||||
transaction who receives a copy of the work also receives whatever
|
||||
licenses to the work the party's predecessor in interest had or could
|
||||
give under the previous paragraph, plus a right to possession of the
|
||||
Corresponding Source of the work from the predecessor in interest, if
|
||||
the predecessor has it or can get it with reasonable efforts.
|
||||
|
||||
You may not impose any further restrictions on the exercise of the
|
||||
rights granted or affirmed under this License. For example, you may
|
||||
not impose a license fee, royalty, or other charge for exercise of
|
||||
rights granted under this License, and you may not initiate litigation
|
||||
(including a cross-claim or counterclaim in a lawsuit) alleging that
|
||||
any patent claim is infringed by making, using, selling, offering for
|
||||
sale, or importing the Program or any portion of it.
|
||||
|
||||
11. Patents.
|
||||
|
||||
A "contributor" is a copyright holder who authorizes use under this
|
||||
License of the Program or a work on which the Program is based. The
|
||||
work thus licensed is called the contributor's "contributor version".
|
||||
|
||||
A contributor's "essential patent claims" are all patent claims
|
||||
owned or controlled by the contributor, whether already acquired or
|
||||
hereafter acquired, that would be infringed by some manner, permitted
|
||||
by this License, of making, using, or selling its contributor version,
|
||||
but do not include claims that would be infringed only as a
|
||||
consequence of further modification of the contributor version. For
|
||||
purposes of this definition, "control" includes the right to grant
|
||||
patent sublicenses in a manner consistent with the requirements of
|
||||
this License.
|
||||
|
||||
Each contributor grants you a non-exclusive, worldwide, royalty-free
|
||||
patent license under the contributor's essential patent claims, to
|
||||
make, use, sell, offer for sale, import and otherwise run, modify and
|
||||
propagate the contents of its contributor version.
|
||||
|
||||
In the following three paragraphs, a "patent license" is any express
|
||||
agreement or commitment, however denominated, not to enforce a patent
|
||||
(such as an express permission to practice a patent or covenant not to
|
||||
sue for patent infringement). To "grant" such a patent license to a
|
||||
party means to make such an agreement or commitment not to enforce a
|
||||
patent against the party.
|
||||
|
||||
If you convey a covered work, knowingly relying on a patent license,
|
||||
and the Corresponding Source of the work is not available for anyone
|
||||
to copy, free of charge and under the terms of this License, through a
|
||||
publicly available network server or other readily accessible means,
|
||||
then you must either (1) cause the Corresponding Source to be so
|
||||
available, or (2) arrange to deprive yourself of the benefit of the
|
||||
patent license for this particular work, or (3) arrange, in a manner
|
||||
consistent with the requirements of this License, to extend the patent
|
||||
license to downstream recipients. "Knowingly relying" means you have
|
||||
actual knowledge that, but for the patent license, your conveying the
|
||||
covered work in a country, or your recipient's use of the covered work
|
||||
in a country, would infringe one or more identifiable patents in that
|
||||
country that you have reason to believe are valid.
|
||||
|
||||
If, pursuant to or in connection with a single transaction or
|
||||
arrangement, you convey, or propagate by procuring conveyance of, a
|
||||
covered work, and grant a patent license to some of the parties
|
||||
receiving the covered work authorizing them to use, propagate, modify
|
||||
or convey a specific copy of the covered work, then the patent license
|
||||
you grant is automatically extended to all recipients of the covered
|
||||
work and works based on it.
|
||||
|
||||
A patent license is "discriminatory" if it does not include within
|
||||
the scope of its coverage, prohibits the exercise of, or is
|
||||
conditioned on the non-exercise of one or more of the rights that are
|
||||
specifically granted under this License. You may not convey a covered
|
||||
work if you are a party to an arrangement with a third party that is
|
||||
in the business of distributing software, under which you make payment
|
||||
to the third party based on the extent of your activity of conveying
|
||||
the work, and under which the third party grants, to any of the
|
||||
parties who would receive the covered work from you, a discriminatory
|
||||
patent license (a) in connection with copies of the covered work
|
||||
conveyed by you (or copies made from those copies), or (b) primarily
|
||||
for and in connection with specific products or compilations that
|
||||
contain the covered work, unless you entered into that arrangement,
|
||||
or that patent license was granted, prior to 28 March 2007.
|
||||
|
||||
Nothing in this License shall be construed as excluding or limiting
|
||||
any implied license or other defenses to infringement that may
|
||||
otherwise be available to you under applicable patent law.
|
||||
|
||||
12. No Surrender of Others' Freedom.
|
||||
|
||||
If conditions are imposed on you (whether by court order, agreement or
|
||||
otherwise) that contradict the conditions of this License, they do not
|
||||
excuse you from the conditions of this License. If you cannot convey a
|
||||
covered work so as to satisfy simultaneously your obligations under this
|
||||
License and any other pertinent obligations, then as a consequence you may
|
||||
not convey it at all. For example, if you agree to terms that obligate you
|
||||
to collect a royalty for further conveying from those to whom you convey
|
||||
the Program, the only way you could satisfy both those terms and this
|
||||
License would be to refrain entirely from conveying the Program.
|
||||
|
||||
13. Use with the GNU Affero General Public License.
|
||||
|
||||
Notwithstanding any other provision of this License, you have
|
||||
permission to link or combine any covered work with a work licensed
|
||||
under version 3 of the GNU Affero General Public License into a single
|
||||
combined work, and to convey the resulting work. The terms of this
|
||||
License will continue to apply to the part which is the covered work,
|
||||
but the special requirements of the GNU Affero General Public License,
|
||||
section 13, concerning interaction through a network will apply to the
|
||||
combination as such.
|
||||
|
||||
14. Revised Versions of this License.
|
||||
|
||||
The Free Software Foundation may publish revised and/or new versions of
|
||||
the GNU General Public License from time to time. Such new versions will
|
||||
be similar in spirit to the present version, but may differ in detail to
|
||||
address new problems or concerns.
|
||||
|
||||
Each version is given a distinguishing version number. If the
|
||||
Program specifies that a certain numbered version of the GNU General
|
||||
Public License "or any later version" applies to it, you have the
|
||||
option of following the terms and conditions either of that numbered
|
||||
version or of any later version published by the Free Software
|
||||
Foundation. If the Program does not specify a version number of the
|
||||
GNU General Public License, you may choose any version ever published
|
||||
by the Free Software Foundation.
|
||||
|
||||
If the Program specifies that a proxy can decide which future
|
||||
versions of the GNU General Public License can be used, that proxy's
|
||||
public statement of acceptance of a version permanently authorizes you
|
||||
to choose that version for the Program.
|
||||
|
||||
Later license versions may give you additional or different
|
||||
permissions. However, no additional obligations are imposed on any
|
||||
author or copyright holder as a result of your choosing to follow a
|
||||
later version.
|
||||
|
||||
15. Disclaimer of Warranty.
|
||||
|
||||
THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
|
||||
APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
|
||||
HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
|
||||
OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
|
||||
THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
|
||||
PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
|
||||
IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
|
||||
ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
|
||||
|
||||
16. Limitation of Liability.
|
||||
|
||||
IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
|
||||
WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
|
||||
THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
|
||||
GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
|
||||
USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
|
||||
DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
|
||||
PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
|
||||
EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
|
||||
SUCH DAMAGES.
|
||||
|
||||
17. Interpretation of Sections 15 and 16.
|
||||
|
||||
If the disclaimer of warranty and limitation of liability provided
|
||||
above cannot be given local legal effect according to their terms,
|
||||
reviewing courts shall apply local law that most closely approximates
|
||||
an absolute waiver of all civil liability in connection with the
|
||||
Program, unless a warranty or assumption of liability accompanies a
|
||||
copy of the Program in return for a fee.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
How to Apply These Terms to Your New Programs
|
||||
|
||||
If you develop a new program, and you want it to be of the greatest
|
||||
possible use to the public, the best way to achieve this is to make it
|
||||
free software which everyone can redistribute and change under these terms.
|
||||
|
||||
To do so, attach the following notices to the program. It is safest
|
||||
to attach them to the start of each source file to most effectively
|
||||
state the exclusion of warranty; and each file should have at least
|
||||
the "copyright" line and a pointer to where the full notice is found.
|
||||
|
||||
<one line to give the program's name and a brief idea of what it does.>
|
||||
Copyright (C) <year> <name of author>
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License
|
||||
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
Also add information on how to contact you by electronic and paper mail.
|
||||
|
||||
If the program does terminal interaction, make it output a short
|
||||
notice like this when it starts in an interactive mode:
|
||||
|
||||
<program> Copyright (C) <year> <name of author>
|
||||
This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
|
||||
This is free software, and you are welcome to redistribute it
|
||||
under certain conditions; type `show c' for details.
|
||||
|
||||
The hypothetical commands `show w' and `show c' should show the appropriate
|
||||
parts of the General Public License. Of course, your program's commands
|
||||
might be different; for a GUI interface, you would use an "about box".
|
||||
|
||||
You should also get your employer (if you work as a programmer) or school,
|
||||
if any, to sign a "copyright disclaimer" for the program, if necessary.
|
||||
For more information on this, and how to apply and follow the GNU GPL, see
|
||||
<https://www.gnu.org/licenses/>.
|
||||
|
||||
The GNU General Public License does not permit incorporating your program
|
||||
into proprietary programs. If your program is a subroutine library, you
|
||||
may consider it more useful to permit linking proprietary applications with
|
||||
the library. If this is what you want to do, use the GNU Lesser General
|
||||
Public License instead of this License. But first, please read
|
||||
<https://www.gnu.org/licenses/why-not-lgpl.html>.
|
||||
@@ -1,11 +0,0 @@
|
||||
# Grafana Battery Visualisation
|
||||
|
||||
I hate writing documentation, and since I will have ADHD brain, I will forget how to do this.
|
||||
|
||||
```
|
||||
npm install
|
||||
npm run build
|
||||
cp -r dist /var/lib/grafana/plugins/andydixon-battery-panel
|
||||
```
|
||||
|
||||
in `/etc/grafana/grsfana.ini` add `andydixon-battery-panel` to `allow_loading_unsigned_plugins`
|
||||
@@ -1,5 +0,0 @@
|
||||
services:
|
||||
grafana:
|
||||
extends:
|
||||
file: .config/docker-compose-base.yaml
|
||||
service: grafana
|
||||
@@ -1,39 +0,0 @@
|
||||
import { defineConfig } from 'eslint/config';
|
||||
import baseConfig from './.config/eslint.config.mjs';
|
||||
|
||||
export default defineConfig([
|
||||
{
|
||||
ignores: [
|
||||
'**/logs',
|
||||
'**/*.log',
|
||||
'**/npm-debug.log*',
|
||||
'**/yarn-debug.log*',
|
||||
'**/yarn-error.log*',
|
||||
'**/.pnpm-debug.log*',
|
||||
'**/node_modules/',
|
||||
'.yarn/cache',
|
||||
'.yarn/unplugged',
|
||||
'.yarn/build-state.yml',
|
||||
'.yarn/install-state.gz',
|
||||
'**/.pnp.*',
|
||||
'**/pids',
|
||||
'**/*.pid',
|
||||
'**/*.seed',
|
||||
'**/*.pid.lock',
|
||||
'**/lib-cov',
|
||||
'**/coverage',
|
||||
'**/dist/',
|
||||
'**/artifacts/',
|
||||
'**/work/',
|
||||
'**/ci/',
|
||||
'test-results/',
|
||||
'playwright-report/',
|
||||
'blob-report/',
|
||||
'playwright/.cache/',
|
||||
'playwright/.auth/',
|
||||
'**/.idea',
|
||||
'**/.eslintcache',
|
||||
],
|
||||
},
|
||||
...baseConfig,
|
||||
]);
|
||||
@@ -1,2 +0,0 @@
|
||||
// Jest setup provided by Grafana scaffolding
|
||||
import './.config/jest-setup';
|
||||
@@ -1,8 +0,0 @@
|
||||
// force timezone to UTC to allow tests to work regardless of local timezone
|
||||
// generally used by snapshots, but can affect specific tests
|
||||
process.env.TZ = 'UTC';
|
||||
|
||||
module.exports = {
|
||||
// Jest configuration provided by Grafana scaffolding
|
||||
...require('./.config/jest.config'),
|
||||
};
|
||||
Generated
-16746
File diff suppressed because it is too large
Load Diff
@@ -1,78 +0,0 @@
|
||||
{
|
||||
"name": "charge-viz-battery-panel",
|
||||
"version": "1.0.0",
|
||||
"scripts": {
|
||||
"build": "webpack -c ./.config/webpack/webpack.config.ts --env production",
|
||||
"dev": "webpack -w -c ./.config/webpack/webpack.config.ts --env development",
|
||||
"test": "jest --watch --onlyChanged",
|
||||
"test:ci": "jest --passWithNoTests --maxWorkers 4",
|
||||
"typecheck": "tsc --noEmit",
|
||||
"lint": "eslint --cache .",
|
||||
"lint:fix": "npm run lint -- --fix && prettier --write --list-different .",
|
||||
"e2e": "playwright test",
|
||||
"server": "docker compose up --build",
|
||||
"sign": "npx --yes @grafana/sign-plugin@latest"
|
||||
},
|
||||
"author": "Andy dixon",
|
||||
"license": "Apache-2.0",
|
||||
"devDependencies": {
|
||||
"@grafana/eslint-config": "^8.2.0",
|
||||
"@grafana/plugin-e2e": "^2.2.0",
|
||||
"@grafana/tsconfig": "^2.0.0",
|
||||
"@playwright/test": "^1.52.0",
|
||||
"@stylistic/eslint-plugin-ts": "^2.9.0",
|
||||
"@swc/core": "^1.3.90",
|
||||
"@swc/helpers": "^0.5.0",
|
||||
"@swc/jest": "^0.2.26",
|
||||
"@testing-library/jest-dom": "6.1.4",
|
||||
"@testing-library/react": "14.0.0",
|
||||
"@types/jest": "^29.5.0",
|
||||
"@types/node": "^20.8.7",
|
||||
"@types/testing-library__jest-dom": "5.14.8",
|
||||
"@typescript-eslint/eslint-plugin": "^8.3.0",
|
||||
"@typescript-eslint/parser": "^8.3.0",
|
||||
"copy-webpack-plugin": "^11.0.0",
|
||||
"css-loader": "^6.7.3",
|
||||
"eslint": "^9.0.0",
|
||||
"eslint-config-prettier": "^8.8.0",
|
||||
"eslint-plugin-jsdoc": "^51.2.3",
|
||||
"eslint-plugin-react": "^7.37.5",
|
||||
"eslint-plugin-react-hooks": "^5.2.0",
|
||||
"eslint-webpack-plugin": "^5.0.0",
|
||||
"fork-ts-checker-webpack-plugin": "^8.0.0",
|
||||
"glob": "^10.2.7",
|
||||
"identity-obj-proxy": "3.0.0",
|
||||
"imports-loader": "^5.0.0",
|
||||
"jest": "^29.5.0",
|
||||
"jest-environment-jsdom": "^29.5.0",
|
||||
"prettier": "^2.8.7",
|
||||
"replace-in-file-webpack-plugin": "^1.0.6",
|
||||
"sass": "1.63.2",
|
||||
"sass-loader": "13.3.1",
|
||||
"semver": "^7.6.3",
|
||||
"style-loader": "3.3.3",
|
||||
"swc-loader": "^0.2.3",
|
||||
"terser-webpack-plugin": "^5.3.10",
|
||||
"ts-node": "^10.9.2",
|
||||
"typescript": "5.5.4",
|
||||
"webpack": "^5.94.0",
|
||||
"webpack-cli": "^5.1.4",
|
||||
"webpack-livereload-plugin": "^3.0.2",
|
||||
"webpack-subresource-integrity": "^5.1.0",
|
||||
"webpack-virtual-modules": "^0.6.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=22"
|
||||
},
|
||||
"dependencies": {
|
||||
"@emotion/css": "11.10.6",
|
||||
"@grafana/data": "^12.2.0",
|
||||
"@grafana/i18n": "^12.2.0",
|
||||
"@grafana/runtime": "^12.2.0",
|
||||
"@grafana/ui": "^12.2.0",
|
||||
"@grafana/schema": "^12.2.0",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0"
|
||||
},
|
||||
"packageManager": "npm@10.8.2"
|
||||
}
|
||||
@@ -1,53 +0,0 @@
|
||||
import type { PluginOptions } from '@grafana/plugin-e2e';
|
||||
import { defineConfig, devices } from '@playwright/test';
|
||||
import { dirname } from 'node:path';
|
||||
|
||||
const pluginE2eAuth = `${dirname(require.resolve('@grafana/plugin-e2e'))}/auth`;
|
||||
|
||||
/**
|
||||
* Read environment variables from file.
|
||||
* https://github.com/motdotla/dotenv
|
||||
*/
|
||||
// require('dotenv').config();
|
||||
|
||||
/**
|
||||
* See https://playwright.dev/docs/test-configuration.
|
||||
*/
|
||||
export default defineConfig<PluginOptions>({
|
||||
testDir: './tests',
|
||||
/* Run tests in files in parallel */
|
||||
fullyParallel: true,
|
||||
/* Fail the build on CI if you accidentally left test.only in the source code. */
|
||||
forbidOnly: !!process.env.CI,
|
||||
/* Retry on CI only */
|
||||
retries: process.env.CI ? 2 : 0,
|
||||
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
|
||||
reporter: 'html',
|
||||
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
|
||||
use: {
|
||||
/* Base URL to use in actions like `await page.goto('/')`. */
|
||||
baseURL: process.env.GRAFANA_URL || 'http://localhost:3000',
|
||||
|
||||
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
|
||||
trace: 'on-first-retry',
|
||||
},
|
||||
|
||||
/* Configure projects for major browsers */
|
||||
projects: [
|
||||
// 1. Login to Grafana and store the cookie on disk for use in other tests.
|
||||
{
|
||||
name: 'auth',
|
||||
testDir: pluginE2eAuth,
|
||||
testMatch: [/.*\.js/],
|
||||
},
|
||||
// 2. Run tests in Google Chrome. Every test will start authenticated as admin user.
|
||||
{
|
||||
name: 'chromium',
|
||||
use: {
|
||||
...devices['Desktop Chrome'],
|
||||
storageState: 'playwright/.auth/admin.json',
|
||||
},
|
||||
dependencies: ['auth'],
|
||||
},
|
||||
],
|
||||
});
|
||||
@@ -1 +0,0 @@
|
||||
For more information see [Provision dashboards and data sources](https://grafana.com/tutorials/provision-dashboards-and-data-sources/)
|
||||
@@ -1,104 +0,0 @@
|
||||
{
|
||||
"annotations": {
|
||||
"list": [
|
||||
{
|
||||
"builtIn": 1,
|
||||
"datasource": {
|
||||
"type": "grafana",
|
||||
"uid": "-- Grafana --"
|
||||
},
|
||||
"enable": true,
|
||||
"hide": true,
|
||||
"iconColor": "rgba(0, 211, 255, 1)",
|
||||
"name": "Annotations & Alerts",
|
||||
"type": "dashboard"
|
||||
}
|
||||
]
|
||||
},
|
||||
"editable": true,
|
||||
"fiscalYearStartMonth": 0,
|
||||
"graphTooltip": 0,
|
||||
"id": 1,
|
||||
"links": [],
|
||||
"liveNow": false,
|
||||
"panels": [
|
||||
{
|
||||
"datasource": {
|
||||
"type": "grafana-testdata-datasource",
|
||||
"uid": "trlxrdZVk"
|
||||
},
|
||||
"gridPos": {
|
||||
"h": 8,
|
||||
"w": 12,
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"id": 1,
|
||||
"options": {
|
||||
"seriesCountSize": "sm",
|
||||
"showSeriesCount": false,
|
||||
"text": "Default value of text input option"
|
||||
},
|
||||
"targets": [
|
||||
{
|
||||
"datasource": {
|
||||
"type": "grafana-testdata-datasource",
|
||||
"uid": "db84e60d-b92a-4089-82cb-34842fb1754b"
|
||||
},
|
||||
"refId": "A",
|
||||
"scenarioId": "raw_frame",
|
||||
"rawFrameContent": "[\n {\n \"columns\": [\n {\n \"text\": \"Time\",\n \"type\": \"time\"\n },\n {\n \"text\": \"Label\",\n \"type\": \"string\"\n },\n {\n \"text\": \"Value\",\n \"type\": \"number\"\n }\n ],\n \"rows\": [\n [1609459200000, \"A\", 10],\n [1609462800000, \"B\", 20],\n [1609466400000, \"C\", 15],\n [1609470000000, \"D\", 25],\n [1609473600000, \"E\", 30]\n ]\n },\n{\n \"columns\": [\n {\n \"text\": \"Time\",\n \"type\": \"time\"\n },\n {\n \"text\": \"Label\",\n \"type\": \"string\"\n },\n {\n \"text\": \"Value\",\n \"type\": \"number\"\n }\n ],\n \"rows\": [\n [1609459200000, \"A\", 40],\n [1609462800000, \"B\", 50],\n [1609466400000, \"C\", 45],\n [1609470000000, \"D\", 55],\n [1609473600000, \"E\", 60]\n ]\n }\n]"
|
||||
}
|
||||
],
|
||||
"title": "Sample Panel Title",
|
||||
"type": "andydixon-chargevizbattery-panel"
|
||||
},
|
||||
{
|
||||
"datasource": {
|
||||
"type": "grafana-testdata-datasource",
|
||||
"uid": "trlxrdZVk"
|
||||
},
|
||||
"gridPos": {
|
||||
"h": 8,
|
||||
"w": 12,
|
||||
"x": 12,
|
||||
"y": 0
|
||||
},
|
||||
"id": 2,
|
||||
"options": {
|
||||
"seriesCountSize": "sm",
|
||||
"showSeriesCount": false,
|
||||
"text": "Default value of text input option"
|
||||
},
|
||||
"targets": [
|
||||
{
|
||||
"alias": "",
|
||||
"datasource": {
|
||||
"type": "grafana-testdata-datasource",
|
||||
"uid": "db84e60d-b92a-4089-82cb-34842fb1754b"
|
||||
},
|
||||
"refId": "A",
|
||||
"scenarioId": "no_data_points"
|
||||
}
|
||||
],
|
||||
"title": "Sample Panel Title",
|
||||
"type": "andydixon-chargevizbattery-panel"
|
||||
}
|
||||
],
|
||||
"refresh": "",
|
||||
"schemaVersion": 39,
|
||||
"tags": [],
|
||||
"templating": {
|
||||
"list": []
|
||||
},
|
||||
"time": {
|
||||
"from": "now-6h",
|
||||
"to": "now"
|
||||
},
|
||||
"timepicker": {},
|
||||
"timezone": "",
|
||||
"title": "Provisioned ChargeViz Battery Panel dashboard",
|
||||
"uid": "a538aeff-5a8a-42a5-901c-938d896fdd6f",
|
||||
"version": 1,
|
||||
"weekStart": ""
|
||||
}
|
||||
@@ -1,7 +0,0 @@
|
||||
apiVersion: 1
|
||||
|
||||
providers:
|
||||
- name: 'ChargeViz Battery Panel'
|
||||
type: file
|
||||
options:
|
||||
path: /etc/grafana/provisioning/dashboards
|
||||
@@ -1,7 +0,0 @@
|
||||
apiVersion: 1
|
||||
|
||||
datasources:
|
||||
- name: TestData DB
|
||||
type: testdata
|
||||
uid: trlxrdZVk
|
||||
isDefault: true
|
||||
@@ -1,50 +0,0 @@
|
||||
<!-- This README file is going to be the one displayed on the Grafana.com website for your plugin. Uncomment and replace the content here before publishing.
|
||||
|
||||
Remove any remaining comments before publishing as these may be displayed on Grafana.com -->
|
||||
|
||||
# ChargeViz Battery Panel
|
||||
|
||||
<!-- To help maximize the impact of your README and improve usability for users, we propose the following loose structure:
|
||||
|
||||
**BEFORE YOU BEGIN**
|
||||
- Ensure all links are absolute URLs so that they will work when the README is displayed within Grafana and Grafana.com
|
||||
- Be inspired ✨
|
||||
- [grafana-polystat-panel](https://github.com/grafana/grafana-polystat-panel)
|
||||
- [volkovlabs-variable-panel](https://github.com/volkovlabs/volkovlabs-variable-panel)
|
||||
|
||||
**ADD SOME BADGES**
|
||||
|
||||
Badges convey useful information at a glance for users whether in the Catalog or viewing the source code. You can use the generator on [Shields.io](https://shields.io/badges/dynamic-json-badge) together with the Grafana.com API
|
||||
to create dynamic badges that update automatically when you publish a new version to the marketplace.
|
||||
|
||||
- For the URL parameter use `https://grafana.com/api/plugins/your-plugin-id`.
|
||||
- Example queries:
|
||||
- Downloads: `$.downloads`
|
||||
- Catalog Version: `$.version`
|
||||
- Grafana Dependency: `$.grafanaDependency`
|
||||
- Signature Type: `$.versionSignatureType`
|
||||
- Optionally, for the logo parameter use `grafana`.
|
||||
|
||||
Full example: 
|
||||
|
||||
Consider other [badges](https://shields.io/badges) as you feel appropriate for your project.
|
||||
|
||||
## Overview / Introduction
|
||||
Provide one or more paragraphs as an introduction to your plugin to help users understand why they should use it.
|
||||
|
||||
Consider including screenshots:
|
||||
- in [plugin.json](https://grafana.com/developers/plugin-tools/reference/plugin-json#info) include them as relative links.
|
||||
- in the README ensure they are absolute URLs.
|
||||
|
||||
## Requirements
|
||||
List any requirements or dependencies they may need to run the plugin.
|
||||
|
||||
## Getting Started
|
||||
Provide a quick start on how to configure and use the plugin.
|
||||
|
||||
## Documentation
|
||||
If your project has dedicated documentation available for users, provide links here. For help in following Grafana's style recommendations for technical documentation, refer to our [Writer's Toolkit](https://grafana.com/docs/writers-toolkit/).
|
||||
|
||||
## Contributing
|
||||
Do you want folks to contribute to the plugin or provide feedback through specific means? If so, tell them how!
|
||||
-->
|
||||
@@ -1,823 +0,0 @@
|
||||
import React, { useId, useMemo } from 'react';
|
||||
import { PanelProps, Field, DataFrame } from '@grafana/data';
|
||||
import { useTheme2 } from '@grafana/ui';
|
||||
import { css, keyframes } from '@emotion/css';
|
||||
import { ChargeVizOptions } from '../types';
|
||||
|
||||
interface Props extends PanelProps<ChargeVizOptions> {}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Helpers
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
const toFinite = (v: unknown): number | undefined => {
|
||||
const n = Number(v);
|
||||
return Number.isFinite(n) ? n : undefined;
|
||||
};
|
||||
|
||||
function slopePercentPerMinute(times: number[], values: number[]): number {
|
||||
const pts: Array<[number, number]> = [];
|
||||
for (let i = 0; i < times.length; i++) {
|
||||
const t = toFinite(times[i]);
|
||||
const v = toFinite(values[i]);
|
||||
if (t !== undefined && v !== undefined) {
|
||||
pts.push([t, v]);
|
||||
}
|
||||
}
|
||||
if (pts.length < 2) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
const xs = pts.map((p) => (p[0] - pts[0][0]) / 60000);
|
||||
const ys = pts.map((p) => p[1]);
|
||||
const xMean = xs.reduce((a, b) => a + b, 0) / xs.length;
|
||||
const yMean = ys.reduce((a, b) => a + b, 0) / ys.length;
|
||||
|
||||
let num = 0;
|
||||
let den = 0;
|
||||
for (let i = 0; i < xs.length; i++) {
|
||||
num += (xs[i] - xMean) * (ys[i] - yMean);
|
||||
den += (xs[i] - xMean) ** 2;
|
||||
}
|
||||
return den === 0 ? 0 : num / den;
|
||||
}
|
||||
|
||||
/** Infer battery state from the trend of the last ≤ maxPoints values. */
|
||||
function inferStateFromTrend(
|
||||
values: number[],
|
||||
maxPoints = 50,
|
||||
threshold = 0.01,
|
||||
): 'charging' | 'discharging' | 'stable' {
|
||||
const tail = values.length > maxPoints ? values.slice(-maxPoints) : values;
|
||||
if (tail.length < 2) {
|
||||
return 'stable';
|
||||
}
|
||||
|
||||
// Simple least-squares slope over the tail window
|
||||
const n = tail.length;
|
||||
let sumX = 0;
|
||||
let sumY = 0;
|
||||
let sumXY = 0;
|
||||
let sumXX = 0;
|
||||
for (let i = 0; i < n; i++) {
|
||||
sumX += i;
|
||||
sumY += tail[i];
|
||||
sumXY += i * tail[i];
|
||||
sumXX += i * i;
|
||||
}
|
||||
const slope = (n * sumXY - sumX * sumY) / (n * sumXX - sumX * sumX);
|
||||
|
||||
if (slope > threshold) {
|
||||
return 'charging';
|
||||
}
|
||||
if (slope < -threshold) {
|
||||
return 'discharging';
|
||||
}
|
||||
return 'stable';
|
||||
}
|
||||
|
||||
/** Format minutes into a human-readable duration string. */
|
||||
function formatMinutes(mins: number): string {
|
||||
if (!Number.isFinite(mins) || mins < 0) {
|
||||
return '—';
|
||||
}
|
||||
if (mins < 1) {
|
||||
return '< 1 min';
|
||||
}
|
||||
const h = Math.floor(mins / 60);
|
||||
const m = Math.round(mins % 60);
|
||||
if (h === 0) {
|
||||
return `${m} min`;
|
||||
}
|
||||
return m > 0 ? `${h}h ${m}m` : `${h}h`;
|
||||
}
|
||||
|
||||
/**
|
||||
* Resolve a field across all data frames using the "refId:fieldName" key
|
||||
* format produced by the dropdown, or a plain field name for manual entry.
|
||||
* Returns the matching field and its companion time field, or undefined.
|
||||
*/
|
||||
function resolveFieldByKey(
|
||||
series: DataFrame[],
|
||||
key: string | undefined,
|
||||
): { field: Field; timeField: Field } | undefined {
|
||||
if (!key) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
// Try "refId:fieldName" format first
|
||||
const colonIdx = key.indexOf(':');
|
||||
if (colonIdx > 0) {
|
||||
const refId = key.substring(0, colonIdx);
|
||||
const fieldName = key.substring(colonIdx + 1);
|
||||
|
||||
for (const frame of series) {
|
||||
if (frame.refId !== refId && frame.name !== refId) {
|
||||
continue;
|
||||
}
|
||||
const timeField = frame.fields.find((f) => f.type === 'time');
|
||||
const match = frame.fields.find((f) => f.name === fieldName && f.type !== 'time');
|
||||
if (match && timeField) {
|
||||
return { field: match, timeField };
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Fallback: search all frames by field name, display name, frame name, or refId
|
||||
const needle = key.toLowerCase().trim();
|
||||
for (const frame of series) {
|
||||
const timeField = frame.fields.find((f) => f.type === 'time');
|
||||
if (!timeField) {
|
||||
continue;
|
||||
}
|
||||
|
||||
for (const field of frame.fields) {
|
||||
if (field.type === 'time') {
|
||||
continue;
|
||||
}
|
||||
|
||||
const candidates = [
|
||||
field.name,
|
||||
field.config?.displayName,
|
||||
field.config?.displayNameFromDS,
|
||||
frame.name,
|
||||
frame.refId,
|
||||
];
|
||||
|
||||
for (const c of candidates) {
|
||||
if (c && c.toLowerCase().trim() === needle) {
|
||||
return { field, timeField };
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the first numeric field from the first series (default fallback).
|
||||
*/
|
||||
function getFirstNumericField(
|
||||
series: DataFrame[],
|
||||
): { field: Field; timeField: Field } | undefined {
|
||||
for (const frame of series) {
|
||||
const timeField = frame.fields.find((f) => f.type === 'time');
|
||||
const numField = frame.fields.find((f) => f.type === 'number');
|
||||
if (numField && timeField) {
|
||||
return { field: numField, timeField };
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// SVG sub-components
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
interface BatteryGfxProps {
|
||||
fillLevel: number;
|
||||
fillColour: string;
|
||||
gradientFill: boolean;
|
||||
gradientId: string;
|
||||
clipId: string;
|
||||
startColour: string;
|
||||
endColour: string;
|
||||
strokeColour: string;
|
||||
borderWidth: number;
|
||||
showPercentage: boolean;
|
||||
animating: boolean;
|
||||
textColour: string;
|
||||
}
|
||||
|
||||
const pulseKf = keyframes`
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.6; }
|
||||
`;
|
||||
|
||||
function VerticalBattery(props: BatteryGfxProps) {
|
||||
const {
|
||||
fillLevel, fillColour, gradientFill, gradientId, clipId,
|
||||
startColour, endColour, strokeColour, borderWidth, showPercentage,
|
||||
animating, textColour,
|
||||
} = props;
|
||||
|
||||
const bodyX = 5;
|
||||
const bodyY = 14;
|
||||
const bodyW = 100;
|
||||
const bodyH = 220;
|
||||
const r = 8;
|
||||
const fillH = (fillLevel / 100) * bodyH;
|
||||
|
||||
return (
|
||||
<svg viewBox="0 0 110 244" preserveAspectRatio="xMidYMid meet" width="100%" height="100%">
|
||||
<defs>
|
||||
{gradientFill && (
|
||||
<linearGradient id={gradientId} x1="0" y1="1" x2="0" y2="0">
|
||||
<stop offset="0%" stopColor={startColour} />
|
||||
<stop offset="100%" stopColor={endColour} />
|
||||
</linearGradient>
|
||||
)}
|
||||
<clipPath id={clipId}>
|
||||
<rect x={bodyX} y={bodyY} width={bodyW} height={bodyH} rx={r} ry={r} />
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<rect x="38" y="2" width="34" height="12" rx="4" ry="4" fill={strokeColour} />
|
||||
|
||||
<rect
|
||||
x={bodyX} y={bodyY} width={bodyW} height={bodyH}
|
||||
rx={r} ry={r}
|
||||
stroke={strokeColour} strokeWidth={borderWidth} fill="none"
|
||||
/>
|
||||
|
||||
<rect
|
||||
x={bodyX}
|
||||
y={bodyY + bodyH - fillH}
|
||||
width={bodyW}
|
||||
height={fillH}
|
||||
fill={gradientFill ? `url(#${gradientId})` : fillColour}
|
||||
clipPath={`url(#${clipId})`}
|
||||
className={animating ? css`animation: ${pulseKf} 2s ease-in-out infinite;` : undefined}
|
||||
/>
|
||||
|
||||
{showPercentage && (
|
||||
<text
|
||||
x={bodyX + bodyW / 2}
|
||||
y={bodyY + bodyH / 2}
|
||||
textAnchor="middle"
|
||||
dominantBaseline="central"
|
||||
fill={textColour}
|
||||
fontSize="28"
|
||||
fontWeight="bold"
|
||||
style={{ pointerEvents: 'none' }}
|
||||
>
|
||||
{fillLevel.toFixed(0)}%
|
||||
</text>
|
||||
)}
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
function HorizontalBattery(props: BatteryGfxProps) {
|
||||
const {
|
||||
fillLevel, fillColour, gradientFill, gradientId, clipId,
|
||||
startColour, endColour, strokeColour, borderWidth, showPercentage,
|
||||
animating, textColour,
|
||||
} = props;
|
||||
|
||||
const bodyX = 5;
|
||||
const bodyY = 5;
|
||||
const bodyW = 220;
|
||||
const bodyH = 100;
|
||||
const r = 8;
|
||||
const fillW = (fillLevel / 100) * bodyW;
|
||||
|
||||
return (
|
||||
<svg viewBox="0 0 248 110" preserveAspectRatio="xMidYMid meet" width="100%" height="100%">
|
||||
<defs>
|
||||
{gradientFill && (
|
||||
<linearGradient id={gradientId} x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0%" stopColor={startColour} />
|
||||
<stop offset="100%" stopColor={endColour} />
|
||||
</linearGradient>
|
||||
)}
|
||||
<clipPath id={clipId}>
|
||||
<rect x={bodyX} y={bodyY} width={bodyW} height={bodyH} rx={r} ry={r} />
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<rect x={bodyX + bodyW + 2} y="33" width="12" height="34" rx="4" ry="4" fill={strokeColour} />
|
||||
|
||||
<rect
|
||||
x={bodyX} y={bodyY} width={bodyW} height={bodyH}
|
||||
rx={r} ry={r}
|
||||
stroke={strokeColour} strokeWidth={borderWidth} fill="none"
|
||||
/>
|
||||
|
||||
<rect
|
||||
x={bodyX}
|
||||
y={bodyY}
|
||||
width={fillW}
|
||||
height={bodyH}
|
||||
fill={gradientFill ? `url(#${gradientId})` : fillColour}
|
||||
clipPath={`url(#${clipId})`}
|
||||
className={animating ? css`animation: ${pulseKf} 2s ease-in-out infinite;` : undefined}
|
||||
/>
|
||||
|
||||
{showPercentage && (
|
||||
<text
|
||||
x={bodyX + bodyW / 2}
|
||||
y={bodyY + bodyH / 2}
|
||||
textAnchor="middle"
|
||||
dominantBaseline="central"
|
||||
fill={textColour}
|
||||
fontSize="28"
|
||||
fontWeight="bold"
|
||||
style={{ pointerEvents: 'none' }}
|
||||
>
|
||||
{fillLevel.toFixed(0)}%
|
||||
</text>
|
||||
)}
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Load gauge – a semi-circular arc rendered as SVG
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
interface LoadGaugeProps {
|
||||
value: number; // 0–100
|
||||
size: number; // px diameter
|
||||
colour: string;
|
||||
trackColour: string;
|
||||
textColour: string;
|
||||
}
|
||||
|
||||
function LoadGauge({ value, size, colour, trackColour, textColour }: LoadGaugeProps) {
|
||||
const clamped = Math.max(0, Math.min(100, value));
|
||||
const r = 40;
|
||||
const cx = 50;
|
||||
const cy = 50;
|
||||
const startAngle = 135;
|
||||
const totalSweep = 270;
|
||||
const endAngle = startAngle + (clamped / 100) * totalSweep;
|
||||
|
||||
const toRad = (deg: number) => (deg * Math.PI) / 180;
|
||||
const arcPoint = (angle: number) => ({
|
||||
x: cx + r * Math.cos(toRad(angle)),
|
||||
y: cy + r * Math.sin(toRad(angle)),
|
||||
});
|
||||
|
||||
// Track (background arc)
|
||||
const trackEnd = startAngle + totalSweep;
|
||||
const tStart = arcPoint(startAngle);
|
||||
const tEnd = arcPoint(trackEnd);
|
||||
const trackLargeArc = totalSweep > 180 ? 1 : 0;
|
||||
const trackPath = `M ${tStart.x} ${tStart.y} A ${r} ${r} 0 ${trackLargeArc} 1 ${tEnd.x} ${tEnd.y}`;
|
||||
|
||||
// Value arc
|
||||
const vStart = arcPoint(startAngle);
|
||||
const vEnd = arcPoint(endAngle);
|
||||
const sweep = (clamped / 100) * totalSweep;
|
||||
const largeArc = sweep > 180 ? 1 : 0;
|
||||
const valuePath = clamped > 0
|
||||
? `M ${vStart.x} ${vStart.y} A ${r} ${r} 0 ${largeArc} 1 ${vEnd.x} ${vEnd.y}`
|
||||
: '';
|
||||
|
||||
return (
|
||||
<svg viewBox="0 0 100 100" width={size} height={size}>
|
||||
<path d={trackPath} fill="none" stroke={trackColour} strokeWidth="8" strokeLinecap="round" />
|
||||
{valuePath && (
|
||||
<path d={valuePath} fill="none" stroke={colour} strokeWidth="8" strokeLinecap="round" />
|
||||
)}
|
||||
<text
|
||||
x={cx}
|
||||
y={cy - 2}
|
||||
textAnchor="middle"
|
||||
dominantBaseline="central"
|
||||
fill={textColour}
|
||||
fontSize="18"
|
||||
fontWeight="bold"
|
||||
>
|
||||
{clamped.toFixed(0)}%
|
||||
</text>
|
||||
<text
|
||||
x={cx}
|
||||
y={cy + 14}
|
||||
textAnchor="middle"
|
||||
dominantBaseline="central"
|
||||
fill={textColour}
|
||||
fontSize="9"
|
||||
opacity="0.7"
|
||||
>
|
||||
LOAD
|
||||
</text>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Main panel
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
export const ChargeVizPanel: React.FC<Props> = ({ data, width, height, options, id }) => {
|
||||
const theme = useTheme2();
|
||||
const reactId = useId();
|
||||
const gradientId = `battGrad-${id}-${reactId}`;
|
||||
const clipId = `battClip-${id}-${reactId}`;
|
||||
|
||||
// Options with defaults
|
||||
const lowColour = options.lowColour || '#F44336';
|
||||
const midColour = options.midColour || '#FF9800';
|
||||
const highColour = options.highColour || '#4CAF50';
|
||||
const lowThreshold = options.lowThreshold ?? 30;
|
||||
const highThreshold = options.highThreshold ?? 70;
|
||||
const gradientFill = options.gradientFill ?? true;
|
||||
const chargingAnimation = options.chargingAnimation ?? true;
|
||||
const borderWidth = options.borderWidth ?? 3;
|
||||
const dp = Number.isFinite(options.decimalPlaces) ? options.decimalPlaces : 2;
|
||||
const useRegression = options.useRegressionForRate ?? false;
|
||||
const showPercentage = options.showPercentage ?? true;
|
||||
const showRate = options.showRate ?? true;
|
||||
const showLowHigh = options.showLowHigh ?? true;
|
||||
const showStatus = options.showStatus ?? true;
|
||||
const enableLoad = options.enableLoad ?? false;
|
||||
const enableTimeLeft = options.enableTimeLeft ?? false;
|
||||
const enableStateField = options.enableStateField ?? false;
|
||||
const stateChargingValue = (options.stateChargingValue ?? 'charging').toLowerCase();
|
||||
const stateDischargingValue = (options.stateDischargingValue ?? 'discharging').toLowerCase();
|
||||
|
||||
// -----------------------------------------------------------------------
|
||||
// Data extraction
|
||||
// -----------------------------------------------------------------------
|
||||
const extracted = useMemo(() => {
|
||||
let cur = 0;
|
||||
let r = 0;
|
||||
let lo = 0;
|
||||
let hi = 0;
|
||||
let loadValue: number | undefined;
|
||||
let timeLeftValue: number | undefined;
|
||||
let stateFromField: 'charging' | 'discharging' | 'stable' | undefined;
|
||||
let inferredState: 'charging' | 'discharging' | 'stable' = 'stable';
|
||||
|
||||
const allSeries = data.series;
|
||||
|
||||
if (allSeries.length > 0) {
|
||||
// Resolve the charge field: user selection → first numeric field
|
||||
const chargeResolved = resolveFieldByKey(allSeries, options.chargeField)
|
||||
?? getFirstNumericField(allSeries);
|
||||
|
||||
if (chargeResolved) {
|
||||
const rawValues = Array.from(chargeResolved.field.values);
|
||||
const rawTimes = Array.from(chargeResolved.timeField.values);
|
||||
const values: number[] = [];
|
||||
const times: number[] = [];
|
||||
|
||||
for (let i = 0; i < rawValues.length; i++) {
|
||||
const v = toFinite(rawValues[i]);
|
||||
const t = toFinite(rawTimes[i]);
|
||||
if (v !== undefined && t !== undefined) {
|
||||
values.push(v);
|
||||
times.push(t);
|
||||
}
|
||||
}
|
||||
|
||||
if (values.length > 0) {
|
||||
cur = values[values.length - 1];
|
||||
lo = Math.min(...values);
|
||||
hi = Math.max(...values);
|
||||
|
||||
if (values.length >= 2) {
|
||||
if (useRegression) {
|
||||
r = slopePercentPerMinute(times, values);
|
||||
} else {
|
||||
const deltaPercent = values[values.length - 1] - values[0];
|
||||
const deltaMinutes = (times[times.length - 1] - times[0]) / 60000;
|
||||
r = deltaMinutes !== 0 ? deltaPercent / deltaMinutes : 0;
|
||||
}
|
||||
}
|
||||
|
||||
inferredState = inferStateFromTrend(values);
|
||||
}
|
||||
}
|
||||
|
||||
// Load field — search across all series
|
||||
if (enableLoad && options.loadField) {
|
||||
const loadResolved = resolveFieldByKey(allSeries, options.loadField);
|
||||
if (loadResolved) {
|
||||
const arr = Array.from(loadResolved.field.values);
|
||||
const last = toFinite(arr[arr.length - 1]);
|
||||
if (last !== undefined) {
|
||||
loadValue = last;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Time remaining field — search across all series
|
||||
if (enableTimeLeft && options.timeLeftField) {
|
||||
const tlResolved = resolveFieldByKey(allSeries, options.timeLeftField);
|
||||
if (tlResolved) {
|
||||
const arr = Array.from(tlResolved.field.values);
|
||||
const last = toFinite(arr[arr.length - 1]);
|
||||
if (last !== undefined) {
|
||||
timeLeftValue = last;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// State field — search across all series
|
||||
if (enableStateField && options.stateField) {
|
||||
const stateResolved = resolveFieldByKey(allSeries, options.stateField);
|
||||
if (stateResolved) {
|
||||
const arr = Array.from(stateResolved.field.values);
|
||||
const lastRaw = arr[arr.length - 1];
|
||||
if (lastRaw !== undefined && lastRaw !== null) {
|
||||
const v = String(lastRaw).toLowerCase().trim();
|
||||
if (v === stateChargingValue) {
|
||||
stateFromField = 'charging';
|
||||
} else if (v === stateDischargingValue) {
|
||||
stateFromField = 'discharging';
|
||||
} else {
|
||||
stateFromField = 'stable';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return { currentValue: cur, rate: r, low: lo, high: hi, loadValue, timeLeftValue, stateFromField, inferredState };
|
||||
}, [
|
||||
data.series, useRegression, enableLoad, enableTimeLeft, enableStateField,
|
||||
options.chargeField, options.loadField, options.timeLeftField, options.stateField,
|
||||
stateChargingValue, stateDischargingValue,
|
||||
]);
|
||||
|
||||
const { currentValue, rate, low, high, loadValue, timeLeftValue, stateFromField, inferredState } = extracted;
|
||||
|
||||
// -----------------------------------------------------------------------
|
||||
// Derived visual values
|
||||
// -----------------------------------------------------------------------
|
||||
const fillLevel = Math.max(0, Math.min(100, currentValue));
|
||||
|
||||
let fillColour = midColour;
|
||||
if (fillLevel < lowThreshold) {
|
||||
fillColour = lowColour;
|
||||
} else if (fillLevel >= highThreshold) {
|
||||
fillColour = highColour;
|
||||
}
|
||||
|
||||
let startColour = fillColour;
|
||||
let endColour = fillColour;
|
||||
|
||||
// Determine charging state: state field → inferred trend from last ≤50 points → stable
|
||||
const resolvedState = stateFromField ?? inferredState;
|
||||
const isCharging = resolvedState === 'charging';
|
||||
const isDischarging = resolvedState === 'discharging';
|
||||
|
||||
if (gradientFill) {
|
||||
if (isCharging) {
|
||||
endColour = theme.colors.success.text;
|
||||
} else if (isDischarging) {
|
||||
startColour = theme.colors.error.text;
|
||||
}
|
||||
}
|
||||
|
||||
const animating = chargingAnimation && isCharging;
|
||||
|
||||
const showAnyStats = showRate || showLowHigh || showStatus;
|
||||
const hasLoadExtra = enableLoad && loadValue !== undefined;
|
||||
const hasTimeLeftExtra = enableTimeLeft && timeLeftValue !== undefined;
|
||||
const hasExtras = hasLoadExtra || hasTimeLeftExtra;
|
||||
|
||||
// -----------------------------------------------------------------------
|
||||
// Responsive layout
|
||||
// -----------------------------------------------------------------------
|
||||
|
||||
// Auto-revert horizontal to vertical when the panel is too narrow
|
||||
// for horizontal battery + side content to fit comfortably.
|
||||
const preferredOrientation = options.orientation ?? 'vertical';
|
||||
const effectiveOrientation = preferredOrientation === 'horizontal' && width < 300
|
||||
? 'vertical'
|
||||
: preferredOrientation;
|
||||
|
||||
const isCompact = effectiveOrientation === 'vertical' ? width < 140 : height < 100;
|
||||
const isTiny = width < 80 || height < 80;
|
||||
|
||||
const useColumnLayout = effectiveOrientation === 'vertical'
|
||||
? width < 240
|
||||
: height < 200;
|
||||
|
||||
const statAreaSize = useColumnLayout
|
||||
? (effectiveOrientation === 'vertical' ? height * 0.3 : width * 0.3)
|
||||
: (effectiveOrientation === 'vertical' ? width * 0.5 : height * 0.5);
|
||||
const baseFontSize = Math.max(10, Math.min(16, statAreaSize / 8));
|
||||
|
||||
// Gauge size scales with available panel space
|
||||
const gaugeSize = Math.max(48, Math.min(120, Math.min(width, height) * 0.35));
|
||||
|
||||
// No-data state
|
||||
if (data.series.length === 0) {
|
||||
return (
|
||||
<div
|
||||
className={css`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
color: ${theme.colors.text.secondary};
|
||||
font-size: 14px;
|
||||
`}
|
||||
data-testid="charge-viz-panel"
|
||||
>
|
||||
No data
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------
|
||||
// Styles
|
||||
// -----------------------------------------------------------------------
|
||||
const containerStyle = css`
|
||||
display: flex;
|
||||
flex-direction: ${useColumnLayout ? 'column' : 'row'};
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding: 4px;
|
||||
box-sizing: border-box;
|
||||
gap: ${useColumnLayout ? '2px' : '8px'};
|
||||
overflow: hidden;
|
||||
font-family: Inter, Helvetica, Arial, sans-serif;
|
||||
color: ${theme.colors.text.primary};
|
||||
`;
|
||||
|
||||
const batteryWrapStyle = css`
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
${useColumnLayout ? 'width: 100%;' : 'height: 100%;'}
|
||||
overflow: hidden;
|
||||
`;
|
||||
|
||||
const sidePanelStyle = css`
|
||||
flex: 0 0 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: ${useColumnLayout ? 'center' : 'flex-start'};
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
overflow: hidden;
|
||||
max-width: 100%;
|
||||
`;
|
||||
|
||||
const statsStyle = css`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: inherit;
|
||||
gap: 2px;
|
||||
font-size: ${baseFontSize}px;
|
||||
line-height: 1.4;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
`;
|
||||
|
||||
const statusBadgeStyle = css`
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
padding: 2px 10px;
|
||||
border-radius: 12px;
|
||||
font-size: ${baseFontSize * 0.9}px;
|
||||
font-weight: 600;
|
||||
background: ${isCharging
|
||||
? theme.colors.success.transparent
|
||||
: isDischarging
|
||||
? theme.colors.error.transparent
|
||||
: theme.colors.secondary.transparent};
|
||||
color: ${isCharging
|
||||
? theme.colors.success.text
|
||||
: isDischarging
|
||||
? theme.colors.error.text
|
||||
: theme.colors.text.secondary};
|
||||
`;
|
||||
|
||||
const loadCardStyle = css`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 4px;
|
||||
border-radius: 8px;
|
||||
background: ${theme.colors.background.secondary};
|
||||
border: 1px solid ${theme.colors.border.weak};
|
||||
`;
|
||||
|
||||
const textColour = fillLevel > 45 ? '#ffffff' : theme.colors.text.primary;
|
||||
|
||||
const batteryProps: BatteryGfxProps = {
|
||||
fillLevel,
|
||||
fillColour,
|
||||
gradientFill,
|
||||
gradientId,
|
||||
clipId,
|
||||
startColour,
|
||||
endColour,
|
||||
strokeColour: theme.colors.text.secondary,
|
||||
borderWidth,
|
||||
showPercentage: showPercentage && !isTiny,
|
||||
animating,
|
||||
textColour,
|
||||
};
|
||||
|
||||
// Load gauge colour: green if low load, amber if moderate, red if high
|
||||
const loadClamped = loadValue !== undefined ? Math.max(0, Math.min(100, loadValue)) : 0;
|
||||
const loadColour = loadClamped >= 80
|
||||
? theme.colors.error.text
|
||||
: loadClamped >= 50
|
||||
? theme.colors.warning.text
|
||||
: theme.colors.success.text;
|
||||
|
||||
// -----------------------------------------------------------------------
|
||||
// Render
|
||||
// -----------------------------------------------------------------------
|
||||
return (
|
||||
<div className={containerStyle} data-testid="charge-viz-panel">
|
||||
<div className={batteryWrapStyle}>
|
||||
{effectiveOrientation === 'vertical'
|
||||
? <VerticalBattery {...batteryProps} />
|
||||
: <HorizontalBattery {...batteryProps} />
|
||||
}
|
||||
</div>
|
||||
|
||||
{(showAnyStats || hasExtras) && !isTiny && (
|
||||
<div className={sidePanelStyle}>
|
||||
{/* Load gauge card */}
|
||||
{hasLoadExtra && !isCompact && (
|
||||
<div className={loadCardStyle}>
|
||||
<LoadGauge
|
||||
value={loadClamped}
|
||||
size={gaugeSize}
|
||||
colour={loadColour}
|
||||
trackColour={theme.colors.border.weak}
|
||||
textColour={theme.colors.text.primary}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Compact load fallback when gauge doesn't fit */}
|
||||
{hasLoadExtra && isCompact && (
|
||||
<div className={css`
|
||||
font-size: ${baseFontSize}px;
|
||||
white-space: nowrap;
|
||||
`}>
|
||||
<span style={{ opacity: 0.7, marginRight: 4 }}>Load</span>
|
||||
<strong style={{ color: loadColour }}>{loadClamped.toFixed(0)}%</strong>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Time remaining */}
|
||||
{hasTimeLeftExtra && (
|
||||
<div className={css`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 4px 10px;
|
||||
border-radius: 8px;
|
||||
background: ${theme.colors.background.secondary};
|
||||
border: 1px solid ${theme.colors.border.weak};
|
||||
white-space: nowrap;
|
||||
font-size: ${baseFontSize}px;
|
||||
`}>
|
||||
<span style={{ fontSize: baseFontSize * 1.1, lineHeight: 1 }}>⏱</span>
|
||||
<div>
|
||||
<div style={{ opacity: 0.7, fontSize: baseFontSize * 0.8, lineHeight: 1.2 }}>
|
||||
Time remaining
|
||||
</div>
|
||||
<strong style={{ fontSize: baseFontSize * 1.15 }}>
|
||||
{formatMinutes(timeLeftValue!)}
|
||||
</strong>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Status badge */}
|
||||
{showStatus && !isCompact && (
|
||||
<div className={statusBadgeStyle}>
|
||||
{isCharging ? '⚡ Charging' : isDischarging ? '🔋 On Battery' : '— Stable'}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Stats */}
|
||||
{(showRate || showLowHigh) && (
|
||||
<div className={statsStyle}>
|
||||
{showRate && (
|
||||
<div>
|
||||
<span style={{ opacity: 0.7, marginRight: 4 }}>Rate</span>
|
||||
<strong>{rate.toFixed(dp)} %/min</strong>
|
||||
</div>
|
||||
)}
|
||||
{showLowHigh && (
|
||||
<>
|
||||
<div>
|
||||
<span style={{ opacity: 0.7, marginRight: 4 }}>Low</span>
|
||||
<strong>{low.toFixed(dp)}%</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span style={{ opacity: 0.7, marginRight: 4 }}>High</span>
|
||||
<strong>{high.toFixed(dp)}%</strong>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#4CAF50" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="1" y="6" width="18" height="12" rx="2" ry="2"/><line x1="23" y1="10" x2="23" y2="14"/><rect x="3" y="8" width="6" height="8" rx="1" ry="1" fill="#4CAF50" stroke="none"/><rect x="10" y="8" width="6" height="8" rx="1" ry="1" fill="#4CAF50" stroke="none" opacity="0.4"/></svg>
|
||||
|
Before Width: | Height: | Size: 435 B |
-278
@@ -1,278 +0,0 @@
|
||||
import { PanelPlugin, SelectableValue } from '@grafana/data';
|
||||
import { ChargeVizPanel } from './components/ChargeVizPanel';
|
||||
import { ChargeVizOptions } from './types';
|
||||
|
||||
/**
|
||||
* Build a list of selectable field identifiers from the panel's data frames.
|
||||
* Each option label shows "fieldName (refId)" so users can distinguish
|
||||
* fields from different queries.
|
||||
*/
|
||||
function buildFieldOptions(data: Array<{ fields: Array<{ name: string; type: string }>; refId?: string; name?: string }>): Array<SelectableValue<string>> {
|
||||
const opts: Array<SelectableValue<string>> = [
|
||||
{ label: '— Auto (first number field)', value: '' },
|
||||
];
|
||||
const seen = new Set<string>();
|
||||
|
||||
for (const frame of data) {
|
||||
const label = frame.refId || frame.name || '';
|
||||
for (const field of frame.fields) {
|
||||
if (field.type === 'time') {
|
||||
continue;
|
||||
}
|
||||
// Use "refId:fieldName" as a unique key to handle multiple series
|
||||
// with identically-named fields.
|
||||
const key = label ? `${label}:${field.name}` : field.name;
|
||||
if (seen.has(key)) {
|
||||
continue;
|
||||
}
|
||||
seen.add(key);
|
||||
|
||||
const display = label ? `${field.name} (${label})` : field.name;
|
||||
opts.push({ label: display, value: key });
|
||||
}
|
||||
}
|
||||
|
||||
return opts;
|
||||
}
|
||||
|
||||
export const plugin = new PanelPlugin<ChargeVizOptions>(ChargeVizPanel).setPanelOptions(
|
||||
(builder, context) => {
|
||||
const fieldOptions = buildFieldOptions(context.data ?? []);
|
||||
const fieldOptionsNoAuto = fieldOptions.filter((o) => o.value !== '');
|
||||
|
||||
// -- Field Mapping category (top) --
|
||||
builder.addSelect({
|
||||
path: 'chargeField',
|
||||
name: 'Charge field',
|
||||
defaultValue: '',
|
||||
category: ['Field Mapping'],
|
||||
description: 'Numeric field for battery charge (0–100%).',
|
||||
settings: {
|
||||
allowCustomValue: true,
|
||||
isClearable: true,
|
||||
options: fieldOptions,
|
||||
},
|
||||
});
|
||||
|
||||
builder.addBooleanSwitch({
|
||||
path: 'enableLoad',
|
||||
name: 'Enable load metric',
|
||||
defaultValue: false,
|
||||
category: ['Field Mapping'],
|
||||
description: 'Show a second metric representing current load / power draw.',
|
||||
});
|
||||
|
||||
builder.addSelect({
|
||||
path: 'loadField',
|
||||
name: 'Load field',
|
||||
defaultValue: '',
|
||||
category: ['Field Mapping'],
|
||||
description: 'Numeric field for load percentage (0–100%).',
|
||||
settings: {
|
||||
allowCustomValue: true,
|
||||
isClearable: true,
|
||||
options: fieldOptionsNoAuto,
|
||||
},
|
||||
showIf: (opts) => opts.enableLoad === true,
|
||||
});
|
||||
|
||||
builder.addBooleanSwitch({
|
||||
path: 'enableTimeLeft',
|
||||
name: 'Enable time remaining',
|
||||
defaultValue: false,
|
||||
category: ['Field Mapping'],
|
||||
description: 'Show estimated time remaining from a data field (value in minutes).',
|
||||
});
|
||||
|
||||
builder.addSelect({
|
||||
path: 'timeLeftField',
|
||||
name: 'Time remaining field',
|
||||
defaultValue: '',
|
||||
category: ['Field Mapping'],
|
||||
description: 'Numeric field for estimated time remaining (in minutes).',
|
||||
settings: {
|
||||
allowCustomValue: true,
|
||||
isClearable: true,
|
||||
options: fieldOptionsNoAuto,
|
||||
},
|
||||
showIf: (opts) => opts.enableTimeLeft === true,
|
||||
});
|
||||
|
||||
builder.addBooleanSwitch({
|
||||
path: 'enableStateField',
|
||||
name: 'Enable state field',
|
||||
defaultValue: false,
|
||||
category: ['Field Mapping'],
|
||||
description: 'Use a data field to determine charging / discharging state instead of inferring from the trend.',
|
||||
});
|
||||
|
||||
builder.addSelect({
|
||||
path: 'stateField',
|
||||
name: 'State field',
|
||||
defaultValue: '',
|
||||
category: ['Field Mapping'],
|
||||
description: 'Field whose value indicates battery state.',
|
||||
settings: {
|
||||
allowCustomValue: true,
|
||||
isClearable: true,
|
||||
options: fieldOptionsNoAuto,
|
||||
},
|
||||
showIf: (opts) => opts.enableStateField === true,
|
||||
});
|
||||
|
||||
builder.addTextInput({
|
||||
path: 'stateChargingValue',
|
||||
name: 'Charging value',
|
||||
defaultValue: 'charging',
|
||||
category: ['Field Mapping'],
|
||||
description: 'Value in the state field that means "charging" (case-insensitive).',
|
||||
showIf: (opts) => opts.enableStateField === true,
|
||||
});
|
||||
|
||||
builder.addTextInput({
|
||||
path: 'stateDischargingValue',
|
||||
name: 'Discharging value',
|
||||
defaultValue: 'discharging',
|
||||
category: ['Field Mapping'],
|
||||
description: 'Value in the state field that means "discharging" (case-insensitive).',
|
||||
showIf: (opts) => opts.enableStateField === true,
|
||||
});
|
||||
|
||||
// -- Colours category --
|
||||
builder.addColorPicker({
|
||||
path: 'lowColour',
|
||||
name: 'Low battery colour',
|
||||
defaultValue: '#F44336',
|
||||
category: ['Colours'],
|
||||
description: 'Colour when charge is below the low threshold.',
|
||||
});
|
||||
|
||||
builder.addColorPicker({
|
||||
path: 'midColour',
|
||||
name: 'Medium battery colour',
|
||||
defaultValue: '#FF9800',
|
||||
category: ['Colours'],
|
||||
description: 'Colour when charge is between the low and high thresholds.',
|
||||
});
|
||||
|
||||
builder.addColorPicker({
|
||||
path: 'highColour',
|
||||
name: 'High battery colour',
|
||||
defaultValue: '#4CAF50',
|
||||
category: ['Colours'],
|
||||
description: 'Colour when charge is above the high threshold.',
|
||||
});
|
||||
|
||||
// -- Thresholds category --
|
||||
builder.addNumberInput({
|
||||
path: 'lowThreshold',
|
||||
name: 'Low threshold (%)',
|
||||
defaultValue: 30,
|
||||
settings: { min: 0, max: 100, integer: true },
|
||||
category: ['Thresholds'],
|
||||
description: 'Charge level below which the low colour is used.',
|
||||
});
|
||||
|
||||
builder.addNumberInput({
|
||||
path: 'highThreshold',
|
||||
name: 'High threshold (%)',
|
||||
defaultValue: 70,
|
||||
settings: { min: 0, max: 100, integer: true },
|
||||
category: ['Thresholds'],
|
||||
description: 'Charge level above which the high colour is used.',
|
||||
});
|
||||
|
||||
// -- Appearance category --
|
||||
builder.addBooleanSwitch({
|
||||
path: 'gradientFill',
|
||||
name: 'Gradient fill',
|
||||
defaultValue: true,
|
||||
category: ['Appearance'],
|
||||
description: 'Show a gradient that hints at charging/discharging direction.',
|
||||
});
|
||||
|
||||
builder.addSelect({
|
||||
path: 'orientation',
|
||||
name: 'Orientation',
|
||||
defaultValue: 'vertical',
|
||||
category: ['Appearance'],
|
||||
settings: {
|
||||
options: [
|
||||
{ value: 'vertical', label: 'Vertical' },
|
||||
{ value: 'horizontal', label: 'Horizontal' },
|
||||
],
|
||||
},
|
||||
description: 'Preferred orientation. Auto-reverts to vertical if the panel is too narrow for horizontal.',
|
||||
});
|
||||
|
||||
builder.addBooleanSwitch({
|
||||
path: 'chargingAnimation',
|
||||
name: 'Charging animation',
|
||||
defaultValue: true,
|
||||
category: ['Appearance'],
|
||||
description: 'Show a pulse animation when the battery is charging.',
|
||||
});
|
||||
|
||||
builder.addNumberInput({
|
||||
path: 'borderWidth',
|
||||
name: 'Border width',
|
||||
defaultValue: 3,
|
||||
settings: { min: 1, max: 8, integer: true },
|
||||
category: ['Appearance'],
|
||||
description: 'Thickness of the battery outline.',
|
||||
});
|
||||
|
||||
// -- Display category --
|
||||
builder.addBooleanSwitch({
|
||||
path: 'showPercentage',
|
||||
name: 'Show percentage',
|
||||
defaultValue: true,
|
||||
category: ['Display'],
|
||||
description: 'Show the percentage text inside the battery.',
|
||||
});
|
||||
|
||||
builder.addBooleanSwitch({
|
||||
path: 'showRate',
|
||||
name: 'Show charge rate',
|
||||
defaultValue: true,
|
||||
category: ['Display'],
|
||||
description: 'Show the rate of change (%/min).',
|
||||
});
|
||||
|
||||
builder.addBooleanSwitch({
|
||||
path: 'showLowHigh',
|
||||
name: 'Show low / high',
|
||||
defaultValue: true,
|
||||
category: ['Display'],
|
||||
description: 'Show the minimum and maximum values from the series.',
|
||||
});
|
||||
|
||||
builder.addBooleanSwitch({
|
||||
path: 'showStatus',
|
||||
name: 'Show charging status',
|
||||
defaultValue: true,
|
||||
category: ['Display'],
|
||||
description: 'Show Charging / Discharging / Stable indicator.',
|
||||
});
|
||||
|
||||
// -- Data category --
|
||||
builder.addNumberInput({
|
||||
path: 'decimalPlaces',
|
||||
name: 'Decimal places',
|
||||
defaultValue: 2,
|
||||
settings: { min: 0, max: 6, integer: true },
|
||||
category: ['Data'],
|
||||
description: 'Decimal places for rate / low / high values.',
|
||||
});
|
||||
|
||||
builder.addBooleanSwitch({
|
||||
path: 'useRegressionForRate',
|
||||
name: 'Use regression for rate',
|
||||
defaultValue: false,
|
||||
category: ['Data'],
|
||||
description: 'Compute %/min using least-squares regression instead of simple first/last difference.',
|
||||
});
|
||||
|
||||
return builder;
|
||||
}
|
||||
);
|
||||
@@ -1,25 +0,0 @@
|
||||
{
|
||||
"$schema": "https://raw.githubusercontent.com/grafana/grafana/main/docs/sources/developers/plugins/plugin.schema.json",
|
||||
"type": "panel",
|
||||
"name": "UPS Visualisation",
|
||||
"id": "andydixon-chargevizbattery-panel",
|
||||
"info": {
|
||||
"keywords": ["panel"],
|
||||
"description": "",
|
||||
"author": {
|
||||
"name": "Andy dixon"
|
||||
},
|
||||
"logos": {
|
||||
"small": "img/logo.svg",
|
||||
"large": "img/logo.svg"
|
||||
},
|
||||
"links": [],
|
||||
"screenshots": [],
|
||||
"version": "%VERSION%",
|
||||
"updated": "%TODAY%"
|
||||
},
|
||||
"dependencies": {
|
||||
"grafanaDependency": ">=10.4.0",
|
||||
"plugins": []
|
||||
}
|
||||
}
|
||||
@@ -1,39 +0,0 @@
|
||||
export type BatteryOrientation = 'vertical' | 'horizontal';
|
||||
|
||||
export interface ChargeVizOptions {
|
||||
// Field selectors
|
||||
chargeField: string;
|
||||
enableLoad: boolean;
|
||||
loadField: string;
|
||||
enableTimeLeft: boolean;
|
||||
timeLeftField: string;
|
||||
enableStateField: boolean;
|
||||
stateField: string;
|
||||
stateChargingValue: string;
|
||||
stateDischargingValue: string;
|
||||
|
||||
// Colours
|
||||
lowColour: string;
|
||||
midColour: string;
|
||||
highColour: string;
|
||||
|
||||
// Thresholds
|
||||
lowThreshold: number;
|
||||
highThreshold: number;
|
||||
|
||||
// Appearance
|
||||
gradientFill: boolean;
|
||||
orientation: BatteryOrientation;
|
||||
chargingAnimation: boolean;
|
||||
borderWidth: number;
|
||||
|
||||
// Data display
|
||||
decimalPlaces: number;
|
||||
useRegressionForRate: boolean;
|
||||
|
||||
// Visibility toggles
|
||||
showPercentage: boolean;
|
||||
showRate: boolean;
|
||||
showLowHigh: boolean;
|
||||
showStatus: boolean;
|
||||
}
|
||||
@@ -1,21 +0,0 @@
|
||||
import { test, expect } from '@grafana/plugin-e2e';
|
||||
|
||||
test('should display "No data" in case panel data is empty', async ({
|
||||
gotoPanelEditPage,
|
||||
readProvisionedDashboard,
|
||||
}) => {
|
||||
const dashboard = await readProvisionedDashboard({ fileName: 'dashboard.json' });
|
||||
const panelEditPage = await gotoPanelEditPage({ dashboard, id: '2' });
|
||||
await expect(panelEditPage.panel.locator).toContainText('No data');
|
||||
});
|
||||
|
||||
test('should display the battery panel when data is passed', async ({
|
||||
panelEditPage,
|
||||
readProvisionedDataSource,
|
||||
page,
|
||||
}) => {
|
||||
const ds = await readProvisionedDataSource({ fileName: 'datasources.yml' });
|
||||
await panelEditPage.datasource.set(ds.name);
|
||||
await panelEditPage.setVisualization('Battery Panel');
|
||||
await expect(page.getByTestId('charge-viz-panel')).toBeVisible();
|
||||
});
|
||||
@@ -1,3 +0,0 @@
|
||||
{
|
||||
"extends": "./.config/tsconfig.json"
|
||||
}
|
||||
Reference in New Issue
Block a user