diff --git a/src/components/CalendarModal/CalendarModal.jsx b/src/components/CalendarModal/CalendarModal.jsx index b173404f8..bf462fd6f 100644 --- a/src/components/CalendarModal/CalendarModal.jsx +++ b/src/components/CalendarModal/CalendarModal.jsx @@ -79,6 +79,10 @@ const today = new Date() export function useCalendarState(startDateInit = today, endDateInit = today) { const [dateTimeStart, setStart] = useState(startDateInit) const [dateTimeEnd, setEnd] = useState(endDateInit) + const resetDates = () => { + setStart(startDateInit); + setEnd(startDateInit); + }; - return { dateTimeStart, dateTimeEnd, setStart, setEnd } + return { dateTimeStart, dateTimeEnd, setStart, setEnd, resetDates } } \ No newline at end of file diff --git a/src/views/AddTenant/addTenant.js b/src/views/AddTenant/addTenant.js index ccd9ddd7c..03666d4e1 100644 --- a/src/views/AddTenant/addTenant.js +++ b/src/views/AddTenant/addTenant.js @@ -23,7 +23,7 @@ const validationSchema = Yup.object().shape({ .min(7, "*Phone Number must have at least 7 characters") .max(20, "*Phone Number can't be longer than 20 characters") .required("*Phone Number is required"), - unitNum: Yup.number(), + unitNum: Yup.string(), occupants: Yup.number(), }); @@ -39,12 +39,16 @@ export const AddTenant = () => { const [propertyOptions, setPropertyOptions] = useState([]); const [propertySearchResults, setPropertySearchResults] = useState([]); const [showAddProperty, setShowAddProperty] = useState(false); + const [isValidationActive, setIsValidationActive] = useState(false); + const [propertyErrorText, setPropertyErrorText] = useState(""); const calendarState = useCalendarState(); - const { dateTimeStart, dateTimeEnd, } = calendarState; + const { dateTimeStart, dateTimeEnd, resetDates } = calendarState; useMountEffect(() => getProperties()); + useEffect(() => validateForm(), [propertySelection, dateTimeStart, dateTimeEnd]); + useEffect(() => { axios.post("/api/users/role", { userrole: RoleEnum.STAFF, @@ -88,13 +92,8 @@ export const AddTenant = () => { }; const handleFormSubmit = (data) => { - let body = { - ...data, - propertyID: propertySelection[0].key, - staffIDs: staffSelections && staffSelections.map(staff => staff.key) - }; axios - .post(`/api/tenants`, body, makeAuthHeaders(context)) + .post(`/api/tenants`, data, makeAuthHeaders(context)) .then((response) => { Toast("Tenant Created Successfully!", "success"); }) @@ -144,6 +143,17 @@ export const AddTenant = () => { setStaffSelections(selectedChoices); }; + const validateForm = (values) => { + setIsValidationActive(true); + + if (dateTimeStart !== dateTimeEnd) { + setPropertyErrorText(dateTimeStart !== dateTimeEnd && propertySelection.length + ? "" + : "*Property is a required field" + ); + } + }; + return (