Docs: Update readme (#47)

CHANGELOG.md

@@ -1,13 +1,36 @@
 # Changelog
 
+## 0.5.0
+
+- Feat: Dynamic Lights style allowing any number of lights to be used
+- Fix: Sort should sort numerically
+- Chore: Bump @grafana/create-plugin configuration to 5.5.3
+- CI: Update all GH workflows to latest create-plugin
+
+## 0.4.1
+
+- Chore: Bump @grafana/create-plugin configuration to 5.3.9
+
+## 0.4.0
+
+- Feature: Support table data
+- Chore: fix license file
+- Chore: Bump @grafana/create-plugin configuration to 4.16.2
+- Deps: bump ws from 8.13.0 to 8.17.1
+
+## 0.3.1
+
+- Bug: Fix queries with a single field
+- Chore: Bump @grafana/create-plugin configuration to 4.12.0
+- CI: introduce cp update workflow
+
 ## 0.3.0
 
 - Add new option to reverse the order of colors in traffic lights
 - Add new option to show only the legend (query name) below traffic lights
 - Clean up e2e tests with test ids const and bumping plugin-e2e to 1.x.x
 - Introduce e2e tests for TrafficLightValue component
 
-
 ## 0.2.0
 
 - Add a new option to select different traffic light styles (`default`, `rounded`, `side-lights`)

package.json

@@ -20,7 +20,7 @@
   "devDependencies": {
     "@babel/core": "^7.21.4",
     "@grafana/eslint-config": "^7.0.0",
-    "@grafana/plugin-e2e": "^1.8.3",
+    "@grafana/plugin-e2e": "^1.10.0",
     "@grafana/tsconfig": "^2.0.0",
     "@playwright/test": "^1.41.2",
     "@swc/core": "^1.3.90",

src/README.md

@@ -19,7 +19,7 @@ Grafana >=9.5.3
 - **Value Display:** Option to show or hide the values associated with each light.
 - **Legend Display:** Option to show or hide the legend (query name) associated with each light.
 - **Trend Display:** Show or hide the trend color to provide an additional layer of information.
-- **Traffic Light Style:** Pick a style of traffic light.
+- **Traffic Light Style:** Pick a style of traffic light. If you want a custom number of lights use dynamic.
 - **Orientation Flexibility:** Choose between a vertical or horizontal layout for the traffic lights.
 
 ## Installation
@@ -34,16 +34,17 @@ This plugin can be installed using one of the following methods:
 
 The traffic light panel uses the built in Grafana thresholds to assign lights to values.
 
-1. **Define Thresholds:** In the plugin settings, define thresholds that categorize your data. A basic thresholds example for a traffic light looks like:
+1. **Choose a traffic light style:** In the panel settings, select a light style. Dynamic allows you to add any number of lights based on the threshold settings. All other light styles require 3 thresholds to be set.
+2. **Define Thresholds:** In the panel settings, define thresholds that categorize your data. A basic thresholds example for a traffic light looks like:
 
    <img width="300px" src="https://raw.githubusercontent.com/jackw/heywesty-trafficlight-panel/main/docs/thresholds-example.png" />
 
-2. **Assign Colors:** Assign colors to each threshold range. These colors will be used to represent the corresponding data values in the traffic lights.
-3. **Preview and Adjust:** After setting the thresholds, preview them on your dashboard. Adjust the thresholds and colors as necessary to accurately reflect the status indicated by your data.
-4. **Data Links:** Optionally [add datalinks](https://grafana.com/docs/grafana/latest/panels-visualizations/configure-data-links/) to make the traffic light panel navigate elsewhere on click.
+3. **Assign Colors:** Assign colors to each threshold range. These colors will be used to represent the corresponding data values in the traffic lights.
+4. **Preview and Adjust:** After setting the thresholds, preview them on your dashboard. Adjust the thresholds and colors as necessary to accurately reflect the status indicated by your data.
+5. **Data Links:** Optionally [add datalinks](https://grafana.com/docs/grafana/latest/panels-visualizations/configure-data-links/) to make the traffic light panel navigate elsewhere on click.
 
 > [!TIP]
-> Make use of threshold overrides if you'd like to set traffic lights with different colour schemes.
+> Make use of threshold overrides if you'd like to set traffic lights with different colour schemes. If you're using dynamic lights you can also set different numbers of lights.
 
 ## Options
 
@@ -55,12 +56,12 @@ Getting started is as simple as adding the panel to your dashboard and tweaking
 1. **Show Value:** Choose whether to display the numerical values with each light. True by default.
 1. **Show Legend:** Choose whether to display the numerical values with each light. True by default.
 1. **Show Trend:** Add an extra layer of insight with a trend color. True by default.
-1. **Traffic Light Style:** Choose from one of: default, rounded, or side lights.
-1. **Sort Lights:** Organize your traffic lights in the order that makes sense to you:
+2. **Traffic Light Style:** Choose from one of: default, rounded, side lights, or dynamic.
+3. **Sort Lights:** Organize your traffic lights in the order that makes sense to you:
    - None: Keep data series order.
    - Ascending: Line them up from lowest to highest values.
    - Descending: Line them up from highest to lowest values.
-1. **Orientation:** Set the lights horizontally or stick to the default vertical layout.
+4. **Orientation:** Set the lights horizontally or stick to the default vertical layout.
 
 ## Troubleshooting / Help