Wheel PickerWheel Picker

"use client";

import * as React from "react";
import { WheelPicker } from "@/components/ui/notchset/wheel-picker";

// `now` comes from the server (the request's time), so server and browser render the same reel.
export function SendLater({ now, schedule }: { now: Date; schedule: (when: Date) => Promise<void> }) {
  const [when, setWhen] = React.useState<Date | undefined>();
  return (
    <div className="grid gap-2">
      <WheelPicker now={now} onValueChange={setWhen} onSchedule={schedule} />
      <span className="font-mono text-xs">{when ? `SENDS ${when.toUTCString()}` : "PICK A TIME"}</span>
    </div>
  );
}