rozetko
2 years ago
commit
e939222efa
36 changed files with 10944 additions and 0 deletions
@ -0,0 +1,15 @@ |
|||||||
|
ARG grafana_version=latest |
||||||
|
|
||||||
|
FROM grafana/grafana:${grafana_version} |
||||||
|
|
||||||
|
# Make it as simple as possible to access the grafana instance for development purposes |
||||||
|
# Do NOT enable these settings in a public facing / production grafana instance |
||||||
|
ENV GF_AUTH_ANONYMOUS_ORG_ROLE "Admin" |
||||||
|
ENV GF_AUTH_ANONYMOUS_ENABLED "true" |
||||||
|
ENV GF_AUTH_BASIC_ENABLED "false" |
||||||
|
# Set development mode so plugins can be loaded without the need to sign |
||||||
|
ENV GF_DEFAULT_APP_MODE "development" |
||||||
|
|
||||||
|
# Inject livereload script into grafana index.html |
||||||
|
USER root |
||||||
|
RUN sed -i 's/<\/body><\/html>/<script src=\"http:\/\/localhost:35729\/livereload.js\"><\/script><\/body><\/html>/g' /usr/share/grafana/public/views/index.html |
@ -0,0 +1,37 @@ |
|||||||
|
// Image declarations
|
||||||
|
declare module '*.gif' { |
||||||
|
const src: string; |
||||||
|
export default src; |
||||||
|
} |
||||||
|
|
||||||
|
declare module '*.jpg' { |
||||||
|
const src: string; |
||||||
|
export default src; |
||||||
|
} |
||||||
|
|
||||||
|
declare module '*.jpeg' { |
||||||
|
const src: string; |
||||||
|
export default src; |
||||||
|
} |
||||||
|
|
||||||
|
declare module '*.png' { |
||||||
|
const src: string; |
||||||
|
export default src; |
||||||
|
} |
||||||
|
|
||||||
|
declare module '*.webp' { |
||||||
|
const src: string; |
||||||
|
export default src; |
||||||
|
} |
||||||
|
|
||||||
|
declare module '*.svg' { |
||||||
|
const content: string; |
||||||
|
export default content; |
||||||
|
} |
||||||
|
|
||||||
|
// Font declarations
|
||||||
|
declare module '*.woff'; |
||||||
|
declare module '*.woff2'; |
||||||
|
declare module '*.eot'; |
||||||
|
declare module '*.ttf'; |
||||||
|
declare module '*.otf'; |
@ -0,0 +1,2 @@ |
|||||||
|
export const SOURCE_DIR = 'src'; |
||||||
|
export const DIST_DIR = 'dist'; |
@ -0,0 +1,9 @@ |
|||||||
|
{ |
||||||
|
"compilerOptions": { |
||||||
|
"module": "commonjs", |
||||||
|
"target": "es5", |
||||||
|
"esModuleInterop": true |
||||||
|
}, |
||||||
|
"transpileOnly": true, |
||||||
|
"transpiler": "ts-node/transpilers/swc-experimental" |
||||||
|
} |
@ -0,0 +1,42 @@ |
|||||||
|
import fs from 'fs'; |
||||||
|
import path from 'path'; |
||||||
|
import util from 'util'; |
||||||
|
import glob from 'glob'; |
||||||
|
import { SOURCE_DIR } from './constants'; |
||||||
|
|
||||||
|
const globAsync = util.promisify(glob); |
||||||
|
|
||||||
|
export function getPackageJson() { |
||||||
|
return require(path.resolve(process.cwd(), 'package.json')); |
||||||
|
} |
||||||
|
|
||||||
|
export function getPluginId() { |
||||||
|
const { id } = require(path.resolve(process.cwd(), `${SOURCE_DIR}/plugin.json`)); |
||||||
|
|
||||||
|
return id; |
||||||
|
} |
||||||
|
|
||||||
|
export function hasReadme() { |
||||||
|
return fs.existsSync(path.resolve(process.cwd(), SOURCE_DIR, 'README.md')); |
||||||
|
} |
||||||
|
|
||||||
|
export async function getEntries(): Promise<Record<string, string>> { |
||||||
|
const parent = '..'; |
||||||
|
const pluginsJson = await globAsync('**/src/**/plugin.json'); |
||||||
|
|
||||||
|
const plugins = await Promise.all(pluginsJson.map(pluginJson => { |
||||||
|
const folder = path.dirname(pluginJson); |
||||||
|
return globAsync(`${folder}/module.{ts,tsx,js}`); |
||||||
|
})); |
||||||
|
|
||||||
|
return plugins.reduce((result, modules) => { |
||||||
|
return modules.reduce((result, module) => { |
||||||
|
const pluginPath = path.resolve(path.dirname(module), parent); |
||||||
|
const pluginName = path.basename(pluginPath); |
||||||
|
const entryName = plugins.length > 1 ? `${pluginName}/module` : 'module'; |
||||||
|
|
||||||
|
result[entryName] = path.join(parent, module); |
||||||
|
return result; |
||||||
|
}, result); |
||||||
|
}, {}); |
||||||
|
} |
@ -0,0 +1,4 @@ |
|||||||
|
module.exports = { |
||||||
|
// Prettier configuration provided by Grafana scaffolding
|
||||||
|
...require("./.config/.prettierrc.js") |
||||||
|
}; |
@ -0,0 +1,201 @@ |
|||||||
|
Apache License |
||||||
|
Version 2.0, January 2004 |
||||||
|
http://www.apache.org/licenses/ |
||||||
|
|
||||||
|
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION |
||||||
|
|
||||||
|
1. Definitions. |
||||||
|
|
||||||
|
"License" shall mean the terms and conditions for use, reproduction, |
||||||
|
and distribution as defined by Sections 1 through 9 of this document. |
||||||
|
|
||||||
|
"Licensor" shall mean the copyright owner or entity authorized by |
||||||
|
the copyright owner that is granting the License. |
||||||
|
|
||||||
|
"Legal Entity" shall mean the union of the acting entity and all |
||||||
|
other entities that control, are controlled by, or are under common |
||||||
|
control with that entity. For the purposes of this definition, |
||||||
|
"control" means (i) the power, direct or indirect, to cause the |
||||||
|
direction or management of such entity, whether by contract or |
||||||
|
otherwise, or (ii) ownership of fifty percent (50%) or more of the |
||||||
|
outstanding shares, or (iii) beneficial ownership of such entity. |
||||||
|
|
||||||
|
"You" (or "Your") shall mean an individual or Legal Entity |
||||||
|
exercising permissions granted by this License. |
||||||
|
|
||||||
|
"Source" form shall mean the preferred form for making modifications, |
||||||
|
including but not limited to software source code, documentation |
||||||
|
source, and configuration files. |
||||||
|
|
||||||
|
"Object" form shall mean any form resulting from mechanical |
||||||
|
transformation or translation of a Source form, including but |
||||||
|
not limited to compiled object code, generated documentation, |
||||||
|
and conversions to other media types. |
||||||
|
|
||||||
|
"Work" shall mean the work of authorship, whether in Source or |
||||||
|
Object form, made available under the License, as indicated by a |
||||||
|
copyright notice that is included in or attached to the work |
||||||
|
(an example is provided in the Appendix below). |
||||||
|
|
||||||
|
"Derivative Works" shall mean any work, whether in Source or Object |
||||||
|
form, that is based on (or derived from) the Work and for which the |
||||||
|
editorial revisions, annotations, elaborations, or other modifications |
||||||
|
represent, as a whole, an original work of authorship. For the purposes |
||||||
|
of this License, Derivative Works shall not include works that remain |
||||||
|
separable from, or merely link (or bind by name) to the interfaces of, |
||||||
|
the Work and Derivative Works thereof. |
||||||
|
|
||||||
|
"Contribution" shall mean any work of authorship, including |
||||||
|
the original version of the Work and any modifications or additions |
||||||
|
to that Work or Derivative Works thereof, that is intentionally |
||||||
|
submitted to Licensor for inclusion in the Work by the copyright owner |
||||||
|
or by an individual or Legal Entity authorized to submit on behalf of |
||||||
|
the copyright owner. For the purposes of this definition, "submitted" |
||||||
|
means any form of electronic, verbal, or written communication sent |
||||||
|
to the Licensor or its representatives, including but not limited to |
||||||
|
communication on electronic mailing lists, source code control systems, |
||||||
|
and issue tracking systems that are managed by, or on behalf of, the |
||||||
|
Licensor for the purpose of discussing and improving the Work, but |
||||||
|
excluding communication that is conspicuously marked or otherwise |
||||||
|
designated in writing by the copyright owner as "Not a Contribution." |
||||||
|
|
||||||
|
"Contributor" shall mean Licensor and any individual or Legal Entity |
||||||
|
on behalf of whom a Contribution has been received by Licensor and |
||||||
|
subsequently incorporated within the Work. |
||||||
|
|
||||||
|
2. Grant of Copyright License. Subject to the terms and conditions of |
||||||
|
this License, each Contributor hereby grants to You a perpetual, |
||||||
|
worldwide, non-exclusive, no-charge, royalty-free, irrevocable |
||||||
|
copyright license to reproduce, prepare Derivative Works of, |
||||||
|
publicly display, publicly perform, sublicense, and distribute the |
||||||
|
Work and such Derivative Works in Source or Object form. |
||||||
|
|
||||||
|
3. Grant of Patent License. Subject to the terms and conditions of |
||||||
|
this License, each Contributor hereby grants to You a perpetual, |
||||||
|
worldwide, non-exclusive, no-charge, royalty-free, irrevocable |
||||||
|
(except as stated in this section) patent license to make, have made, |
||||||
|
use, offer to sell, sell, import, and otherwise transfer the Work, |
||||||
|
where such license applies only to those patent claims licensable |
||||||
|
by such Contributor that are necessarily infringed by their |
||||||
|
Contribution(s) alone or by combination of their Contribution(s) |
||||||
|
with the Work to which such Contribution(s) was submitted. If You |
||||||
|
institute patent litigation against any entity (including a |
||||||
|
cross-claim or counterclaim in a lawsuit) alleging that the Work |
||||||
|
or a Contribution incorporated within the Work constitutes direct |
||||||
|
or contributory patent infringement, then any patent licenses |
||||||
|
granted to You under this License for that Work shall terminate |
||||||
|
as of the date such litigation is filed. |
||||||
|
|
||||||
|
4. Redistribution. You may reproduce and distribute copies of the |
||||||
|
Work or Derivative Works thereof in any medium, with or without |
||||||
|
modifications, and in Source or Object form, provided that You |
||||||
|
meet the following conditions: |
||||||
|
|
||||||
|
(a) You must give any other recipients of the Work or |
||||||
|
Derivative Works a copy of this License; and |
||||||
|
|
||||||
|
(b) You must cause any modified files to carry prominent notices |
||||||
|
stating that You changed the files; and |
||||||
|
|
||||||
|
(c) You must retain, in the Source form of any Derivative Works |
||||||
|
that You distribute, all copyright, patent, trademark, and |
||||||
|
attribution notices from the Source form of the Work, |
||||||
|
excluding those notices that do not pertain to any part of |
||||||
|
the Derivative Works; and |
||||||
|
|
||||||
|
(d) If the Work includes a "NOTICE" text file as part of its |
||||||
|
distribution, then any Derivative Works that You distribute must |
||||||
|
include a readable copy of the attribution notices contained |
||||||
|
within such NOTICE file, excluding those notices that do not |
||||||
|
pertain to any part of the Derivative Works, in at least one |
||||||
|
of the following places: within a NOTICE text file distributed |
||||||
|
as part of the Derivative Works; within the Source form or |
||||||
|
documentation, if provided along with the Derivative Works; or, |
||||||
|
within a display generated by the Derivative Works, if and |
||||||
|
wherever such third-party notices normally appear. The contents |
||||||
|
of the NOTICE file are for informational purposes only and |
||||||
|
do not modify the License. You may add Your own attribution |
||||||
|
notices within Derivative Works that You distribute, alongside |
||||||
|
or as an addendum to the NOTICE text from the Work, provided |
||||||
|
that such additional attribution notices cannot be construed |
||||||
|
as modifying the License. |
||||||
|
|
||||||
|
You may add Your own copyright statement to Your modifications and |
||||||
|
may provide additional or different license terms and conditions |
||||||
|
for use, reproduction, or distribution of Your modifications, or |
||||||
|
for any such Derivative Works as a whole, provided Your use, |
||||||
|
reproduction, and distribution of the Work otherwise complies with |
||||||
|
the conditions stated in this License. |
||||||
|
|
||||||
|
5. Submission of Contributions. Unless You explicitly state otherwise, |
||||||
|
any Contribution intentionally submitted for inclusion in the Work |
||||||
|
by You to the Licensor shall be under the terms and conditions of |
||||||
|
this License, without any additional terms or conditions. |
||||||
|
Notwithstanding the above, nothing herein shall supersede or modify |
||||||
|
the terms of any separate license agreement you may have executed |
||||||
|
with Licensor regarding such Contributions. |
||||||
|
|
||||||
|
6. Trademarks. This License does not grant permission to use the trade |
||||||
|
names, trademarks, service marks, or product names of the Licensor, |
||||||
|
except as required for reasonable and customary use in describing the |
||||||
|
origin of the Work and reproducing the content of the NOTICE file. |
||||||
|
|
||||||
|
7. Disclaimer of Warranty. Unless required by applicable law or |
||||||
|
agreed to in writing, Licensor provides the Work (and each |
||||||
|
Contributor provides its Contributions) on an "AS IS" BASIS, |
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or |
||||||
|
implied, including, without limitation, any warranties or conditions |
||||||
|
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A |
||||||
|
PARTICULAR PURPOSE. You are solely responsible for determining the |
||||||
|
appropriateness of using or redistributing the Work and assume any |
||||||
|
risks associated with Your exercise of permissions under this License. |
||||||
|
|
||||||
|
8. Limitation of Liability. In no event and under no legal theory, |
||||||
|
whether in tort (including negligence), contract, or otherwise, |
||||||
|
unless required by applicable law (such as deliberate and grossly |
||||||
|
negligent acts) or agreed to in writing, shall any Contributor be |
||||||
|
liable to You for damages, including any direct, indirect, special, |
||||||
|
incidental, or consequential damages of any character arising as a |
||||||
|
result of this License or out of the use or inability to use the |
||||||
|
Work (including but not limited to damages for loss of goodwill, |
||||||
|
work stoppage, computer failure or malfunction, or any and all |
||||||
|
other commercial damages or losses), even if such Contributor |
||||||
|
has been advised of the possibility of such damages. |
||||||
|
|
||||||
|
9. Accepting Warranty or Additional Liability. While redistributing |
||||||
|
the Work or Derivative Works thereof, You may choose to offer, |
||||||
|
and charge a fee for, acceptance of support, warranty, indemnity, |
||||||
|
or other liability obligations and/or rights consistent with this |
||||||
|
License. However, in accepting such obligations, You may act only |
||||||
|
on Your own behalf and on Your sole responsibility, not on behalf |
||||||
|
of any other Contributor, and only if You agree to indemnify, |
||||||
|
defend, and hold each Contributor harmless for any liability |
||||||
|
incurred by, or claims asserted against, such Contributor by reason |
||||||
|
of your accepting any such warranty or additional liability. |
||||||
|
|
||||||
|
END OF TERMS AND CONDITIONS |
||||||
|
|
||||||
|
APPENDIX: How to apply the Apache License to your work. |
||||||
|
|
||||||
|
To apply the Apache License to your work, attach the following |
||||||
|
boilerplate notice, with the fields enclosed by brackets "{}" |
||||||
|
replaced with your own identifying information. (Don't include |
||||||
|
the brackets!) The text should be enclosed in the appropriate |
||||||
|
comment syntax for the file format. We also recommend that a |
||||||
|
file or class name and description of purpose be included on the |
||||||
|
same "printed page" as the copyright notice for easier |
||||||
|
identification within third-party archives. |
||||||
|
|
||||||
|
Copyright {yyyy} {name of copyright owner} |
||||||
|
|
||||||
|
Licensed under the Apache License, Version 2.0 (the "License"); |
||||||
|
you may not use this file except in compliance with the License. |
||||||
|
You may obtain a copy of the License at |
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0 |
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing, software |
||||||
|
distributed under the License is distributed on an "AS IS" BASIS, |
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||||
|
See the License for the specific language governing permissions and |
||||||
|
limitations under the License. |
@ -0,0 +1,79 @@ |
|||||||
|
# Grafana app plugin template |
||||||
|
|
||||||
|
This template is a starting point for building an app plugin for Grafana. |
||||||
|
|
||||||
|
## What are Grafana app plugins? |
||||||
|
|
||||||
|
App plugins can let you create a custom out-of-the-box monitoring experience by custom pages, nested datasources and panel plugins. |
||||||
|
|
||||||
|
## Getting started |
||||||
|
|
||||||
|
### Frontend |
||||||
|
|
||||||
|
1. Install dependencies |
||||||
|
|
||||||
|
```bash |
||||||
|
yarn install |
||||||
|
``` |
||||||
|
|
||||||
|
2. Build plugin in development mode or run in watch mode |
||||||
|
|
||||||
|
```bash |
||||||
|
yarn dev |
||||||
|
|
||||||
|
# or |
||||||
|
|
||||||
|
yarn watch |
||||||
|
``` |
||||||
|
|
||||||
|
3. Build plugin in production mode |
||||||
|
|
||||||
|
```bash |
||||||
|
yarn build |
||||||
|
``` |
||||||
|
|
||||||
|
4. Run the tests (using Jest) |
||||||
|
|
||||||
|
```bash |
||||||
|
# Runs the tests and watches for changes |
||||||
|
yarn test |
||||||
|
|
||||||
|
# Exists after running all the tests |
||||||
|
yarn lint:ci |
||||||
|
``` |
||||||
|
|
||||||
|
5. Spin up a Grafana instance and run the plugin inside it (using Docker) |
||||||
|
|
||||||
|
```bash |
||||||
|
yarn server |
||||||
|
``` |
||||||
|
|
||||||
|
6. Run the E2E tests (using Cypress) |
||||||
|
|
||||||
|
```bash |
||||||
|
# Spin up a Grafana instance first that we tests against |
||||||
|
yarn server |
||||||
|
|
||||||
|
# Start the tests |
||||||
|
yarn e2e |
||||||
|
``` |
||||||
|
|
||||||
|
7. Run the linter |
||||||
|
|
||||||
|
```bash |
||||||
|
yarn lint |
||||||
|
|
||||||
|
# or |
||||||
|
|
||||||
|
yarn lint:fix |
||||||
|
``` |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## Learn more |
||||||
|
|
||||||
|
Below you can find source code for existing app plugins and other related documentation. |
||||||
|
|
||||||
|
- [Basic app plugin example](https://github.com/grafana/grafana-plugin-examples/tree/master/examples/app-basic#readme) |
||||||
|
- [Plugin.json documentation](https://grafana.com/docs/grafana/latest/developers/plugins/metadata/) |
||||||
|
- [How to sign a plugin?](https://grafana.com/docs/grafana/latest/developers/plugins/sign-a-plugin/) |
@ -0,0 +1,10 @@ |
|||||||
|
import { e2e } from '@grafana/e2e'; |
||||||
|
|
||||||
|
e2e.scenario({ |
||||||
|
describeName: 'Smoke test', |
||||||
|
itName: 'Smoke test', |
||||||
|
scenario: () => { |
||||||
|
e2e.pages.Home.visit(); |
||||||
|
e2e().contains('Welcome to Grafana').should('be.visible'); |
||||||
|
}, |
||||||
|
}); |
@ -0,0 +1,14 @@ |
|||||||
|
version: '3.0' |
||||||
|
|
||||||
|
services: |
||||||
|
grafana: |
||||||
|
container_name: 'data-exporter' |
||||||
|
build: |
||||||
|
context: ./.config |
||||||
|
args: |
||||||
|
grafana_version: ${GRAFANA_VERSION:-9.1.2} |
||||||
|
ports: |
||||||
|
- 3000:3000/tcp |
||||||
|
volumes: |
||||||
|
- ./dist:/var/lib/grafana/plugins/data-exporter, |
||||||
|
- ./provisioning:/etc/grafana/provisioning |
@ -0,0 +1,2 @@ |
|||||||
|
// Jest setup provided by Grafana scaffolding
|
||||||
|
import './.config/jest-setup'; |
@ -0,0 +1,4 @@ |
|||||||
|
module.exports = { |
||||||
|
// Jest configuration provided by Grafana scaffolding
|
||||||
|
...require('./.config/jest.config'), |
||||||
|
}; |
@ -0,0 +1,68 @@ |
|||||||
|
{ |
||||||
|
"name": "corpglory-dataexporter-app", |
||||||
|
"version": "1.0.0", |
||||||
|
"description": "", |
||||||
|
"scripts": { |
||||||
|
"build": "TS_NODE_PROJECT=\"./.config/webpack/tsconfig.webpack.json\" webpack -c ./.config/webpack/webpack.config.ts --env production", |
||||||
|
"dev": "TS_NODE_PROJECT=\"./.config/webpack/tsconfig.webpack.json\" webpack -w -c ./.config/webpack/webpack.config.ts --env development", |
||||||
|
"test": "jest --watch --onlyChanged", |
||||||
|
"test:ci": "jest --maxWorkers 4", |
||||||
|
"typecheck": "tsc --noEmit", |
||||||
|
"lint": "eslint --cache --ignore-path ./.gitignore --ext .js,.jsx,.ts,.tsx .", |
||||||
|
"lint:fix": "yarn lint --fix", |
||||||
|
"e2e": "yarn cypress install && yarn grafana-e2e run", |
||||||
|
"e2e:update": "yarn cypress install && yarn grafana-e2e run --update-screenshots", |
||||||
|
"server": "docker-compose up --build" |
||||||
|
}, |
||||||
|
"author": "CorpGlory Inc.", |
||||||
|
"license": "Apache-2.0", |
||||||
|
"devDependencies": { |
||||||
|
"@babel/core": "^7.16.7", |
||||||
|
"@grafana/e2e": "9.1.2", |
||||||
|
"@grafana/e2e-selectors": "9.1.2", |
||||||
|
"@grafana/eslint-config": "^2.5.0", |
||||||
|
"@grafana/tsconfig": "^1.2.0-rc1", |
||||||
|
"@swc/core": "^1.2.144", |
||||||
|
"@swc/helpers": "^0.3.6", |
||||||
|
"@swc/jest": "^0.2.20", |
||||||
|
"@testing-library/jest-dom": "^5.16.2", |
||||||
|
"@testing-library/react": "^12.1.3", |
||||||
|
"@types/glob": "^8.0.0", |
||||||
|
"@types/jest": "^27.4.1", |
||||||
|
"@types/react-router-dom": "^5.3.3", |
||||||
|
"@types/node": "^17.0.19", |
||||||
|
"@typescript-eslint/eslint-plugin": "^4.33.0", |
||||||
|
"@typescript-eslint/parser": "^4.33.0", |
||||||
|
"copy-webpack-plugin": "^10.0.0", |
||||||
|
"eslint": "^7.32.0", |
||||||
|
"eslint-config-prettier": "^8.3.0", |
||||||
|
"eslint-plugin-jsdoc": "^36.1.0", |
||||||
|
"eslint-plugin-prettier": "^4.0.0", |
||||||
|
"eslint-plugin-react": "^7.26.1", |
||||||
|
"eslint-plugin-react-hooks": "^4.2.0", |
||||||
|
"eslint-webpack-plugin": "^3.1.1", |
||||||
|
"glob": "^8.0.3", |
||||||
|
"jest": "27.5.0", |
||||||
|
"fork-ts-checker-webpack-plugin": "^7.2.0", |
||||||
|
"prettier": "^2.5.0", |
||||||
|
"replace-in-file-webpack-plugin": "^1.0.6", |
||||||
|
"swc-loader": "^0.1.15", |
||||||
|
"tsconfig-paths": "^3.12.0", |
||||||
|
"ts-node": "^10.5.0", |
||||||
|
"typescript": "^4.4.0", |
||||||
|
"webpack": "^5.69.1", |
||||||
|
"webpack-cli": "^4.9.2", |
||||||
|
"webpack-livereload-plugin": "^3.0.2" |
||||||
|
}, |
||||||
|
"engines": { |
||||||
|
"node": ">=14" |
||||||
|
}, |
||||||
|
"dependencies": { |
||||||
|
"@emotion/css": "^11.1.3", |
||||||
|
"@grafana/data": "9.1.2", |
||||||
|
"@grafana/runtime": "9.1.2", |
||||||
|
"@grafana/ui": "9.1.2", |
||||||
|
"@types/lodash": "latest", |
||||||
|
"react-router-dom": "^5.2.0" |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,5 @@ |
|||||||
|
<!-- This README file is going to be the one displayed on the Grafana.com website for your plugin --> |
||||||
|
|
||||||
|
# Data Exporter |
||||||
|
|
||||||
|
|
@ -0,0 +1,32 @@ |
|||||||
|
import React from 'react'; |
||||||
|
import { AppRootProps, PluginType } from '@grafana/data'; |
||||||
|
import { render, screen } from '@testing-library/react'; |
||||||
|
import { App } from './App'; |
||||||
|
|
||||||
|
describe('Components/App', () => { |
||||||
|
let props: AppRootProps; |
||||||
|
|
||||||
|
beforeEach(() => { |
||||||
|
jest.resetAllMocks(); |
||||||
|
|
||||||
|
props = { |
||||||
|
basename: 'a/sample-app', |
||||||
|
meta: { |
||||||
|
id: 'sample-app', |
||||||
|
name: 'Sample App', |
||||||
|
type: PluginType.app, |
||||||
|
enabled: true, |
||||||
|
jsonData: {}, |
||||||
|
}, |
||||||
|
query: {}, |
||||||
|
path: '', |
||||||
|
onNavChanged: jest.fn(), |
||||||
|
} as unknown as AppRootProps; |
||||||
|
}); |
||||||
|
|
||||||
|
test('renders without an error"', () => { |
||||||
|
render(<App {...props} />); |
||||||
|
|
||||||
|
expect(screen.queryByText(/Hello Grafana!/i)).toBeInTheDocument(); |
||||||
|
}); |
||||||
|
}); |
@ -0,0 +1,8 @@ |
|||||||
|
import * as React from 'react'; |
||||||
|
import { AppRootProps } from '@grafana/data'; |
||||||
|
|
||||||
|
export class App extends React.PureComponent<AppRootProps> { |
||||||
|
render() { |
||||||
|
return <div className="page-container">Hello Grafana!</div>; |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,51 @@ |
|||||||
|
import React from 'react'; |
||||||
|
import { render, screen } from '@testing-library/react'; |
||||||
|
import { PluginType } from '@grafana/data'; |
||||||
|
import { AppConfig, AppConfigProps } from './AppConfig'; |
||||||
|
|
||||||
|
describe('Components/AppConfig', () => { |
||||||
|
let props: AppConfigProps; |
||||||
|
|
||||||
|
beforeEach(() => { |
||||||
|
jest.resetAllMocks(); |
||||||
|
|
||||||
|
props = { |
||||||
|
plugin: { |
||||||
|
meta: { |
||||||
|
id: 'sample-app', |
||||||
|
name: 'Sample App', |
||||||
|
type: PluginType.app, |
||||||
|
enabled: true, |
||||||
|
jsonData: {}, |
||||||
|
}, |
||||||
|
}, |
||||||
|
query: {}, |
||||||
|
} as unknown as AppConfigProps; |
||||||
|
}); |
||||||
|
|
||||||
|
test('renders without an error"', () => { |
||||||
|
render(<AppConfig plugin={props.plugin} query={props.query} />); |
||||||
|
|
||||||
|
expect(screen.queryByText(/Enable \/ Disable/i)).toBeInTheDocument(); |
||||||
|
}); |
||||||
|
|
||||||
|
test('renders an "Enable" button if the plugin is disabled', () => { |
||||||
|
const plugin = { meta: { ...props.plugin.meta, enabled: false } }; |
||||||
|
|
||||||
|
// @ts-ignore - We don't need to provide `addConfigPage()` and `setChannelSupport()` for these tests
|
||||||
|
render(<AppConfig plugin={plugin} query={props.query} />); |
||||||
|
|
||||||
|
expect(screen.queryByText(/The plugin is currently not enabled./i)).toBeInTheDocument(); |
||||||
|
expect(screen.queryByText(/The plugin is currently enabled./i)).not.toBeInTheDocument(); |
||||||
|
}); |
||||||
|
|
||||||
|
test('renders a "Disable" button if the plugin is enabled', () => { |
||||||
|
const plugin = { meta: { ...props.plugin.meta, enabled: true } }; |
||||||
|
|
||||||
|
// @ts-ignore - We don't need to provide `addConfigPage()` and `setChannelSupport()` for these tests
|
||||||
|
render(<AppConfig plugin={plugin} query={props.query} />); |
||||||
|
|
||||||
|
expect(screen.queryByText(/The plugin is currently enabled./i)).toBeInTheDocument(); |
||||||
|
expect(screen.queryByText(/The plugin is currently not enabled./i)).not.toBeInTheDocument(); |
||||||
|
}); |
||||||
|
}); |
@ -0,0 +1,92 @@ |
|||||||
|
import React from 'react'; |
||||||
|
import { Button, Legend, useStyles2 } from '@grafana/ui'; |
||||||
|
import { PluginConfigPageProps, AppPluginMeta, PluginMeta, GrafanaTheme2 } from '@grafana/data'; |
||||||
|
import { getBackendSrv } from '@grafana/runtime'; |
||||||
|
import { css } from '@emotion/css'; |
||||||
|
import { lastValueFrom } from 'rxjs'; |
||||||
|
|
||||||
|
export type AppPluginSettings = {}; |
||||||
|
|
||||||
|
export interface AppConfigProps extends PluginConfigPageProps<AppPluginMeta<AppPluginSettings>> {} |
||||||
|
|
||||||
|
export const AppConfig = ({ plugin }: AppConfigProps) => { |
||||||
|
const s = useStyles2(getStyles); |
||||||
|
const { enabled, jsonData } = plugin.meta; |
||||||
|
|
||||||
|
return ( |
||||||
|
<div className="gf-form-group"> |
||||||
|
<div> |
||||||
|
{/* Enable the plugin */} |
||||||
|
<Legend>Enable / Disable</Legend> |
||||||
|
{!enabled && ( |
||||||
|
<> |
||||||
|
<div className={s.colorWeak}>The plugin is currently not enabled.</div> |
||||||
|
<Button |
||||||
|
className={s.marginTop} |
||||||
|
variant="primary" |
||||||
|
onClick={() => |
||||||
|
updatePluginAndReload(plugin.meta.id, { |
||||||
|
enabled: true, |
||||||
|
pinned: true, |
||||||
|
jsonData, |
||||||
|
}) |
||||||
|
} |
||||||
|
> |
||||||
|
Enable plugin |
||||||
|
</Button> |
||||||
|
</> |
||||||
|
)} |
||||||
|
|
||||||
|
{/* Disable the plugin */} |
||||||
|
{enabled && ( |
||||||
|
<> |
||||||
|
<div className={s.colorWeak}>The plugin is currently enabled.</div> |
||||||
|
<Button |
||||||
|
className={s.marginTop} |
||||||
|
variant="destructive" |
||||||
|
onClick={() => |
||||||
|
updatePluginAndReload(plugin.meta.id, { |
||||||
|
enabled: false, |
||||||
|
pinned: false, |
||||||
|
jsonData, |
||||||
|
}) |
||||||
|
} |
||||||
|
> |
||||||
|
Disable plugin |
||||||
|
</Button> |
||||||
|
</> |
||||||
|
)} |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
); |
||||||
|
}; |
||||||
|
|
||||||
|
const getStyles = (theme: GrafanaTheme2) => ({ |
||||||
|
colorWeak: css` |
||||||
|
color: ${theme.colors.text.secondary}; |
||||||
|
`,
|
||||||
|
marginTop: css` |
||||||
|
margin-top: ${theme.spacing(3)}; |
||||||
|
`,
|
||||||
|
}); |
||||||
|
|
||||||
|
const updatePluginAndReload = async (pluginId: string, data: Partial<PluginMeta>) => { |
||||||
|
try { |
||||||
|
await updatePlugin(pluginId, data); |
||||||
|
|
||||||
|
// Reloading the page as the changes made here wouldn't be propagated to the actual plugin otherwise.
|
||||||
|
// This is not ideal, however unfortunately currently there is no supported way for updating the plugin state.
|
||||||
|
window.location.reload(); |
||||||
|
} catch (e) { |
||||||
|
console.error('Error while updating the plugin', e); |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
export const updatePlugin = async (pluginId: string, data: Partial<PluginMeta>) => { |
||||||
|
const response = getBackendSrv().fetch({ |
||||||
|
url: `/api/plugins/${pluginId}/settings`, |
||||||
|
method: 'POST', |
||||||
|
data, |
||||||
|
}); |
||||||
|
return lastValueFrom(response); |
||||||
|
}; |
@ -0,0 +1,12 @@ |
|||||||
|
import { AppPlugin } from '@grafana/data'; |
||||||
|
import { App } from './components/App'; |
||||||
|
import { AppConfig } from './components/AppConfig'; |
||||||
|
|
||||||
|
export const plugin = new AppPlugin<{}>().setRootPage(App).addConfigPage({ |
||||||
|
title: 'Configuration', |
||||||
|
icon: 'fa fa-cog', |
||||||
|
// @ts-ignore - Would expect a Class component, however works absolutely fine with a functional one
|
||||||
|
// Implementation: https://github.com/grafana/grafana/blob/fd44c01675e54973370969dfb9e78f173aff7910/public/app/features/plugins/PluginPage.tsx#L157
|
||||||
|
body: AppConfig, |
||||||
|
id: 'configuration', |
||||||
|
}); |
@ -0,0 +1,34 @@ |
|||||||
|
{ |
||||||
|
"$schema": "https://raw.githubusercontent.com/grafana/grafana/master/docs/sources/developers/plugins/plugin.schema.json", |
||||||
|
"type": "app", |
||||||
|
"name": "Data Exporter", |
||||||
|
"id": "corpglory-dataexporter-app", |
||||||
|
"info": { |
||||||
|
"description": "", |
||||||
|
"author": { |
||||||
|
"name": "CorpGlory Inc." |
||||||
|
}, |
||||||
|
"logos": { |
||||||
|
"small": "img/logo.svg", |
||||||
|
"large": "img/logo.svg" |
||||||
|
}, |
||||||
|
"keywords": ["export", "csv"], |
||||||
|
"screenshots": [], |
||||||
|
"version": "%VERSION%", |
||||||
|
"updated": "%TODAY%" |
||||||
|
}, |
||||||
|
"includes": [ |
||||||
|
{ |
||||||
|
"type": "page", |
||||||
|
"name": "Default", |
||||||
|
"path": "/a/%PLUGIN_ID%", |
||||||
|
"role": "Admin", |
||||||
|
"addToNav": true, |
||||||
|
"defaultNav": true |
||||||
|
} |
||||||
|
], |
||||||
|
"dependencies": { |
||||||
|
"grafanaDependency": ">=7.0.0", |
||||||
|
"plugins": [] |
||||||
|
} |
||||||
|
} |
Loading…
Reference in new issue