build using @grafana/toolkit

.circleci/config.yml

@@ -1,31 +1,115 @@
 version: 2
 jobs:
- build:
+ build_plugin:
  docker:
- # specify the version you desire here
- - image: circleci/node:8
-
- working_directory: ~/repo
-
+ - image: circleci/node:10
+ working_directory: ~/plugin
  steps:
- - checkout
- - restore_cache:
- key: dependency-cache-{{ checksum "yarn.lock" }}
- - run:
- name: yarn install
- command: 'yarn install --pure-lockfile --no-progress'
- - save_cache:
- key: dependency-cache-{{ checksum "yarn.lock" }}
- paths:
- - node_modules
- - run:
- name: test
- command: 'yarn test'
- - run:
- name: build
- command: 'yarn build'
- - run:
- name: zip dist
- command: 'cd dist && zip -r9 ../grafana-plotly-panel-dev.zip *'
- - store_artifacts:
- path: grafana-plotly-panel-dev.zip
+ - checkout
+ - restore_cache:
+ keys:
+ - yarn-packages-{{ checksum "yarn.lock" }}
+ - run:
+ name: Install yarn
+ command: |
+ yarn install --pure-lockfile
+ - run:
+ name: Run Toolkit Build
+ command: npx grafana-toolkit plugin:ci-build
+ - save_cache:
+ paths:
+ - node_modules
+ key: yarn-packages-{{ checksum "yarn.lock" }}
+ - persist_to_workspace:
+ root: .
+ paths:
+ - ci
+ package:
+ docker:
+ - image: circleci/node:10
+ working_directory: ~/plugin
+ steps:
+ - checkout
+ - attach_workspace:
+ at: .
+ - restore_cache:
+ keys:
+ - yarn-packages-{{ checksum "yarn.lock" }}
+ - run:
+ name: Package Distribution
+ command: npx grafana-toolkit plugin:ci-package
+ - persist_to_workspace:
+ root: .
+ paths:
+ - ci/jobs/package
+ - ci/packages
+ - ci/dist
+ - ci/grafana-test-env
+ test_6_5_1:
+ docker:
+ - image: circleci/node:10-browsers
+ working_directory: ~/plugin
+ steps:
+ - checkout
+ - attach_workspace:
+ at: .
+ - restore_cache:
+ keys:
+ - yarn-packages-{{ checksum "yarn.lock" }}
+ - run:
+ name: Setup Grafana (local install)
+ command: |
+ wget https://dl.grafana.com/oss/release/grafana_6.5.1_amd64.deb
+ sudo apt-get install -y adduser libfontconfig1
+ sudo dpkg -i grafana_6.5.1_amd64.deb
+ sudo apt-get install locate
+ sudo updatedb
+ sudo locate grafana
+ sudo cat /etc/grafana/grafana.ini
+ sudo echo ------------------------
+ sudo cp ci/grafana-test-env/custom.ini /usr/share/grafana/conf/custom.ini
+ sudo cp ci/grafana-test-env/custom.ini /etc/grafana/grafana.ini
+ sudo service grafana-server start
+ sudo grafana-cli --version
+ - run:
+ name: Run e2e tests
+ command: |
+ npx grafana-toolkit plugin:ci-test
+ - persist_to_workspace:
+ root: .
+ paths:
+ - ci/jobs/test_6_5_1
+ - store_test_results:
+ path: ci/jobs/test_6_5_1
+ - store_artifacts:
+ path: ci/jobs/test_6_5_1
+ report:
+ docker:
+ - image: circleci/node:10
+ working_directory: ~/plugin
+ steps:
+ - checkout
+ - attach_workspace:
+ at: .
+ - restore_cache:
+ keys:
+ - yarn-packages-{{ checksum "yarn.lock" }}
+ - run:
+ name: Toolkit Report
+ command: npx grafana-toolkit plugin:ci-report
+ - store_artifacts:
+ path: ci
+workflows:
+ version: 2
+ plugin_workflow:
+ jobs:
+ - build_plugin
+ - package:
+ requires:
+ - build_plugin
+ - test_6_5_1:
+ requires:
+ - package
+ - report:
+ requires:
+ - test_6_5_1

.prettierrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+ ...require("./node_modules/@grafana/toolkit/src/config/prettier.plugin.config.json"),
+};

README.md

@@ -37,6 +37,11 @@ env GITHUB_TOKEN=your_token yarn release-it patch
 
 #### Changelog
 
