From 201f71704d510df2e39b0f98fb2dec4583e1aaa5 Mon Sep 17 00:00:00 2001
From: Ambroise C <ambroise.christea@sonarsource.com>
Date: Thu, 21 Nov 2024 11:37:39 +0100
Subject: [PATCH] SONAR-22308 Fix Measures page a11y issue

Also replace some deprectated design-system components with Echoes ones.
---
 .../drilldown/BubbleChartView.tsx                  | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/server/sonar-web/src/main/js/apps/component-measures/drilldown/BubbleChartView.tsx b/server/sonar-web/src/main/js/apps/component-measures/drilldown/BubbleChartView.tsx
index 7751fc840a4..2c853d51286 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/drilldown/BubbleChartView.tsx
+++ b/server/sonar-web/src/main/js/apps/component-measures/drilldown/BubbleChartView.tsx
@@ -20,12 +20,10 @@
 
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
+import { Heading, IconQuestionMark, LinkStandalone } from '@sonarsource/echoes-react';
 import * as React from 'react';
 import {
   BubbleColorVal,
-  HelperHintIcon,
-  Highlight,
-  Link,
   BubbleChart as OriginalBubbleChart,
   themeColor,
   themeContrast,
@@ -168,9 +166,11 @@ export default function BubbleChartView(props: Readonly<Props>) {
       <div className="sw-flex sw-justify-between sw-gap-3">
         <div>
           <div className="sw-flex sw-items-center sw-whitespace-nowrap">
-            <Highlight className="it__measure-overview-bubble-chart-title">{title}</Highlight>
+            <Heading as="h3" className="it__measure-overview-bubble-chart-title">
+              {title}
+            </Heading>
             <HelpTooltip className="sw-ml-2" overlay={getDescription(domain)}>
-              <HelperHintIcon />
+              <IconQuestionMark />
             </HelpTooltip>
           </div>
 
@@ -181,7 +181,7 @@ export default function BubbleChartView(props: Readonly<Props>) {
           )}
           {(isView(component?.qualifier) || isProject(component?.qualifier)) && (
             <div className="sw-mt-2">
-              <Link
+              <LinkStandalone
                 to={getComponentDrilldownUrl({
                   componentKey: component.key,
                   branchLike,
@@ -190,7 +190,7 @@ export default function BubbleChartView(props: Readonly<Props>) {
                 })}
               >
                 {translate('component_measures.overview.see_data_as_list')}
-              </Link>
+              </LinkStandalone>
             </div>
           )}
         </div>
-- 
2.39.5