SONAR-17001 [894147] Button: Button does not have a name

diff --git a/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendItem.tsx b/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendItem.tsx
index e131d1993bc6e161a6b1cfde51e9a06e506b58b1..c26f9de9f02355e4a867b0bc5e865ecac107ad24 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendItem.tsx
+++ b/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendItem.tsx
@@ -22,6 +22,7 @@ import * as React from 'react';
 import { ClearButton } from '../../components/controls/buttons';
 import AlertWarnIcon from '../../components/icons/AlertWarnIcon';
 import ChartLegendIcon from '../../components/icons/ChartLegendIcon';
+import { translateWithParameters } from '../../helpers/l10n';
 
 interface Props {
   className?: string;
@@ -40,22 +41,25 @@ export default class GraphsLegendItem extends React.PureComponent<Props> {
   };
 
   render() {
+    const { className, name, index } = this.props;
     const isActionable = this.props.removeMetric != null;
-    const legendClass = classNames(
-      { 'activity-graph-legend-actionable': isActionable },
-      this.props.className
-    );
+    const legendClass = classNames({ 'activity-graph-legend-actionable': isActionable }, className);
+
     return (
       <span className={legendClass}>
         {this.props.showWarning ? (
           <AlertWarnIcon className="spacer-right" />
         ) : (
-          <ChartLegendIcon className="text-middle spacer-right" index={this.props.index} />
+          <ChartLegendIcon className="text-middle spacer-right" index={index} />
         )}
-        <span className="text-middle">{this.props.name}</span>
+        <span className="text-middle">{name}</span>
         {isActionable && (
           <ClearButton
             className="button-tiny spacer-left text-middle"
+            aria-label={translateWithParameters(
+              'project_activity.graphs.custom.remove_metric',
+              name
+            )}
             iconProps={{ size: 12 }}
             onClick={this.handleClick}
           />

diff --git a/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendItem-test.tsx.snap b/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendItem-test.tsx.snap
index d374734cb547be6159a1bb21a1e237a1fa754eb9..37369e0d97022b5e696d28d7ba8616cc51c8ace2 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendItem-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendItem-test.tsx.snap
@@ -30,6 +30,7 @@ exports[`should render correctly a legend: with legend 1`] = `
     Foo
   </span>
   <ClearButton
+    aria-label="project_activity.graphs.custom.remove_metric.Foo"
     className="button-tiny spacer-left text-middle"
     iconProps={
       Object {

diff --git a/sonar-core/src/main/resources/org/sonar/l10n/core.properties b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
index 6a4b4fd5f5adec44fb1daa796de5311cd9da55f7..1d654070d38ba005adea3a3722380053c6abb077 100644 (file)
--- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties
+++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
@@ -1545,6 +1545,7 @@ project_activity.graphs.custom.add=Add metric
 project_activity.graphs.custom.add_metric=Add a metric
 project_activity.graphs.custom.select_metric=Select metric to display
 project_activity.graphs.custom.add_metric_info=Only 3 metrics of the same type can be displayed on one graph. You can have a maximum of two graphs.
+project_activity.graphs.custom.remove_metric=Remove the {0} metric from the graph
 project_activity.graphs.custom.no_history=There isn't enough data to generate an activity graph, please select more metrics.
 project_activity.graphs.custom.metric_no_history=This metric has no historical data to display.
 project_activity.graphs.custom.search=Search for a metric by name