Update to Grafana 9.4.2 (#48)

* Update to Grafana 9.4.2

* Update screenshot.png

CHANGELOG.md

@@ -5,6 +5,8 @@
 ### Features / Enhancements
 
 - Update Docker customization to Grafana 9.4.2 (#47)
+- Update to Grafana 9.4.2 (#48)
+- Update Dynamic Text Panel 3.0.0 (#48)
 
 ## 2.1.0 (2023-02-18)
 

README.md

@@ -2,7 +2,7 @@
 
 ![Application](https://raw.githubusercontent.com/volkovlabs/volkovlabs-app/main/img/app.png)
 
-![Grafana 9](https://img.shields.io/badge/Grafana-9.3.6-orange)
+![Grafana 9](https://img.shields.io/badge/Grafana-9.4.2-orange)
 [![YouTube](https://img.shields.io/badge/YouTube-Playlist-red)](https://youtube.com/playlist?list=PLPow72ygztmTm_zY_PYqJtRYpMPpZglYC)
 ![CI](https://github.com/volkovlabs/volkovlabs-app/workflows/CI/badge.svg)
 [![codecov](https://codecov.io/gh/VolkovLabs/volkovlabs-app/branch/main/graph/badge.svg)](https://codecov.io/gh/VolkovLabs/volkovlabs-app)
@@ -26,7 +26,7 @@ docker pull ghcr.io/volkovlabs/app:latest
 
 ## Bundle
 
-Application plugin includes:
+Application plugin includes.
 
 - [RSS/Atom data source](https://volkovlabs.io/plugins/volkovlabs-rss-datasource)
 - [Dynamic text panel](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel)

package.json

@@ -2,10 +2,10 @@
   "author": "Volkov Labs",
   "description": "Volkov Labs Application plugin",
   "devDependencies": {
-    "@grafana/data": "9.3.6",
-    "@grafana/runtime": "9.3.6",
-    "@grafana/toolkit": "9.3.6",
-    "@grafana/ui": "9.3.6",
+    "@grafana/data": "9.4.2",
+    "@grafana/runtime": "9.4.2",
+    "@grafana/toolkit": "9.4.2",
+    "@grafana/ui": "9.4.2",
     "@types/enzyme": "^3.10.12",
     "@types/enzyme-adapter-react-16": "^1.0.6",
     "enzyme": "^3.11.0",
@@ -29,5 +29,5 @@
     "upgrade": "yarn upgrade --latest",
     "watch": "grafana-toolkit plugin:dev --watch"
   },
-  "version": "2.1.0"
+  "version": "2.2.0"
 }

src/marcusolsson-dynamictext-panel/CHANGELOG.md

@@ -1,5 +1,38 @@
 # Changelog
 
+## 3.0.0 (2023-02-19)
+
+### Breaking changes
+
+The default Content and JavaScript editors are not displayed by default unless values were modified.
+To display required editors, including the new Styles, they should be selected in the list.
+
+### Features / Enhancements
+
+- Update README features with new JavaScript Code Editor (#141)
+- Update to Grafana 9.3.6 (#147)
+- Update CI and Release workflows (#147)
+- Update README to include JavaScript tutorial (#148)
+- Add custom styles (#149)
+- Add option to display optional editors (#149)
+- Remove Panel Padding (#150)
+- Add Code Syntax Highlight (#151)
+- Add Breaking Changes for displaying optional editors (#152)
+
+## 2.2.0 (2023-01-09)
+
+### Features / Enhancements
+
+- Add JSON helper to show objects and arrays (#121)
+- Update to Grafana 9.3.1 (#122)
+- Update Documentation links (#130, #131)
+- Add Split Helper (#132)
+- Refactor Text Component and Styles (#133)
+- Add JavaScript Code to add Handlebars helpers and Event handlers (#134)
+- Update default Content to `{{json @root}}` and Code Editor height to `200px` (#134)
+- Update CSS to fit images to screen (#135)
+- Add `getLocale()` parameter to JavaScript Code (#137)
+
 ## 2.1.0 (2022-11-27)
 
 ### Breaking changes

src/marcusolsson-dynamictext-panel/LICENSE

@@ -187,7 +187,7 @@
       identification within third-party archives.
 
    Copyright 2021-2022 Marcus Olsson
-   Copyright 2022 Volkov Labs
+   Copyright 2022-2023 Volkov Labs
 
    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.

src/marcusolsson-dynamictext-panel/MANIFEST.txt

@@ -1,36 +1,36 @@
-
------BEGIN PGP SIGNED MESSAGE-----
-Hash: SHA512
-
-{
-  "manifestVersion": "2.0.0",
-  "signatureType": "community",
-  "signedByOrg": "marcusolsson",
-  "signedByOrgName": "Marcus Olsson",
-  "plugin": "marcusolsson-dynamictext-panel",
-  "version": "2.1.0",
-  "time": 1669560123918,
-  "keyId": "7e4d0c6a708866e7",
-  "files": {
-    "CHANGELOG.md": "ae115bf79bd497281626a2773f97e2a21731009c667a15dc6d9b0e8f22b518f0",
-    "module.js.LICENSE.txt": "e8c02c32db0a1df801e3d57aab9722d00cf899e5a1b469795e18d19dc3b9f1c4",
-    "img/logo.svg": "655cfc72eec8d19bda8f74d9fa3449b7b133b5ee66c7bd3db407fdfeada1cbd1",
-    "img/screenshot.png": "eadb1e588dccd558fa3aee74e1a4ffa7fab992d810de198dc230293528f8dd23",
-    "plugin.json": "93c59d3db6c7a5b65caf49da4373cffef76b5db96fd0f1feadc1080dc2647b29",
-    "module.js": "0bc49d3b8bcc98fc48b5d4c36307ec0c5447086af09445ca49acedd785908685",
-    "module.js.map": "112d9d377a990f3b004a52b61a3021263c2923d91d2dd088432b673817721215",
-    "LICENSE": "a63c5165eb9778ded164326a26710064defbc9ffc295c8d49eda51bf9bd8f7d2",
-    "README.md": "704d353d84ae0eca7d3f38cb7af84fdb32bed8a944ebcabb9bde8a92dcf5bfdd"
-  }
-}
------BEGIN PGP SIGNATURE-----
-Version: OpenPGP.js v4.10.10
-Comment: https://openpgpjs.org
-
-wrgEARMKAAYFAmODdzwAIQkQfk0ManCIZucWIQTzOyW2kQdOhGNlcPN+TQxq
-cIhm5yabAgjcMfnUR0k27bRKxKiW7fwpBAt/P5AYE/Dt3TAtnWt3VLzIGJAc
-ogYMFBcnJsJtVtGqczROGnZ2GtGrdaun4KLo4QIJAT0aYSTKGH35dzo4iWmt
-DW1RHjvgeMOQlfz52E+peIXnVM/AV29H29PMhiAZ1nmYU1kySLYrUcrqGekr
-i+V6zLpU
-=HhLi
------END PGP SIGNATURE-----
+
+-----BEGIN PGP SIGNED MESSAGE-----
+Hash: SHA512
+
+{
+  "manifestVersion": "2.0.0",
+  "signatureType": "community",
+  "signedByOrg": "marcusolsson",
+  "signedByOrgName": "Marcus Olsson",
+  "plugin": "marcusolsson-dynamictext-panel",
+  "version": "3.0.0",
+  "time": 1676841447323,
+  "keyId": "7e4d0c6a708866e7",
+  "files": {
+    "README.md": "b309ab42e0591a65d989e8ae6351c87f09adc19cc8292112372ab54e96849af3",
+    "module.js.LICENSE.txt": "e8c02c32db0a1df801e3d57aab9722d00cf899e5a1b469795e18d19dc3b9f1c4",
+    "plugin.json": "cfc5369d5be10d2f297fe0de413aa802ab05ee0782088a6e5a548bf4f7ef3fa6",
+    "LICENSE": "f61b4f79d7a9894e10398b6fd55ce533b206a27df5e045a58eca3ea788cc9119",
+    "img/logo.svg": "655cfc72eec8d19bda8f74d9fa3449b7b133b5ee66c7bd3db407fdfeada1cbd1",
+    "img/screenshot.png": "68d355ffafe66ce4855566ccd7bf393e4c0dad66bddb3a2d2adb5e3eb057f50c",
+    "CHANGELOG.md": "ad326e2cbef94f8675acbc75d627d3268dd3cc68e94ab6f7f6aec821e9031e35",
+    "module.js": "c68ac6c2d78437c466a9e0288340ba38ed2e0f1f6c7de359693368c337c16363",
+    "module.js.map": "80b3e067fe994430aab689ba5efc7242849379eeae744f96f62de231d191744c"
+  }
+}
+-----BEGIN PGP SIGNATURE-----
+Version: OpenPGP.js v4.10.10
+Comment: https://openpgpjs.org
+
+wrkEARMKAAYFAmPykecAIQkQfk0ManCIZucWIQTzOyW2kQdOhGNlcPN+TQxq
+cIhm50F1AgkBWBYrLtwNo3gYXG7qEGzehhntwTa2eG8/8DEh9tp2Bw9x3Tqw
+IvJ44UkcRDEvnV7vfynhenWX3oY1Y1iZlrTdxiYCCQHw7sKQOoSmHxX1hGdF
+V0MzX5gYSp6O1hJlshHkl3mZQFt8kACYZyQIJ2qf1ogMZ8tz4LbJQikf49G3
+STJjWOQCow==
+=TaFo
+-----END PGP SIGNATURE-----

src/marcusolsson-dynamictext-panel/README.md

@@ -2,108 +2,81 @@
 
 ![Text](https://github.com/VolkovLabs/volkovlabs-dynamictext-panel/raw/main/src/img/screenshot.png)
 
-[![Grafana](https://img.shields.io/badge/Grafana-9.2.2-orange)](https://www.grafana.com)
+[![Grafana](https://img.shields.io/badge/Grafana-9.3.6-orange)](https://www.grafana.com)
 ![CI](https://github.com/volkovlabs/volkovlabs-dynamictext-panel/workflows/CI/badge.svg)
 [![codecov](https://codecov.io/gh/VolkovLabs/volkovlabs-dynamictext-panel/branch/main/graph/badge.svg?token=0m6f0ktUar)](https://codecov.io/gh/VolkovLabs/volkovlabs-dynamictext-panel)
 [![CodeQL](https://github.com/VolkovLabs/volkovlabs-dynamictext-panel/actions/workflows/codeql-analysis.yml/badge.svg)](https://github.com/VolkovLabs/volkovlabs-dynamictext-panel/actions/workflows/codeql-analysis.yml)
 
 ## Introduction
 
-A Dynamic Text panel is a plugin for Grafana for dynamic, data-driven text with Markdown and Handlebars support.
+A Dynamic Text visualization panel is a Grafana plugin that transforms monotone text/table data into vibrant, easy-to-read information cards. The panel supports variables, Markdown and Handlebars.
 
-While the built-in Text panel in Grafana does support variables, that's about as dynamic it gets. This panel lets you define a text template using the data from your data source query.
+The Dynamic Text visualization panel lets you define a text template using the data from your data source query.
 
 [![Dynamic Text Plugin for Grafana | Markdown, HTML and Handlebars to transform data visualizations](https://raw.githubusercontent.com/volkovlabs/volkovlabs-dynamictext-panel/main/img/video.png)](https://youtu.be/MpNZ4Yl-p0U)
 
-### Requirements
+## Requirements
 
-- **Grafana 8.5+**, **Grafana 9.0+** is required for version 2.X.
-- **Grafana 7.0+** is required for version 1.X.
+- **Grafana 8.5+**, **Grafana 9.0+** is required for major versions 2 and 3.
+- **Grafana 7.0+** is required for major version 1.
 
 ## Getting Started
 
-The Dynamic Text panel can be installed from the [Grafana Catalog](https://grafana.com/grafana/plugins/marcusolsson-dynamictext-panel/) or use the `grafana-cli` tool to install from the command line:
+The Dynamic Text visualization panel can be installed from the [Grafana Catalog](https://grafana.com/grafana/plugins/marcusolsson-dynamictext-panel/) or utilizing the Grafana command line tool.
+
+For the latter, use the following command.
 
 ```bash
 grafana-cli plugins install marcusolsson-dynamictext-panel
 ```
 
 ## Features
 
-- Uses Monaco Code Editor with Auto formatting to update Templates.
+- Uses Monaco Code Editor with Auto formatting to update Templates,  JavaScript Code and Styles.
 - Supports [Markdown](https://commonmark.org/help/) and [Handlebars](https://handlebarsjs.com/guide/expressions.html#basic-usage).
 - Uses [markdown-it](https://github.com/markdown-it/markdown-it) for rendering Markdown to HTML.
-- HTML inside templates is sanitized using [XSS](https://jsxss.com/en/index.html) through `textUtil`.
-- Allows to display Time global variables (`__to` and `__from`) as seconds, ISO, and formatted using `dayjs`.
-- Supports disable Sanitizing using Grafana configuration `disable_sanitize_html`.
-
-## Content
-
-To display data from your query result, enter the name of the field surrounded by double braces. For example, to display the value from the `Time` field:
-
-```
-{{Time}}
-```
+  - Supports Code syntax highlight using a11y styles.
+- Sanitizing
+  - HTML inside templates is sanitized using [XSS](https://jsxss.com/en/index.html).
+  - Can be disabled using Grafana configuration `disable_sanitize_html`.
+- Allows to display nested objects using `{{json object}}` Handlebars helper.
+- Allows displaying Time global variables (`__to` and `__from`) as seconds, ISO, and formatted using `dayjs`.
+- Allows adding Handlebars helpers and Event handlers.
+- Allows adding CSS styles.
+- Supports Internationalization using custom helpers.
 
-Panels renders the template for every row in the query result. If a query returns multiple query results, you can select the query result you wish to display from a drop-down menu.
+## Documentation
 
-Template support text processing using one or more helpers and recipies:
+| Section                  | Description                                                    |
+| ------------------------ | -------------------------------------------------------------- |
+| [Content](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/content)       | Explains how to create a visualization template for your data. |
+| [Recipes](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/recipes)      | Useful snippets that you can use in your templates.                                        |
+| [Release Notes](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/release) | Stay up to date with the latest features and updates.          |
 
-- [Helpers](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/helpers) - functions that let you perform text transformation within your template.
-- [Recipes](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/recipes) - useful snippets that you can use in your templates.
+### Features
 
-The panel renders Handlebars → Markdown → Sanitized HTML and displays the final result.
+| Section                 | Description                                                                                |
+| ----------------------- | ------------------------------------------------------------------------------------------ |
+| [Data](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/data)            | Demonstrates how to use the Every Row and All Rows options.                                |
+| [JavaScript Code](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/code) | Demonstrates how to add Handlebars helpers and Event handlers.                             |
+| [Styles](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/styles)        | Demonstrates how to add CSS styles.                                                        |
+| [Helpers](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/helpers)      | Helpers are functions that let you perform basic text transformation within your template. |
+| [Variables](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/variables)  | Demonstrates how to use variables.                                                         |
 
-### Default content
+## Tutorial
 
-Whenever the data source query returns an empty result, Grafana displays the template in **Default content**. This can be useful to provide users with instructions on what to do, or who to contact, when the query returns an empty result.
+This video outlines all the new features we implemented, including the most asked-for JavaScript area code.
 
-Even though there's no data from the data source, you can still use the available [helpers](https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/helpers).
-
-### Sanitizing
-
-Sanitizing is enabled by default and some elements like `<button>` are unavailable in the content.
-
-To disable sanitizing, panel depends on the Grafana configuration option [`disable_sanitize_html`](https://grafana.com/docs/grafana/latest/setup-grafana/configure-grafana/#disable_sanitize_html). For Docker container and Docker Compose, use as:
-
-```bash
-- GF_PANELS_DISABLE_SANITIZE_HTML=true
-```
-
-## Every row vs All rows
-
-By default, the template configured in the **Content** field is rendered for each record in the result. You can render this template only once by selecting `All rows`. In this case, the query results are passed in as the `data` field to the template.
-
-Handlebars provides a [builtin-helper](https://handlebarsjs.com/guide/builtin-helpers.html#each) to iterate over these records.
-
-If your data source returns the following data:
-
-```md
-| app  | description                  | cluster | tier     |
-| ---- | ---------------------------- | ------- | -------- |
-| auth | Handles user authentication. | prod    | frontend |
-```
-
-You can then write Markdown with placeholders for the data you want to use. The value inside each double brace expression refers to a field in the query result.
-
-```md
-# {{app}}
-
-{{description}}
-
-{{#if (eq tier "frontend")}}
-Link: <a href='https://{{cluster}}.example.com/{{app}}'>https://{{cluster}}.example.com/{{app}}</a>
-{{/if}}
-```
+[![JavaScript code in the Dynamic text panel | Grafana functionality explodes](https://raw.githubusercontent.com/volkovlabs/volkovlabs-dynamictext-panel/main/img/javascript.png)](https://youtu.be/lJqk5Gobec4)
 
 ## Feedback
 
-We love to hear from users, developers, and the whole community interested in this plugin. These are various ways to get in touch with us:
+We love to hear from you. There are various ways to get in touch with us.
 
 - Ask a question, request a new feature, and file a bug with [GitHub issues](https://github.com/volkovlabs/volkovlabs-dynamictext-panel/issues/new/choose).
 - Sponsor our open-source plugins for Grafana with [GitHub Sponsor](https://github.com/sponsors/VolkovLabs).
 - Star the repository to show your support.
 
 ## License
 
-- Apache License Version 2.0, see [LICENSE](https://github.com/volkovlabs/volkovlabs-dynamictext-panel/blob/main/LICENSE).
+Apache License Version 2.0, see [LICENSE](https://github.com/volkovlabs/volkovlabs-dynamictext-panel/blob/main/LICENSE).

src/marcusolsson-dynamictext-panel/plugin.json

@@ -14,16 +14,12 @@
     "keywords": ["text", "markdown", "handlebars"],
     "links": [
       {
-        "name": "GitHub",
-        "url": "https://github.com/volkovlabs/volkovlabs-dynamictext-panel"
-      },
-      {
-        "name": "YouTube Playlist",
-        "url": "https://www.youtube.com/playlist?list=PLPow72ygztmSRxDiDIAdXNIqD_RxLRjcW"
+        "name": "Documentation",
+        "url": "https://volkovlabs.io/plugins/volkovlabs-dynamictext-panel/"
       },
       {
-        "name": "Website",
-        "url": "https://volkovlabs.io"
+        "name": "GitHub",
+        "url": "https://github.com/volkovlabs/volkovlabs-dynamictext-panel"
       }
     ],
     "logos": {
@@ -36,8 +32,8 @@
         "path": "img/screenshot.png"
       }
     ],
-    "updated": "2022-11-27",
-    "version": "2.1.0"
+    "updated": "2023-02-19",
+    "version": "3.0.0"
   },
   "name": "Dynamic Text",
   "type": "panel"

src/plugin.json

@@ -20,10 +20,6 @@
       {
         "name": "GitHub",
         "url": "https://github.com/VolkovLabs/volkovlabs-app"
-      },
-      {
-        "name": "YouTube Playlist",
-        "url": "https://youtube.com/playlist?list=PLPow72ygztmTm_zY_PYqJtRYpMPpZglYC"
       }
     ],
     "logos": {