feat(application-system): Add locale to arguments passed to options functions for select, radio and checkbox fields

libs/application/core/src/lib/fieldBuilders.ts

@@ -44,8 +44,9 @@ import {
   AccordionField,
   BankAccountField,
   SliderField,
+  MaybeWithApplicationAndFieldAndLocale,
 } from '@island.is/application/types'
-
+import { Locale } from '@island.is/shared/types'
 import { Colors } from '@island.is/island-ui/theme'
 import { SpanType, BoxProps } from '@island.is/island-ui/core/types'
 import { coreDefaultFieldMessages } from './messages'
@@ -525,12 +526,13 @@ export const buildSubmitField = (data: {
 }
 
 export const buildFieldOptions = (
-  maybeOptions: MaybeWithApplicationAndField<Option[]>,
+  maybeOptions: MaybeWithApplicationAndFieldAndLocale<Option[]>,
   application: Application,
   field: Field,
+  locale: Locale,
 ): Option[] => {
   if (typeof maybeOptions === 'function') {
-    return maybeOptions(application, field)
+    return maybeOptions(application, field, locale)
   }
 
   return maybeOptions

libs/application/core/src/lib/formUtils.ts

@@ -24,8 +24,9 @@ import {
   StaticText,
   StaticTextObject,
   SubSection,
+  FormTextWithLocale,
 } from '@island.is/application/types'
-import { User } from '@island.is/shared/types'
+import { Locale, User } from '@island.is/shared/types'
 
 const containsArray = (obj: RecordObject) => {
   let contains = false
@@ -278,6 +279,45 @@ export const formatText = <T extends FormTextArray | FormText>(
   return formatMessage(text) as T extends FormTextArray ? string[] : string
 }
 
+export const formatTextWithLocale = <
+  T extends FormTextArray | FormText | FormTextWithLocale,
+>(
+  text: T,
+  application: Application,
+  locale: Locale,
+  formatMessage: MessageFormatter,
+): T extends FormTextArray ? string[] : string => {
+  if (typeof text === 'function') {
+    const message = (
+      text as (_: Application, locale: Locale) => StaticText | StaticText[]
+    )(application, locale)
+    if (Array.isArray(message)) {
+      return message.map((m) =>
+        handleMessageFormatting(m, formatMessage),
+      ) as T extends FormTextArray ? string[] : string
+    }
+    return handleMessageFormatting(
+      message,
+      formatMessage,
+    ) as T extends FormTextArray ? string[] : string
+  } else if (Array.isArray(text)) {
+    const texts = text as StaticText[]
+    return texts.map((m) =>
+      handleMessageFormatting(m, formatMessage),
+    ) as T extends FormTextArray ? string[] : string
+  } else if (typeof text === 'object') {
+    const staticTextObject = text as StaticTextObject
+    if (staticTextObject.values) {
+      return formatMessage(
+        staticTextObject,
+        staticTextObject.values,
+      ) as T extends FormTextArray ? string[] : string
+    }
+  }
+
+  return formatMessage(text) as T extends FormTextArray ? string[] : string
+}
+
 export const formatAndParseAsHTML = (
   text: FormText,
   application: Application,

libs/application/templates/announcement-of-death/src/fields/FilesRecipientCard/index.tsx

@@ -1,7 +1,7 @@
 import React, { FC } from 'react'
 import { useLocale } from '@island.is/localization'
 import { SelectController } from '@island.is/shared/form-fields'
-import { formatText } from '@island.is/application/core'
+import { formatText, formatTextWithLocale } from '@island.is/application/core'
 import {
   Application,
   FieldBaseProps,
@@ -11,7 +11,7 @@ import { Box, Tag, Text } from '@island.is/island-ui/core'
 import { m } from '../../lib/messages'
 import { Answers as AODAnswers } from '../../types'
 import { isPerson } from 'kennitala'
-
+import { Locale } from '@island.is/shared/types'
 type FilesRecipientCardProps = {
   field: {
     props: {
@@ -25,7 +25,7 @@ type FilesRecipientCardProps = {
 export const FilesRecipientCard: FC<
   React.PropsWithChildren<FieldBaseProps<AODAnswers> & FilesRecipientCardProps>
 > = ({ application, field }) => {
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang: locale } = useLocale()
   let options =
     application.answers?.estateMembers?.members?.length &&
     application.answers.estateMembers.members.length !== 0
@@ -67,7 +67,12 @@ export const FilesRecipientCard: FC<
     >
       {field.title && (
         <Text variant="h4" as="h3" marginBottom={1}>
-          {formatText(field.title, application, formatMessage)}
+          {formatTextWithLocale(
+            field.title,
+            application,
+            locale as Locale,
+            formatMessage,
+          )}
         </Text>
       )}
       {field.description && (

libs/application/templates/data-protection-complaint/src/fields/CommissionFieldRepeater/CommissionFieldRepeater.tsx

@@ -1,6 +1,10 @@
 import React, { FC, useEffect } from 'react'
 import { useLocale } from '@island.is/localization'
-import { formatText, getErrorViaPath } from '@island.is/application/core'
+import {
+  formatText,
+  formatTextWithLocale,
+  getErrorViaPath,
+} from '@island.is/application/core'
 import { FieldBaseProps } from '@island.is/application/types'
 import { InputController } from '@island.is/shared/form-fields'
 import {
@@ -13,7 +17,7 @@ import {
 import { useFieldArray } from 'react-hook-form'
 import * as styles from './CommissionFieldRepeater.css'
 import { info } from '../../lib/messages'
-
+import { Locale } from '@island.is/shared/types'
 type PersonField = {
   name: string
   nationalId: string
@@ -23,7 +27,7 @@ export const CommissionFieldRepeater: FC<
   React.PropsWithChildren<FieldBaseProps>
 > = ({ application, errors, field }) => {
   const { id, title } = field
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang: locale } = useLocale()
   const { fields, append, remove } = useFieldArray({ name: id })
 
   useEffect(() => {
@@ -58,7 +62,12 @@ export const CommissionFieldRepeater: FC<
               </Box>
             )}
             <Text variant="h4" marginBottom={3}>
-              {formatText(title, application, formatMessage)}{' '}
+              {formatTextWithLocale(
+                title,
+                application,
+                locale as Locale,
+                formatMessage,
+              )}{' '}
               {index > 0 ? index + 1 : ''}
             </Text>
             <GridRow>

libs/application/templates/data-protection-complaint/src/fields/FieldLabel.tsx

@@ -1,19 +1,25 @@
 import { useLocale } from '@island.is/localization'
-import { formatText } from '@island.is/application/core'
+import { formatTextWithLocale } from '@island.is/application/core'
 import { FieldBaseProps } from '@island.is/application/types'
 import { Text } from '@island.is/island-ui/core'
 import React, { FC } from 'react'
+import { Locale } from '@island.is/shared/types'
 
 export const FieldLabel: FC<React.PropsWithChildren<FieldBaseProps>> = ({
   application,
   field,
 }) => {
   const { title } = field
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang: locale } = useLocale()
 
   return (
     <Text variant="h4" marginTop={3}>
-      {formatText(title, application, formatMessage)}
+      {formatTextWithLocale(
+        title,
+        application,
+        locale as Locale,
+        formatMessage,
+      )}
     </Text>
   )
 }

libs/application/templates/funding-government-projects/src/fields/FieldTitle/FieldTitle.tsx

@@ -1,8 +1,9 @@
 import React from 'react'
-import { formatText } from '@island.is/application/core'
+import { formatText, formatTextWithLocale } from '@island.is/application/core'
 import { FieldBaseProps } from '@island.is/application/types'
 import { ResponsiveSpace, Text } from '@island.is/island-ui/core'
 import { useLocale } from '@island.is/localization'
+import { Locale } from '@island.is/shared/types'
 
 type Props = FieldBaseProps & {
   field: {
@@ -14,15 +15,20 @@ type Props = FieldBaseProps & {
 }
 
 export const FieldTitle = ({ field, application }: Props) => {
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang: locale } = useLocale()
   return (
     <>
       <Text
         variant="h4"
         marginTop={field.props.marginTop || 0}
         marginBottom={field.description ? 1 : 0}
       >
-        {formatText(field.title, application, formatMessage)}
+        {formatTextWithLocale(
+          field.title,
+          application,
+          locale as Locale,
+          formatMessage,
+        )}
         {field.props.required && (
           <Text variant="h4" color="red400" as="span">
             {' *'}

libs/application/templates/grindavik-housing-buyout/src/fields/AdditionalOwnersOverview/index.tsx

@@ -11,13 +11,14 @@ import {
 import { applicantInformationMessages } from '@island.is/application/ui-forms'
 import { useLocale } from '@island.is/localization'
 import { format as formatNationalId } from 'kennitala'
-import { formatText } from '@island.is/application/core'
+import { formatTextWithLocale } from '@island.is/application/core'
 import * as m from '../../lib/messages'
 import {
   formatBankInfo,
   formatPhoneNumber,
   removeCountryCode,
 } from '@island.is/application/ui-components'
+import { Locale } from '@island.is/shared/types'
 
 const KeyValue = ({ label, value }: { label: StaticText; value: string }) => {
   const { formatMessage } = useLocale()
@@ -36,13 +37,18 @@ export const AdditionalOwnersOverview = ({
   field,
 }: FieldBaseProps<GrindavikHousingBuyout>) => {
   const additionalOwners = application.answers.additionalOwners ?? []
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang: locale } = useLocale()
 
   return (
     <Box>
       <Box marginBottom={3}>
         <Text variant="h3" marginBottom={3}>
-          {formatText(field.title, application, formatMessage)}
+          {formatTextWithLocale(
+            field.title,
+            application,
+            locale as Locale,
+            formatMessage,
+          )}
         </Text>
         <Stack space={6} dividers>
           {additionalOwners.map((owner, index) => (

libs/application/templates/health-insurance/src/fields/TextWithTooltip/TextWithTooltip.tsx

@@ -1,8 +1,9 @@
-import { formatText } from '@island.is/application/core'
+import { formatText, formatTextWithLocale } from '@island.is/application/core'
 import { FieldBaseProps } from '@island.is/application/types'
 import { Box, Text, Tooltip } from '@island.is/island-ui/core'
 import { useLocale } from '@island.is/localization'
 import * as styles from './TextWithTooltip.css'
+import { Locale } from '@island.is/shared/types'
 
 export interface Props extends FieldBaseProps {
   title?: string
@@ -15,14 +16,15 @@ export const TextWithTooltip = ({
   title = '',
   description = '',
 }: Props) => {
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang: locale } = useLocale()
 
   return (
     <Box paddingTop={2} className={styles.marginFix}>
       <Text as="span">
-        {formatText(
+        {formatTextWithLocale(
           field.title ? field.title : title,
           application,
+          locale as Locale,
           formatMessage,
         )}{' '}
         <Tooltip

libs/application/templates/institution-collaboration/src/fields/SecondaryContact/SecondaryContact.tsx

@@ -5,16 +5,18 @@ import { NO, YES } from '../../constants'
 import React, { FC } from 'react'
 
 import { FieldBaseProps } from '@island.is/application/types'
-import { formatText } from '@island.is/application/core'
+import { formatText, formatTextWithLocale } from '@island.is/application/core'
 import { institutionApplicationMessages as m } from '../../lib/messages'
 import { useFormContext } from 'react-hook-form'
 import { useLocale } from '@island.is/localization'
+import { Locale } from '@island.is/shared/types'
+
 const SecondaryContact: FC<React.PropsWithChildren<FieldBaseProps>> = ({
   field,
   application,
 }) => {
   const { setValue, getValues } = useFormContext()
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang: locale } = useLocale()
   const { id, title } = field
   const isEnabled = getValues('hasSecondaryContact') === YES
 
@@ -42,7 +44,12 @@ const SecondaryContact: FC<React.PropsWithChildren<FieldBaseProps>> = ({
             />
           </Box>
           <Text variant="h4">
-            {formatText(title, application, formatMessage)}
+            {formatTextWithLocale(
+              title,
+              application,
+              locale as Locale,
+              formatMessage,
+            )}
           </Text>
         </Box>
       </Stack>

libs/application/templates/operating-license/src/fields/PropertyOverviewRepeater/index.tsx

@@ -4,7 +4,11 @@ import { Box, GridColumn, GridRow, Text } from '@island.is/island-ui/core'
 import { useLocale } from '@island.is/localization'
 import { m } from '../../lib/messages'
 import { Property, PropertyField } from '../../lib/constants'
-import { formatText, getValueViaPath } from '@island.is/application/core'
+import {
+  formatTextWithLocale,
+  getValueViaPath,
+} from '@island.is/application/core'
+import { Locale } from '@island.is/shared/types'
 
 interface PropTypes extends FieldBaseProps {
   field: CustomField
@@ -13,7 +17,7 @@ interface PropTypes extends FieldBaseProps {
 export const PropertyOverviewRepeater: FC<
   React.PropsWithChildren<PropTypes>
 > = ({ field, application }) => {
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang: locale } = useLocale()
   const { title } = field
   const { id } = field.props as { id: string }
   const fields = getValueViaPath(application.answers, id) as Property[]
@@ -25,7 +29,12 @@ export const PropertyOverviewRepeater: FC<
           field={item}
           index={index}
           key={index + item.propertyNumber}
-          title={formatText(title, application, formatMessage)}
+          title={formatTextWithLocale(
+            title,
+            application,
+            locale as Locale,
+            formatMessage,
+          )}
         />
       ))}
     </Box>