@@ -21,7 +21,14 @@ const schema = yup.object().shape({
2121 status : yup . mixed < TaskStatus > ( ) . oneOf ( Object . values ( TaskStatus ) ) . required ( ) ,
2222 assignees : yup . array ( ) . of ( yup . string ( ) . required ( ) ) . required ( ) ,
2323 startDate : yup . date ( ) . optional ( ) ,
24- deadline : yup . date ( ) . optional ( ) ,
24+ deadline : yup
25+ . date ( )
26+ . optional ( )
27+ . test ( 'deadline-after-start' , 'Deadline must be on or after the start date' , function ( deadline ) {
28+ const { startDate } = this . parent ;
29+ if ( ! startDate || ! deadline ) return true ;
30+ return deadline >= startDate ;
31+ } ) ,
2532 notes : yup . string ( ) . optional ( )
2633} ) ;
2734
@@ -51,6 +58,7 @@ const CalendarCreateTaskModal: React.FC<CalendarCreateTaskModalProps> = ({ open,
5158 const {
5259 handleSubmit,
5360 control,
61+ watch,
5462 formState : { errors } ,
5563 reset
5664 } = useForm < CreateTaskFormInput > ( {
@@ -67,6 +75,8 @@ const CalendarCreateTaskModal: React.FC<CalendarCreateTaskModalProps> = ({ open,
6775 }
6876 } ) ;
6977
78+ const startDate = watch ( 'startDate' ) ;
79+
7080 if ( usersError ) return < ErrorPage error = { usersErr } /> ;
7181 if ( projectsError ) return < ErrorPage error = { projectsErr } /> ;
7282 if ( usersLoading || ! users || projectsLoading || ! projects ) return < LoadingIndicator /> ;
@@ -249,10 +259,12 @@ const CalendarCreateTaskModal: React.FC<CalendarCreateTaskModalProps> = ({ open,
249259 format = "MM-dd-yyyy"
250260 onChange = { ( event ) => onChange ( event ?? undefined ) }
251261 value = { value ?? null }
252- slotProps = { { textField : { autoComplete : 'off' } } }
262+ minDate = { startDate ?? undefined }
263+ slotProps = { { textField : { autoComplete : 'off' , error : ! ! errors . deadline } } }
253264 />
254265 ) }
255266 />
267+ { errors . deadline && < FormHelperText error > { errors . deadline . message } </ FormHelperText > }
256268 </ FormControl >
257269 </ Grid >
258270 < Grid item xs = { 12 } >
0 commit comments