SONAR-7349 apply feedback

4 files changed, 73 insertions, 56 deletions

diff --git a/server/sonar-web/src/main/js/apps/overview/main/code-smells.js b/server/sonar-web/src/main/js/apps/overview/main/code-smells.js
index 2d754263334..319f9909528 100644
--- a/server/sonar-web/src/main/js/apps/overview/main/code-smells.js
+++ b/server/sonar-web/src/main/js/apps/overview/main/code-smells.js
@@ -36,7 +36,7 @@ import { DrilldownLink } from '../../../components/shared/drilldown-link';
 import { TooltipsMixin } from '../../../components/mixins/tooltips-mixin';
 import { getMetricName } from '../helpers/metrics';
 import { formatMeasure } from '../../../helpers/measures';
-import { translate } from '../../../helpers/l10n';
+import { translate, translateWithParameters } from '../../../helpers/l10n';
 
 
 export const CodeSmells = React.createClass({
@@ -52,6 +52,8 @@ export const CodeSmells = React.createClass({
       return null;
     }
 
+    const { snapshotDate } = this.props.component;
+    const formattedSnapshotDate = moment(snapshotDate).format('LLL');
     const createdAfter = moment(this.props.leakPeriodDate).format('YYYY-MM-DDTHH:mm:ssZZ');
     const newDebt = this.props.leak['new_technical_debt'] || 0;
     const newCodeSmells = this.props.leak['new_code_smells'] || 0;
@@ -62,14 +64,22 @@ export const CodeSmells = React.createClass({
           <IssuesLink
               component={this.props.component.key}
               params={{ resolved: 'false', createdAfter, types: 'CODE_SMELL', facetMode: 'debt' }}>
-            {formatMeasure(newDebt, 'SHORT_WORK_DUR')}
+            <span
+                title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                data-toggle="tooltip">
+              {formatMeasure(newDebt, 'SHORT_WORK_DUR')}
+            </span>
           </IssuesLink>
         </Measure>
         <Measure label={getMetricName('new_code_smells')}>
           <IssuesLink
               component={this.props.component.key}
               params={{ resolved: 'false', types: 'CODE_SMELL', createdAfter }}>
-            {formatMeasure(newCodeSmells, 'SHORT_INT')}
+            <span
+                title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                data-toggle="tooltip">
+              {formatMeasure(newCodeSmells, 'SHORT_INT')}
+            </span>
           </IssuesLink>
         </Measure>
       </MeasuresList>
@@ -80,6 +90,8 @@ export const CodeSmells = React.createClass({
   render () {
     const debt = this.props.measures['sqale_index'] || 0;
     const codeSmells = this.props.measures['code_smells'] || 0;
+    const { snapshotDate } = this.props.component;
+    const formattedSnapshotDate = moment(snapshotDate).format('LLL');
 
     return <Domain>
       <DomainHeader component={this.props.component}
@@ -91,14 +103,20 @@ export const CodeSmells = React.createClass({
 
             <Measure composite={true}>
               <div className="display-inline-block text-middle big-spacer-right">
-                <div className="overview-domain-measure-value">
+                <div
+                    className="overview-domain-measure-value"
+                    title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                    data-toggle="tooltip">
                   <DrilldownLink component={this.props.component.key} metric="sqale_rating">
                     <Rating value={this.props.measures['sqale_rating']}/>
                   </DrilldownLink>
                 </div>
               </div>
               <div className="display-inline-block text-middle">
-                <div className="overview-domain-measure-value">
+                <div
+                    className="overview-domain-measure-value"
+                    title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                    data-toggle="tooltip">
                   <IssuesLink
                       component={this.props.component.key}
                       params={{ resolved: 'false', types: 'CODE_SMELL', facetMode: 'debt' }}>
@@ -113,7 +131,11 @@ export const CodeSmells = React.createClass({
               <IssuesLink
                   component={this.props.component.key}
                   params={{ resolved: 'false', types: 'CODE_SMELL' }}>
-                {formatMeasure(codeSmells, 'SHORT_INT')}
+                <span
+                    title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                    data-toggle="tooltip">
+                  {formatMeasure(codeSmells, 'SHORT_INT')}
+                </span>
               </IssuesLink>
             </Measure>
           </MeasuresList>
diff --git a/server/sonar-web/src/main/js/apps/overview/main/main.js b/server/sonar-web/src/main/js/apps/overview/main/main.js
index 3af8d825751..fdb05b26b53 100644
--- a/server/sonar-web/src/main/js/apps/overview/main/main.js
+++ b/server/sonar-web/src/main/js/apps/overview/main/main.js
@@ -29,7 +29,6 @@ import { GeneralStructure } from './structure';
 import { CoverageSelectionMixin } from '../components/coverage-selection-mixin';
 import { getPeriodLabel, getPeriodDate } from './../helpers/periods';
 import { getMeasures } from '../../../api/measures';
-import { getFacet } from '../../../api/issues';
 import { getTimeMachineData } from '../../../api/time-machine';
 
 
@@ -48,9 +47,15 @@ const METRICS_LIST = [
 
   'sqale_index',
   'new_technical_debt',
+  'code_smells',
+  'new_code_smells',
   'sqale_rating',
   'reliability_rating',
-  'security_rating'
+  'bugs',
+  'new_bugs',
+  'security_rating',
+  'vulnerabilities',
+  'new_vulnerabilities'
 ];
 
 const HISTORY_METRICS_LIST = [
@@ -77,24 +82,12 @@ export default React.createClass({
   },
 
   componentDidMount() {
-    Promise.all([
-      this.requestMeasures(),
-      this.requestIssues(),
-      this.requestNewIssues()
-    ]).then(responses => {
-      const measures = this.getMeasuresValues(responses[0]);
-      const typesFacet = responses[1];
-      measures['code_smells'] = this.getFacetCount(typesFacet, 'CODE_SMELL');
-      measures['bugs'] = this.getFacetCount(typesFacet, 'BUG');
-      measures['vulnerabilities'] = this.getFacetCount(typesFacet, 'VULNERABILITY');
+    this.requestMeasures().then(r => {
+      const measures = this.getMeasuresValues(r);
 
       let leak;
       if (this.state.leakPeriodDate) {
-        const newTypesFacet = responses[2];
-        leak = this.getMeasuresValues(responses[0], Number(this.props.leakPeriodIndex));
-        leak['new_code_smells'] = this.getFacetCount(newTypesFacet, 'CODE_SMELL');
-        leak['new_bugs'] = this.getFacetCount(newTypesFacet, 'BUG');
-        leak['new_vulnerabilities'] = this.getFacetCount(newTypesFacet, 'VULNERABILITY');
+        leak = this.getMeasuresValues(r, Number(this.props.leakPeriodIndex));
       }
 
       this.setState({
@@ -121,31 +114,6 @@ export default React.createClass({
     return values;
   },
 
-  requestIssues (criteria = {}) {
-    const { component } = this.props;
-    const query = {
-      componentUuids: component.id,
-      resolved: false,
-      ...criteria
-    };
-    return getFacet(query, 'types').then(r => r.facet);
-  },
-
-  requestNewIssues () {
-    const { leakPeriodDate } = this.state;
-
-    if (!leakPeriodDate) {
-      return Promise.resolve();
-    }
-
-    const createdAfter = moment(leakPeriodDate).format('YYYY-MM-DDTHH:mm:ssZZ');
-    return this.requestIssues({ createdAfter });
-  },
-
-  getFacetCount (facet, value) {
-    return facet.find(item => item.val === value).count;
-  },
-
   requestHistory () {
     const coverageMetric = this.state.coverageMetricPrefix + 'coverage';
     const metrics = [].concat(HISTORY_METRICS_LIST, coverageMetric).join(',');
diff --git a/server/sonar-web/src/main/js/apps/overview/main/risk.js b/server/sonar-web/src/main/js/apps/overview/main/risk.js
index 4afae273f82..122162d7312 100644
--- a/server/sonar-web/src/main/js/apps/overview/main/risk.js
+++ b/server/sonar-web/src/main/js/apps/overview/main/risk.js
@@ -36,7 +36,7 @@ import { TooltipsMixin } from '../../../components/mixins/tooltips-mixin';
 import { Legend } from '../components/legend';
 import { getMetricName } from '../helpers/metrics';
 import { formatMeasure } from '../../../helpers/measures';
-import { translate } from '../../../helpers/l10n';
+import { translate, translateWithParameters } from '../../../helpers/l10n';
 
 
 export const Risk = React.createClass({
@@ -52,6 +52,8 @@ export const Risk = React.createClass({
       return null;
     }
 
+    const { snapshotDate } = this.props.component;
+    const formattedSnapshotDate = moment(snapshotDate).format('LLL');
     const createdAfter = moment(this.props.leakPeriodDate).format('YYYY-MM-DDTHH:mm:ssZZ');
     const newBugs = this.props.leak['new_bugs'] || 0;
     const newVulnerabilities = this.props.leak['new_vulnerabilities'] || 0;
@@ -64,14 +66,22 @@ export const Risk = React.createClass({
           <IssuesLink
               component={this.props.component.key}
               params={{ resolved: 'false', types: 'BUG', createdAfter }}>
-            {formatMeasure(newBugs, 'SHORT_INT')}
+            <span
+                title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                data-toggle="tooltip">
+              {formatMeasure(newBugs, 'SHORT_INT')}
+            </span>
           </IssuesLink>
         </Measure>
         <Measure label={getMetricName('new_vulnerabilities')}>
           <IssuesLink
               component={this.props.component.key}
               params={{ resolved: 'false', types: 'VULNERABILITY', createdAfter }}>
-            {formatMeasure(newVulnerabilities, 'SHORT_INT')}
+            <span
+                title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                data-toggle="tooltip">
+              {formatMeasure(newVulnerabilities, 'SHORT_INT')}
+            </span>
           </IssuesLink>
         </Measure>
       </MeasuresList>
@@ -79,6 +89,8 @@ export const Risk = React.createClass({
   },
 
   render () {
+    const { snapshotDate } = this.props.component;
+    const formattedSnapshotDate = moment(snapshotDate).format('LLL');
     const bugs = this.props.measures['bugs'] || 0;
     const vulnerabilities = this.props.measures['vulnerabilities'] || 0;
 
@@ -92,7 +104,10 @@ export const Risk = React.createClass({
 
             <Measure composite={true}>
               <div className="display-inline-block text-middle big-spacer-right">
-                <div className="overview-domain-measure-value">
+                <div
+                    className="overview-domain-measure-value"
+                    title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                    data-toggle="tooltip">
                   <DrilldownLink component={this.props.component.key} metric="reliability_rating">
                     <Rating value={this.props.measures['reliability_rating']}/>
                   </DrilldownLink>
@@ -103,7 +118,11 @@ export const Risk = React.createClass({
                   <IssuesLink
                       component={this.props.component.key}
                       params={{ resolved: 'false', types: 'BUG' }}>
-                    {formatMeasure(bugs, 'SHORT_INT')}
+                    <span
+                        title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                        data-toggle="tooltip">
+                      {formatMeasure(bugs, 'SHORT_INT')}
+                    </span>
                   </IssuesLink>
                 </div>
                 <div className="overview-domain-measure-label">{getMetricName('bugs')}</div>
@@ -112,7 +131,10 @@ export const Risk = React.createClass({
 
             <Measure composite={true}>
               <div className="display-inline-block text-middle big-spacer-right">
-                <div className="overview-domain-measure-value">
+                <div
+                    className="overview-domain-measure-value"
+                    title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                    data-toggle="tooltip">
                   <DrilldownLink component={this.props.component.key} metric="security_rating">
                     <Rating value={this.props.measures['security_rating']}/>
                   </DrilldownLink>
@@ -123,7 +145,11 @@ export const Risk = React.createClass({
                   <IssuesLink
                       component={this.props.component.key}
                       params={{ resolved: 'false', types: 'VULNERABILITY' }}>
-                    {formatMeasure(vulnerabilities, 'SHORT_INT')}
+                    <span
+                        title={translateWithParameters('widget.as_calculated_on_x', formattedSnapshotDate)}
+                        data-toggle="tooltip">
+                      {formatMeasure(vulnerabilities, 'SHORT_INT')}
+                    </span>
                   </IssuesLink>
                 </div>
                 <div className="overview-domain-measure-label">{getMetricName('vulnerabilities')}</div>
diff --git a/server/sonar-web/src/main/js/main/app.js b/server/sonar-web/src/main/js/main/app.js
index 90f27396cfa..e3341bf337d 100644
--- a/server/sonar-web/src/main/js/main/app.js
+++ b/server/sonar-web/src/main/js/main/app.js
@@ -60,7 +60,8 @@ function prepareAppOptions (navResponse) {
         key: navResponse.component.key,
         name: navResponse.component.name,
         qualifier: _.last(navResponse.component.breadcrumbs).qualifier,
-        breadcrumbs: navResponse.component.breadcrumbs
+        breadcrumbs: navResponse.component.breadcrumbs,
+        snapshotDate: navResponse.component.snapshotDate
       };
     }
   }