mirror of
https://github.com/apotdevin/thunderhub.git
synced 2025-02-23 22:46:35 +01:00
Improve "group by date" functionality in charts (#415)
* Removes time from parsed dates to allow accurate date grouping * Daily bar chart now separates hours Co-authored-by: Anthony Potdevin <31413433+apotdevin@users.noreply.github.com>
This commit is contained in:
parent
d119739c56
commit
48b868ae36
2 changed files with 24 additions and 6 deletions
|
@ -54,9 +54,17 @@ const amountOfXTicks = (width: number) => {
|
|||
};
|
||||
|
||||
const parseDate = timeParse('%Y-%m-%d');
|
||||
const parseDateAndHour = timeParse('%Y-%m-%dT%H');
|
||||
const format = timeFormat('%b %d');
|
||||
const hourFormat = timeFormat('%b %d: %H');
|
||||
|
||||
const formatDate = (date: string) => format(parseDate(date) as Date);
|
||||
const formatDate = (date: string) => {
|
||||
if (date.length === 10) {
|
||||
return format(parseDate(date) as Date);
|
||||
} else {
|
||||
return hourFormat(parseDateAndHour(date) as Date);
|
||||
}
|
||||
};
|
||||
|
||||
const tooltipStyles = {
|
||||
...defaultStyles,
|
||||
|
|
|
@ -12,6 +12,10 @@ import { widgetList, WidgetProps } from './widgetList';
|
|||
import { GetInvoicesQuery } from '../../../graphql/queries/__generated__/getInvoices.generated';
|
||||
import { GetPaymentsQuery } from '../../../graphql/queries/__generated__/getPayments.generated';
|
||||
|
||||
const removeTime = (date: Date) => {
|
||||
return new Date(date.getFullYear(), date.getMonth(), date.getDate());
|
||||
};
|
||||
|
||||
const getColumns = (width: number): number => {
|
||||
const { lg, md, sm, xs } = defaultGrid.breakpoints;
|
||||
|
||||
|
@ -94,7 +98,11 @@ export const getByTime = (array: ArrayType, time: number): any[] => {
|
|||
|
||||
const difference = isDay
|
||||
? 24 - differenceInHours(today, new Date(transaction.confirmed_at))
|
||||
: time - differenceInDays(today, new Date(transaction.confirmed_at));
|
||||
: time -
|
||||
differenceInDays(
|
||||
today,
|
||||
removeTime(new Date(transaction.confirmed_at))
|
||||
);
|
||||
|
||||
transactions.push({
|
||||
difference,
|
||||
|
@ -106,7 +114,8 @@ export const getByTime = (array: ArrayType, time: number): any[] => {
|
|||
|
||||
const difference = isDay
|
||||
? 24 - differenceInHours(today, new Date(transaction.created_at))
|
||||
: time - differenceInDays(today, new Date(transaction.created_at));
|
||||
: time -
|
||||
differenceInDays(today, removeTime(new Date(transaction.created_at)));
|
||||
|
||||
transactions.push({
|
||||
difference,
|
||||
|
@ -116,7 +125,8 @@ export const getByTime = (array: ArrayType, time: number): any[] => {
|
|||
} else if (transaction.__typename === 'Forward') {
|
||||
const difference = isDay
|
||||
? 24 - differenceInHours(today, new Date(transaction.created_at))
|
||||
: time - differenceInDays(today, new Date(transaction.created_at));
|
||||
: time -
|
||||
differenceInDays(today, removeTime(new Date(transaction.created_at)));
|
||||
|
||||
transactions.push({
|
||||
difference,
|
||||
|
@ -147,7 +157,7 @@ export const getByTime = (array: ArrayType, time: number): any[] => {
|
|||
date: isDay
|
||||
? subHours(today, 24 - Number(key))
|
||||
.toISOString()
|
||||
.slice(0, 10)
|
||||
.slice(0, 13)
|
||||
: subDays(today, time - Number(key))
|
||||
.toISOString()
|
||||
.slice(0, 10),
|
||||
|
@ -166,7 +176,7 @@ export const getByTime = (array: ArrayType, time: number): any[] => {
|
|||
: isDay
|
||||
? subHours(today, 24 - Number(key))
|
||||
.toISOString()
|
||||
.slice(0, 10)
|
||||
.slice(0, 13)
|
||||
: subDays(today, time - Number(key))
|
||||
.toISOString()
|
||||
.slice(0, 10),
|
||||
|
|
Loading…
Add table
Reference in a new issue