Add consent info to guest frontpage

Resolves: GREG-173

frontend/public/locales/en/common.json

@@ -41,6 +41,9 @@
     "contactInfo": "Contact information",
     "contactInfoBody": "A guest is only considered active if at least one identification number has been verified.",
     "contactInfoTableText": "Contact information and identification",
+    "consentInfoHead": "Consent information",
+    "choiceDate": "Choice date",
+    "consentName": "Consent type",
     "roleInfoHead": "Roles and periods",
     "roleInfoTableText": "Guest roles",
     "roleInfoBody": "You can only change roles that you have given."

frontend/public/locales/nb/common.json

@@ -41,6 +41,9 @@
     "contactInfo": "Kontaktinformasjon",
     "contactInfoBody": "For at ein gjest skal reknast som aktiv må minst ett identifikasjonsnummer vere godkjend.",
     "contactInfoTableText": "Kontaktinformasjon og identifikasjon",
+    "consentInfoHead": "Samtykkeinformasjon",
+    "choiceDate": "Valgdato",
+    "consentName": "Samtykketype",
     "roleInfoHead": "Roller og perioder",
     "roleInfoBody": "Du kan endre på tidsperioden, men kun på gjesteroller som du er vert for.",
     "roleInfoTableText": "Gjesteroller"

frontend/public/locales/nn/common.json

@@ -42,6 +42,9 @@
     "contactInfo": "Kontaktinformasjon",
     "contactInfoBody": "For at en gjest skal regnes som aktiv må minst ett identifikasjonsnummer være godkjent.",
     "contactInfoTableText": "Kontaktinformasjon og identifikasjon",
+    "consentInfoHead": "Samtykkeinformasjon",
+    "choiceDate": "Valdato",
+    "consentName": "Samtykketype",
     "roleInfoTableText": "Gjesteroller",
     "roleInfoHead": "Roller og periodar",
     "roleInfoBody": "Du kan endre på tidsperioden, men berre på gjesteroller som du er vert for."

frontend/src/components/consentLine/index.tsx

+import { Consent } from 'interfaces'
+import { useTranslation } from 'react-i18next'
+import { format } from 'date-fns'
+import { TableCell, TableRow } from 'components/table'
+
+interface UserConsentLineProps {
+  consent: Consent
+}
+const UserConsentLine = ({ consent }: UserConsentLineProps) => {
+  const [, i18n] = useTranslation('common')
+  let name = ''
+  let choice = ''
+  switch (i18n.language) {
+    case 'nb':
+      name =
+        consent.type.name_nb || consent.type.name_nn || consent.type.name_en
+      choice =
+        consent.choice.text_nb ||
+        consent.choice.text_nn ||
+        consent.choice.text_en
+      break
+    case 'nn':
+      name =
+        consent.type.name_nn || consent.type.name_nb || consent.type.name_en
+      choice =
+        consent.choice.text_nn ||
+        consent.choice.text_nb ||
+        consent.choice.text_en
+      break
+    // en
+    default:
+      name =
+        consent.type.name_en || consent.type.name_nb || consent.type.name_nn
+      choice =
+        consent.choice.text_en ||
+        consent.choice.text_nb ||
+        consent.choice.text_nn
+      break
+  }
+  return (
+    <TableRow sx={{ '&:last-child td, &:last-child th': { border: 0 } }}>
+      <TableCell align="left">{name}</TableCell>
+      <TableCell component="th" scope="row">
+        {consent.consent_given_at
+          ? format(consent.consent_given_at, 'yyyy-MM-dd')
+          : null}
+      </TableCell>
+      <TableCell align="left">{choice}</TableCell>
+    </TableRow>
+  )
+}
+export default UserConsentLine

frontend/src/components/roleLine/index.tsx

-import { Button, TableRow, styled } from '@mui/material'
+import { Button, TableRow } from '@mui/material'
 import { Role } from 'interfaces'
 import { useTranslation } from 'react-i18next'
 import { Link } from 'react-router-dom'

frontend/src/contexts/userContext.ts

