improve i18n of the overview page

5 files changed, 23 insertions, 11 deletions

diff --git a/server/sonar-web/src/main/js/apps/overview/components/domain-bubble-chart.js b/server/sonar-web/src/main/js/apps/overview/components/domain-bubble-chart.js
index 3f89f636e35..ffda795363a 100644
--- a/server/sonar-web/src/main/js/apps/overview/components/domain-bubble-chart.js
+++ b/server/sonar-web/src/main/js/apps/overview/components/domain-bubble-chart.js
@@ -120,16 +120,18 @@ export class DomainBubbleChart extends React.Component {
       <div className="overview-card-header">
         <h2 className="overview-title">{window.t('overview.chart.files')}</h2>
         <ul className="list-inline small">
-          <li>Size: {this.getSizeMetricsTitle()}</li>
+          <li>
+            {window.tp('overview.chart.legend.size_x', this.getSizeMetricsTitle())}
+          </li>
         </ul>
       </div>
       <div className="overview-bubble-chart">
         <div className="note" style={{ position: 'relative', top: '10px', left: '10px' }}>
-          Y: {this.state.yMetric.name}
+          {this.state.yMetric.name}
         </div>
         {this.renderBubbleChart()}
         <div className="note text-right" style={{ position: 'relative', top: '-10px', left: '-10px' }}>
-          X: {this.state.xMetric.name}
+          {this.state.xMetric.name}
         </div>
         {this.state.total > BUBBLES_LIMIT &&
         <div className="note text-center">{window.tp('overview.chart.files.limit_message', BUBBLES_LIMIT)}</div>}
diff --git a/server/sonar-web/src/main/js/apps/overview/components/domain-treemap.js b/server/sonar-web/src/main/js/apps/overview/components/domain-treemap.js
index 1152ee83cc4..d2db3d954d4 100644
--- a/server/sonar-web/src/main/js/apps/overview/components/domain-treemap.js
+++ b/server/sonar-web/src/main/js/apps/overview/components/domain-treemap.js
@@ -122,12 +122,15 @@ export class DomainTreemap extends React.Component {
   }
 
   render () {
-    let color = this.props.colorMetric ? <li>Color: {this.state.colorMetric.name}</li> : null;
+    let color = this.props.colorMetric ?
+        <li>{window.tp('overview.chart.legend.color_x', this.state.colorMetric.name)}</li> : null;
     return <div className="overview-domain-chart">
       <div className="overview-card-header">
         <h2 className="overview-title">{window.t('overview.chart.components')}</h2>
         <ul className="list-inline small">
-          <li>Size: {this.state.sizeMetric.name}</li>
+          <li>
+            {window.tp('overview.chart.legend.size_x', this.state.sizeMetric.name)}
+          </li>
           {color}
         </ul>
       </div>
diff --git a/server/sonar-web/src/main/js/apps/overview/components/issue-measure.js b/server/sonar-web/src/main/js/apps/overview/components/issue-measure.js
index 0ee67b64d41..8387f2b6feb 100644
--- a/server/sonar-web/src/main/js/apps/overview/components/issue-measure.js
+++ b/server/sonar-web/src/main/js/apps/overview/components/issue-measure.js
@@ -70,7 +70,7 @@ export const AddedRemovedMeasure = React.createClass({
     return <div className="overview-detailed-measure-leak">
       <ul>
         <li style={{ display: 'flex', alignItems: 'baseline' }}>
-          <small className="flex-1 text-left">Added</small>
+          <small className="flex-1 text-left">{window.t('overview.added')}</small>
           <IssuesLink className="text-danger"
                       component={this.props.component.key} params={{ resolved: 'false' }}>
             <span className="overview-detailed-measure-value">
@@ -79,7 +79,7 @@ export const AddedRemovedMeasure = React.createClass({
           </IssuesLink>
         </li>
         <li className="little-spacer-top" style={{ display: 'flex', alignItems: 'baseline' }}>
-          <small className="flex-1 text-left">Removed</small>
+          <small className="flex-1 text-left">{window.t('overview.removed')}</small>
           <span className="text-success">
             {formatMeasure(removed, getShortType(this.props.type))}
           </span>
@@ -174,7 +174,7 @@ export const OnNewCodeMeasure = React.createClass({
     return <div className="overview-detailed-measure-leak">
       <ul>
         <li className="little-spacer-top" style={{ display: 'flex', alignItems: 'center' }}>
-          <small className="flex-1 text-left">On New Code</small>
+          <small className="flex-1 text-left">{window.t('overview.on_new_code')}</small>
           <DrilldownLink component={this.props.component.key} metric={this.props.leakMetric}
                          period={this.props.leakPeriodIndex}>
             <span className="overview-detailed-measure-value">
@@ -232,7 +232,7 @@ export const SeverityMeasure = React.createClass({
     return <div className="overview-detailed-measure-leak">
       <ul>
         <li style={{ display: 'flex', alignItems: 'baseline' }}>
-          <small className="flex-1 text-left text-ellipsis">Added</small>
+          <small className="flex-1 text-left text-ellipsis">{window.t('overview.added')}</small>
           <IssuesLink className="text-danger"
                       component={this.props.component.key}
                       params={{ resolved: 'false', severities: this.props.severity, createdAfter: createdAfter }}>
@@ -242,7 +242,7 @@ export const SeverityMeasure = React.createClass({
           </IssuesLink>
         </li>
         <li className="little-spacer-top" style={{ display: 'flex', alignItems: 'baseline' }}>
-          <small className="flex-1 text-left text-ellipsis">Removed</small>
+          <small className="flex-1 text-left text-ellipsis">{window.t('overview.removed')}</small>
           <span className="text-success">
             {formatMeasure(removed, 'SHORT_INT')}
           </span>
diff --git a/server/sonar-web/src/main/js/apps/overview/components/ncloc-distribution.js b/server/sonar-web/src/main/js/apps/overview/components/ncloc-distribution.js
index 54bf29e5572..764457ad403 100644
--- a/server/sonar-web/src/main/js/apps/overview/components/ncloc-distribution.js
+++ b/server/sonar-web/src/main/js/apps/overview/components/ncloc-distribution.js
@@ -82,7 +82,9 @@ export const NclocDistribution = React.createClass({
     return <div className="overview-domain-chart">
       <div className="overview-card-header">
         <h2 className="overview-title">{window.t('overview.chart.components')}</h2>
-        <span className="small">Size: Lines of Code</span>
+        <span className="small">
+          {window.tp('overview.chart.legend.size_x', window.t('metric.ncloc.name'))}
+        </span>
       </div>
       <div className="overview-bar-chart">
         {this.renderBarChart()}
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 f7f1130fc5a..8f086234253 100644
--- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties
+++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
@@ -3111,6 +3111,9 @@ overview.leak_period_x=Leak Period {0}
 overview.started_x=started {0}
 overview.project_in_a_nutshell=Project In a Nutshell
 overview.unmanaged_issues=Unmanaged Issues
+overview.on_new_code=On New Code
+overview.added=Added
+overview.removed=Removed
 
 overview.metric.issues=Issues
 overview.metric.debt=Debt
@@ -3148,6 +3151,8 @@ overview.chart.files=Files
 overview.chart.files.limit_message=Only {0} files are displayed.
 overview.chart.components=Components
 overview.chart.history=History
+overview.chart.legend.size_x=Size: {0}
+overview.chart.legend.color_x=Color: {0}
 
 overview.complexity_tooltip.function={0} functions have complexity around {1}
 overview.complexity_tooltip.file={0} files have complexity around {1}