Merge pull request #6267 from espoon-voltti/fix-application-preferred…

…-units-validation Korjataan hakutoiveiden validointi
espoon-voltti · Jan 22, 2025 · 9bd6c14 · 9bd6c14
2 parents 7b37b49 + ae54f17
commit 9bd6c14
Show file tree

Hide file tree

Showing 5 changed files with 87 additions and 34 deletions.
diff --git a/frontend/src/citizen-frontend/applications/editor/unit-preference/UnitPreferenceSection.tsx b/frontend/src/citizen-frontend/applications/editor/unit-preference/UnitPreferenceSection.tsx
@@ -2,18 +2,22 @@
 //
 // SPDX-License-Identifier: LGPL-2.1-or-later
 
-import React from 'react'
+import React, { useContext, useEffect } from 'react'
 
 import { UnitPreferenceFormData } from 'lib-common/api-types/application/ApplicationFormData'
 import { getErrorCount } from 'lib-common/form-validation'
 import { ApplicationType } from 'lib-common/generated/api-types/application'
 import LocalDate from 'lib-common/local-date'
+import { constantQuery, useQuery } from 'lib-common/query'
 import HorizontalLine from 'lib-components/atoms/HorizontalLine'
+import { faExclamation } from 'lib-icons'
 
 import EditorSection from '../../../applications/editor/EditorSection'
 import SiblingBasisSubSection from '../../../applications/editor/unit-preference/SiblingBasisSubSection'
 import UnitsSubSection from '../../../applications/editor/unit-preference/UnitsSubSection'
 import { useTranslation } from '../../../localization'
