From d8a3ee36764e4c3e33f5c73a3c5f9e73cdd5ec13 Mon Sep 17 00:00:00 2001
From: Ildar Kamalov <i.kamalov@adguard.com>
Date: Tue, 11 Sep 2018 12:40:01 +0300
Subject: [PATCH] change graph stats to 24 hours

Closes #328
---
 client/src/api/Api.js                         | 10 ++++------
 client/src/components/Dashboard/Statistics.js |  4 +---
 client/src/helpers/helpers.js                 |  6 +++---
 3 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/client/src/api/Api.js b/client/src/api/Api.js
index 4f7923ec..1ba54271 100644
--- a/client/src/api/Api.js
+++ b/client/src/api/Api.js
@@ -1,6 +1,5 @@
 import axios from 'axios';
-import startOfToday from 'date-fns/start_of_today';
-import endOfToday from 'date-fns/end_of_today';
+import subHours from 'date-fns/sub_hours';
 import dateFormat from 'date-fns/format';
 
 export default class Api {
@@ -51,13 +50,12 @@ export default class Api {
     getGlobalStatsHistory() {
         const { path, method } = this.GLOBAL_STATS_HISTORY;
         const format = 'YYYY-MM-DDTHH:mm:ssZ';
-        const todayStart = dateFormat(startOfToday(), format);
-        const todayEnd = dateFormat(endOfToday(), format);
+        const dateNow = Date.now();
 
         const config = {
             params: {
-                start_time: todayStart,
-                end_time: todayEnd,
+                start_time: dateFormat(subHours(dateNow, 24), format),
+                end_time: dateFormat(dateNow, format),
                 time_unit: 'hours',
             },
         };
diff --git a/client/src/components/Dashboard/Statistics.js b/client/src/components/Dashboard/Statistics.js
index fa556079..de98e19c 100644
--- a/client/src/components/Dashboard/Statistics.js
+++ b/client/src/components/Dashboard/Statistics.js
@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import Card from '../ui/Card';
 
 const Statistics = props => (
-    <Card title="Statistics" subtitle="Today" bodyType="card-graph" refresh={props.refreshButton}>
+    <Card title="Statistics" subtitle="Last 24 hours" bodyType="card-graph" refresh={props.refreshButton}>
         {props.history ?
             <ResponsiveLine
                 data={props.history}
@@ -23,7 +23,6 @@ const Statistics = props => (
                     tickSize: 5,
                     tickPadding: 5,
                     tickRotation: -45,
-                    legend: 'time',
                     legendOffset: 50,
                     legendPosition: 'center',
                 }}
@@ -32,7 +31,6 @@ const Statistics = props => (
                     tickSize: 5,
                     tickPadding: 5,
                     tickRotation: 0,
-                    legend: 'count',
                     legendOffset: -40,
                     legendPosition: 'center',
                 }}
diff --git a/client/src/helpers/helpers.js b/client/src/helpers/helpers.js
index e186047c..d6269d8a 100644
--- a/client/src/helpers/helpers.js
+++ b/client/src/helpers/helpers.js
@@ -1,6 +1,6 @@
 import dateParse from 'date-fns/parse';
 import dateFormat from 'date-fns/format';
-import startOfToday from 'date-fns/start_of_today';
+import subHours from 'date-fns/sub_hours';
 import addHours from 'date-fns/add_hours';
 import round from 'lodash/round';
 
@@ -37,10 +37,10 @@ export const normalizeLogs = logs => logs.map((log) => {
 export const normalizeHistory = history => Object.keys(history).map((key) => {
     const id = key.replace(/_/g, ' ').replace(/^\w/, c => c.toUpperCase());
 
-    const today = startOfToday();
+    const dayAgo = subHours(Date.now(), 24);
 
     const data = history[key].map((item, index) => {
-        const formatHour = dateFormat(addHours(today, index), 'HH:mm');
+        const formatHour = dateFormat(addHours(dayAgo, index), 'ddd HH:00');
         const roundValue = round(item, 2);
 
         return {