"use client";

import { useState } from "react";
import { useRouter } from "next/navigation";
import { Plus } from "lucide-react";
import { Button } from "@/components/ui/button";
import { LogRequestDialog } from "@/components/delivery/LogRequestDialog";

/** The dashboard's way in to logging what a client just asked for. */
export function LogRequestButton() {
  const router = useRouter();
  const [open, setOpen] = useState(false);

  return (
    <>
      <Button size="sm" variant="outline" onClick={() => setOpen(true)}>
        <Plus className="h-3.5 w-3.5 mr-1.5" />
        Log request
      </Button>
      <LogRequestDialog open={open} onClose={() => setOpen(false)} onLogged={() => router.refresh()} />
    </>
  );
}