test(dock schedule fail): failed attempt ad doing a dock schedule but leaving in here

frontend/src/components/ui/datePicker.tsx

@@ -0,0 +1,31 @@
+import { format } from "date-fns";
+import { Calendar as CalendarIcon } from "lucide-react";
+import { Popover, PopoverContent, PopoverTrigger } from "./popover";
+import { Button } from "./button";
+import { Calendar } from "./calendar";
+
+export function DatePicker({
+    date,
+    onChange,
+}: {
+    date?: Date;
+    onChange?: (d: Date | undefined) => void;
+}) {
+    return (
+        <Popover>
+            <PopoverTrigger asChild>
+                <Button
+                    variant="outline"
+                    data-empty={!date}
+                    className="data-[empty=true]:text-muted-foreground w-[200px] justify-start text-left font-normal"
+                >
+                    <CalendarIcon className="mr-2 h-4 w-4" />
+                    {date ? format(date, "PPP") : <span>Pick a date</span>}
+                </Button>
+            </PopoverTrigger>
+            <PopoverContent className="w-auto p-0">
+                <Calendar mode="single" selected={date} onSelect={onChange} />
+            </PopoverContent>
+        </Popover>
+    );
+}