Refactor

Author: reynders

frontend/src/e2e-test/specs/5_employee/application-transitions.spec.ts

@@ -431,7 +431,6 @@ describe('Application transitions', () => {
 
     await placementDraftPage.placeToUnit(testPreschool.id)
 
-    // TODO test placement dates here
     const preschoolTermValidationWarning = page.findByDataQa(
       'preschool-term-warning'
     )

frontend/src/employee-frontend/components/placement-draft/PlacementDraft.tsx

@@ -143,8 +143,7 @@ export default React.memo(function PlacementDraft() {
   const [selectedUnitIsGhostUnit, setSelectedUnitIsGhostUnit] =
     useState<boolean>(false)
 
-  const [preschoolDatesTermWarning, setPreschoolDatesTermWarning] =
-    useState(false)
+  const [preschoolDatesAreValid, setPreschoolDatesAreValid] = useState(true)
 
   const preschoolTermsResult = useQueryResult(getPreschoolTermsQuery())
 
@@ -208,78 +207,61 @@ export default React.memo(function PlacementDraft() {
     )
   }, [applicationId, redirectToMainPage])
 
-  const validatePreschoolPeriods = useCallback(
-    (
-      placementType: PlacementType,
-      periodType: 'period' | 'preschoolDaycarePeriod',
-      period: FiniteDateRange
-    ) => {
-      if (preschoolTermsResult.isSuccess) {
-        if (
-          placementType === 'PRESCHOOL' ||
-          placementType === 'PREPARATORY' ||
-          placementType === 'PRESCHOOL_DAYCARE' ||
-          placementType === 'PRESCHOOL_DAYCARE_ONLY' ||
-          placementType === 'PREPARATORY_DAYCARE'
-        ) {
-          if (periodType === 'period') {
-            preschoolTermsResult.map((preschoolTerms) => {
-              const datesAreInsideSomePreschoolTerm = preschoolTerms.some(
-                (term) =>
-                  term.finnishPreschool.asDateRange().contains(period) ||
-                  term.swedishPreschool.asDateRange().contains(period)
-              )
-              setPreschoolDatesTermWarning(!datesAreInsideSomePreschoolTerm)
-            })
-          } else {
-            preschoolTermsResult.map((preschoolTerms) => {
-              const datesAreInsideSomeExtendedPreschoolTerm =
-                preschoolTerms.some((term) =>
-                  term.extendedTerm.asDateRange().contains(period)
-                )
-              setPreschoolDatesTermWarning(
-                !datesAreInsideSomeExtendedPreschoolTerm
-              )
-            })
-          }
-        }
-      }
-    },
-    [preschoolTermsResult, setPreschoolDatesTermWarning]
-  )
+  const isPreschoolPlacement = (placementType: PlacementType) =>
+    placementType === 'PRESCHOOL' ||
+    placementType === 'PREPARATORY' ||
+    placementType === 'PRESCHOOL_DAYCARE' ||
+    placementType === 'PRESCHOOL_DAYCARE_ONLY' ||
+    placementType === 'PREPARATORY_DAYCARE'
+
+  useEffect(() => {
+    if (
+      preschoolTermsResult.isSuccess &&
+      placementDraft.isSuccess &&
+      isPreschoolPlacement(placementDraft.value.type)
+    ) {
+      const preschoolPeriodIsValid =
+        formState.period !== null &&
+        preschoolTermsResult
+          .map((preschoolTerms) =>
+            preschoolTerms.some(
+              (term) =>
+                term.finnishPreschool
+                  .asDateRange()
+                  .contains(formState.period!) ||
+                term.swedishPreschool.asDateRange().contains(formState.period!)
+            )
+          )
+          .getOrElse(false)
+
+      const preschoolDaycarePeriodIsValid =
+        formState.hasPreschoolDaycarePeriod &&
+        formState.preschoolDaycarePeriod !== null &&
+        preschoolTermsResult
+          .map((preschoolTerms) =>
+            preschoolTerms.some((term) =>
+              term.extendedTerm
+                .asDateRange()
+                .contains(formState.preschoolDaycarePeriod!)
+            )
+          )
+          .getOrElse(false)
+
+      setPreschoolDatesAreValid(
+        preschoolPeriodIsValid && preschoolDaycarePeriodIsValid
+      )
+    }
+  }, [preschoolTermsResult, placementDraft, formState])
 
   useEffect(() => {
     if (placementDraft.isSuccess) {
       void getApplicationUnitsResult({
         type: asUnitType(placementDraft.value.type),
         date: formState.period?.start ?? placementDraft.value.period.start,
         shiftCare: null
-      })
-        .then(setUnits)
-        .then(() => {
-          if (preschoolTermsResult.isSuccess) {
-            validatePreschoolPeriods(
-              placementDraft.value.type,
-              'period',
-              placementDraft.value.period
-            )
-
-            if (placementDraft.value.preschoolDaycarePeriod) {
-              validatePreschoolPeriods(
-                placementDraft.value.type,
-                'preschoolDaycarePeriod',
-                placementDraft.value.preschoolDaycarePeriod
-              )
-            }
-          }
-        })
+      }).then(setUnits)
     }
-  }, [
-    placementDraft,
-    formState.period?.start,
-    preschoolTermsResult,
-    validatePreschoolPeriods
-  ])
+  }, [placementDraft, formState.period?.start, preschoolTermsResult])
 
   useTitle(
     placementDraft.map(
@@ -339,12 +321,6 @@ export default React.memo(function PlacementDraft() {
         }))
         setPlacementDraft(updatedPlacementDraft)
         calculateOverLaps(updatedPlacementDraft, setPlacementDraft)
-
-        validatePreschoolPeriods(
-          placementDraft.value.type,
-          periodType,
-          fixedPeriod
-        )
       }
     }
 
@@ -370,7 +346,12 @@ export default React.memo(function PlacementDraft() {
 
   const validPlan: DaycarePlacementPlan | null = useMemo(() => {
     const { unitId, period, hasPreschoolDaycarePeriod } = formState
-    if (!unitId || !period || selectedUnitIsGhostUnit) {
+    if (
+      !unitId ||
+      !period ||
+      selectedUnitIsGhostUnit ||
+      !preschoolDatesAreValid
+    ) {
       return null
     } else {
       return {
@@ -381,7 +362,7 @@ export default React.memo(function PlacementDraft() {
           : null
       }
     }
-  }, [formState, selectedUnitIsGhostUnit])
+  }, [formState, selectedUnitIsGhostUnit, preschoolDatesAreValid])
 
   return (
     <Container
@@ -449,7 +430,7 @@ export default React.memo(function PlacementDraft() {
                 'end'
               )}
             />
-            {preschoolDatesTermWarning && (
+            {!preschoolDatesAreValid && (
               <div data-qa="preschool-term-warning">
                 <WarningContainer>
                   <InputWarning