addressing PR comments

elastic · Feb 4, 2021 · f80a99d · f80a99d
1 parent 7619127
commit f80a99d
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 22 deletions.
diff --git a/x-pack/plugins/apm/common/utils/formatters/datetime.test.ts b/x-pack/plugins/apm/common/utils/formatters/datetime.test.ts
@@ -168,37 +168,52 @@ describe('date time formatters', () => {
     it('milliseconds', () => {
       const start = moment('2019-10-29 08:00:00.001');
       const end = moment('2019-10-29 08:00:00.005');
-      expect(getDateDifference(start, end, 'milliseconds')).toEqual(4);
+      expect(
+        getDateDifference({ start, end, unitOfTime: 'milliseconds' })
+      ).toEqual(4);
     });
     it('seconds', () => {
       const start = moment('2019-10-29 08:00:00');
       const end = moment('2019-10-29 08:00:10');
-      expect(getDateDifference(start, end, 'seconds')).toEqual(10);
+      expect(getDateDifference({ start, end, unitOfTime: 'seconds' })).toEqual(
+        10
+      );
     });
     it('minutes', () => {
       const start = moment('2019-10-29 08:00:00');
       const end = moment('2019-10-29 08:15:00');
-      expect(getDateDifference(start, end, 'minutes')).toEqual(15);
+      expect(getDateDifference({ start, end, unitOfTime: 'minutes' })).toEqual(
+        15
+      );
     });
     it('hours', () => {
       const start = moment('2019-10-29 08:00:00');
       const end = moment('2019-10-29 10:00:00');
-      expect(getDateDifference(start, end, 'hours')).toEqual(2);
+      expect(getDateDifference({ start, end, unitOfTime: 'hours' })).toEqual(2);
     });
     it('days', () => {
       const start = moment('2019-10-29 08:00:00');
       const end = moment('2019-10-30 10:00:00');
-      expect(getDateDifference(start, end, 'days')).toEqual(1);
+      expect(getDateDifference({ start, end, unitOfTime: 'days' })).toEqual(1);
     });
     it('months', () => {
       const start = moment('2019-10-29 08:00:00');
       const end = moment('2019-12-29 08:00:00');
-      expect(getDateDifference(start, end, 'months')).toEqual(2);
+      expect(getDateDifference({ start, end, unitOfTime: 'months' })).toEqual(
+        2
+      );
     });
     it('years', () => {
       const start = moment('2019-10-29 08:00:00');
       const end = moment('2020-10-29 08:00:00');
-      expect(getDateDifference(start, end, 'years')).toEqual(1);
+      expect(getDateDifference({ start, end, unitOfTime: 'years' })).toEqual(1);
+    });
+    it('precise days', () => {
+      const start = moment('2019-10-29 08:00:00');
+      const end = moment('2019-10-30 10:00:00');
+      expect(
+        getDateDifference({ start, end, unitOfTime: 'days', precise: true })
+      ).toEqual(1.0833333333333333);
     });
   });
 });
diff --git a/x-pack/plugins/apm/common/utils/formatters/datetime.ts b/x-pack/plugins/apm/common/utils/formatters/datetime.ts
@@ -57,37 +57,43 @@ function getDateFormat(dateUnit: DateUnit) {
   }
 }
 
-export const getDateDifference = (
-  start: moment.Moment,
-  end: moment.Moment,
-  unitOfTime: DateUnit | TimeUnit
-) => end.diff(start, unitOfTime);
+export const getDateDifference = ({
+  start,
+  end,
+  unitOfTime,
+  precise,
+}: {
+  start: moment.Moment;
+  end: moment.Moment;
+  unitOfTime: DateUnit | TimeUnit;
+  precise?: boolean;
+}) => end.diff(start, unitOfTime, precise);
 
 function getFormatsAccordingToDateDifference(
   start: moment.Moment,
   end: moment.Moment
 ) {
-  if (getDateDifference(start, end, 'years') >= 5) {
+  if (getDateDifference({ start, end, unitOfTime: 'years' }) >= 5) {
     return { dateFormat: getDateFormat('years') };
   }
 
-  if (getDateDifference(start, end, 'months') >= 5) {
+  if (getDateDifference({ start, end, unitOfTime: 'months' }) >= 5) {
     return { dateFormat: getDateFormat('months') };
   }
 
   const dateFormatWithDays = getDateFormat('days');
-  if (getDateDifference(start, end, 'days') > 1) {
+  if (getDateDifference({ start, end, unitOfTime: 'days' }) > 1) {
     return { dateFormat: dateFormatWithDays };
   }
 
-  if (getDateDifference(start, end, 'minutes') >= 1) {
+  if (getDateDifference({ start, end, unitOfTime: 'minutes' }) >= 1) {
     return {
       dateFormat: dateFormatWithDays,
       timeFormat: getTimeFormat('minutes'),
     };
   }
 
-  if (getDateDifference(start, end, 'seconds') >= 10) {
+  if (getDateDifference({ start, end, unitOfTime: 'seconds' }) >= 10) {
     return {
       dateFormat: dateFormatWithDays,
       timeFormat: getTimeFormat('seconds'),

diff --git a/x-pack/plugins/apm/public/components/shared/time_comparison/index.tsx b/x-pack/plugins/apm/public/components/shared/time_comparison/index.tsx
@@ -23,8 +23,6 @@ const PrependContainer = styled.div`
   padding: 0 ${px(unit)};
 `;
 
-const weekDurationInHours = 24 * 7;
-
 function formatPreviousPeriodDates({
   momentStart,
   momentEnd,
@@ -63,17 +61,22 @@ function getSelectOptions({
     }),
   };
 
-  const dateDiffInHours = getDateDifference(momentStart, momentEnd, 'hours');
+  const dateDiff = getDateDifference({
+    start: momentStart,
+    end: momentEnd,
+    unitOfTime: 'days',
+    precise: true,
+  });
   const isRangeToNow = rangeTo === 'now';
 
   if (isRangeToNow) {
     // Less than or equals to one day
-    if (dateDiffInHours <= 24) {
+    if (dateDiff <= 1) {
       return [yesterdayOption, aWeekAgoOption];
     }
 
     // Less than or equals to one week
-    if (dateDiffInHours <= weekDurationInHours) {
+    if (dateDiff <= 7) {
       return [aWeekAgoOption];
     }
   }