diff --git a/frontend/public/locales/en/common.json b/frontend/public/locales/en/common.json index 9a60da89536295878a4374046f070533466c7cf8..602eeaf393c4467fb0a499a75e43ac350098f898 100644 --- a/frontend/public/locales/en/common.json +++ b/frontend/public/locales/en/common.json @@ -116,6 +116,8 @@ "invalidEmail": "Invalid e-mail address", "passportNumberRequired": "Passport number required", "mobilePhoneRequired": "Mobile phone is required", + "typeMustBeChosen": "Role is required", + "ouMustBeChosen": "Organisation is required", "startDateMustBeSet": "Start date must be set", "startDateMustBeBeforeEndDate": "Start date has to be before end date", "phoneNumberAndCountryCode": "Both country code and phone number must be set", diff --git a/frontend/public/locales/nb/common.json b/frontend/public/locales/nb/common.json index 75ffadd0ebcd0dc0abdeec358d48cd28bbe6dbd3..a3ad61767ff4e79c526f1ee15ed5a7a965c91067 100644 --- a/frontend/public/locales/nb/common.json +++ b/frontend/public/locales/nb/common.json @@ -116,6 +116,8 @@ "invalidEmail": "Ugyldig e-postadresse", "passportNumberRequired": "Passnummer er obligatorisk", "mobilePhoneRequired": "Mobilnummer er obligatorisk", + "typeMustBeChosen": "Gjesterolle er obligatorisk", + "ouMustBeChosen": "Organisasjon er obligatorisk", "startDateMustBeSet": "Startdato må være satt", "startDateMustBeBeforeEndDate": "Startdato må være før sluttdato", "phoneNumberAndCountryCode": "Både landkode og telefonnummer må være satt", diff --git a/frontend/public/locales/nn/common.json b/frontend/public/locales/nn/common.json index 4eefad7f1e0ae51651d94f8fdca93d319b17732b..bcbc3bf1d7cf2f83d13e8b5e47098390cc95bfd2 100644 --- a/frontend/public/locales/nn/common.json +++ b/frontend/public/locales/nn/common.json @@ -116,6 +116,8 @@ "invalidEmail": "Ugyldig e-postadresse", "passportNumberRequired": "Passnummer er obligatorisk", "mobilePhoneRequired": "Mobilnummer er obligatorisk", + "typeMustBeChosen": "Gjesterolle er obligatorisk", + "ouMustBeChosen": "Organisasjon er obligatorisk", "startDateMustBeSet": "Startdato må vere satt", "startDateMustBeBeforeEndDate": "Startdato må vere før sluttdato", "phoneNumberAndCountryCode": "Både landkode og telefonnummer må vere satt", diff --git a/frontend/src/routes/sponsor/guest/newGuestRole/index.tsx b/frontend/src/routes/sponsor/guest/newGuestRole/index.tsx index 73fe14f9525e7b66cf17be3189033ef8d1ea8d07..64a98c8786a211c52fbb74a5d07b0d62e5d0954f 100644 --- a/frontend/src/routes/sponsor/guest/newGuestRole/index.tsx +++ b/frontend/src/routes/sponsor/guest/newGuestRole/index.tsx @@ -190,41 +190,68 @@ function NewGuestRole({ guest, reloadGuestInfo }: NewGuestRoleProps) { </Typography> <form onSubmit={onSubmit}> <Stack spacing={2}> - <FormControl> - <InputLabel id="roletype-select-label"> - {t('input.roleType')} - </InputLabel> - <Select - id="roletype-select" - defaultValue="" - value={roleTypeChoice} - error={!!errors.type} - label={t('input.roleType')} - onChange={handleRoleTypeChange} - > - {(roleTypes === undefined ? [] : roleTypes) - .sort(roleTypeSort()) - .map((rt) => rolesToItem(rt))} - </Select> - </FormControl> + <Controller + name="type" + control={control} + rules={{ required: true }} + render={() => ( + <FormControl> + <InputLabel id="roletype-select-label"> + {t('input.roleType')} + </InputLabel> + <Select + id="roletype-select" + defaultValue="" + value={roleTypeChoice} + error={!!errors.type} + label={t('input.roleType')} + onChange={handleRoleTypeChange} + > + {(roleTypes === undefined ? [] : roleTypes) + .sort(roleTypeSort()) + .map((rt) => rolesToItem(rt))} + </Select> + </FormControl> + )} + /> + {errors.type && errors.type.type === 'required' && ( + <Box sx={{ typography: 'caption', color: 'error.main' }}> + {t('validation.typeMustBeChosen')} + </Box> + )} + + <Controller + name="orgunit" + control={control} + rules={{ required: true }} + render={() => ( + <FormControl> + <InputLabel id="ou-select-label-id"> + {t('common:ou')} + </InputLabel> + <Select + labelId="ou-select-label" + id="ou-select-label" + defaultValue="" + value={ouChoice.toString()} + label={t('common:ou')} + onChange={handleOuChange} + > + {ous !== undefined && + ous.length > 0 && + ous + .sort(i18n.language === 'en' ? enSort : nbSort) + .map((ou) => ouToItem(ou))} + </Select> + </FormControl> + )} + /> + {errors.orgunit && errors.orgunit.type === 'required' && ( + <Box sx={{ typography: 'caption', color: 'error.main' }}> + {t('validation.ouMustBeChosen')} + </Box> + )} - <FormControl> - <InputLabel id="ou-select-label-id">{t('common:ou')}</InputLabel> - <Select - labelId="ou-select-label" - id="ou-select-label" - defaultValue="" - value={ouChoice.toString()} - label={t('common:ou')} - onChange={handleOuChange} - > - {ous !== undefined && - ous.length > 0 && - ous - .sort(i18n.language === 'en' ? enSort : nbSort) - .map((ou) => ouToItem(ou))} - </Select> - </FormControl> <Controller name="start_date" control={control}