@@ -24,6 +24,7 @@ export const UserContext = createContext<IUserContext>({
     fnr: '',
     passport: '',
     roles: [],
+    consents: [],
   },
   fetchUserInfo: noop,
   clearUserInfo: noop,

frontend/src/interfaces/index.ts

@@ -64,6 +64,31 @@ export type FetchedRole = {
   max_days: number
 }
 
+export type ConsentType = {
+  name_en: string
+  name_nb: string
+  name_nn: string
+}
+
+export type ConsentChoice = {
+  text_en: string
+  text_nb: string
+  text_nn: string
+}
+
+export type FetchedConsent = {
+  id: string
+  type: ConsentType
+  choice: ConsentChoice
+  consent_given_at: string
+}
+export type Consent = {
+  id: string
+  type: ConsentType
+  choice: ConsentChoice
+  consent_given_at: Date
+}
+
 export interface User {
   auth: boolean
   auth_type: string
@@ -78,4 +103,5 @@ export interface User {
   fnr: string
   passport: string
   roles: FetchedRole[]
+  consents: FetchedConsent[]
 }

frontend/src/providers/userProvider.tsx

@@ -22,6 +22,7 @@ function UserProvider(props: UserProviderProps) {
     fnr: '',
     passport: '',
     roles: [],
+    consents: [],
   })
 
   const getUserInfo = async () => {
@@ -44,6 +45,7 @@ function UserProvider(props: UserProviderProps) {
           fnr: data.fnr,
           passport: data.passport,
           roles: data.roles,
+          consents: data.consents,
         })
       } else {
         setUser({
@@ -60,6 +62,7 @@ function UserProvider(props: UserProviderProps) {
           fnr: '',
           passport: '',
           roles: [],
+          consents: [],
         })
       }
     } catch (error) {
@@ -77,6 +80,7 @@ function UserProvider(props: UserProviderProps) {
         fnr: '',
         passport: '',
         roles: [],
+        consents: [],
       })
     }
   }
@@ -108,6 +112,7 @@ function UserProvider(props: UserProviderProps) {
       fnr: '',
       passport: '',
       roles: [],
+      consents: [],
     })
   }
 

frontend/src/routes/landing/index.tsx

+import { Table, TableBody } from '@mui/material'
 import {
-  Paper,
-  Table,
-  TableBody,
-  TableCell,
   TableContainer,
   TableHead,
+  TableHeadCell,
   TableRow,
-} from '@mui/material'
+  TableCell,
+} from 'components/table'
 import Page from 'components/page'
 import { UserRoleLine } from 'components/roleLine'
+import UserConsentLine from 'components/consentLine'
 import { useUserContext } from 'contexts'
