Add disabled feature in DatePicker

ohcnetwork · Jan 19, 2025 · b4a49ef · b4a49ef
1 parent cdc745e
commit b4a49ef
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
@@ -16,9 +16,10 @@ import {
 interface DatePickerProps {
   date?: Date;
   onChange?: (date?: Date) => void;
+  disabled?: (date: Date) => boolean;
 }
 
-export function DatePicker({ date, onChange }: DatePickerProps) {
+export function DatePicker({ date, onChange, disabled }: DatePickerProps) {
   const [open, setOpen] = useState(false);
 
   return (
@@ -44,6 +45,7 @@ export function DatePicker({ date, onChange }: DatePickerProps) {
             setOpen(false);
           }}
           initialFocus
+          disabled={disabled}
         />
       </PopoverContent>
     </Popover>

diff --git a/src/pages/PublicAppointments/PatientRegistration.tsx b/src/pages/PublicAppointments/PatientRegistration.tsx
@@ -324,6 +324,10 @@ export function PatientRegistration(props: PatientRegistrationProps) {
                               field.value ? new Date(field.value) : undefined
                             }
                             onChange={(date) => field.onChange(date)}
+                            disabled={(date) =>
+                              date <= new Date("1900-01-01") ||
+                              date >= new Date()
+                            }
                           />
                         </FormControl>
                         <FormMessage />