mirror of
https://github.com/kremalicious/umami.git
synced 2024-11-22 09:57:00 +01:00
Fixed date range calculations.
This commit is contained in:
parent
9f112c8cc9
commit
38abd673f3
@ -7,6 +7,9 @@ const filterOptions = [
|
||||
{ label: 'Last 7 days', value: '7day' },
|
||||
{ label: 'Last 30 days', value: '30day' },
|
||||
{ label: 'Last 90 days', value: '90day' },
|
||||
{ label: 'Today', value: '1day' },
|
||||
{ label: 'This week', value: '1week' },
|
||||
{ label: 'This month', value: '1month' },
|
||||
];
|
||||
|
||||
export default function DateFilter({ value, onChange }) {
|
||||
|
@ -9,13 +9,15 @@ export default function DropDown({ value, options = [], onChange }) {
|
||||
setShowMenu(state => !state);
|
||||
}
|
||||
|
||||
function handleSelect(value) {
|
||||
function handleSelect(value, e) {
|
||||
e.stopPropagation();
|
||||
setShowMenu(false);
|
||||
onChange(value);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
function hideMenu(e) {
|
||||
if (ref.current && !ref.current.contains(e.target)) {
|
||||
if (!ref.current.contains(e.target)) {
|
||||
setShowMenu(false);
|
||||
}
|
||||
}
|
||||
|
@ -18,13 +18,13 @@
|
||||
margin-top: 4px;
|
||||
border: 1px solid #b3b3b3;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.option {
|
||||
background: #fff;
|
||||
padding: 4px 8px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
@ -14,7 +14,7 @@ export default function PageviewsChart({ data, unit, children }) {
|
||||
const n = data.pageviews.length;
|
||||
switch (unit) {
|
||||
case 'day':
|
||||
if (n > 7) {
|
||||
if (n >= 15) {
|
||||
return index % ~~(n / 15) === 0 ? format(d, 'MMM d') : '';
|
||||
}
|
||||
return format(d, 'EEE M/d');
|
||||
|
@ -10,7 +10,7 @@ import DateFilter from './DateFilter';
|
||||
export default function WebsiteChart({ title, websiteId }) {
|
||||
const [data, setData] = useState();
|
||||
const [dateRange, setDateRange] = useState(getDateRange('7day'));
|
||||
const { startDate, endDate, unit } = dateRange;
|
||||
const { startDate, endDate, unit, value } = dateRange;
|
||||
|
||||
const [pageviews, uniques] = useMemo(() => {
|
||||
if (data) {
|
||||
@ -46,10 +46,10 @@ export default function WebsiteChart({ title, websiteId }) {
|
||||
<div className={styles.title}>{title}</div>
|
||||
<div className={styles.header}>
|
||||
<MetricsBar websiteId={websiteId} startDate={startDate} endDate={endDate} />
|
||||
<DateFilter value={dateRange.value} onChange={handleDateChange} />
|
||||
<DateFilter value={value} onChange={handleDateChange} />
|
||||
</div>
|
||||
<PageviewsChart data={{ pageviews, uniques }} unit={unit}>
|
||||
<QuickButtons value={dateRange.value} onChange={handleDateChange} />
|
||||
<QuickButtons value={value} onChange={handleDateChange} />
|
||||
</PageviewsChart>
|
||||
</div>
|
||||
);
|
||||
|
@ -1,7 +1,6 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { get } from 'lib/web';
|
||||
import WebsiteChart from './WebsiteChart';
|
||||
import DateFilter from './DateFilter';
|
||||
import styles from './WebsiteList.module.css';
|
||||
|
||||
export default function WebsiteList() {
|
||||
|
54
lib/date.js
54
lib/date.js
@ -7,10 +7,14 @@ import {
|
||||
subDays,
|
||||
startOfHour,
|
||||
startOfDay,
|
||||
startOfWeek,
|
||||
startOfMonth,
|
||||
endOfHour,
|
||||
endOfDay,
|
||||
endOfWeek,
|
||||
endOfMonth,
|
||||
differenceInHours,
|
||||
differenceInDays,
|
||||
differenceInCalendarDays,
|
||||
} from 'date-fns';
|
||||
|
||||
export function getTimezone() {
|
||||
@ -23,23 +27,47 @@ export function getLocalTime(t) {
|
||||
|
||||
export function getDateRange(value) {
|
||||
const now = new Date();
|
||||
const hour = endOfHour(now);
|
||||
const day = endOfDay(now);
|
||||
|
||||
const { num, unit } = value.match(/^(?<num>[0-9]+)(?<unit>hour|day)$/).groups;
|
||||
const { num, unit } = value.match(/^(?<num>[0-9]+)(?<unit>hour|day|week|month)$/).groups;
|
||||
|
||||
if (+num === 1) {
|
||||
switch (unit) {
|
||||
case 'day':
|
||||
return {
|
||||
startDate: startOfDay(now),
|
||||
endDate: endOfDay(now),
|
||||
unit: 'hour',
|
||||
value,
|
||||
};
|
||||
case 'week':
|
||||
return {
|
||||
startDate: startOfWeek(now),
|
||||
endDate: endOfWeek(now),
|
||||
unit: 'day',
|
||||
value,
|
||||
};
|
||||
case 'month':
|
||||
return {
|
||||
startDate: startOfMonth(now),
|
||||
endDate: endOfMonth(now),
|
||||
unit: 'day',
|
||||
value,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
switch (unit) {
|
||||
case 'day':
|
||||
return {
|
||||
startDate: subDays(day, num),
|
||||
endDate: day,
|
||||
startDate: subDays(startOfDay(now), num - 1),
|
||||
endDate: endOfDay(now),
|
||||
unit,
|
||||
value,
|
||||
};
|
||||
case 'hour':
|
||||
return {
|
||||
startDate: subHours(hour, num),
|
||||
endDate: hour,
|
||||
startDate: subHours(startOfHour(now), num - 1),
|
||||
endDate: endOfHour(now),
|
||||
unit,
|
||||
value,
|
||||
};
|
||||
@ -48,20 +76,22 @@ export function getDateRange(value) {
|
||||
|
||||
const dateFuncs = {
|
||||
hour: [differenceInHours, addHours, startOfHour],
|
||||
day: [differenceInDays, addDays, startOfDay],
|
||||
day: [differenceInCalendarDays, addDays, startOfDay],
|
||||
};
|
||||
|
||||
export function getDateArray(data, startDate, endDate, unit) {
|
||||
const arr = [];
|
||||
const [diff, add, normalize] = dateFuncs[unit];
|
||||
const n = diff(endDate, startDate);
|
||||
const n = diff(endDate, startDate) + 1;
|
||||
|
||||
function findData(t) {
|
||||
return data.find(e => getLocalTime(e.t).getTime() === normalize(t).getTime())?.y || 0;
|
||||
const x = data.find(e => new Date(e.t).getTime() === normalize(new Date(t)).getTime());
|
||||
|
||||
return x?.y || 0;
|
||||
}
|
||||
|
||||
for (let i = 0; i < n; i++) {
|
||||
const t = add(startDate, i + 1);
|
||||
const t = add(startDate, i);
|
||||
const y = findData(t);
|
||||
|
||||
arr.push({ t, y });
|
||||
|
@ -165,7 +165,7 @@ export async function getPageviewData(
|
||||
return runQuery(
|
||||
prisma.queryRaw(
|
||||
`
|
||||
select date_trunc('${unit}', created_at at time zone '${timezone}') t,
|
||||
select date_trunc('${unit}', created_at at time zone '${timezone}') at time zone '${timezone}' t,
|
||||
count(${count}) y
|
||||
from pageview
|
||||
where website_id=$1
|
||||
|
Loading…
Reference in New Issue
Block a user