SONAR-13796 Display the full date when hovering a date from now

18 files changed, 69 insertions, 253 deletions

diff --git a/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.tsx b/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.tsx
index e0b3c6e04e6..8a18a4abd33 100644
--- a/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.tsx
+++ b/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.tsx
@@ -20,9 +20,7 @@
 import * as React from 'react';
 import { Link } from 'react-router';
 import HelpTooltip from 'sonar-ui-common/components/controls/HelpTooltip';
-import Tooltip from 'sonar-ui-common/components/controls/Tooltip';
 import DateFromNow from 'sonar-ui-common/components/intl/DateFromNow';
-import DateTimeFormatter from 'sonar-ui-common/components/intl/DateTimeFormatter';
 import Level from 'sonar-ui-common/components/ui/Level';
 import { translate, translateWithParameters } from 'sonar-ui-common/helpers/l10n';
 import MetaLink from '../../../app/components/nav/component/projectInformation/meta/MetaLink';
@@ -56,11 +54,7 @@ export default function ProjectCard({ project }: Props) {
         {lastAnalysisDate !== undefined ? (
           <div className="account-project-analysis">
             <DateFromNow date={lastAnalysisDate}>
-              {fromNow => (
-                <Tooltip overlay={<DateTimeFormatter date={lastAnalysisDate} />}>
-                  <span>{translateWithParameters('my_account.projects.analyzed_x', fromNow)}</span>
-                </Tooltip>
-              )}
+              {fromNow => translateWithParameters('my_account.projects.analyzed_x', fromNow)}
             </DateFromNow>
           </div>
         ) : (
diff --git a/server/sonar-web/src/main/js/apps/overview/branches/Analysis.tsx b/server/sonar-web/src/main/js/apps/overview/branches/Analysis.tsx
index 540f2eb6023..a165bd38d72 100644
--- a/server/sonar-web/src/main/js/apps/overview/branches/Analysis.tsx
+++ b/server/sonar-web/src/main/js/apps/overview/branches/Analysis.tsx
@@ -19,7 +19,7 @@
  */
 import { sortBy } from 'lodash';
 import * as React from 'react';
-import DateTooltipFormatter from 'sonar-ui-common/components/intl/DateTooltipFormatter';
+import DateTimeFormatter from 'sonar-ui-common/components/intl/DateTimeFormatter';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import { ComponentQualifier } from '../../../types/component';
 import Event from './Event';
@@ -48,7 +48,7 @@ export function Analysis({ analysis, ...props }: AnalysisProps) {
     <li className="overview-analysis">
       <div className="small little-spacer-bottom">
         <strong>
-          <DateTooltipFormatter date={analysis.date} />
+          <DateTimeFormatter date={analysis.date} />
         </strong>
       </div>
 
diff --git a/server/sonar-web/src/main/js/apps/overview/branches/__tests__/__snapshots__/Analysis-test.tsx.snap b/server/sonar-web/src/main/js/apps/overview/branches/__tests__/__snapshots__/Analysis-test.tsx.snap
index e8a36493871..68f3e147e62 100644
--- a/server/sonar-web/src/main/js/apps/overview/branches/__tests__/__snapshots__/Analysis-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/overview/branches/__tests__/__snapshots__/Analysis-test.tsx.snap
@@ -8,7 +8,7 @@ exports[`should render correctly 1`] = `
     className="small little-spacer-bottom"
   >
     <strong>
-      <DateTooltipFormatter
+      <DateTimeFormatter
         date="2017-03-01T09:36:01+0100"
       />
     </strong>
@@ -48,7 +48,7 @@ exports[`should render correctly 2`] = `
     className="small little-spacer-bottom"
   >
     <strong>
-      <DateTooltipFormatter
+      <DateTimeFormatter
         date="2017-03-01T09:36:01+0100"
       />
     </strong>
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
deleted file mode 100644
index 0475bc60ecb..00000000000
--- a/server/sonar-web/src/main/js/apps/overview/components/ApplicationLeakPeriodLegend.tsx
+++ /dev/null
@@ -1,116 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2020 SonarSource SA
- * mailto:info AT sonarsource DOT com
- *
- * This program is free software; you can redistribute it and/or
- * modify it under the terms of the GNU Lesser General Public
- * License as published by the Free Software Foundation; either
- * version 3 of the License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
- * Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * along with this program; if not, write to the Free Software Foundation,
- * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
- */
-import * as classNames from 'classnames';
-import { sortBy } from 'lodash';
-import * as React from 'react';
-import Tooltip from 'sonar-ui-common/components/controls/Tooltip';
-import DateFromNow from 'sonar-ui-common/components/intl/DateFromNow';
-import DateTooltipFormatter from 'sonar-ui-common/components/intl/DateTooltipFormatter';
-import { translate, translateWithParameters } from 'sonar-ui-common/helpers/l10n';
-import { getApplicationLeak } from '../../../api/application';
-import { Branch } from '../../../types/branch-like';
-
-interface Props {
-  branch?: Branch;
-  component: T.LightComponent;
-}
-
-interface State {
-  leaks?: Array<{ date: string; project: string; projectName: string }>;
-}
-
-export default class ApplicationLeakPeriodLegend extends React.Component<Props, State> {
-  mounted = false;
-  state: State = {};
-
-  componentDidMount() {
-    this.mounted = true;
-    this.fetchLeaks();
-  }
-
-  componentWillReceiveProps(nextProps: Props) {
-    if (nextProps.component.key !== this.props.component.key) {
-      this.setState({ leaks: undefined });
-    }
-  }
-
-  componentWillUnmount() {
-    this.mounted = false;
-  }
-
-  fetchLeaks = () => {
-    if (!this.state.leaks) {
-      getApplicationLeak(
-        this.props.component.key,
-        this.props.branch ? this.props.branch.name : undefined
-      ).then(
-        leaks => {
-          if (this.mounted) {
-            this.setState({
-              leaks: sortBy(leaks, value => {
-                return new Date(value.date);
-              })
-            });
-          }
-        },
-        () => {
-          if (this.mounted) {
-            this.setState({ leaks: undefined });
-          }
-        }
-      );
-    }
-  };
-
-  renderOverlay = () =>
-    this.state.leaks != null ? (
-      <ul className="text-left">
-        {this.state.leaks.map(leak => (
-          <li key={leak.project}>
-            {leak.projectName}: <DateTooltipFormatter date={leak.date} />
-          </li>
-        ))}
-      </ul>
-    ) : (
-      <i className="spinner spacer" />
-    );
-
-  render() {
-    const leak = this.state.leaks && this.state.leaks.length > 0 ? this.state.leaks[0] : undefined;
-    return (
-      <Tooltip overlay={this.renderOverlay()}>
-        <div className={classNames('overview-legend', { 'overview-legend-spaced-line': !leak })}>
-          {translate('issues.max_new_code_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/projectBranches/components/BranchLikeRow.tsx b/server/sonar-web/src/main/js/apps/projectBranches/components/BranchLikeRow.tsx
index 526a911abc0..cf7a64577a7 100644
--- a/server/sonar-web/src/main/js/apps/projectBranches/components/BranchLikeRow.tsx
+++ b/server/sonar-web/src/main/js/apps/projectBranches/components/BranchLikeRow.tsx
@@ -60,9 +60,7 @@ export function BranchLikeRow(props: BranchLikeRowProps) {
       <td className="nowrap">
         <BranchStatus branchLike={branchLike} component={component.key} />
       </td>
-      <td className="nowrap">
-        {branchLike.analysisDate && <DateFromNow date={branchLike.analysisDate} />}
-      </td>
+      <td className="nowrap">{<DateFromNow date={branchLike.analysisDate} />}</td>
       {displayPurgeSetting && isBranch(branchLike) && (
         <td className="nowrap js-test-purge-toggle-container">
           <BranchPurgeSetting branch={branchLike} component={component} />
diff --git a/server/sonar-web/src/main/js/apps/projectsManagement/ProjectRow.tsx b/server/sonar-web/src/main/js/apps/projectsManagement/ProjectRow.tsx
index fe4a70a5f4a..855b937ff2f 100644
--- a/server/sonar-web/src/main/js/apps/projectsManagement/ProjectRow.tsx
+++ b/server/sonar-web/src/main/js/apps/projectsManagement/ProjectRow.tsx
@@ -22,7 +22,7 @@ import { Link } from 'react-router';
 import Checkbox from 'sonar-ui-common/components/controls/Checkbox';
 import Tooltip from 'sonar-ui-common/components/controls/Tooltip';
 import QualifierIcon from 'sonar-ui-common/components/icons/QualifierIcon';
-import DateTooltipFormatter from 'sonar-ui-common/components/intl/DateTooltipFormatter';
+import DateFormatter from 'sonar-ui-common/components/intl/DateFormatter';
 import { Project } from '../../api/components';
 import PrivacyBadgeContainer from '../../components/common/PrivacyBadgeContainer';
 import { getComponentOverviewUrl } from '../../helpers/urls';
@@ -75,7 +75,7 @@ export default class ProjectRow extends React.PureComponent<Props> {
 
         <td className="thin nowrap text-right">
           {project.lastAnalysisDate ? (
-            <DateTooltipFormatter date={project.lastAnalysisDate} />
+            <DateFormatter date={project.lastAnalysisDate} />
           ) : (
             <span className="note">—</span>
           )}
diff --git a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/__snapshots__/ProjectRow-test.tsx.snap b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/__snapshots__/ProjectRow-test.tsx.snap
index c11442aa7ce..eb4b5da27bb 100644
--- a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/__snapshots__/ProjectRow-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/__snapshots__/ProjectRow-test.tsx.snap
@@ -260,7 +260,7 @@ exports[`renders: with lastAnalysisDate 1`] = `
   <td
     className="thin nowrap text-right"
   >
-    <DateTooltipFormatter
+    <DateFormatter
       date="2017-04-08T00:00:00.000Z"
     />
   </td>
diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/components/ProfileDate.tsx b/server/sonar-web/src/main/js/apps/quality-profiles/components/ProfileDate.tsx
deleted file mode 100644
index 0f620164b34..00000000000
--- a/server/sonar-web/src/main/js/apps/quality-profiles/components/ProfileDate.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2020 SonarSource SA
- * mailto:info AT sonarsource DOT com
- *
- * This program is free software; you can redistribute it and/or
- * modify it under the terms of the GNU Lesser General Public
- * License as published by the Free Software Foundation; either
- * version 3 of the License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
- * Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * along with this program; if not, write to the Free Software Foundation,
- * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
- */
-import * as React from 'react';
-import Tooltip from 'sonar-ui-common/components/controls/Tooltip';
-import DateFromNow from 'sonar-ui-common/components/intl/DateFromNow';
-import DateTimeFormatter from 'sonar-ui-common/components/intl/DateTimeFormatter';
-import { translate } from 'sonar-ui-common/helpers/l10n';
-
-interface Props {
-  date?: string;
-}
-
-export default function ProfileDate({ date }: Props) {
-  return date ? (
-    <Tooltip overlay={<DateTimeFormatter date={date} />}>
-      <span>
-        <DateFromNow date={date} />
-      </span>
-    </Tooltip>
-  ) : (
-    <span>{translate('never')}</span>
-  );
-}
diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.tsx b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.tsx
index ce4544487c2..52eb3badcdf 100644
--- a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.tsx
@@ -19,10 +19,10 @@
  */
 import * as React from 'react';
 import { IndexLink, Link } from 'react-router';
+import DateFromNow from 'sonar-ui-common/components/intl/DateFromNow';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import BuiltInQualityProfileBadge from '../components/BuiltInQualityProfileBadge';
 import ProfileActions from '../components/ProfileActions';
-import ProfileDate from '../components/ProfileDate';
 import ProfileLink from '../components/ProfileLink';
 import { Profile } from '../types';
 import { getProfileChangelogPath, getProfilesForLanguagePath, getProfilesPath } from '../utils';
@@ -67,10 +67,10 @@ export default class ProfileHeader extends React.PureComponent<Props> {
         <div className="pull-right">
           <ul className="list-inline" style={{ lineHeight: '24px' }}>
             <li className="small spacer-right">
-              {translate('quality_profiles.updated_')} <ProfileDate date={profile.rulesUpdatedAt} />
+              {translate('quality_profiles.updated_')} <DateFromNow date={profile.rulesUpdatedAt} />
             </li>
             <li className="small big-spacer-right">
-              {translate('quality_profiles.used_')} <ProfileDate date={profile.lastUsed} />
+              {translate('quality_profiles.used_')} <DateFromNow date={profile.lastUsed} />
             </li>
             <li>
               <Link
diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/__tests__/__snapshots__/ProfileHeader-test.tsx.snap b/server/sonar-web/src/main/js/apps/quality-profiles/details/__tests__/__snapshots__/ProfileHeader-test.tsx.snap
index dabf705a8b0..12132420745 100644
--- a/server/sonar-web/src/main/js/apps/quality-profiles/details/__tests__/__snapshots__/ProfileHeader-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/details/__tests__/__snapshots__/ProfileHeader-test.tsx.snap
@@ -60,14 +60,14 @@ exports[`should render correctly 1`] = `
       >
         quality_profiles.updated_
          
-        <ProfileDate />
+        <DateFromNow />
       </li>
       <li
         className="small big-spacer-right"
       >
         quality_profiles.used_
          
-        <ProfileDate />
+        <DateFromNow />
       </li>
       <li>
         <Link
diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/home/ProfilesListRow.tsx b/server/sonar-web/src/main/js/apps/quality-profiles/home/ProfilesListRow.tsx
index cb68e62875a..fc2cb985b35 100644
--- a/server/sonar-web/src/main/js/apps/quality-profiles/home/ProfilesListRow.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/home/ProfilesListRow.tsx
@@ -20,12 +20,12 @@
 import * as React from 'react';
 import { Link } from 'react-router';
 import Tooltip from 'sonar-ui-common/components/controls/Tooltip';
+import DateFromNow from 'sonar-ui-common/components/intl/DateFromNow';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import DocTooltip from '../../../components/docs/DocTooltip';
 import { getRulesUrl } from '../../../helpers/urls';
 import BuiltInQualityProfileBadge from '../components/BuiltInQualityProfileBadge';
 import ProfileActions from '../components/ProfileActions';
-import ProfileDate from '../components/ProfileDate';
 import ProfileLink from '../components/ProfileLink';
 import { Profile } from '../types';
 
@@ -104,11 +104,11 @@ export function ProfilesListRow(props: ProfilesListRowProps) {
       </td>
 
       <td className="quality-profiles-table-date thin nowrap text-middle text-right">
-        <ProfileDate date={profile.rulesUpdatedAt} />
+        <DateFromNow date={profile.rulesUpdatedAt} />
       </td>
 
       <td className="quality-profiles-table-date thin nowrap text-middle text-right">
-        <ProfileDate date={profile.lastUsed} />
+        <DateFromNow date={profile.lastUsed} />
       </td>
 
       <td className="quality-profiles-table-actions thin nowrap text-middle text-right">
diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/home/__tests__/__snapshots__/ProfilesListRow-test.tsx.snap b/server/sonar-web/src/main/js/apps/quality-profiles/home/__tests__/__snapshots__/ProfilesListRow-test.tsx.snap
index 60829b64142..f4761ea4483 100644
--- a/server/sonar-web/src/main/js/apps/quality-profiles/home/__tests__/__snapshots__/ProfilesListRow-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/home/__tests__/__snapshots__/ProfilesListRow-test.tsx.snap
@@ -87,12 +87,12 @@ exports[`should render correctly: built-in profile 1`] = `
   <td
     className="quality-profiles-table-date thin nowrap text-middle text-right"
   >
-    <ProfileDate />
+    <DateFromNow />
   </td>
   <td
     className="quality-profiles-table-date thin nowrap text-middle text-right"
   >
-    <ProfileDate />
+    <DateFromNow />
   </td>
   <td
     className="quality-profiles-table-actions thin nowrap text-middle text-right"
@@ -182,12 +182,12 @@ exports[`should render correctly: default 1`] = `
   <td
     className="quality-profiles-table-date thin nowrap text-middle text-right"
   >
-    <ProfileDate />
+    <DateFromNow />
   </td>
   <td
     className="quality-profiles-table-date thin nowrap text-middle text-right"
   >
-    <ProfileDate />
+    <DateFromNow />
   </td>
   <td
     className="quality-profiles-table-actions thin nowrap text-middle text-right"
@@ -308,12 +308,12 @@ exports[`should render correctly: default profile 1`] = `
   <td
     className="quality-profiles-table-date thin nowrap text-middle text-right"
   >
-    <ProfileDate />
+    <DateFromNow />
   </td>
   <td
     className="quality-profiles-table-date thin nowrap text-middle text-right"
   >
-    <ProfileDate />
+    <DateFromNow />
   </td>
   <td
     className="quality-profiles-table-actions thin nowrap text-middle text-right"
@@ -428,12 +428,12 @@ exports[`should render correctly: with deprecated rules 1`] = `
   <td
     className="quality-profiles-table-date thin nowrap text-middle text-right"
   >
-    <ProfileDate />
+    <DateFromNow />
   </td>
   <td
     className="quality-profiles-table-date thin nowrap text-middle text-right"
   >
-    <ProfileDate />
+    <DateFromNow />
   </td>
   <td
     className="quality-profiles-table-actions thin nowrap text-middle text-right"
diff --git a/server/sonar-web/src/main/js/apps/users/components/TokensFormItem.tsx b/server/sonar-web/src/main/js/apps/users/components/TokensFormItem.tsx
index a1ec4dc3d3a..b43fb3718d8 100644
--- a/server/sonar-web/src/main/js/apps/users/components/TokensFormItem.tsx
+++ b/server/sonar-web/src/main/js/apps/users/components/TokensFormItem.tsx
@@ -23,7 +23,7 @@ import { Button } from 'sonar-ui-common/components/controls/buttons';
 import ConfirmButton from 'sonar-ui-common/components/controls/ConfirmButton';
 import Tooltip from 'sonar-ui-common/components/controls/Tooltip';
 import DateFormatter from 'sonar-ui-common/components/intl/DateFormatter';
-import DateFromNowHourPrecision from 'sonar-ui-common/components/intl/DateFromNowHourPrecision';
+import DateFromNow from 'sonar-ui-common/components/intl/DateFromNow';
 import DeferredSpinner from 'sonar-ui-common/components/ui/DeferredSpinner';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import { limitComponentName } from 'sonar-ui-common/helpers/path';
@@ -90,7 +90,7 @@ export default class TokensFormItem extends React.PureComponent<Props, State> {
           </Tooltip>
         </td>
         <td className="nowrap">
-          <DateFromNowHourPrecision date={token.lastConnectionDate} />
+          <DateFromNow date={token.lastConnectionDate} hourPrecision={true} />
         </td>
         <td className="thin nowrap text-right">
           <DateFormatter date={token.createdAt} long={true} />
diff --git a/server/sonar-web/src/main/js/apps/users/components/UserListItem.tsx b/server/sonar-web/src/main/js/apps/users/components/UserListItem.tsx
index 2720b08425c..53c06adc190 100644
--- a/server/sonar-web/src/main/js/apps/users/components/UserListItem.tsx
+++ b/server/sonar-web/src/main/js/apps/users/components/UserListItem.tsx
@@ -20,7 +20,7 @@
 import * as React from 'react';
 import { ButtonIcon } from 'sonar-ui-common/components/controls/buttons';
 import BulletListIcon from 'sonar-ui-common/components/icons/BulletListIcon';
-import DateFromNowHourPrecision from 'sonar-ui-common/components/intl/DateFromNowHourPrecision';
+import DateFromNow from 'sonar-ui-common/components/intl/DateFromNow';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import Avatar from '../../../components/ui/Avatar';
 import TokensFormModal from './TokensFormModal';
@@ -61,7 +61,7 @@ export default class UserListItem extends React.PureComponent<Props, State> {
           <UserScmAccounts scmAccounts={user.scmAccounts || []} />
         </td>
         <td className="thin nowrap text-middle">
-          <DateFromNowHourPrecision date={user.lastConnectionDate} />
+          <DateFromNow date={user.lastConnectionDate} hourPrecision={true} />
         </td>
         {!organizationsEnabled && (
           <td className="thin nowrap text-middle">
diff --git a/server/sonar-web/src/main/js/apps/users/components/__tests__/__snapshots__/TokensFormItem-test.tsx.snap b/server/sonar-web/src/main/js/apps/users/components/__tests__/__snapshots__/TokensFormItem-test.tsx.snap
index efe5ea7b142..806e21ebc0a 100644
--- a/server/sonar-web/src/main/js/apps/users/components/__tests__/__snapshots__/TokensFormItem-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/users/components/__tests__/__snapshots__/TokensFormItem-test.tsx.snap
@@ -14,8 +14,9 @@ exports[`should render correctly 1`] = `
   <td
     className="nowrap"
   >
-    <DateFromNowHourPrecision
+    <DateFromNow
       date="2019-01-18T15:06:33+0100"
+      hourPrecision={true}
     />
   </td>
   <td
@@ -62,8 +63,9 @@ exports[`should render correctly 2`] = `
   <td
     className="nowrap"
   >
-    <DateFromNowHourPrecision
+    <DateFromNow
       date="2019-01-18T15:06:33+0100"
+      hourPrecision={true}
     />
   </td>
   <td
diff --git a/server/sonar-web/src/main/js/apps/users/components/__tests__/__snapshots__/UserListItem-test.tsx.snap b/server/sonar-web/src/main/js/apps/users/components/__tests__/__snapshots__/UserListItem-test.tsx.snap
index e0649832c3e..5e34a0c7b61 100644
--- a/server/sonar-web/src/main/js/apps/users/components/__tests__/__snapshots__/UserListItem-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/users/components/__tests__/__snapshots__/UserListItem-test.tsx.snap
@@ -32,8 +32,9 @@ exports[`should render correctly 1`] = `
   <td
     className="thin nowrap text-middle"
   >
-    <DateFromNowHourPrecision
+    <DateFromNow
       date="2019-01-18T15:06:33+0100"
+      hourPrecision={true}
     />
   </td>
   <td
@@ -118,8 +119,9 @@ exports[`should render correctly without last connection date 1`] = `
   <td
     className="thin nowrap text-middle"
   >
-    <DateFromNowHourPrecision
+    <DateFromNow
       date="2019-01-18T15:06:33+0100"
+      hourPrecision={true}
     />
   </td>
   <td
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.tsx b/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.tsx
index 3fbae07587b..30a09e06a14 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.tsx
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.tsx
@@ -20,10 +20,8 @@
 import * as React from 'react';
 import { ButtonLink } from 'sonar-ui-common/components/controls/buttons';
 import Toggler from 'sonar-ui-common/components/controls/Toggler';
-import Tooltip from 'sonar-ui-common/components/controls/Tooltip';
 import DropdownIcon from 'sonar-ui-common/components/icons/DropdownIcon';
 import DateFromNow from 'sonar-ui-common/components/intl/DateFromNow';
-import DateTimeFormatter from 'sonar-ui-common/components/intl/DateTimeFormatter';
 import ChangelogPopup from '../popups/ChangelogPopup';
 
 interface Props {
@@ -53,18 +51,14 @@ export default class IssueChangelog extends React.PureComponent<Props> {
           onRequestClose={this.handleClose}
           open={this.props.isOpen}
           overlay={<ChangelogPopup issue={this.props.issue} />}>
-          <Tooltip
-            mouseEnterDelay={0.5}
-            overlay={<DateTimeFormatter date={this.props.creationDate} />}>
-            <ButtonLink
-              className="issue-action issue-action-with-options js-issue-show-changelog"
-              onClick={this.handleClick}>
-              <span className="issue-meta-label">
-                <DateFromNow date={this.props.creationDate} />
-              </span>
-              <DropdownIcon className="little-spacer-left" />
-            </ButtonLink>
-          </Tooltip>
+          <ButtonLink
+            className="issue-action issue-action-with-options js-issue-show-changelog"
+            onClick={this.handleClick}>
+            <span className="issue-meta-label">
+              <DateFromNow date={this.props.creationDate} />
+            </span>
+            <DropdownIcon className="little-spacer-left" />
+          </ButtonLink>
         </Toggler>
       </div>
     );
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.tsx.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.tsx.snap
index fbce7a8945e..774bd2669b7 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.tsx.snap
@@ -28,30 +28,21 @@ exports[`should open the popup when the button is clicked 2`] = `
       />
     }
   >
-    <Tooltip
-      mouseEnterDelay={0.5}
-      overlay={
-        <DateTimeFormatter
-          date="2017-03-01T09:36:01+0100"
-        />
-      }
+    <ButtonLink
+      className="issue-action issue-action-with-options js-issue-show-changelog"
+      onClick={[Function]}
     >
-      <ButtonLink
-        className="issue-action issue-action-with-options js-issue-show-changelog"
-        onClick={[Function]}
+      <span
+        className="issue-meta-label"
       >
-        <span
-          className="issue-meta-label"
-        >
-          <DateFromNow
-            date="2017-03-01T09:36:01+0100"
-          />
-        </span>
-        <DropdownIcon
-          className="little-spacer-left"
+        <DateFromNow
+          date="2017-03-01T09:36:01+0100"
         />
-      </ButtonLink>
-    </Tooltip>
+      </span>
+      <DropdownIcon
+        className="little-spacer-left"
+      />
+    </ButtonLink>
   </Toggler>
 </div>
 `;
@@ -75,30 +66,21 @@ exports[`should render correctly 1`] = `
       />
     }
   >
-    <Tooltip
-      mouseEnterDelay={0.5}
-      overlay={
-        <DateTimeFormatter
-          date="2017-03-01T09:36:01+0100"
-        />
-      }
+    <ButtonLink
+      className="issue-action issue-action-with-options js-issue-show-changelog"
+      onClick={[Function]}
     >
-      <ButtonLink
-        className="issue-action issue-action-with-options js-issue-show-changelog"
-        onClick={[Function]}
+      <span
+        className="issue-meta-label"
       >
-        <span
-          className="issue-meta-label"
-        >
-          <DateFromNow
-            date="2017-03-01T09:36:01+0100"
-          />
-        </span>
-        <DropdownIcon
-          className="little-spacer-left"
+        <DateFromNow
+          date="2017-03-01T09:36:01+0100"
         />
-      </ButtonLink>
-    </Tooltip>
+      </span>
+      <DropdownIcon
+        className="little-spacer-left"
+      />
+    </ButtonLink>
   </Toggler>
 </div>
 `;