(props.color)}
+ colorBy={() => (color)}
tooltip={slice => (
{slice.data.map(d => (
diff --git a/client/src/containers/Clients.js b/client/src/containers/Clients.js
index 20f756d1..6651ceea 100644
--- a/client/src/containers/Clients.js
+++ b/client/src/containers/Clients.js
@@ -1,20 +1,22 @@
import { connect } from 'react-redux';
-import { getClients, getTopStats } from '../actions';
+import { getClients } from '../actions';
+import { getStats } from '../actions/stats';
import { addClient, updateClient, deleteClient, toggleClientModal } from '../actions/clients';
import Clients from '../components/Settings/Clients';
const mapStateToProps = (state) => {
- const { dashboard, clients } = state;
+ const { dashboard, clients, stats } = state;
const props = {
dashboard,
clients,
+ stats,
};
return props;
};
const mapDispatchToProps = {
getClients,
- getTopStats,
+ getStats,
addClient,
updateClient,
deleteClient,
diff --git a/client/src/containers/Dashboard.js b/client/src/containers/Dashboard.js
index d5874768..8d40df18 100644
--- a/client/src/containers/Dashboard.js
+++ b/client/src/containers/Dashboard.js
@@ -1,14 +1,23 @@
import { connect } from 'react-redux';
-import * as actionCreators from '../actions';
+import { toggleProtection, getClients } from '../actions';
+import { getStats, getStatsConfig, setStatsConfig } from '../actions/stats';
import Dashboard from '../components/Dashboard';
const mapStateToProps = (state) => {
- const { dashboard } = state;
- const props = { dashboard };
+ const { dashboard, stats } = state;
+ const props = { dashboard, stats };
return props;
};
+const mapDispatchToProps = {
+ toggleProtection,
+ getClients,
+ getStats,
+ getStatsConfig,
+ setStatsConfig,
+};
+
export default connect(
mapStateToProps,
- actionCreators,
+ mapDispatchToProps,
)(Dashboard);
diff --git a/client/src/helpers/helpers.js b/client/src/helpers/helpers.js
index def170f0..e84d2b27 100644
--- a/client/src/helpers/helpers.js
+++ b/client/src/helpers/helpers.js
@@ -2,11 +2,12 @@ import dateParse from 'date-fns/parse';
import dateFormat from 'date-fns/format';
import subHours from 'date-fns/sub_hours';
import addHours from 'date-fns/add_hours';
+import addDays from 'date-fns/add_days';
+import subDays from 'date-fns/sub_days';
import round from 'lodash/round';
import axios from 'axios';
import {
- STATS_NAMES,
STANDARD_DNS_PORT,
STANDARD_WEB_PORT,
STANDARD_HTTPS_PORT,
@@ -49,29 +50,28 @@ export const normalizeLogs = logs => logs.map((log) => {
};
});
-export const normalizeHistory = history => Object.keys(history).map((key) => {
- let id = STATS_NAMES[key];
- if (!id) {
- id = key.replace(/_/g, ' ').replace(/^\w/, c => c.toUpperCase());
+export const normalizeHistory = (history, interval) => {
+ if (interval === 1 || interval === 7) {
+ const hoursAgo = subHours(Date.now(), 24 * interval);
+ return history.map((item, index) => ({
+ x: dateFormat(addHours(hoursAgo, index), 'D MMM HH:00'),
+ y: round(item, 2),
+ }));
}
- const dayAgo = subHours(Date.now(), 24);
+ const daysAgo = subDays(Date.now(), interval - 1);
+ return history.map((item, index) => ({
+ x: dateFormat(addDays(daysAgo, index), 'D MMM YYYY'),
+ y: round(item, 2),
+ }));
+};
- const data = history[key].map((item, index) => {
- const formatHour = dateFormat(addHours(dayAgo, index), 'ddd HH:00');
- const roundValue = round(item, 2);
-
- return {
- x: formatHour,
- y: roundValue,
- };
- });
-
- return {
- id,
- data,
- };
-});
+export const normalizeTopStats = stats => (
+ stats.map(item => ({
+ name: Object.keys(item)[0],
+ count: Object.values(item)[0],
+ }))
+);
export const normalizeFilteringStatus = (filteringStatus) => {
const { enabled, filters, user_rules: userRules } = filteringStatus;
diff --git a/client/src/reducers/index.js b/client/src/reducers/index.js
index ef197cb8..2af571b2 100644
--- a/client/src/reducers/index.js
+++ b/client/src/reducers/index.js
@@ -94,27 +94,6 @@ const dashboard = handleActions({
return newState;
},
- [actions.getStatsRequest]: state => ({ ...state, processingStats: true }),
- [actions.getStatsFailure]: state => ({ ...state, processingStats: false }),
- [actions.getStatsSuccess]: (state, { payload }) => {
- const newState = { ...state, stats: payload, processingStats: false };
- return newState;
- },
-
- [actions.getTopStatsRequest]: state => ({ ...state, processingTopStats: true }),
- [actions.getTopStatsFailure]: state => ({ ...state, processingTopStats: false }),
- [actions.getTopStatsSuccess]: (state, { payload }) => {
- const newState = { ...state, topStats: payload, processingTopStats: false };
- return newState;
- },
-
- [actions.getStatsHistoryRequest]: state => ({ ...state, processingStatsHistory: true }),
- [actions.getStatsHistoryFailure]: state => ({ ...state, processingStatsHistory: false }),
- [actions.getStatsHistorySuccess]: (state, { payload }) => {
- const newState = { ...state, statsHistory: payload, processingStatsHistory: false };
- return newState;
- },
-
[actions.toggleLogStatusRequest]: state => ({ ...state, logStatusProcessing: true }),
[actions.toggleLogStatusFailure]: state => ({ ...state, logStatusProcessing: false }),
[actions.toggleLogStatusSuccess]: (state) => {
@@ -200,8 +179,6 @@ const dashboard = handleActions({
}, {
processing: true,
isCoreRunning: false,
- processingTopStats: true,
- processingStats: true,
logStatusProcessing: false,
processingVersion: true,
processingFiltering: true,
@@ -218,15 +195,6 @@ const dashboard = handleActions({
dnsVersion: '',
clients: [],
autoClients: [],
- topStats: [],
- stats: {
- dns_queries: '',
- blocked_filtering: '',
- replaced_safebrowsing: '',
- replaced_parental: '',
- replaced_safesearch: '',
- avg_processing_time: '',
- },
});
const queryLogs = handleActions({
diff --git a/client/src/reducers/stats.js b/client/src/reducers/stats.js
index 48e07bb5..3bae662d 100644
--- a/client/src/reducers/stats.js
+++ b/client/src/reducers/stats.js
@@ -2,26 +2,83 @@ import { handleActions } from 'redux-actions';
import * as actions from '../actions/stats';
-const stats = handleActions({
- [actions.getStatsConfigRequest]: state => ({ ...state, getConfigProcessing: true }),
- [actions.getStatsConfigFailure]: state => ({ ...state, getConfigProcessing: false }),
- [actions.getStatsConfigSuccess]: (state, { payload }) => ({
- ...state,
- interval: payload.interval,
- getConfigProcessing: false,
- }),
+const stats = handleActions(
+ {
+ [actions.getStatsConfigRequest]: state => ({ ...state, processingGetConfig: true }),
+ [actions.getStatsConfigFailure]: state => ({ ...state, processingGetConfig: false }),
+ [actions.getStatsConfigSuccess]: (state, { payload }) => ({
+ ...state,
+ interval: payload.interval,
+ processingGetConfig: false,
+ }),
- [actions.setStatsConfigRequest]: state => ({ ...state, setConfigProcessing: true }),
- [actions.setStatsConfigFailure]: state => ({ ...state, setConfigProcessing: false }),
- [actions.setStatsConfigSuccess]: (state, { payload }) => ({
- ...state,
- interval: payload.interval,
- setConfigProcessing: false,
- }),
-}, {
- getConfigProcessing: false,
- setConfigProcessing: false,
- interval: 1,
-});
+ [actions.setStatsConfigRequest]: state => ({ ...state, processingSetConfig: true }),
+ [actions.setStatsConfigFailure]: state => ({ ...state, processingSetConfig: false }),
+ [actions.setStatsConfigSuccess]: (state, { payload }) => ({
+ ...state,
+ interval: payload.interval,
+ processingSetConfig: false,
+ }),
+
+ [actions.getStatsRequest]: state => ({ ...state, processingStats: true }),
+ [actions.getStatsFailure]: state => ({ ...state, processingStats: false }),
+ [actions.getStatsSuccess]: (state, { payload }) => {
+ const {
+ dns_queries: dnsQueries,
+ blocked_filtering: blockedFiltering,
+ replaced_parental: replacedParental,
+ replaced_safebrowsing: replacedSafebrowsing,
+ top_blocked_domains: topBlockedDomains,
+ top_clients: topClients,
+ top_queried_domains: topQueriedDomains,
+ num_blocked_filtering: numBlockedFiltering,
+ num_dns_queries: numDnsQueries,
+ num_replaced_parental: numReplacedParental,
+ num_replaced_safebrowsing: numReplacedSafebrowsing,
+ num_replaced_safesearch: numReplacedSafesearch,
+ avg_processing_time: avgProcessingTime,
+ } = payload;
+
+ const newState = {
+ ...state,
+ processingStats: false,
+ dnsQueries,
+ blockedFiltering,
+ replacedParental,
+ replacedSafebrowsing,
+ topBlockedDomains,
+ topClients,
+ topQueriedDomains,
+ numBlockedFiltering,
+ numDnsQueries,
+ numReplacedParental,
+ numReplacedSafebrowsing,
+ numReplacedSafesearch,
+ avgProcessingTime,
+ };
+
+ return newState;
+ },
+ },
+ {
+ processingGetConfig: false,
+ processingSetConfig: false,
+ processingStats: true,
+ interval: 1,
+ dnsQueries: [],
+ blockedFiltering: [],
+ replacedParental: [],
+ replacedSafebrowsing: [],
+ topBlockedDomains: [],
+ topClients: [],
+ topQueriedDomains: [],
+ numBlockedFiltering: 0,
+ numDnsQueries: 0,
+ numReplacedParental: 0,
+ numReplacedSafebrowsing: 0,
+ numReplacedSafesearch: 0,
+ avgProcessingTime: 0,
+ },
+);
export default stats;