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

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}
           />

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 {

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