blyzer/graphs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix RFM date range consistency
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 1m5s
Details

Browse Source
This commit is contained in:
Cauê Faleiros
2026-06-15 10:48:00 -03:00
parent ac692b8e10
commit fc7a50fddf
8 changed files with 262 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/components/DateRangePicker.tsx
View File

@@ -1,6 +1,7 @@
import React, { useState, useRef } from 'react';
import { Calendar, RefreshCw, ChevronDown } from 'lucide-react';
import type { DateRange } from '../types';
import { endOfLocalDay, formatDateParam, parseLocalDateInput, rangeForDay, rangeForLastDays, rangeForPreviousDay, startOfLocalDay } from '../dateRanges';
interface DateRangePickerProps {
dateRange: DateRange;
@@ -12,14 +13,14 @@ interface DateRangePickerProps {
const PRESETS = [
{ label: 'Hoje', getRange: () => rangeForDay(new Date()) },
{ label: 'Ontem', getRange: () => { const d = new Date(); d.setDate(d.getDate() - 1); return rangeForDay(d); } },
{ label: 'Ontem', getRange: () => rangeForPreviousDay() },
{ label: 'Últimos 7 dias', getRange: () => rangeForLastDays(7) },
{ label: 'Últimos 30 dias', getRange: () => rangeForLastDays(30) },
{ label: 'Este Mês', getRange: () => { const end = endOfDay(new Date()); const start = startOfDay(new Date(end.getFullYear(), end.getMonth(), 1)); return { start, end }; } },
{ label: 'Este Mês', getRange: () => { const end = endOfLocalDay(new Date()); const start = startOfLocalDay(new Date(end.getFullYear(), end.getMonth(), 1)); return { start, end }; } },
{ label: 'Mês Passado', getRange: () => { const d = new Date(); const start = new Date(d.getFullYear(), d.getMonth() - 1, 1); const end = new Date(d.getFullYear(), d.getMonth(), 0, 23, 59, 59, 999); return { start, end }; } },
{ label: 'Últimos 90 dias', getRange: () => rangeForLastDays(90) },
{ label: 'Este Ano', getRange: () => { const end = endOfDay(new Date()); const start = startOfDay(new Date(end.getFullYear(), 0, 1)); return { start, end }; } },
{ label: 'Todo o Período', getRange: () => { const end = endOfDay(new Date()); const start = startOfDay(new Date(2000, 0, 1)); return { start, end }; } },
{ label: 'Este Ano', getRange: () => { const end = endOfLocalDay(new Date()); const start = startOfLocalDay(new Date(end.getFullYear(), 0, 1)); return { start, end }; } },
{ label: 'Todo o Período', getRange: () => { const end = endOfLocalDay(new Date()); const start = startOfLocalDay(new Date(2000, 0, 1)); return { start, end }; } },
];
const REFRESH_OPTIONS = [
@@ -31,30 +32,6 @@ const REFRESH_OPTIONS = [
{ label: '5m', value: 300000 },
];
const startOfDay = (date: Date) => {
const nextDate = new Date(date);
nextDate.setHours(0, 0, 0, 0);
return nextDate;
};
const endOfDay = (date: Date) => {
const nextDate = new Date(date);
nextDate.setHours(23, 59, 59, 999);
return nextDate;
};
const rangeForDay = (date: Date) => ({
start: startOfDay(date),
end: endOfDay(date),
});
const rangeForLastDays = (days: number) => {
const end = endOfDay(new Date());
const start = startOfDay(end);
start.setDate(start.getDate() - Math.max(days - 1, 0));
return { start, end };
};
const DateRangePicker: React.FC<DateRangePickerProps> = ({ dateRange, onChange, refreshInterval, setRefreshInterval, onManualRefresh }) => {
const [isPresetOpen, setIsPresetOpen] = useState(false);
const startRef = useRef<HTMLInputElement>(null);
@@ -65,32 +42,23 @@ const DateRangePicker: React.FC<DateRangePickerProps> = ({ dateRange, onChange,
};
const formatDateForInput = (date: Date) => {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
};
const parseLocalDate = (value: string) => {
if (!value) return null;
const [year, month, day] = value.split('-');
return new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
return formatDateParam(date);
};
const handleStartChange = (e: React.ChangeEvent<HTMLInputElement>) => {
const newStart = parseLocalDate(e.target.value);
const newStart = parseLocalDateInput(e.target.value);
if (newStart && !isNaN(newStart.getTime())) {
const start = startOfDay(newStart);
const end = dateRange.end < start ? endOfDay(start) : dateRange.end;
const start = startOfLocalDay(newStart);
const end = dateRange.end < start ? endOfLocalDay(start) : dateRange.end;
onChange({ start, end });
}
};
const handleEndChange = (e: React.ChangeEvent<HTMLInputElement>) => {
const newEnd = parseLocalDate(e.target.value);
const newEnd = parseLocalDateInput(e.target.value);
if (newEnd && !isNaN(newEnd.getTime())) {
const end = endOfDay(newEnd);
const start = dateRange.start > end ? startOfDay(end) : dateRange.start;
const end = endOfLocalDay(newEnd);
const start = dateRange.start > end ? startOfLocalDay(end) : dateRange.start;
onChange({ start, end });
}
};