+import { OverlayContext } from '../../../overlay/state'
+import { applicationUnitsQuery } from '../../queries'
 import { ApplicationFormDataErrors } from '../validations'
 
 export type UnitPreferenceSectionCommonProps = {
@@ -41,6 +45,64 @@ export default React.memo(function UnitPreferenceSection(
 ) {
   const t = useTranslation()
 
+  const {
+    updateFormData,
+    applicationType,
+    preparatory,
+    preferredStartDate,
+    shiftCare
+  } = props
+
+  const { setInfoMessage, clearInfoMessage } = useContext(OverlayContext)
+
+  const { data: units = null } = useQuery(
+    preferredStartDate
+      ? applicationUnitsQuery({
+          type:
+            applicationType === 'CLUB'
+              ? 'CLUB'
+              : applicationType === 'DAYCARE'
+                ? 'DAYCARE'
+                : preparatory
+                  ? 'PREPARATORY'
+                  : 'PRESCHOOL',
+          date: preferredStartDate,
+          shiftCare
+        })
+      : constantQuery(null)
+  )
+
+  useEffect(() => {
+    updateFormData((prev) => {
+      const preferredUnits = units
+        ? prev.preferredUnits.filter(({ id }) =>
+            units.some((unit) => unit.id === id)
+          )
+        : prev.preferredUnits
+
+      if (preferredUnits.length < prev.preferredUnits.length) {
+        setInfoMessage({
+          title: t.applications.editor.unitChangeWarning.title,
+          text: t.applications.editor.unitChangeWarning.text,
+          type: 'warning',
+          icon: faExclamation,
+          resolve: {
+            action: clearInfoMessage,
+            label: t.applications.editor.unitChangeWarning.ok
+          }
+        })
+      }
+
+      return { preferredUnits }
+    })
+  }, [
+    units,
+    updateFormData,
+    setInfoMessage,
+    clearInfoMessage,
+    t.applications.editor.unitChangeWarning
+  ])
+
   return (
     <EditorSection
       title={t.applications.editor.unitPreference.title}
@@ -51,7 +113,7 @@ export default React.memo(function UnitPreferenceSection(
     >
       <SiblingBasisSubSection {...props} />
       <HorizontalLine />
-      <UnitsSubSection {...props} />
+      <UnitsSubSection {...props} units={units} />
     </EditorSection>
   )
 })
diff --git a/frontend/src/citizen-frontend/applications/editor/unit-preference/UnitsSubSection.tsx b/frontend/src/citizen-frontend/applications/editor/unit-preference/UnitsSubSection.tsx
@@ -2,10 +2,10 @@
 //
 // SPDX-License-Identifier: LGPL-2.1-or-later
 
-import React, { useEffect, useState } from 'react'
+import React, { useState } from 'react'
 import styled from 'styled-components'
 
-import { constantQuery, useQuery } from 'lib-common/query'
+import { PublicUnit } from 'lib-common/generated/api-types/daycare'
 import { SelectionChip } from 'lib-components/atoms/Chip'
 import ExternalLink from 'lib-components/atoms/ExternalLink'
 import MultiSelect from 'lib-components/atoms/form/MultiSelect'
@@ -22,51 +22,27 @@ import colors from 'lib-customizations/common'
 
 import PreferredUnitBox from '../../../applications/editor/unit-preference/PreferredUnitBox'
 import { useTranslation } from '../../../localization'
-import { applicationUnitsQuery } from '../../queries'
 
 import { UnitPreferenceSectionProps } from './UnitPreferenceSection'
 
+interface Props extends UnitPreferenceSectionProps {
+  units: PublicUnit[] | null
+}
+
 export default React.memo(function UnitsSubSection({
   formData,
   updateFormData,
   errors,
   verificationRequested,
   applicationType,
-  preparatory,
   preferredStartDate,
-  shiftCare
-}: UnitPreferenceSectionProps) {
+  units
+}: Props) {
   const t = useTranslation()
   const [displayFinnish, setDisplayFinnish] = useState(true)
   const [displaySwedish, setDisplaySwedish] = useState(false)
   const [isUnitSelectionInvalid, setIsUnitSelectionInvalid] = useState(false)
 
-  const { data: units = null } = useQuery(
-    preferredStartDate
-      ? applicationUnitsQuery({
-          type:
-            applicationType === 'CLUB'
-              ? 'CLUB'
-              : applicationType === 'DAYCARE'
-                ? 'DAYCARE'
-                : preparatory
-                  ? 'PREPARATORY'
-                  : 'PRESCHOOL',
-          date: preferredStartDate,
-          shiftCare
-        })
-      : constantQuery([])
-  )
-  useEffect(() => {
-    updateFormData((prev) => ({
-      preferredUnits: units
-        ? prev.preferredUnits.filter(({ id }) =>
-            units.some((unit) => unit.id === id)
-          )
-        : prev.preferredUnits
-    }))
-  }, [units, updateFormData])
-
   const maxUnits = getMaxPreferredUnits(applicationType)
 
   return (

diff --git a/frontend/src/lib-customizations/defaults/citizen/i18n/en.tsx b/frontend/src/lib-customizations/defaults/citizen/i18n/en.tsx
@@ -1569,6 +1569,11 @@ const en: Translations = {
         title: 'Modifications saved',
         text: 'If you wish, you can make further changes as long as the application has not been processed.',
         ok: 'Ok!'
+      },
+      unitChangeWarning: {
+        title: 'Check the unit preferences',
+        text: 'Some of the preferred units you selected were removed, because they do not offer the selected service.',
+        ok: 'Ok!'
       }
     }
   },

diff --git a/frontend/src/lib-customizations/defaults/citizen/i18n/fi.tsx b/frontend/src/lib-customizations/defaults/citizen/i18n/fi.tsx
@@ -1513,6 +1513,11 @@ export default {
         title: 'Muutokset hakemukseen on tallennettu',
         text: 'Halutessasi voit tehdä lisää muutoksia niin kauan kuin hakemusta ei olla otettu käsittelyyn.',
         ok: 'Selvä!'
+      },
+      unitChangeWarning: {
+        title: 'Tarkista hakutoiveet',
+        text: 'Osa merkitsemistäsi hakutoiveista poistettiin, koska ne eivät tarjoa valittua palvelua.',
+        ok: 'Selvä!'
       }
     }
   },

diff --git a/frontend/src/lib-customizations/defaults/citizen/i18n/sv.tsx b/frontend/src/lib-customizations/defaults/citizen/i18n/sv.tsx
@@ -1517,6 +1517,11 @@ const sv: Translations = {
         title: 'Ändringar i ansökan har sparats.',
         text: 'Om du vill kan du göra ändringar i ansökan så länge ansökan inte har behandlats.',
         ok: 'Klart!'
+      },
+      unitChangeWarning: {
+        title: 'Vänligen kontrollera dina sökningar',
+        text: 'Vissa av de sökningar du angav har tagits bort eftersom de inte erbjuder den valda tjänsten.',
+        ok: 'Klart!'
       }
     }
   },