-import { FetchedRole, Role } from 'interfaces'
+import { FetchedRole, Role, Consent, FetchedConsent } from 'interfaces'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Redirect } from 'react-router-dom'
-import { parseRole } from 'utils'
+import { parseRole, parseConsent } from 'utils'
 
 const GuestPage = () => {
   const { user } = useUserContext()
 
   const [t] = useTranslation('common')
   const [roles, setRoles] = useState<Role[]>([])
+  const [consents, setConsents] = useState<Consent[]>([])
   useEffect(() => {
     setRoles(user.roles.map((role: FetchedRole) => parseRole(role)))
+    setConsents(user.consents.map((cons: FetchedConsent) => parseConsent(cons)))
   }, [])
   return (
     <Page>
       <h4>{t('guestInfo.contactInfo')}</h4>
-      <TableContainer component={Paper}>
+      <TableContainer>
         <Table sx={{ minWidth: 650 }} aria-label="simple table">
-          <TableHead sx={{ backgroundColor: 'secondary.light' }}>
+          <TableHead sx={{ backgroundColor: 'none' }}>
             <TableRow>
-              <TableCell align="left">{t('guestInfo.contactInfo')}</TableCell>
-              <TableCell />
+              <TableHeadCell align="left">
+                {t('guestInfo.contactInfo')}
+              </TableHeadCell>
+              <TableHeadCell />
             </TableRow>
           </TableHead>
           <TableBody>
@@ -64,13 +68,13 @@ const GuestPage = () => {
         </Table>
       </TableContainer>
       <h4>{t('guestInfo.roleInfoHead')}</h4>
-      <TableContainer component={Paper}>
+      <TableContainer>
         <Table sx={{ minWidth: 650 }} aria-label="simple table">
-          <TableHead sx={{ backgroundColor: 'secondary.light' }}>
+          <TableHead sx={{ backgroundColor: 'none' }}>
             <TableRow>
-              <TableCell align="left">{t('common:role')}</TableCell>
-              <TableCell align="left">{t('common:period')}</TableCell>
-              <TableCell align="left">{t('common:ou')}</TableCell>
+              <TableHeadCell align="left">{t('common:role')}</TableHeadCell>
+              <TableHeadCell align="left">{t('common:period')}</TableHeadCell>
+              <TableHeadCell align="left">{t('common:ou')}</TableHeadCell>
             </TableRow>
           </TableHead>
           <TableBody>
@@ -80,6 +84,27 @@ const GuestPage = () => {
           </TableBody>
         </Table>
       </TableContainer>
+      <h4>{t('guestInfo.consentInfoHead')}</h4>
+      <TableContainer>
+        <Table sx={{ minWidth: 650 }} aria-label="simple table">
+          <TableHead sx={{ backgroundColor: 'none' }}>
+            <TableRow>
+              <TableHeadCell align="left">
+                {t('guestInfo.consentName')}
+              </TableHeadCell>
+              <TableHeadCell align="left">
+                {t('guestInfo.choiceDate')}
+              </TableHeadCell>
+              <TableHeadCell align="left">{t('common:choice')}</TableHeadCell>
+            </TableRow>
+          </TableHead>
+          <TableBody>
+            {consents.map((cons) => (
+              <UserConsentLine key={cons.id} consent={cons} />
+            ))}
+          </TableBody>
+        </Table>
+      </TableContainer>
     </Page>
   )
 }

frontend/src/utils/index.ts

 import validator from '@navikt/fnrvalidator'
 import { parseISO } from 'date-fns'
 import i18n from 'i18next'
-import { FetchedIdentity, FetchedRole, Identity, Role } from 'interfaces'
+import {
+  FetchedIdentity,
+  FetchedRole,
+  Identity,
+  Role,
+  Consent,
+  FetchedConsent,
+} from 'interfaces'
 import { isValidPhoneNumber, parsePhoneNumber } from 'libphonenumber-js'
 
 const validEmailRegex =
@@ -141,6 +148,15 @@ export function parseRole(role: FetchedRole): Role {
   }
 }
 
+export function parseConsent(cons: FetchedConsent): Consent {
+  return {
+    id: cons.id,
+    type: cons.type,
+    choice: cons.choice,
+    consent_given_at: parseISO(cons.consent_given_at),
+  }
+}
+
 export function parseIdentity(
   identity: FetchedIdentity | null
 ): Identity | null {

gregui/api/views/userinfo.py

-from typing import (
-    Sequence,
-    Type,
-)
-
 from rest_framework.authentication import BaseAuthentication, SessionAuthentication
 from rest_framework.permissions import AllowAny, BasePermission
 from rest_framework.status import HTTP_403_FORBIDDEN
@@ -48,6 +43,7 @@ class UserInfoView(APIView):
             "sponsor_id": None,
             "person_id": None,
             "roles": [],
+            "consents": [],
             "auth_type": auth_type,
         }
 
@@ -102,6 +98,23 @@ class UserInfoView(APIView):
                     "orgunit", "type", "sponsor"
                 )
             ]
+            person_consents = [
+                {
+                    "id": cons.id,
+                    "type": {
+                        "name_en": cons.type.name_en,
+                        "name_nb": cons.type.name_nb,
+                        "name_nn": cons.type.name_nn,
+                    },
+                    "choice": {
+                        "text_en": cons.choice.text_en,
+                        "text_nb": cons.choice.text_nb,
+                        "text_nn": cons.choice.text_nn,
+                    },
+                    "consent_given_at": cons.consent_given_at,
+                }
+                for cons in person.consents.all()
+            ]
             content.update(
                 {
                     "person_id": person.id,
@@ -113,6 +126,7 @@ class UserInfoView(APIView):
                     "fnr": person.fnr and "".join((person.fnr.value[:-5], "*****")),
                     "passport": person.passport and person.passport.value,
                     "roles": person_roles,
+                    "consents": person_consents,
                 }
             )
         return Response(content)

gregui/tests/api/views/test_userinfo.py

@@ -39,8 +39,9 @@ def test_userinfo_invited_get(client, invitation_link):
                 "start_date": None,
                 "end_date": "2050-10-15",
                 "sponsor": {"first_name": "Sponsor", "last_name": "Bar"},
-            }
+            },
         ],
+        "consents": [],
     }
 
 
@@ -64,6 +65,7 @@ def test_userinfo_sponsor_get(client, log_in, user_sponsor):
         "feide_id": "",
         "person_id": None,
         "roles": [],
+        "consents": [],
         "sponsor_id": 1,
     }
 
@@ -80,6 +82,7 @@ def test_userinfo_guest_get(client, log_in, user_person):
         "sponsor_id": None,
         "person_id": 1,
         "roles": [],
+        "consents": [],
         "first_name": "Foo",
         "last_name": "Bar",
         "email": "foo@bar.com",