From c61e645418a9ad4c3ed31fb8eca666fc426c3609 Mon Sep 17 00:00:00 2001
From: Helen C <helen.chapman@torchbox.com>
Date: Thu, 27 Feb 2025 16:11:44 +0000
Subject: [PATCH] Disable hover effects on series, tooltips, and click events
 on the legend

---
 src/components/chart/chart.js                  |  3 +++
 src/components/chart/common-chart-options.js   | 13 +++++++++++++
 src/components/chart/line-chart.js             |  5 -----
 src/components/chart/specific-chart-options.js |  8 ++++++++
 4 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/src/components/chart/chart.js b/src/components/chart/chart.js
index 76844737df..e29afc20cc 100644
--- a/src/components/chart/chart.js
+++ b/src/components/chart/chart.js
@@ -43,7 +43,10 @@ class HighchartsBaseChart {
         for (const option in specificChartOptions) {
             this.config[option] = specificChartOptions[option];
         }
+        // Add the line chart plotOptions to the config - merge with
+        // any existing plotOptions
         this.config.plotOptions = {
+            ...(Highcharts.getOptions()?.plotOptions || {}),
             line: new LineChartPlotOptions().plotOptions.line,
         };
     };
diff --git a/src/components/chart/common-chart-options.js b/src/components/chart/common-chart-options.js
index dae1ae6eb1..ef55366200 100644
--- a/src/components/chart/common-chart-options.js
+++ b/src/components/chart/common-chart-options.js
@@ -64,6 +64,19 @@ class CommonChartOptions {
                 tickLength: 6,
                 tickColor: this.constants.gridLineColor,
             },
+            plotOptions: {
+                series: {
+                    // disabes the tooltip on hover
+                    enableMouseTracking: false,
+
+                    // disables the legend item hover
+                    states: {
+                        inactive: {
+                            enabled: false,
+                        },
+                    },
+                },
+            },
             // Adjust font size for smaller width of chart
             // Note this is not the same as the viewport width
             responsive: {
diff --git a/src/components/chart/line-chart.js b/src/components/chart/line-chart.js
index 5972538a8f..cc0267835f 100644
--- a/src/components/chart/line-chart.js
+++ b/src/components/chart/line-chart.js
@@ -11,11 +11,6 @@ class LineChartPlotOptions {
                 marker: {
                     enabled: false,
                 },
-                states: {
-                    hover: {
-                        lineWidth: 3,
-                    },
-                },
             },
         };
     }
diff --git a/src/components/chart/specific-chart-options.js b/src/components/chart/specific-chart-options.js
index 940f7bce1e..ca314f25b8 100644
--- a/src/components/chart/specific-chart-options.js
+++ b/src/components/chart/specific-chart-options.js
@@ -22,6 +22,14 @@ class SpecificChartOptions {
                     fontSize: this.constants.desktopFontSize,
                     fontWeight: 'normal',
                 },
+                // Disable click event on legend
+                // There is currently an issue because the legend items are still buttons
+                // and therefore the screen reader still announces that they can be clicked
+                events: {
+                    itemClick: () => {
+                        return false;
+                    },
+                },
             },
         };
     }