feat(driving-license): start on advanced driving-license (#16647)

* start on advanced driving-license * code rabbit comment changes * more comment changes * change * minor tweaks - advanced license * tweaks * text tweak --------- Co-authored-by: albinagu <[email protected]> Co-authored-by: albina <[email protected]> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
island-is · Nov 15, 2024 · 9d63937 · 9d63937
1 parent b9cf31e
commit 9d63937
Show file tree

Hide file tree

Showing 12 changed files with 512 additions and 6 deletions.
diff --git a/libs/application/templates/driving-license-duplicate/src/fields/Alert.tsx b/libs/application/templates/driving-license-duplicate/src/fields/Alert.tsx
@@ -27,7 +27,7 @@ export const Alert: FC<React.PropsWithChildren<Props>> = ({
 }) => {
   const { formatMessage } = useLocale()
   const { title, type, message, heading } = field.props as Field
-  console.log('message', formatText(message, application, formatMessage))
+
   return (
     <Box justifyContent={'spaceBetween'}>
       {heading && (

diff --git a/...emplates/driving-license/src/fields/AdvancedLicenseSelection/AdvancedLicenseSelection.tsx b/...emplates/driving-license/src/fields/AdvancedLicenseSelection/AdvancedLicenseSelection.tsx
@@ -0,0 +1,130 @@
+import React, { FC, useEffect, useState } from 'react'
+
+import { Box, Checkbox, ErrorMessage, Text } from '@island.is/island-ui/core'
+import { FieldBaseProps } from '@island.is/application/types'
+import { useFormContext } from 'react-hook-form'
+import {
+  organizedAdvancedLicenseMap,
+  AdvancedLicense as AdvancedLicenseEnum,
+} from '../../lib/constants'
+import { useLocale } from '@island.is/localization'
+import { m } from '../../lib/messages'
+
+const AdvancedLicenseSelection: FC<React.PropsWithChildren<FieldBaseProps>> = ({
+  errors,
+}) => {
+  const { formatMessage } = useLocale()
+  const { setValue, watch } = useFormContext()
+
+  const requiredMessage = (errors as { advancedLicense?: string })
+    ?.advancedLicense
+    ? formatMessage(m.applicationForAdvancedRequiredError)
+    : ''
+
+  const advancedLicenseValue = watch('advancedLicense') ?? []
+
+  const [selectedLicenses, setSelectedLicenses] =
+    useState<Array<keyof typeof AdvancedLicenseEnum>>(advancedLicenseValue)
+
+  useEffect(() => {
+    setValue('advancedLicense', selectedLicenses)
+  }, [selectedLicenses, setValue])
+
+  return (
+    <Box>
+      {Object.entries(organizedAdvancedLicenseMap).map(([, options], index) => {
+        const group = options.find((x) => x.group)?.group
+        const groupAge = options.find((x) => x.minAge)?.minAge
+
+        return (
+          <Box
+            key={`license-group-${index}`}
+            marginTop={index === 0 ? 2 : 7}
+            marginBottom={5}
+          >
+            <Box marginBottom={2}>
+              <Text variant="h4">
+                {group ? formatMessage(m[`groupTitle${group}`]) : ''}
+              </Text>
+              <Text variant="medium" as="div">
+                {formatMessage(m[`applicationForAdvancedAgeRequired`], {
+                  age: String(groupAge),
+                })}
+              </Text>
+            </Box>
+            {options.map((option) => {
+              const name = `field-${option.code}`
+
+              return (
+                <Box key={`license-option-${option.code}`} marginBottom={4}>
+                  <Checkbox
+                    label={formatMessage(
+                      m[`applicationForAdvancedLicenseTitle${option.code}`],
+                    )}
+                    subLabel={formatMessage(
+                      m[`applicationForAdvancedLicenseLabel${option.code}`],
+                    )}
+                    large
+                    id={name}
+                    name={name}
+                    backgroundColor="blue"
+                    labelVariant="medium"
+                    checked={advancedLicenseValue.includes(option.code)}
+                    onChange={() => {
+                      setSelectedLicenses((prev) => {
+                        return prev.includes(option.code)
+                          ? prev
+                              .filter((item) => item !== option.code)
+                              .filter(
+                                (item) => item !== option.professional?.code,
+                              )
+                          : [...prev, option.code]
+                      })
+                    }}
+                  />
+                  {option?.professional?.code && (
+                    <Box marginTop={1}>
+                      <Checkbox
+                        large
+                        key={`professional-${option.professional.code}`}
+                        disabled={!selectedLicenses.includes(option?.code)}
+                        label={formatMessage(
+                          m[
+                            `applicationForAdvancedLicenseLabel${option.professional.code}`
+                          ],
+                        )}
+                        backgroundColor="blue"
+                        labelVariant="small"
+                        checked={advancedLicenseValue.includes(
+                          option?.professional?.code,
+                        )}
+                        onChange={(e) => {
+                          setSelectedLicenses((prev) => {
+                            if (e.target.checked && option.professional?.code) {
+                              return [...prev, option.professional.code]
+                            }
+
+                            return prev.filter(
+                              (item) => item !== option.professional?.code,
+                            )
+                          })
+                        }}
+                      />
+                    </Box>
+                  )}
+                </Box>
+              )
+            })}
+          </Box>
+        )
+      })}
+      {!selectedLicenses?.length && requiredMessage && (
+        <ErrorMessage>
+          <div>{requiredMessage}</div>
+        </ErrorMessage>
+      )}
+    </Box>
+  )
+}
+
+export { AdvancedLicenseSelection }
diff --git a/libs/application/templates/driving-license/src/fields/AdvancedLicenseSelection/index.tsx b/libs/application/templates/driving-license/src/fields/AdvancedLicenseSelection/index.tsx
@@ -0,0 +1 @@
+export { AdvancedLicenseSelection } from './AdvancedLicenseSelection'
diff --git a/libs/application/templates/driving-license/src/fields/index.ts b/libs/application/templates/driving-license/src/fields/index.ts
@@ -4,5 +4,6 @@ export { EligibilitySummary } from './EligibilitySummary'
 export { SubmitAndDecline } from './SubmitAndDecline'
 export { LinkExistingApplication } from './LinkExistingApplication'
 export { PaymentPending } from './PaymentPending'
+export { AdvancedLicenseSelection } from './AdvancedLicenseSelection'
 export { QualityPhoto } from './QualityPhoto'
 export { default as HealthRemarks } from './HealthRemarks'
diff --git a/libs/application/templates/driving-license/src/forms/prerequisites/getForm.ts b/libs/application/templates/driving-license/src/forms/prerequisites/getForm.ts
@@ -8,13 +8,23 @@ import { sectionApplicationFor } from './sectionApplicationFor'
 import { sectionRequirements } from './sectionRequirements'
 import { sectionExistingApplication } from './sectionExistingApplication'
 import { sectionDigitalLicenseInfo } from './sectionDigitalLicenseInfo'
+import { sectionAdvancedLicenseSelection } from './sectionAdvancedLicenseSelection'
+
+interface DrivingLicenseFormConfig {
+  allowFakeData?: boolean
+  allowPickLicense?: boolean
+  allowBELicense?: boolean
+  allow65Renewal?: boolean
+  allowAdvanced?: boolean
+}
 
 export const getForm = ({
   allowFakeData = false,
   allowPickLicense = false,
   allowBELicense = false,
   allow65Renewal = false,
-}): Form =>
+  allowAdvanced = false,
+}: DrivingLicenseFormConfig): Form =>
   buildForm({
     id: 'DrivingLicenseApplicationPrerequisitesForm',
     title: '',
@@ -31,8 +41,15 @@ export const getForm = ({
           sectionExternalData,
           sectionExistingApplication,
           ...(allowPickLicense
-            ? [sectionApplicationFor(allowBELicense, allow65Renewal)]
+            ? [
+                sectionApplicationFor(
+                  allowBELicense,
+                  allow65Renewal,
+                  allowAdvanced,
+                ),
+              ]
             : []),
+          ...(allowAdvanced ? [sectionAdvancedLicenseSelection] : []),
           sectionDigitalLicenseInfo,
           sectionRequirements,
         ],

diff --git a/...tion/templates/driving-license/src/forms/prerequisites/sectionAdvancedLicenseSelection.ts b/...tion/templates/driving-license/src/forms/prerequisites/sectionAdvancedLicenseSelection.ts
@@ -0,0 +1,35 @@
+import {
+  buildCustomField,
+  buildMultiField,
+  buildSubSection,
+  getValueViaPath,
+} from '@island.is/application/core'
+import { m } from '../../lib/messages'
+import { LicenseTypes } from '../../lib/constants'
+
+export const sectionAdvancedLicenseSelection = buildSubSection({
+  id: 'sectionAdvancedLicenseSelection',
+  title: m.applicationForAdvancedLicenseTitle,
+  condition: (answers) => {
+    const applicationFor = getValueViaPath<LicenseTypes>(
+      answers,
+      'applicationFor',
+    )
+
+    return applicationFor != null && applicationFor === LicenseTypes.B_ADVANCED
+  },
+  children: [
+    buildMultiField({
+      id: 'advancedLicenseSelectionFields',
+      title: m.applicationForAdvancedLicenseSectionTitle,
+      description: m.applicationForAdvancedLicenseSectionDescription,
+      children: [
+        buildCustomField({
+          id: 'advancedLicense',
+          title: '',
+          component: 'AdvancedLicenseSelection',
+        }),
+      ],
+    }),
+  ],
+})
diff --git a/libs/application/templates/driving-license/src/forms/prerequisites/sectionApplicationFor.ts b/libs/application/templates/driving-license/src/forms/prerequisites/sectionApplicationFor.ts
@@ -7,6 +7,7 @@ import {
 import { m } from '../../lib/messages'
 import { DrivingLicense } from '../../lib/types'
 import {
+  B_ADVANCED,
   B_FULL,
   B_FULL_RENEWAL_65,
   B_TEMP,
@@ -17,6 +18,7 @@ import {
 export const sectionApplicationFor = (
   allowBELicense = false,
   allow65Renewal = false,
+  allowAdvanced = false,
 ) =>
   buildSubSection({
     id: 'applicationFor',
@@ -112,6 +114,17 @@ export const sectionApplicationFor = (
                 })
               }
 
+              if (allowAdvanced) {
+                options = options.concat({
+                  label: m.applicationForAdvancedLicenseTitle,
+                  subLabel: m.applicationForAdvancedLicenseDescription,
+                  value: B_ADVANCED,
+                  disabled: !categories?.some(
+                    (c) => c.nr.toUpperCase() === 'B' && c.validToCode !== 8,
+                  ),
+                })
+              }
+
               return options
             },
           }),
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export { AdvancedLicenseSelection } from './AdvancedLicenseSelection'