From 5b45301178758133abc9b1cec96b8687e07f7223 Mon Sep 17 00:00:00 2001 From: Mike Cao Date: Thu, 30 Jul 2020 23:08:33 -0700 Subject: [PATCH] Added year option. --- components/DateFilter.js | 1 + components/PageviewsChart.js | 3 +++ lib/date.js | 14 +++++++++++++- pages/api/website/[id]/pageviews.js | 2 +- 4 files changed, 18 insertions(+), 2 deletions(-) diff --git a/components/DateFilter.js b/components/DateFilter.js index 25647db1..2889dde3 100644 --- a/components/DateFilter.js +++ b/components/DateFilter.js @@ -10,6 +10,7 @@ const filterOptions = [ { label: 'Today', value: '1day' }, { label: 'This week', value: '1week' }, { label: 'This month', value: '1month' }, + { label: 'This year', value: '1year' }, ]; export default function DateFilter({ value, onChange }) { diff --git a/components/PageviewsChart.js b/components/PageviewsChart.js index d3d6c444..0f65640e 100644 --- a/components/PageviewsChart.js +++ b/components/PageviewsChart.js @@ -12,12 +12,15 @@ export default function PageviewsChart({ data, unit, children }) { (label, index, values) => { const d = new Date(values[index].value); const n = data.pageviews.length; + switch (unit) { case 'day': if (n >= 15) { return index % ~~(n / 15) === 0 ? format(d, 'MMM d') : ''; } return format(d, 'EEE M/d'); + case 'month': + return format(d, 'MMMM'); default: return label; } diff --git a/lib/date.js b/lib/date.js index 0ea3b4e0..978ede6a 100644 --- a/lib/date.js +++ b/lib/date.js @@ -3,18 +3,22 @@ import { addMinutes, addHours, addDays, + addMonths, subHours, subDays, startOfHour, startOfDay, startOfWeek, startOfMonth, + startOfYear, endOfHour, endOfDay, endOfWeek, endOfMonth, + endOfYear, differenceInHours, differenceInCalendarDays, + differenceInMonths, } from 'date-fns'; export function getTimezone() { @@ -28,7 +32,7 @@ export function getLocalTime(t) { export function getDateRange(value) { const now = new Date(); - const { num, unit } = value.match(/^(?[0-9]+)(?hour|day|week|month)$/).groups; + const { num, unit } = value.match(/^(?[0-9]+)(?hour|day|week|month|year)$/).groups; if (+num === 1) { switch (unit) { @@ -53,6 +57,13 @@ export function getDateRange(value) { unit: 'day', value, }; + case 'year': + return { + startDate: startOfYear(now), + endDate: endOfYear(now), + unit: 'month', + value, + }; } } @@ -77,6 +88,7 @@ export function getDateRange(value) { const dateFuncs = { hour: [differenceInHours, addHours, startOfHour], day: [differenceInCalendarDays, addDays, startOfDay], + month: [differenceInMonths, addMonths, startOfMonth], }; export function getDateArray(data, startDate, endDate, unit) { diff --git a/pages/api/website/[id]/pageviews.js b/pages/api/website/[id]/pageviews.js index 578fbcbf..1987f72f 100644 --- a/pages/api/website/[id]/pageviews.js +++ b/pages/api/website/[id]/pageviews.js @@ -7,7 +7,7 @@ export default async (req, res) => { const { id, start_at, end_at, unit, tz } = req.query; - if (!moment.tz.zone(tz) || !['hour', 'day'].includes(unit)) { + if (!moment.tz.zone(tz) || !['month', 'hour', 'day'].includes(unit)) { return res.status(400).end(); }