adds validation to event type availability (#1778)
* adds validation to event type availability * lint fix * general improvement * prettier fix Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
This commit is contained in:
		
							parent
							
								
									97fdfc5d6b
								
							
						
					
					
						commit
						c4862c4b92
					
				
					 2 changed files with 26 additions and 7 deletions
				
			
		|  | @ -2,7 +2,7 @@ import { ClockIcon } from "@heroicons/react/outline"; | |||
| import { useRef } from "react"; | ||||
| 
 | ||||
| import { useLocale } from "@lib/hooks/useLocale"; | ||||
| 
 | ||||
| import showToast from "@lib/notification"; | ||||
| import Button from "@components/ui/Button"; | ||||
| 
 | ||||
| interface SetTimesModalProps { | ||||
|  | @ -21,6 +21,18 @@ export default function SetTimesModal(props: SetTimesModalProps) { | |||
|   const endHoursRef = useRef<HTMLInputElement>(null!); | ||||
|   const endMinsRef = useRef<HTMLInputElement>(null!); | ||||
| 
 | ||||
|   const isValidTime = (startTime: number, endTime: number) => { | ||||
|     if (new Date(startTime) > new Date(endTime)) { | ||||
|       showToast(t("error_end_time_before_start_time"), "error"); | ||||
|       return false; | ||||
|     } | ||||
|     if (endTime > 1440) { | ||||
|       showToast(t("error_end_time_next_day"), "error"); | ||||
|       return false; | ||||
|     } | ||||
|     return true; | ||||
|   }; | ||||
| 
 | ||||
|   return ( | ||||
|     <div | ||||
|       className="fixed inset-0 z-50 overflow-y-auto" | ||||
|  | @ -138,12 +150,18 @@ export default function SetTimesModal(props: SetTimesModalProps) { | |||
|                 const enteredEndHours = parseInt(endHoursRef.current.value); | ||||
|                 const enteredEndMins = parseInt(endMinsRef.current.value); | ||||
| 
 | ||||
|                 props.onChange({ | ||||
|                   startTime: enteredStartHours * 60 + enteredStartMins, | ||||
|                   endTime: enteredEndHours * 60 + enteredEndMins, | ||||
|                 }); | ||||
| 
 | ||||
|                 props.onExit(0); | ||||
|                 if ( | ||||
|                   isValidTime( | ||||
|                     enteredStartHours * 60 + enteredStartMins, | ||||
|                     enteredEndHours * 60 + enteredEndMins | ||||
|                   ) | ||||
|                 ) { | ||||
|                   props.onChange({ | ||||
|                     startTime: enteredStartHours * 60 + enteredStartMins, | ||||
|                     endTime: enteredEndHours * 60 + enteredEndMins, | ||||
|                   }); | ||||
|                   props.onExit(0); | ||||
|                 } | ||||
|               }} | ||||
|               type="submit"> | ||||
|               {t("save")} | ||||
|  |  | |||
|  | @ -251,6 +251,7 @@ | |||
|   "friday_time_error":"Invalid time on Friday", | ||||
|   "saturday_time_error":"Invalid time on Saturday", | ||||
|   "error_end_time_before_start_time": "End time cannot be before start time", | ||||
|   "error_end_time_next_day": "End time cannot be greater than 24 hours", | ||||
|   "back_to_bookings": "Back to bookings", | ||||
|   "free_to_pick_another_event_type": "Feel free to pick another event anytime.", | ||||
|   "cancelled": "Cancelled", | ||||
|  |  | |||
		Loading…
	
		Reference in a new issue
	
	 Syed Ali Shahbaz
						Syed Ali Shahbaz