feat: rango de fechas personalizado y datos hasta ayer (salvo Hoy)

Selector libre en Ad Tracker/Seguimiento; presets y KPIs cierran en ayer.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
4Ventures
2026-09-24 10:24:25 +02:00
parent 068faa3d25
commit 8fda2996b6
5 changed files with 299 additions and 73 deletions

View File

@@ -25,8 +25,8 @@ import {
sumWeekly,
} from '@/lib/metrics';
import { PageHeader } from '@/components/ui';
import DateRangePicker from '@/components/DateRangePicker';
import {
AD_TRACKER_PRESETS,
RangePreset,
resolveAdRange,
} from '@/lib/ad-tracker-range';
@@ -263,6 +263,8 @@ export default function SeguimientoBoard() {
const [openId, setOpenId] = useState<string | null>(null);
const [query, setQuery] = useState('');
const [preset, setPreset] = useState<RangePreset>('last_30d');
const [customSince, setCustomSince] = useState('');
const [customUntil, setCustomUntil] = useState('');
const [noteTitle, setNoteTitle] = useState('');
const [noteBody, setNoteBody] = useState('');
const [noteBusy, setNoteBusy] = useState(false);
@@ -288,7 +290,10 @@ export default function SeguimientoBoard() {
void load();
}, []);
const range = useMemo(() => resolveAdRange(preset), [preset]);
const range = useMemo(
() => resolveAdRange(preset, { since: customSince, until: customUntil }),
[preset, customSince, customUntil]
);
const rangedWeekly = useMemo(() => {
const rows = data?.weekly || [];
@@ -450,28 +455,28 @@ export default function SeguimientoBoard() {
/>
{/* Date selector */}
<section className="rounded-2xl border border-white/[0.06] bg-card/80 p-4 space-y-3">
<div className="flex items-center gap-2 text-xs text-gray-400">
<CalendarRange className="w-3.5 h-3.5 text-sky-400" />
<section className="rounded-2xl border border-gray-200 bg-white p-4 space-y-3">
<div className="flex items-center gap-2 text-xs text-gray-500">
<CalendarRange className="w-3.5 h-3.5 text-sky-500" />
Periodo
<span className="text-gray-500">· {range.label}</span>
</div>
<div className="flex flex-wrap gap-1.5">
{AD_TRACKER_PRESETS.map((p) => (
<button
key={p.id}
type="button"
onClick={() => setPreset(p.id)}
className={`px-3 py-1.5 rounded-lg text-xs font-semibold ${
preset === p.id
? 'bg-brand-500 text-white'
: 'bg-gray-100 text-gray-600 hover:bg-gray-50'
}`}
>
{p.label}
</button>
))}
</div>
<DateRangePicker
preset={preset}
customSince={customSince || range.since}
customUntil={customUntil || range.until}
onPreset={(p) => {
setPreset(p);
if (p !== 'custom') {
const r = resolveAdRange(p);
setCustomSince(r.since);
setCustomUntil(r.until);
}
}}
onCustomChange={(since, until) => {
setCustomSince(since);
setCustomUntil(until);
}}
/>
</section>
{/* KPI cards (Métricas-like) */}