From 5f54e78924f2fdc4550759dd3c034b1239cad73c Mon Sep 17 00:00:00 2001
From: Andreas Ellewsen <ae@uio.no>
Date: Tue, 1 Feb 2022 11:32:43 +0100
Subject: [PATCH] Use fallback for missing language text
Necessary for OUs and RoleTypes with missing english or norwegian names
---
frontend/src/components/roleLine/index.tsx | 13 +++-----
.../sponsor/guest/guestRoleInfo/index.tsx | 13 +++-----
.../sponsor/register/stepPersonForm.tsx | 10 +++---
frontend/src/utils/index.ts | 32 +++++++++++++++++++
4 files changed, 47 insertions(+), 21 deletions(-)
diff --git a/frontend/src/components/roleLine/index.tsx b/frontend/src/components/roleLine/index.tsx
index 13d3d1df..f57d3e68 100644
--- a/frontend/src/components/roleLine/index.tsx
+++ b/frontend/src/components/roleLine/index.tsx
@@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next'
import { Link } from 'react-router-dom'
import { format } from 'date-fns'
import { TableCell } from 'components/table'
+import { getRoleName, getRoleOuName } from 'utils'
interface RoleLineProps {
role: Role
@@ -11,16 +12,12 @@ interface RoleLineProps {
}
const RoleLine = ({ role, pid }: RoleLineProps) => {
- const [t, i18n] = useTranslation('common')
- console.log(role)
+ const [t] = useTranslation('common')
+
return (
<TableRow sx={{ '&:last-child td, &:last-child th': { border: 0 } }}>
- <TableCell align="left">
- {i18n.language === 'en' ? role.name_en : role.name_nb}
- </TableCell>
- <TableCell align="left">
- {i18n.language === 'en' ? role.ou_en : role.ou_nb}
- </TableCell>
+ <TableCell align="left">{getRoleName(role)}</TableCell>
+ <TableCell align="left">{getRoleOuName(role)}</TableCell>
<TableCell component="th" scope="row">
{role.start_date ? format(role.start_date, 'yyyy-MM-dd') : null} -{' '}
{format(role.end_date, 'yyyy-MM-dd')}
diff --git a/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx b/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx
index 3bcb0e3a..d06a638d 100644
--- a/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx
+++ b/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx
@@ -15,7 +15,7 @@ import { useParams } from 'react-router-dom'
import SponsorInfoButtons from 'routes/components/sponsorInfoButtons'
import { DatePicker } from '@mui/lab'
import { Controller, SubmitHandler, useForm } from 'react-hook-form'
-import { submitJsonOpts } from 'utils'
+import { getRoleName, getRoleOuName, submitJsonOpts } from 'utils'
interface GuestRoleInfoProps {
guest: Guest
@@ -94,7 +94,7 @@ const TableContainer = styled(TableContainerMui)({
export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) {
const { pid, id } = useParams<GuestRoleInfoParams>()
- const [t, i18n] = useTranslation('common')
+ const [t] = useTranslation('common')
const [role, setRole] = useState<Role>({
id: '',
name_nb: '',
@@ -158,6 +158,7 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) {
useEffect(() => {
getRoleInfo()
}, [guest])
+
return (
<Page>
<SponsorInfoButtons
@@ -181,9 +182,7 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) {
<TableCell align="left" sx={{ fontWeight: 'bold' }}>
{t('common:role')}
</TableCell>
- <TableCell>
- {i18n.language === 'en' ? role.name_en : role.name_nb}
- </TableCell>
+ <TableCell>{getRoleName(role)}</TableCell>
</TableRow>
<TableRow>
<TableCell align="left" sx={{ fontWeight: 'bold' }}>
@@ -230,9 +229,7 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) {
<TableCell align="left" sx={{ fontWeight: 'bold' }}>
{t('common:ou')}
</TableCell>
- <TableCell align="left">
- {i18n.language === 'en' ? role.ou_en : role.ou_nb}
- </TableCell>
+ <TableCell align="left">{getRoleOuName(role)}</TableCell>
<TableCell align="left" />
</TableRow>
<TableRow>
diff --git a/frontend/src/routes/sponsor/register/stepPersonForm.tsx b/frontend/src/routes/sponsor/register/stepPersonForm.tsx
index 013d8d1b..5ac3a41a 100644
--- a/frontend/src/routes/sponsor/register/stepPersonForm.tsx
+++ b/frontend/src/routes/sponsor/register/stepPersonForm.tsx
@@ -18,12 +18,12 @@ import React, {
} from 'react'
import { addDays } from 'date-fns/fp'
import { useTranslation } from 'react-i18next'
+import useOus, { enSort, nbSort } from 'hooks/useOus'
+import useRoleTypes, { RoleTypeData } from 'hooks/useRoleTypes'
+import { getOuName, isValidEmail } from 'utils'
+import { FeatureContext } from 'contexts'
import { RegisterFormData } from './formData'
import { PersonFormMethods } from './personFormMethods'
-import useOus, { enSort, nbSort } from '../../../hooks/useOus'
-import useRoleTypes, { RoleTypeData } from '../../../hooks/useRoleTypes'
-import { isValidEmail } from '../../../utils'
-import { FeatureContext } from '../../../contexts'
interface StepPersonFormProperties {
nextHandler(formState: RegisterFormData): void
@@ -243,7 +243,7 @@ const StepPersonForm = forwardRef(
.sort(i18n.language === 'en' ? enSort : nbSort)
.map((ou) => (
<MenuItem key={ou.id.toString()} value={ou.id}>
- {i18n.language === 'en' ? ou.en : ou.nb} ({ou.id})
+ {getOuName(ou)} ({ou.id})
</MenuItem>
))}
</TextField>
diff --git a/frontend/src/utils/index.ts b/frontend/src/utils/index.ts
index c8aceab1..cb2ffe7d 100644
--- a/frontend/src/utils/index.ts
+++ b/frontend/src/utils/index.ts
@@ -1,5 +1,6 @@
import validator from '@navikt/fnrvalidator'
import { parseISO } from 'date-fns'
+import { OuData } from 'hooks/useOus'
import i18n from 'i18next'
import {
FetchedIdentity,
@@ -188,3 +189,34 @@ export function instNameUpperCaser(instName: String): String {
return instName
}
}
+
+/**
+ * Get the name of a role matching chosen language with fallback to nb/en if missing
+ * @param role an object of type Role
+ * @returns the name matching the language or fallback if missing
+ */
+export function getRoleName(role: Role) {
+ if (i18n.language === 'en') {
+ return role.name_en ? role.name_en : role.name_nb
+ }
+ return role.name_nb ? role.name_nb : role.name_en
+}
+
+/**
+ * Get the ou name of a role matching chosen language with fallback to nb/en if missing
+ * @param role an object of type Role
+ * @returns the ou name matching the language or fallback if missing
+ */
+export function getRoleOuName(role: Role) {
+ if (i18n.language === 'en') {
+ return role.ou_en ? role.ou_en : role.ou_nb
+ }
+ return role.ou_nb ? role.ou_nb : role.ou_en
+}
+
+export function getOuName(ou: OuData) {
+ if (i18n.language === 'en') {
+ return ou.en ? ou.en : ou.nb
+ }
+ return ou.nb ? ou.nb : ou.en
+}
--
GitLab