GOV-265 Application leak header should reflect oldest leak start

diff --git a/server/sonar-web/src/main/js/apps/overview/components/ApplicationLeakPeriodLegend.tsx b/server/sonar-web/src/main/js/apps/overview/components/ApplicationLeakPeriodLegend.tsx
index 4ff9c39f6706d687d009f90ce4bdf8a0f735d874..eb230682fcb8ee9dbcb466493a878f3cbaa7e1b2 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/components/ApplicationLeakPeriodLegend.tsx
+++ b/server/sonar-web/src/main/js/apps/overview/components/ApplicationLeakPeriodLegend.tsx
@@ -18,10 +18,13 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
+import * as classNames from 'classnames';
+import { sortBy } from 'lodash';
 import Tooltip from '../../../components/controls/Tooltip';
 import DateTooltipFormatter from '../../../components/intl/DateTooltipFormatter';
 import { getApplicationLeak } from '../../../api/application';
-import { translate } from '../../../helpers/l10n';
+import { translate, translateWithParameters } from '../../../helpers/l10n';
+import DateFromNow from '../../../components/intl/DateFromNow';
 
 interface Props {
   component: string;
@@ -37,6 +40,7 @@ export default class ApplicationLeakPeriodLegend extends React.Component<Props,
 
   componentDidMount() {
     this.mounted = true;
+    this.fetchLeaks();
   }
 
   componentWillReceiveProps(nextProps: Props) {
@@ -54,12 +58,16 @@ export default class ApplicationLeakPeriodLegend extends React.Component<Props,
       getApplicationLeak(this.props.component).then(
         leaks => {
           if (this.mounted) {
-            this.setState({ leaks });
+            this.setState({
+              leaks: sortBy(leaks, value => {
+                return new Date(value.date);
+              })
+            });
           }
         },
         () => {
           if (this.mounted) {
-            this.setState({ leaks: [] });
+            this.setState({ leaks: undefined });
           }
         }
       );
@@ -80,10 +88,22 @@ export default class ApplicationLeakPeriodLegend extends React.Component<Props,
     );
 
   render() {
+    const leak = this.state.leaks && this.state.leaks.length > 0 ? this.state.leaks[0] : undefined;
     return (
-      <Tooltip onShow={this.fetchLeaks} overlay={this.renderOverlay()}>
-        <div className="overview-legend  overview-legend-spaced-line">
-          {translate('issues.leak_period')}
+      <Tooltip overlay={this.renderOverlay()}>
+        <div className={classNames('overview-legend', { 'overview-legend-spaced-line': !leak })}>
+          {translate('issues.max_leak_period')}:{' '}
+          {leak && (
+            <>
+              <DateFromNow date={leak.date}>
+                {fromNow => <span>{translateWithParameters('overview.started_x', fromNow)}</span>}
+              </DateFromNow>
+              <br />
+              <span className="note">
+                {translate('from')}:{leak.projectName}
+              </span>
+            </>
+          )}
         </div>
       </Tooltip>
     );

diff --git a/server/sonar-web/src/main/js/apps/overview/components/__tests__/ApplicationLeakPeriodLegend-test.tsx b/server/sonar-web/src/main/js/apps/overview/components/__tests__/ApplicationLeakPeriodLegend-test.tsx
index f9c36d4c81c93452a906f0bdd8d35b36306a5131..27a71ac1851f90969cd699cdf1cb333da01e65ee 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/components/__tests__/ApplicationLeakPeriodLegend-test.tsx
+++ b/server/sonar-web/src/main/js/apps/overview/components/__tests__/ApplicationLeakPeriodLegend-test.tsx
@@ -35,7 +35,6 @@ it('renders', async () => {
   const wrapper = shallow(<ApplicationLeakPeriodLegend component="foo" />);
   expect(wrapper).toMatchSnapshot();
 
-  wrapper.find('Tooltip').prop<Function>('onShow')();
   await waitAndUpdate(wrapper);
   expect(wrapper).toMatchSnapshot();
 });

diff --git a/server/sonar-web/src/main/js/apps/overview/components/__tests__/__snapshots__/ApplicationLeakPeriodLegend-test.tsx.snap b/server/sonar-web/src/main/js/apps/overview/components/__tests__/__snapshots__/ApplicationLeakPeriodLegend-test.tsx.snap
index f873abb317d0a7364b6825318da110a090ac9fe3..6a5804570ebf5db7d80873c3c8005ec7886b5a3f 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/components/__tests__/__snapshots__/ApplicationLeakPeriodLegend-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/overview/components/__tests__/__snapshots__/ApplicationLeakPeriodLegend-test.tsx.snap
@@ -2,7 +2,6 @@
 
 exports[`renders 1`] = `
 <Tooltip
-  onShow={[Function]}
   overlay={
     <i
       className="spinner spinner-margin"
@@ -10,16 +9,17 @@ exports[`renders 1`] = `
   }
 >
   <div
-    className="overview-legend  overview-legend-spaced-line"
+    className="overview-legend overview-legend-spaced-line"
   >
-    issues.leak_period
+    issues.max_leak_period
+    :
+     
   </div>
 </Tooltip>
 `;
 
 exports[`renders 2`] = `
 <Tooltip
-  onShow={[Function]}
   overlay={
     <ul
       className="text-left"
@@ -42,9 +42,24 @@ exports[`renders 2`] = `
   }
 >
   <div
-    className="overview-legend  overview-legend-spaced-line"
+    className="overview-legend"
   >
-    issues.leak_period
+    issues.max_leak_period
+    :
+     
+    <React.Fragment>
+      <DateFromNow
+        date="2017-01-01T11:39:03+0100"
+      />
+      <br />
+      <span
+        className="note"
+      >
+        from
+        :
+        Foo
+      </span>
+    </React.Fragment>
   </div>
 </Tooltip>
 `;

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 c27b6630b337773c0912696742ce8999ee995e5b..70ac03a89788c257021e6b9439706d31f2ea628c 100644 (file)
--- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties
+++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
@@ -618,6 +618,7 @@ issues.to_navigate=to navigate
 issues.to_navigate_issue_locations=to navigate issue locations
 issues.to_switch_flows=to switch flows
 issues.leak_period=Leak Period
+issues.max_leak_period=Max Leak Period
 issues.my_issues=My Issues
 issues.no_my_issues=There are no issues assigned to you.
 issues.no_issues=No Issues. Hooray!