Date Range PickerDate Range Picker

"use client";

import * as React from "react";
import { DateRangePicker, type DateRangeValue, type RangePresetGroup } from "@/components/ui/notchset/date-range-picker";

/** Presets from a day: calendar arithmetic (the date's own day field), so DST never shifts a day. */
function presetsFor(today: Date): RangePresetGroup[] {
  const day = (n: number) => new Date(today.getFullYear(), today.getMonth(), today.getDate() + n);
  return [
    {
      group: "RECENT",
      items: [
        { label: "Last 7 days", from: day(-7), to: day(-1) },
        { label: "Last 30 days", from: day(-30), to: day(-1) },
      ],
    },
  ];
}

// `today` comes from the request, so a long-running server never serves yesterday's presets.
export function ReportRange({ today }: { today: Date }) {
  const presets = React.useMemo(() => presetsFor(today), [today]);
  const recent = presets[0]!.items[0]!;
  const [range, setRange] = React.useState<DateRangeValue>({ from: recent.from, to: recent.to });
  return <DateRangePicker value={range} onValueChange={setRange} presets={presets} max={recent.to} />;
}