+
+##### v0.0.7
+- build with toolkit
+
+
 ##### v0.0.6
 
 - Fix axis range configuration bug [#49](https://github.com/NatelEnergy/grafana-plotly-panel/issues/49)

mocks/sdk.ts

@@ -0,0 +1,11 @@
+
+export class MetricsPanelCtrl {
+ ctrl = {
+ panel: {
+ version: 1,
+ },
+ updateTimeRange: () => {}
+ }
+};
+
+export default {}

package.json

@@ -3,14 +3,9 @@
  "version": "0.0.7-dev",
  "description": "Plot.ly Panel Plugin for Grafana",
  "scripts": {
- "build": "webpack --config webpack.config.prod.js",
- "dev": "webpack --mode development",
- "watch": "webpack --mode development --watch",
- "test": "jest --config jest.config.js",
- "precommit": "pretty-quick --staged",
- "lint": "tslint -c tslint.json --project tsconfig.json",
- "format": "prettier-eslint --write \"src/**/*.{ts,tsx,json,css,js,jsx}\"",
- "zip": "yarn build && rm -f ../grafana-plotly-panel.zip && zip -r ../grafana-plotly-panel.zip dist"
+ "build": "grafana-toolkit plugin:build",
+ "test": "grafana-toolkit plugin:test",
+ "dev": "grafana-toolkit plugin:dev"
  },
  "author": "ryantxu",
  "license": "MIT",
@@ -25,16 +20,10 @@
  "type": "git",
  "url": "https://github.com/NatelEnergy/grafana-plotly-panel.git"
  },
- "lint-staged": {
- "src/**/*.{ts,tsx,json,css,js,jsx}": [
- "prettier-eslint"
- ]
- },
- "prettier": {
- "trailingComma": "es5",
- "singleQuote": true,
- "bracketSpacing": false,
- "printWidth": 100
+ "jest": {
+ "moduleNameMapper": {
+ "grafana/app/plugins/sdk": "<rootDir>/node_modules/grafana-sdk-mocks/app/plugins/sdk.ts"
+ }
  },
  "dependencies": {
  "jquery": "^3.2.1",
@@ -44,32 +33,8 @@
  "scriptjs": "^2.5.9"
  },
  "devDependencies": {
- "@types/jest": "^24.0.0",
- "@types/lodash": "^4.14.74",
- "@types/plotly.js": "^1.38.0",
- "@types/scriptjs": "^0.0.2",
- "babel-core": "^6.26.3",
- "babel-jest": "^23.0.1",
- "babel-loader": "^7.1.4",
- "babel-preset-env": "^1.7.0",
- "clean-webpack-plugin": "^1.0.1",
- "copy-webpack-plugin": "^4.5.1",
- "css-loader": "^2.1.0",
- "grafana-sdk-mocks": "github:grafana/grafana-sdk-mocks",
- "jest": "^24.1.0",
- "ng-annotate-webpack-plugin": "^0.3.0",
- "prettier": "^1.15.3",
- "prettier-eslint": "^8.8.0",
- "prettier-eslint-cli": "^4.7.0",
- "pretty-quick": "^1.10.0",
- "release-it": "^10",
- "replace-in-file-webpack-plugin": "^1.0.6",
- "style-loader": "^0.23.1",
- "ts-jest": "^23",
- "ts-loader": "^5.3.3",
- "typescript": "^3",
- "uglifyjs-webpack-plugin": "^2.1.1",
- "webpack": "^4.9.1",
- "webpack-cli": "^3.1"
+ "@grafana/toolkit": "next",
+ "@types/grafana": "github:CorpGlory/types-grafana.git",
+ "grafana-sdk-mocks": "github:grafana/grafana-sdk-mocks"
  }
 }

specs/series.jest.ts → src/SeriesWrapper.test.ts

@@ -1,18 +1,20 @@
-///<reference path="../node_modules/@types/jest/index.d.ts" />
-
 import {
  SeriesWrapper,
  SeriesWrapperSeries,
  // SeriesWrapperTable,
-} from '../src/SeriesWrapper';
+} from './SeriesWrapper';
 
 describe('Check Series Helper', () => {
  // $scope, $injector, $window, private $rootScope, public uiSegmentSrv
 
  // Skip those for now because they rely on real template expansion
  describe('check Series Helper', () => {
  const series = {
- datapoints: [[1.23, 100], [2.24, 101], [3.45, 102]],
+ datapoints: [
+ [1.23, 100],
+ [2.24, 101],
+ [3.45, 102],
+ ],
  };
  const helperValue: SeriesWrapper = new SeriesWrapperSeries('AAA', series, 'value');
  const helperTime: SeriesWrapper = new SeriesWrapperSeries('AAA', series, 'time');

src/anno.ts

@@ -1,4 +1,4 @@
-import {Shape, Data} from 'plotly.js';
+import { Shape, Data } from 'plotly.js';
 
 export class AnnoInfo {
  trace: Data;
@@ -66,7 +66,7 @@ export class AnnoInfo {
  });
 
  // Overwrite it with new points
- this.trace = {...this.trace, x, y, text};
+ this.trace = { ...this.trace, x, y, text };
  this.trace.marker!.color = color;
  return x.length > 0;
  }

src/editor.ts

@@ -1,6 +1,6 @@
 import _ from 'lodash';
 
-import {PlotlyPanelCtrl} from './module';
+import { PlotlyPanelCtrl } from './module';
 
 class AxisInfo {
  label: string;