Skip to content

Commit

Permalink
fix(daypicker functionality): fix daypicker to successfully set date …
Browse files Browse the repository at this point in the history
…in slot field (#731)

* fix daypicker

* fix QA issues
  • Loading branch information
jdinh8124 authored Aug 26, 2024
1 parent fd39111 commit c40842f
Showing 1 changed file with 19 additions and 17 deletions.
36 changes: 19 additions & 17 deletions react-app/src/components/RHF/SlotField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -130,34 +130,36 @@ export const SlotField = ({
}
case "DatePicker":
return (
<Popover>
<PopoverTrigger asChild>
<FormControl>
<FormControl>
<Popover>
<PopoverTrigger asChild>
<Button
variant={"outline"}
className={cn(
"w-[240px] pl-3 text-left font-normal",
"w-[240px] pl-3 text-left font-normal text-[#212121] justify-start",
!field.value && "text-muted-foreground",
)}
>
<CalendarIcon className="h-4" />
{field.value ? (
format(field.value, "PPP")
format(new Date(field.value), "MM/dd/yyyy")
) : (
<span>Pick a date</span>
)}
<CalendarIcon className="ml-auto h-4 w-4 opacity-50" />
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-auto p-0" align="start">
<Calendar
{...props}
selected={field.value}
// @ts-expect-error
onSelect={field.onChange}
/>
</PopoverContent>
</Popover>
</PopoverTrigger>
<PopoverContent className="w-auto p-0" align="start">
<Calendar
{...props}
mode="single"
selected={field.value && new Date(field.value)}
defaultMonth={field.value && new Date(field.value)}
onSelect={(date) => field.onChange(date)}
initialFocus
/>
</PopoverContent>
</Popover>
</FormControl>
);
case "Checkbox":
return (
Expand Down

0 comments on commit c40842f

Please sign in to comment.