Browse Source

ux improve: the first metric is selected by default

pull/2/head
vargburz 3 years ago
parent
commit
27c2eaba4a
  1. 4
      package.json
  2. 3
      src/components/Panel.tsx
  3. 9
      src/models/series.ts
  4. 2
      src/plugin.json
  5. 59
      yarn.lock

4
package.json

@ -1,6 +1,6 @@
{ {
"name": "grafana-chartwerk-panel", "name": "grafana-chartwerk-panel",
"version": "0.4.1", "version": "0.4.2",
"description": "Chartwerk Panel", "description": "Chartwerk Panel",
"scripts": { "scripts": {
"build": "grafana-toolkit plugin:build", "build": "grafana-toolkit plugin:build",
@ -14,7 +14,7 @@
"author": "CorpGlory Inc.", "author": "CorpGlory Inc.",
"license": "GPL V3", "license": "GPL V3",
"devDependencies": { "devDependencies": {
"@chartwerk/gauge-pod": "0.4.1", "@chartwerk/gauge-pod": "0.6.2",
"@grafana/data": "latest", "@grafana/data": "latest",
"@grafana/toolkit": "latest", "@grafana/toolkit": "latest",
"@grafana/ui": "latest", "@grafana/ui": "latest",

3
src/components/Panel.tsx

@ -16,12 +16,9 @@ import * as _ from 'lodash';
interface Props extends PanelProps<PanelOptions> {} interface Props extends PanelProps<PanelOptions> {}
export function Panel({ options, data, width, height, timeZone, timeRange, onChangeTimeRange }: Props) { export function Panel({ options, data, width, height, timeZone, timeRange, onChangeTimeRange }: Props) {
console.log('options', options);
const grafanaSeriesList = getGrafanaSeriesList(data, timeRange); const grafanaSeriesList = getGrafanaSeriesList(data, timeRange);
const series = new Series(grafanaSeriesList, options.gauge.value).getChartwerkSeries(); const series = new Series(grafanaSeriesList, options.gauge.value).getChartwerkSeries();
console.log('series', series);
const chartwerkOptions = new Options(grafanaSeriesList, options).getChartwerkOptions(); const chartwerkOptions = new Options(grafanaSeriesList, options).getChartwerkOptions();
let chartContainer = useRef(null); let chartContainer = useRef(null);
// we request animation frame here because we need an existing DOM-element at the moment we render the pod // we request animation frame here because we need an existing DOM-element at the moment we render the pod
window.requestAnimationFrame(() => { window.requestAnimationFrame(() => {

9
src/models/series.ts

@ -9,9 +9,14 @@ export class Series {
private _seriesList; private _seriesList;
private _selectedSerieName; private _selectedSerieName;
constructor(grafanaSeriesList: any, private gaugeValueOptions: ValueOptions) { constructor(grafanaSeriesList: any[], private gaugeValueOptions: ValueOptions) {
if (_.isEmpty(grafanaSeriesList)) {
throw new Error(`No metrics has been provided`);
}
if (_.isEmpty(this.gaugeValueOptions?.metricName)) { if (_.isEmpty(this.gaugeValueOptions?.metricName)) {
throw new Error(`Value: metric is not selected. [See options: Value -> Metric]`); const serie = _.first(grafanaSeriesList);
this._seriesList = this._updateSeriesListWithChartwerkParams([serie]);
return;
} }
this._selectedSerieName = this.gaugeValueOptions.metricName; this._selectedSerieName = this.gaugeValueOptions.metricName;

2
src/plugin.json

@ -34,7 +34,7 @@
"updated": "%TODAY%" "updated": "%TODAY%"
}, },
"dependencies": { "dependencies": {
"grafanaDependency": ">=7.0.0", "grafanaDependency": ">=8.0.0",
"plugins": [] "plugins": []
} }
} }

59
yarn.lock

@ -902,16 +902,20 @@
resolved "https://registry.yarnpkg.com/@braintree/sanitize-url/-/sanitize-url-6.0.0.tgz#fe364f025ba74f6de6c837a84ef44bdb1d61e68f" resolved "https://registry.yarnpkg.com/@braintree/sanitize-url/-/sanitize-url-6.0.0.tgz#fe364f025ba74f6de6c837a84ef44bdb1d61e68f"
integrity sha512-mgmE7XBYY/21erpzhexk4Cj1cyTQ9LzvnTxtzM17BJ7ERMNE6W72mQRo0I1Ud8eFJ+RVVIcBNhLFZ3GX4XFz5w== integrity sha512-mgmE7XBYY/21erpzhexk4Cj1cyTQ9LzvnTxtzM17BJ7ERMNE6W72mQRo0I1Ud8eFJ+RVVIcBNhLFZ3GX4XFz5w==
"@chartwerk/core@github:chartwerk/core#a30ca83842247c79969deaaacfc7fb444a60cefb": "@chartwerk/core@latest":
version "0.1.0" version "0.6.9"
resolved "https://codeload.github.com/chartwerk/core/tar.gz/a30ca83842247c79969deaaacfc7fb444a60cefb" resolved "https://registry.yarnpkg.com/@chartwerk/core/-/core-0.6.9.tgz#9d63844b5935de8362f6f3440159d85040116c60"
integrity sha512-9vv1LDAoR64iS2Nxdc2YqCmWNEf3tC2bULk20K8KFA6oVQmA1imdgFJSUv4cvm7Y9VVtPxlL1wDzIjGiLzeVcw==
dependencies:
d3 "^5.7.2"
lodash "^4.14.149"
"@chartwerk/gauge-pod@0.4.1": "@chartwerk/gauge-pod@0.6.2":
version "0.4.1" version "0.6.2"
resolved "https://registry.yarnpkg.com/@chartwerk/gauge-pod/-/gauge-pod-0.4.1.tgz#ac346d777f72ec855e51f5f7c8c01e12a1e1cb5c" resolved "https://registry.yarnpkg.com/@chartwerk/gauge-pod/-/gauge-pod-0.6.2.tgz#7725394cd65acaaaa81cabb93a0b03e146c10362"
integrity sha512-Ik6Dr4AJP/L+7YjZVJ9W19ujXXB5/b5A3Qxboi491hrXYlqMrfAx/LoyfDAtSEmGNhK5qpT8XLluzuHVcgTY4g== integrity sha512-L26hsvHCJruxfIJjXBsgcw2vszKMcMYcsXLGLy9Gy02hETpHR1pTKosgXPEpQqvQBRz+5WX+aL3x6yao/Elg/Q==
dependencies: dependencies:
"@chartwerk/core" "github:chartwerk/core#a30ca83842247c79969deaaacfc7fb444a60cefb" "@chartwerk/core" latest
"@cnakazawa/watch@^1.0.3": "@cnakazawa/watch@^1.0.3":
version "1.0.4" version "1.0.4"
@ -4811,6 +4815,43 @@ d3@5.15.0:
d3-voronoi "1" d3-voronoi "1"
d3-zoom "1" d3-zoom "1"
d3@^5.7.2:
version "5.16.0"
resolved "https://registry.yarnpkg.com/d3/-/d3-5.16.0.tgz#9c5e8d3b56403c79d4ed42fbd62f6113f199c877"
integrity sha512-4PL5hHaHwX4m7Zr1UapXW23apo6pexCgdetdJ5kTmADpG/7T9Gkxw0M0tf/pjoB63ezCCm0u5UaFYy2aMt0Mcw==
dependencies:
d3-array "1"
d3-axis "1"
d3-brush "1"
d3-chord "1"
d3-collection "1"
d3-color "1"
d3-contour "1"
d3-dispatch "1"
d3-drag "1"
d3-dsv "1"
d3-ease "1"
d3-fetch "1"
d3-force "1"
d3-format "1"
d3-geo "1"
d3-hierarchy "1"
d3-interpolate "1"
d3-path "1"
d3-polygon "1"
d3-quadtree "1"
d3-random "1"
d3-scale "2"
d3-scale-chromatic "1"
d3-selection "1"
d3-shape "1"
d3-time "1"
d3-time-format "2"
d3-timer "1"
d3-transition "1"
d3-voronoi "1"
d3-zoom "1"
dashdash@^1.12.0: dashdash@^1.12.0:
version "1.14.1" version "1.14.1"
resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0" resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0"
@ -8030,7 +8071,7 @@ lodash.uniq@^4.5.0:
resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773" resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M= integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=
lodash@4.17.21, lodash@^4.1.1, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.17.21, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.7.0: lodash@4.17.21, lodash@^4.1.1, lodash@^4.14.149, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.17.21, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.7.0:
version "4.17.21" version "4.17.21"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==

Loading…
Cancel
Save