From 22a2283b40bac802646ce847ba5f0d6f312351e9 Mon Sep 17 00:00:00 2001 From: Sophia Mersmann Date: Sun, 22 Dec 2024 11:56:43 +0100 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20(facet)=20make=20legend=20clicka?= =?UTF-8?q?ble=20for=20line=20and=20slope=20charts=20only?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../grapher/src/facetChart/FacetChart.tsx | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/@ourworldindata/grapher/src/facetChart/FacetChart.tsx b/packages/@ourworldindata/grapher/src/facetChart/FacetChart.tsx index c5c0ccc7ab..e1cf131f83 100644 --- a/packages/@ourworldindata/grapher/src/facetChart/FacetChart.tsx +++ b/packages/@ourworldindata/grapher/src/facetChart/FacetChart.tsx @@ -795,6 +795,13 @@ export class FacetChart return this.isNumericLegend ? this.numericLegend : this.categoryLegend } + @computed private get isFocusModeSupported(): boolean { + return ( + this.chartTypeName === GRAPHER_CHART_TYPES.LineChart || + this.chartTypeName === GRAPHER_CHART_TYPES.SlopeChart + ) + } + /** * In order to display a potentially long facet label in the potentially tight space, we * shrink and shorten the label as follows to prevent overlap between neighbouring labels: @@ -853,7 +860,9 @@ export class FacetChart onMouseLeave={this.onLegendMouseLeave} hoverColors={this.hoverColors} activeColors={this.activeColors} - onClick={this.onLegendClick} + onClick={ + this.isFocusModeSupported ? this.onLegendClick : undefined + } /> ) }