SONAR-9385 SONAR-9436 Replace moment with react-intl

15 files changed, 124 insertions, 139 deletions

diff --git a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/utils-test.js.snap b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/utils-test.js.snap
index 06b8994c23d..1bc54255ce1 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/utils-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/utils-test.js.snap
@@ -4,11 +4,11 @@ exports[`generateCoveredLinesMetric should correctly generate covered lines metr
 Object {
   "data": Array [
     Object {
-      "x": 2017-04-27T06:21:32.000Z,
+      "x": 2017-04-27T08:21:32.000Z,
       "y": 88,
     },
     Object {
-      "x": 2017-04-30T21:06:24.000Z,
+      "x": 2017-04-30T23:06:24.000Z,
       "y": 50,
     },
   ],
@@ -23,11 +23,11 @@ Array [
   Object {
     "data": Array [
       Object {
-        "x": 2017-04-27T06:21:32.000Z,
+        "x": 2017-04-27T08:21:32.000Z,
         "y": 88,
       },
       Object {
-        "x": 2017-04-30T21:06:24.000Z,
+        "x": 2017-04-30T23:06:24.000Z,
         "y": 50,
       },
     ],
@@ -38,11 +38,11 @@ Array [
   Object {
     "data": Array [
       Object {
-        "x": 2017-04-27T06:21:32.000Z,
+        "x": 2017-04-27T08:21:32.000Z,
         "y": 100,
       },
       Object {
-        "x": 2017-04-30T21:06:24.000Z,
+        "x": 2017-04-30T23:06:24.000Z,
         "y": 100,
       },
     ],
@@ -57,9 +57,9 @@ exports[`getAnalysesByVersionByDay should also filter analysis based on the quer
 Array [
   Object {
     "byDay": Object {
-      "2017-4-18": Array [
+      "1495065600000": Array [
         Object {
-          "date": 2017-05-18T12:13:07.000Z,
+          "date": 2017-05-18T14:13:07.000Z,
           "events": Array [
             Object {
               "category": "QUALITY_PROFILE",
@@ -76,9 +76,9 @@ Array [
   },
   Object {
     "byDay": Object {
-      "2017-4-16": Array [
+      "1494892800000": Array [
         Object {
-          "date": 2017-05-16T05:09:59.000Z,
+          "date": 2017-05-16T07:09:59.000Z,
           "events": Array [
             Object {
               "category": "VERSION",
@@ -105,9 +105,9 @@ exports[`getAnalysesByVersionByDay should also filter analysis based on the quer
 Array [
   Object {
     "byDay": Object {
-      "2017-5-9": Array [
+      "1496966400000": Array [
         Object {
-          "date": 2017-06-09T09:12:27.000Z,
+          "date": 2017-06-09T11:12:27.000Z,
           "events": Array [],
           "key": "AVyM9n3cHjR_PLDzRciT",
         },
@@ -118,9 +118,9 @@ Array [
   },
   Object {
     "byDay": Object {
-      "2017-4-18": Array [
+      "1495065600000": Array [
         Object {
-          "date": 2017-05-18T12:13:07.000Z,
+          "date": 2017-05-18T14:13:07.000Z,
           "events": Array [
             Object {
               "category": "QUALITY_PROFILE",
@@ -131,9 +131,9 @@ Array [
           "key": "AVxZtCpH7841nF4RNEMI",
         },
       ],
-      "2017-5-9": Array [
+      "1496966400000": Array [
         Object {
-          "date": 2017-06-09T09:12:27.000Z,
+          "date": 2017-06-09T11:12:27.000Z,
           "events": Array [
             Object {
               "category": "VERSION",
@@ -160,9 +160,9 @@ exports[`getAnalysesByVersionByDay should correctly map analysis by versions and
 Array [
   Object {
     "byDay": Object {
-      "2017-5-9": Array [
+      "1496966400000": Array [
         Object {
-          "date": 2017-06-09T11:06:10.000Z,
+          "date": 2017-06-09T13:06:10.000Z,
           "events": Array [
             Object {
               "category": "VERSION",
@@ -173,7 +173,7 @@ Array [
           "key": "AVyMjlK1HjR_PLDzRbB9",
         },
         Object {
-          "date": 2017-06-09T09:12:27.000Z,
+          "date": 2017-06-09T11:12:27.000Z,
           "events": Array [],
           "key": "AVyM9n3cHjR_PLDzRciT",
         },
@@ -184,9 +184,9 @@ Array [
   },
   Object {
     "byDay": Object {
-      "2017-4-18": Array [
+      "1495065600000": Array [
         Object {
-          "date": 2017-05-18T12:13:07.000Z,
+          "date": 2017-05-18T14:13:07.000Z,
           "events": Array [
             Object {
               "category": "QUALITY_PROFILE",
@@ -197,14 +197,14 @@ Array [
           "key": "AVxZtCpH7841nF4RNEMI",
         },
         Object {
-          "date": 2017-05-18T05:17:32.000Z,
+          "date": 2017-05-18T07:17:32.000Z,
           "events": Array [],
           "key": "AVwaa1qkpbBde8B6UhYI",
         },
       ],
-      "2017-5-9": Array [
+      "1496966400000": Array [
         Object {
-          "date": 2017-06-09T09:12:27.000Z,
+          "date": 2017-06-09T11:12:27.000Z,
           "events": Array [
             Object {
               "category": "VERSION",
@@ -221,9 +221,16 @@ Array [
   },
   Object {
     "byDay": Object {
-      "2017-4-16": Array [
+      "1494288000000": Array [
         Object {
-          "date": 2017-05-16T05:09:59.000Z,
+          "date": 2017-05-09T12:03:59.000Z,
+          "events": Array [],
+          "key": "AVvtGF3IY6vCuQNDdwxI",
+        },
+      ],
+      "1494892800000": Array [
+        Object {
+          "date": 2017-05-16T07:09:59.000Z,
           "events": Array [
             Object {
               "category": "VERSION",
@@ -239,13 +246,6 @@ Array [
           "key": "AVwQF7kwl-nNFgFWOJ3V",
         },
       ],
-      "2017-4-9": Array [
-        Object {
-          "date": 2017-05-09T10:03:59.000Z,
-          "events": Array [],
-          "key": "AVvtGF3IY6vCuQNDdwxI",
-        },
-      ],
     },
     "key": "AVyM9oI1HjR_PLDzRciU",
     "version": "1.0",
@@ -257,26 +257,26 @@ exports[`getAnalysesByVersionByDay should create fake version 1`] = `
 Array [
   Object {
     "byDay": Object {
-      "2017-4-18": Array [
+      "1495065600000": Array [
         Object {
-          "date": 2017-05-18T12:13:07.000Z,
+          "date": 2017-05-18T14:13:07.000Z,
           "events": Array [],
           "key": "AVxZtCpH7841nF4RNEMI",
         },
       ],
-      "2017-5-9": Array [
+      "1496966400000": Array [
         Object {
-          "date": 2017-06-09T11:06:10.000Z,
+          "date": 2017-06-09T13:06:10.000Z,
           "events": Array [],
           "key": "AVyMjlK1HjR_PLDzRbB9",
         },
         Object {
-          "date": 2017-06-09T09:12:27.000Z,
+          "date": 2017-06-09T11:12:27.000Z,
           "events": Array [],
           "key": "AVyM9n3cHjR_PLDzRciT",
         },
         Object {
-          "date": 2017-06-09T09:12:27.000Z,
+          "date": 2017-06-09T11:12:27.000Z,
           "events": Array [],
           "key": "AVyMjlK1HjR_PLDzRbB9",
         },
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/utils-test.js b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/utils-test.js
index 2ee3b2cfe3d..455c679d2d7 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/utils-test.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/utils-test.js
@@ -19,22 +19,23 @@
  */
 // @flow
 import * as utils from '../utils';
+import * as dates from '../../../helpers/dates';
 
 const ANALYSES = [
   {
     key: 'AVyMjlK1HjR_PLDzRbB9',
-    date: new Date('2017-06-09T13:06:10+0200'),
+    date: new Date('2017-06-09T13:06:10.000Z'),
     events: [{ key: 'AVyM9oI1HjR_PLDzRciU', category: 'VERSION', name: '1.1-SNAPSHOT' }]
   },
-  { key: 'AVyM9n3cHjR_PLDzRciT', date: new Date('2017-06-09T11:12:27+0200'), events: [] },
+  { key: 'AVyM9n3cHjR_PLDzRciT', date: new Date('2017-06-09T11:12:27.000Z'), events: [] },
   {
     key: 'AVyMjlK1HjR_PLDzRbB9',
-    date: new Date('2017-06-09T11:12:27+0200'),
+    date: new Date('2017-06-09T11:12:27.000Z'),
     events: [{ key: 'AVyM9oI1HjR_PLDzRciU', category: 'VERSION', name: '1.1' }]
   },
   {
     key: 'AVxZtCpH7841nF4RNEMI',
-    date: new Date('2017-05-18T14:13:07+0200'),
+    date: new Date('2017-05-18T14:13:07.000Z'),
     events: [
       {
         key: 'AVxZtC-N7841nF4RNEMJ',
@@ -43,10 +44,10 @@ const ANALYSES = [
       }
     ]
   },
-  { key: 'AVwaa1qkpbBde8B6UhYI', date: new Date('2017-05-18T07:17:32+0200'), events: [] },
+  { key: 'AVwaa1qkpbBde8B6UhYI', date: new Date('2017-05-18T07:17:32.000Z'), events: [] },
   {
     key: 'AVwQF7kwl-nNFgFWOJ3V',
-    date: new Date('2017-05-16T07:09:59+0200'),
+    date: new Date('2017-05-16T07:09:59.000Z'),
     events: [
       { key: 'AVyM9oI1HjR_PLDzRciU', category: 'VERSION', name: '1.0' },
       {
@@ -56,22 +57,22 @@ const ANALYSES = [
       }
     ]
   },
-  { key: 'AVvtGF3IY6vCuQNDdwxI', date: new Date('2017-05-09T12:03:59+0200'), events: [] }
+  { key: 'AVvtGF3IY6vCuQNDdwxI', date: new Date('2017-05-09T12:03:59.000Z'), events: [] }
 ];
 
 const HISTORY = [
   {
     metric: 'lines_to_cover',
     history: [
-      { date: new Date('2017-04-27T08:21:32+0200'), value: '100' },
-      { date: new Date('2017-04-30T23:06:24+0200'), value: '100' }
+      { date: new Date('2017-04-27T08:21:32.000Z'), value: '100' },
+      { date: new Date('2017-04-30T23:06:24.000Z'), value: '100' }
     ]
   },
   {
     metric: 'uncovered_lines',
     history: [
-      { date: new Date('2017-04-27T08:21:32+0200'), value: '12' },
-      { date: new Date('2017-04-30T23:06:24+0200'), value: '50' }
+      { date: new Date('2017-04-27T08:21:32.000Z'), value: '12' },
+      { date: new Date('2017-04-30T23:06:24.000Z'), value: '50' }
     ]
   }
 ];
@@ -83,7 +84,7 @@ const METRICS = [
 
 const QUERY = {
   category: '',
-  from: new Date('2017-04-27T08:21:32+0200'),
+  from: new Date('2017-04-27T08:21:32.000Z'),
   graph: utils.DEFAULT_GRAPH,
   project: 'foo',
   to: undefined,
@@ -91,16 +92,6 @@ const QUERY = {
   customMetrics: ['foo', 'bar', 'baz']
 };
 
-jest.mock('moment', () => date => ({
-  startOf: () => {
-    return {
-      valueOf: () => `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`
-    };
-  },
-  toDate: () => new Date(date),
-  format: format => `Formated.${format}:${date.valueOf()}`
-}));
-
 describe('generateCoveredLinesMetric', () => {
   it('should correctly generate covered lines metric', () => {
     expect(utils.generateCoveredLinesMetric(HISTORY[1], HISTORY)).toMatchSnapshot();
@@ -116,6 +107,12 @@ describe('generateSeries', () => {
 });
 
 describe('getAnalysesByVersionByDay', () => {
+  dates.startOfDay = jest.fn(date => {
+    const startDay = new Date(date);
+    startDay.setUTCHours(0, 0, 0, 0);
+    return startDay;
+  });
+
   it('should correctly map analysis by versions and by days', () => {
     expect(
       utils.getAnalysesByVersionByDay(ANALYSES, {
@@ -141,8 +138,8 @@ describe('getAnalysesByVersionByDay', () => {
         customMetrics: [],
         graph: utils.DEFAULT_GRAPH,
         project: 'foo',
-        to: new Date('2017-06-09T11:12:27+0200'),
-        from: new Date('2017-05-18T14:13:07+0200')
+        to: new Date('2017-06-09T11:12:27.000Z'),
+        from: new Date('2017-05-18T14:13:07.000Z')
       })
     ).toMatchSnapshot();
   });
@@ -150,10 +147,10 @@ describe('getAnalysesByVersionByDay', () => {
     expect(
       utils.getAnalysesByVersionByDay(
         [
-          { key: 'AVyMjlK1HjR_PLDzRbB9', date: new Date('2017-06-09T13:06:10+0200'), events: [] },
-          { key: 'AVyM9n3cHjR_PLDzRciT', date: new Date('2017-06-09T11:12:27+0200'), events: [] },
-          { key: 'AVyMjlK1HjR_PLDzRbB9', date: new Date('2017-06-09T11:12:27+0200'), events: [] },
-          { key: 'AVxZtCpH7841nF4RNEMI', date: new Date('2017-05-18T14:13:07+0200'), events: [] }
+          { key: 'AVyMjlK1HjR_PLDzRbB9', date: new Date('2017-06-09T13:06:10.000Z'), events: [] },
+          { key: 'AVyM9n3cHjR_PLDzRciT', date: new Date('2017-06-09T11:12:27.000Z'), events: [] },
+          { key: 'AVyMjlK1HjR_PLDzRbB9', date: new Date('2017-06-09T11:12:27.000Z'), events: [] },
+          { key: 'AVxZtCpH7841nF4RNEMI', date: new Date('2017-05-18T14:13:07.000Z'), events: [] }
         ],
         {
           category: '',
@@ -208,7 +205,7 @@ describe('parseQuery', () => {
   it('should parse query with default values', () => {
     expect(
       utils.parseQuery({
-        from: '2017-04-27T08:21:32+0200',
+        from: '2017-04-27T08:21:32.000Z',
         id: 'foo',
         custom_metrics: 'foo,bar,baz'
       })
@@ -219,11 +216,11 @@ describe('parseQuery', () => {
 describe('serializeQuery', () => {
   it('should serialize query for api request', () => {
     expect(utils.serializeQuery(QUERY)).toEqual({
-      from: 'Formated.YYYY-MM-DDTHH:mm:ssZZ:1493274092000',
+      from: '2017-04-27T08:21:32+0000',
       project: 'foo'
     });
     expect(utils.serializeQuery({ ...QUERY, graph: 'coverage', category: 'test' })).toEqual({
-      from: 'Formated.YYYY-MM-DDTHH:mm:ssZZ:1493274092000',
+      from: '2017-04-27T08:21:32+0000',
       project: 'foo',
       category: 'test'
     });
@@ -233,14 +230,14 @@ describe('serializeQuery', () => {
 describe('serializeUrlQuery', () => {
   it('should serialize query for url', () => {
     expect(utils.serializeUrlQuery(QUERY)).toEqual({
-      from: 'Formated.YYYY-MM-DDTHH:mm:ssZZ:1493274092000',
+      from: '2017-04-27T08:21:32+0000',
       id: 'foo',
       custom_metrics: 'foo,bar,baz'
     });
     expect(
       utils.serializeUrlQuery({ ...QUERY, graph: 'coverage', category: 'test', customMetrics: [] })
     ).toEqual({
-      from: 'Formated.YYYY-MM-DDTHH:mm:ssZZ:1493274092000',
+      from: '2017-04-27T08:21:32+0000',
       id: 'foo',
       graph: 'coverage',
       category: 'test'
@@ -256,8 +253,8 @@ describe('hasHistoryData', () => {
           name: 'foo',
           type: 'INT',
           data: [
-            { x: new Date('2017-04-27T08:21:32+0200'), y: 2 },
-            { x: new Date('2017-04-30T23:06:24+0200'), y: 2 }
+            { x: new Date('2017-04-27T08:21:32.000Z'), y: 2 },
+            { x: new Date('2017-04-30T23:06:24.000Z'), y: 2 }
           ]
         }
       ])
@@ -273,8 +270,8 @@ describe('hasHistoryData', () => {
           name: 'bar',
           type: 'INT',
           data: [
-            { x: new Date('2017-04-27T08:21:32+0200'), y: 2 },
-            { x: new Date('2017-04-30T23:06:24+0200'), y: 2 }
+            { x: new Date('2017-04-27T08:21:32.000Z'), y: 2 },
+            { x: new Date('2017-04-30T23:06:24.000Z'), y: 2 }
           ]
         }
       ])
@@ -284,7 +281,7 @@ describe('hasHistoryData', () => {
         {
           name: 'bar',
           type: 'INT',
-          data: [{ x: new Date('2017-04-27T08:21:32+0200'), y: 2 }]
+          data: [{ x: new Date('2017-04-27T08:21:32.000Z'), y: 2 }]
         }
       ])
     ).toBeFalsy();
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsHistory.js b/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsHistory.js
index 4e5be7ea5db..044b1462323 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsHistory.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsHistory.js
@@ -18,7 +18,6 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
-import moment from 'moment';
 import { isEqual, sortBy } from 'lodash';
 import DeferredSpinner from '../../../components/common/DeferredSpinner';
 import GraphHistory from './GraphHistory';
@@ -87,7 +86,7 @@ export default class GraphsHistory extends React.PureComponent {
       return acc.concat({
         className: event.category,
         name: event.name,
-        date: moment(analysis.date).toDate()
+        date: new Date(analysis.date)
       });
     }, []);
     return sortBy(filteredEvents, 'date');
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltips.js b/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltips.js
index 4eb0e719a28..320f934e028 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltips.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltips.js
@@ -20,7 +20,7 @@
 // @flow
 import React from 'react';
 import BubblePopup from '../../../components/common/BubblePopup';
-import FormattedDate from '../../../components/ui/FormattedDate';
+import DateTimeFormatter from '../../../components/intl/DateTimeFormatter';
 import GraphsTooltipsContent from './GraphsTooltipsContent';
 import GraphsTooltipsContentEvents from './GraphsTooltipsContentEvents';
 import GraphsTooltipsContentCoverage from './GraphsTooltipsContentCoverage';
@@ -98,7 +98,7 @@ export default class GraphsTooltips extends React.PureComponent {
       <BubblePopup customClass={customClass} position={{ top, left, width: TOOLTIP_WIDTH }}>
         <div className="project-activity-graph-tooltip">
           <div className="project-activity-graph-tooltip-title spacer-bottom">
-            <FormattedDate date={this.props.selectedDate} format="LL" />
+            <DateTimeFormatter date={this.props.selectedDate} />
           </div>
           <table className="width-100">
             <tbody>
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysesList.js b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysesList.js
index 7f69288c33d..7b94b01483c 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysesList.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysesList.js
@@ -20,10 +20,9 @@
 // @flow
 import React from 'react';
 import classNames from 'classnames';
-import moment from 'moment';
 import { throttle } from 'lodash';
 import ProjectActivityAnalysis from './ProjectActivityAnalysis';
-import FormattedDate from '../../../components/ui/FormattedDate';
+import DateFormatter from '../../../components/intl/DateFormatter';
 import { translate } from '../../../helpers/l10n';
 import {
   activityQueryChanged,
@@ -191,12 +190,9 @@ export default class ProjectActivityAnalysesList extends React.PureComponent {
                 </div>}
               <ul className="project-activity-days-list">
                 {days.map(day =>
-                  <li
-                    key={day}
-                    className="project-activity-day"
-                    data-day={moment(Number(day)).format('YYYY-MM-DD')}>
+                  <li key={day} className="project-activity-day">
                     <div className="project-activity-date">
-                      <FormattedDate date={Number(day)} format="LL" />
+                      <DateFormatter date={Number(day)} long={true} />
                     </div>
                     <ul className="project-activity-analyses-list">
                       {version.byDay[day] != null &&
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysis.js b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysis.js
index f52a59b5943..bc17b6a46b6 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysis.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysis.js
@@ -23,7 +23,7 @@ import classNames from 'classnames';
 import Events from './Events';
 import AddEventForm from './forms/AddEventForm';
 import RemoveAnalysisForm from './forms/RemoveAnalysisForm';
-import FormattedDate from '../../../components/ui/FormattedDate';
+import TimeTooltipFormatter from '../../../components/intl/TimeTooltipFormatter';
 import { translate } from '../../../helpers/l10n';
 /*:: import type { Analysis } from '../types'; */
 
@@ -65,7 +65,7 @@ export default class ProjectActivityAnalysis extends React.PureComponent {
         role="listitem"
         tabIndex="0">
         <div className="project-activity-time spacer-right">
-          <FormattedDate className="text-middle" date={date} format="LT" tooltipFormat="LTS" />
+          <TimeTooltipFormatter className="text-middle" date={date} placement="right" />
         </div>
         <div className="project-activity-analysis-icon big-spacer-right" title={analysisTitle} />
 
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityApp.js b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityApp.js
index cdc41b48e99..2de698d4b52 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityApp.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityApp.js
@@ -20,7 +20,6 @@
 // @flow
 import React from 'react';
 import Helmet from 'react-helmet';
-import moment from 'moment';
 import ProjectActivityPageHeader from './ProjectActivityPageHeader';
 import ProjectActivityAnalysesList from './ProjectActivityAnalysesList';
 import ProjectActivityGraphs from './ProjectActivityGraphs';
@@ -89,7 +88,7 @@ export default function ProjectActivityApp(props /*: Props */) {
         <div className="project-activity-layout-page-main">
           <ProjectActivityGraphs
             analyses={analyses}
-            leakPeriodDate={moment(props.project.leakPeriodDate).toDate()}
+            leakPeriodDate={new Date(props.project.leakPeriodDate)}
             loading={props.graphLoading}
             measuresHistory={measuresHistory}
             metrics={props.metrics}
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAppContainer.js b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAppContainer.js
index 61e9bd077c2..172e0d35bcf 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAppContainer.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAppContainer.js
@@ -19,7 +19,6 @@
  */
 // @flow
 import React from 'react';
-import moment from 'moment';
 import { connect } from 'react-redux';
 import { withRouter } from 'react-router';
 import ProjectActivityApp from './ProjectActivityApp';
@@ -173,7 +172,7 @@ class ProjectActivityAppContainer extends React.PureComponent {
     return api
       .getProjectActivity({ ...parameters, ...additional })
       .then(({ analyses, paging }) => ({
-        analyses: analyses.map(analysis => ({ ...analysis, date: moment(analysis.date).toDate() })),
+        analyses: analyses.map(analysis => ({ ...analysis, date: new Date(analysis.date) })),
         paging
       }));
   };
@@ -187,7 +186,7 @@ class ProjectActivityAppContainer extends React.PureComponent {
         measures.map(measure => ({
           metric: measure.metric,
           history: measure.history.map(analysis => ({
-            date: moment(analysis.date).toDate(),
+            date: new Date(analysis.date),
             value: analysis.value
           }))
         })),
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityDateInput.js b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityDateInput.js
index 1ece1355970..f6f85c29c9b 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityDateInput.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityDateInput.js
@@ -19,8 +19,9 @@
  */
 // @flow
 import React from 'react';
-import moment from 'moment';
+import { intlShape } from 'react-intl';
 import DateInput from '../../../components/controls/DateInput';
+import { formatterOption } from '../../../components/intl/DateFormatter';
 import { parseAsDate } from '../../../helpers/query';
 import { translate } from '../../../helpers/l10n';
 /*:: import type { RawQuery } from '../../../helpers/query'; */
@@ -36,13 +37,18 @@ type Props = {
 export default class ProjectActivityDateInput extends React.PureComponent {
   /*:: props: Props; */
 
+  static contextTypes = {
+    intl: intlShape
+  };
+
   handleFromDateChange = (from /*: string */) => this.props.onChange({ from: parseAsDate(from) });
 
   handleToDateChange = (to /*: string */) => this.props.onChange({ to: parseAsDate(to) });
 
   handleResetClick = () => this.props.onChange({ from: null, to: null });
 
-  formatDate = (date /*: ?Date */) => (date ? moment(date).format('YYYY-MM-DD') : null);
+  formatDate = (date /*: ?Date */) =>
+    date ? this.context.intl.formatDate(date, formatterOption) : undefined;
 
   render() {
     return (
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/ProjectActivityAnalysesList-test.js b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/ProjectActivityAnalysesList-test.js
index 30864a995f9..6a0c61741f2 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/ProjectActivityAnalysesList-test.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/ProjectActivityAnalysesList-test.js
@@ -20,6 +20,7 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 import ProjectActivityAnalysesList from '../ProjectActivityAnalysesList';
+import * as dates from '../../../../helpers/dates';
 import { DEFAULT_GRAPH } from '../../utils';
 
 const ANALYSES = [
@@ -83,18 +84,14 @@ const DEFAULT_PROPS = {
   updateQuery: () => {}
 };
 
-jest.mock('moment', () => date => ({
-  startOf: () => {
-    return {
-      valueOf: () => `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`
-    };
-  },
-  toDate: () => new Date(date),
-  format: format => `Formated.${format}:${date}`
-}));
-
 window.Number = val => val;
 
+dates.startOfDay = jest.fn(date => {
+  const startDay = new Date(date);
+  startDay.setUTCHours(0, 0, 0, 0);
+  return startDay;
+});
+
 it('should render correctly', () => {
   expect(shallow(<ProjectActivityAnalysesList {...DEFAULT_PROPS} />)).toMatchSnapshot();
 });
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/ProjectActivityDateInput-test.js b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/ProjectActivityDateInput-test.js
index fa199664561..6b93eaae296 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/ProjectActivityDateInput-test.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/ProjectActivityDateInput-test.js
@@ -18,12 +18,12 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallowWithIntl } from '../../../../helpers/testUtils';
 import ProjectActivityDateInput from '../ProjectActivityDateInput';
 
 it('should render correctly the date inputs', () => {
   expect(
-    shallow(
+    shallowWithIntl(
       <ProjectActivityDateInput
         from={new Date('2016-10-27T12:21:15+0000')}
         to={new Date('2016-12-27T12:21:15+0000')}
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/GraphsTooltips-test.js.snap b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/GraphsTooltips-test.js.snap
index aea593d413e..e2ab4b039a8 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/GraphsTooltips-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/GraphsTooltips-test.js.snap
@@ -17,9 +17,8 @@ exports[`should not add separators if not needed 1`] = `
     <div
       className="project-activity-graph-tooltip-title spacer-bottom"
     >
-      <FormattedDate
+      <DateTimeFormatter
         date={2011-10-01T22:01:00.000Z}
-        format="LL"
       />
     </div>
     <table
@@ -53,9 +52,8 @@ exports[`should render correctly for issues graphs 1`] = `
     <div
       className="project-activity-graph-tooltip-title spacer-bottom"
     >
-      <FormattedDate
+      <DateTimeFormatter
         date={2011-10-01T22:01:00.000Z}
-        format="LL"
       />
     </div>
     <table
@@ -109,9 +107,8 @@ exports[`should render correctly for random graphs 1`] = `
     <div
       className="project-activity-graph-tooltip-title spacer-bottom"
     >
-      <FormattedDate
+      <DateTimeFormatter
         date={2011-10-25T10:27:41.000Z}
-        format="LL"
       />
     </div>
     <table
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityAnalysesList-test.js.snap b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityAnalysesList-test.js.snap
index 32622085444..00938d611a8 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityAnalysesList-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityAnalysesList-test.js.snap
@@ -25,14 +25,13 @@ exports[`should correctly filter analyses by category 1`] = `
     >
       <li
         className="project-activity-day"
-        data-day="Formated.YYYY-MM-DD:2016-9-24"
       >
         <div
           className="project-activity-date"
         >
-          <FormattedDate
-            date="2016-9-24"
-            format="LL"
+          <DateFormatter
+            date="1477267200000"
+            long={true}
           />
         </div>
         <ul
@@ -95,14 +94,13 @@ exports[`should correctly filter analyses by date range 1`] = `
     >
       <li
         className="project-activity-day"
-        data-day="Formated.YYYY-MM-DD:2016-9-27"
       >
         <div
           className="project-activity-date"
         >
-          <FormattedDate
-            date="2016-9-27"
-            format="LL"
+          <DateFormatter
+            date="1477526400000"
+            long={true}
           />
         </div>
         <ul
@@ -165,14 +163,13 @@ exports[`should render correctly 1`] = `
     >
       <li
         className="project-activity-day"
-        data-day="Formated.YYYY-MM-DD:2016-9-27"
       >
         <div
           className="project-activity-date"
         >
-          <FormattedDate
-            date="2016-9-27"
-            format="LL"
+          <DateFormatter
+            date="1477526400000"
+            long={true}
           />
         </div>
         <ul
@@ -241,14 +238,13 @@ exports[`should render correctly 1`] = `
     >
       <li
         className="project-activity-day"
-        data-day="Formated.YYYY-MM-DD:2016-9-26"
       >
         <div
           className="project-activity-date"
         >
-          <FormattedDate
-            date="2016-9-26"
-            format="LL"
+          <DateFormatter
+            date="1477440000000"
+            long={true}
           />
         </div>
         <ul
@@ -288,14 +284,13 @@ exports[`should render correctly 1`] = `
       </li>
       <li
         className="project-activity-day"
-        data-day="Formated.YYYY-MM-DD:2016-9-24"
       >
         <div
           className="project-activity-date"
         >
-          <FormattedDate
-            date="2016-9-24"
-            format="LL"
+          <DateFormatter
+            date="1477267200000"
+            long={true}
           />
         </div>
         <ul
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityDateInput-test.js.snap b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityDateInput-test.js.snap
index bc15b05c60e..95d05668fef 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityDateInput-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityDateInput-test.js.snap
@@ -8,7 +8,7 @@ exports[`should render correctly the date inputs 1`] = `
     name="from"
     onChange={[Function]}
     placeholder="from"
-    value="2016-10-27"
+    value="10/27/2016"
   />
   —
   <DateInput
@@ -17,7 +17,7 @@ exports[`should render correctly the date inputs 1`] = `
     name="to"
     onChange={[Function]}
     placeholder="to"
-    value="2016-12-27"
+    value="12/27/2016"
   />
   <button
     className="spacer-left"
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/utils.js b/server/sonar-web/src/main/js/apps/projectActivity/utils.js
index 12694dba2bf..03eb0510b61 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/utils.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/utils.js
@@ -18,7 +18,6 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 // @flow
-import moment from 'moment';
 import { chunk, flatMap, groupBy, isEqual, sortBy } from 'lodash';
 import {
   cleanQuery,
@@ -29,6 +28,7 @@ import {
   serializeDate,
   serializeString
 } from '../../helpers/query';
+import { startOfDay } from '../../helpers/dates';
 import { getLocalizedMetricName, translate } from '../../helpers/l10n';
 /*:: import type { Analysis, MeasureHistory, Metric, Query } from './types'; */
 /*:: import type { RawQuery } from '../../helpers/query'; */
@@ -157,7 +157,7 @@ export function getAnalysesByVersionByDay(analyses /*: Array<Analysis> */, query
       acc.push(currentVersion);
     }
 
-    const day = moment(analysis.date).startOf('day').valueOf().toString();
+    const day = startOfDay(new Date(analysis.date)).getTime().toString();
 
     let matchFilters = true;
     if (query.category || query.from || query.to) {