Bugfix/endring direkte vergemaal (#3610)

* Designendringer med Betsy og refaktorert en del utdatert kode * Oppdatering og mindre refaktor * Endret redigering av vergemaal i pdl-forvalter * Fikset innsending av vergemaal fra frontend
navikt · Sep 16, 2024 · ae07098 · ae07098
1 parent 965b071
commit ae07098
Show file tree

Hide file tree

Showing 18 changed files with 340 additions and 257 deletions.
diff --git a/apps/dolly-frontend/src/main/js/package-lock.json b/apps/dolly-frontend/src/main/js/package-lock.json
diff --git a/apps/dolly-frontend/src/main/js/package.json b/apps/dolly-frontend/src/main/js/package.json
@@ -1,6 +1,6 @@
 {
   "name": "dolly",
-  "version": "3.0.27",
+  "version": "3.0.29",
   "type": "module",
   "description": "",
   "main": "index.js",

diff --git a/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/stegVelger/StegVelger.tsx b/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/stegVelger/StegVelger.tsx
@@ -26,6 +26,10 @@ import { DollyValidation } from './steg/steg2/DollyValidation'
 
 const STEPS = [Steg1, Steg2, Steg3]
 
+export const devEnabled =
+	window.location.hostname.includes('localhost') ||
+	window.location.hostname.includes('dolly-frontend-dev')
+
 export const StegVelger = ({ initialValues, onSubmit }) => {
 	const context = useContext(BestillingsveilederContext)
 	const errorContext: ShowErrorContextType = useContext(ShowErrorContext)
@@ -81,10 +85,6 @@ export const StegVelger = ({ initialValues, onSubmit }) => {
 
 	const labels = STEPS.map((v) => ({ label: v.label }))
 
-	const devEnabled =
-		window.location.hostname.includes('localhost') ||
-		window.location.hostname.includes('dolly-frontend-dev')
-
 	return (
 		<FormProvider {...formMethods}>
 			<Stepper orientation="horizontal" activeStep={step + 1}>

diff --git a/apps/dolly-frontend/src/main/js/src/components/fagsystem/pdlf/PdlTypes.tsx b/apps/dolly-frontend/src/main/js/src/components/fagsystem/pdlf/PdlTypes.tsx
@@ -174,7 +174,7 @@ export type VergemaalValues = {
 	sakType?: string
 	gyldigFraOgMed: string
 	gyldigTilOgMed: string
-	nyVergeIdent?: NyIdent
+	nyVergeIdent?: NyIdent | undefined
 	vergeIdent?: string
 	id: number
 }

diff --git a/apps/dolly-frontend/src/main/js/src/components/fagsystem/pdlf/form/initialValues.tsx b/apps/dolly-frontend/src/main/js/src/components/fagsystem/pdlf/form/initialValues.tsx
@@ -29,7 +29,7 @@ export const getInitialKontaktadresse = (master = 'FREG') => ({
 	adressetype: null as unknown as string,
 	gyldigFraOgMed: null as unknown as string,
 	gyldigTilOgMed: null as unknown as string,
-	opprettCoAdresseNavn: null as object,
+	opprettCoAdresseNavn: null as unknown as object,
 	kilde: 'Dolly',
 	master: master,
 })
@@ -95,8 +95,6 @@ export const initialUkjentBosted = {
 	bostedskommune: null as unknown as string,
 }
 
-export const initialOppholdAnnetSted = null as unknown as string
-
 export const initialKontaktinfoForDoedebo = {
 	skifteform: null as unknown as string,
 	attestutstedelsesdato: null as unknown as string,
@@ -226,7 +224,7 @@ export const initialOrganisasjon = {
 export const initialPerson = {
 	identifikasjonsnummer: null as unknown as string,
 	foedselsdato: null as unknown as string,
-	navn: null as typeof navn,
+	navn: null as unknown as typeof navn,
 }
 
 export const initialNyPerson = {
@@ -287,7 +285,7 @@ export const initialVergemaal = {
 	sakType: null as unknown as string,
 	gyldigFraOgMed: null as unknown as string,
 	gyldigTilOgMed: null as unknown as string,
-	nyVergeIdent: initialPdlPerson,
+	nyVergeIdent: initialPdlPerson as unknown,
 	vergeIdent: null as unknown as string,
 	mandatType: null as unknown as string,
 	kilde: 'Dolly',
@@ -338,21 +336,6 @@ export const getInitialUtenlandskIdentifikasjonsnummer = (master = 'FREG') => ({
 	master: master,
 })
 
-export const initialNyIdent = {
-	eksisterendeIdent: null as unknown as string,
-	identtype: null as unknown as string,
-	kjoenn: null as unknown as string,
-	foedtEtter: null as unknown as string,
-	foedtFoer: null as unknown as string,
-	alder: '',
-	syntetisk: true,
-	nyttNavn: {
-		hasMellomnavn: false,
-	},
-	kilde: 'Dolly',
-	master: 'FREG',
-}
-
 export const getInitialNyIdent = (master = 'FREG') => ({
 	eksisterendeIdent: null as unknown as string,
 	identtype: null as unknown as string,

diff --git a/...s/src/components/fagsystem/pdlf/form/partials/familierelasjoner/sivilstand/Sivilstand.tsx b/...s/src/components/fagsystem/pdlf/form/partials/familierelasjoner/sivilstand/Sivilstand.tsx
@@ -101,6 +101,7 @@ export const SivilstandForm = ({
 			/>
 			{kanHaRelatertPerson && (
 				<PdlPersonExpander
+					path={path}
 					nyPersonPath={`${path}.nyRelatertPerson`}
 					eksisterendePersonPath={`${path}.relatertVedSivilstand`}
 					eksisterendeNyPerson={eksisterendeNyPerson}

diff --git a/...ly-frontend/src/main/js/src/components/fagsystem/pdlf/form/partials/fullmakt/Fullmakt.tsx b/...ly-frontend/src/main/js/src/components/fagsystem/pdlf/form/partials/fullmakt/Fullmakt.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react'
+import { useContext } from 'react'
 import { FormSelect } from '@/components/ui/form/inputs/select/Select'
 import { FormDatepicker } from '@/components/ui/form/inputs/datepicker/Datepicker'
 import { SelectOptionsOppslag } from '@/service/SelectOptionsOppslag'
@@ -9,7 +10,6 @@ import { initialFullmakt } from '@/components/fagsystem/pdlf/form/initialValues'
 import { isEmpty } from '@/components/fagsystem/pdlf/form/partials/utils'
 import { SelectOptionsFormat } from '@/service/SelectOptionsFormat'
 import { UseFormReturn } from 'react-hook-form/dist/types'
-import { useContext } from 'react'
 import { BestillingsveilederContext } from '@/components/bestillingsveileder/BestillingsveilederContext'
 
 interface FullmaktProps {
@@ -40,6 +40,7 @@ export const FullmaktForm = ({ formMethods, path, eksisterendeNyPerson = null }:
 			<FormDatepicker name={`${path}.gyldigFraOgMed`} label="Gyldig fra og med" />
 			<FormDatepicker name={`${path}.gyldigTilOgMed`} label="Gyldig til og med" />
 			<PdlPersonExpander
+				path={path}
 				nyPersonPath={`${path}.nyFullmektig`}
 				eksisterendePersonPath={`${path}.motpartsPersonident`}
 				label={'FULLMEKTIG'}

diff --git a/...olly-frontend/src/main/js/src/components/fagsystem/pdlf/form/partials/nyIdent/nyIdent.tsx b/...olly-frontend/src/main/js/src/components/fagsystem/pdlf/form/partials/nyIdent/nyIdent.tsx
@@ -33,6 +33,7 @@ export const NyIdent = ({ formMethods }: NyIdentForm) => {
 				return (
 					<div className="flexbox--flex-wrap">
 						<PdlPersonExpander
+							path={path}
 							nyPersonPath={path}
 							eksisterendePersonPath={`${path}.eksisterendeIdent`}
 							label="NY IDENTITET"

diff --git a/...rontend/src/main/js/src/components/fagsystem/pdlf/form/partials/pdlPerson/PdlNyPerson.tsx b/...rontend/src/main/js/src/components/fagsystem/pdlf/form/partials/pdlPerson/PdlNyPerson.tsx
@@ -105,6 +105,7 @@ export const PdlNyPerson = ({
 					label="Gradering"
 					options={Options('gradering')}
 					isDisabled={hasEksisterendePerson}
+					size={'large'}
 				/>
 			)}
 			<FormCheckbox

diff --git a/...d/src/main/js/src/components/fagsystem/pdlf/form/partials/pdlPerson/PdlPersonExpander.tsx b/...d/src/main/js/src/components/fagsystem/pdlf/form/partials/pdlPerson/PdlPersonExpander.tsx
@@ -7,6 +7,7 @@ import { Option } from '@/service/SelectOptionsOppslag'
 import { UseFormReturn } from 'react-hook-form/dist/types'
 
 interface PdlPersonValues {
+	path: string
 	nyPersonPath: string
 	eksisterendePersonPath: string
 	eksisterendeNyPerson?: Option
@@ -18,6 +19,7 @@ interface PdlPersonValues {
 }
 
 export const PdlPersonExpander = ({
+	path,
 	nyPersonPath,
 	eksisterendePersonPath,
 	eksisterendeNyPerson = null,
@@ -50,6 +52,7 @@ export const PdlPersonExpander = ({
 				))}
 			{visPersonValg && (
 				<PdlPersonForm
+					path={path}
 					nyPersonPath={nyPersonPath}
 					eksisterendePersonPath={eksisterendePersonPath}
 					label={label}

diff --git a/...ntend/src/main/js/src/components/fagsystem/pdlf/form/partials/pdlPerson/PdlPersonForm.tsx b/...ntend/src/main/js/src/components/fagsystem/pdlf/form/partials/pdlPerson/PdlPersonForm.tsx
@@ -6,10 +6,15 @@ import { DollyApi } from '@/service/Api'
 import { useAsync } from 'react-use'
 import { Option } from '@/service/SelectOptionsOppslag'
 import { UseFormReturn } from 'react-hook-form/dist/types'
-import { useContext } from 'react'
+import { useContext, useEffect, useState } from 'react'
 import { BestillingsveilederContext } from '@/components/bestillingsveileder/BestillingsveilederContext'
+import { ToggleGroup } from '@navikt/ds-react'
+import Icon from '@/components/ui/icon/Icon'
+import styled from 'styled-components'
+import { initialPdlPerson } from '@/components/fagsystem/pdlf/form/initialValues'
 
 interface PdlPersonValues {
+	path: string
 	nyPersonPath: string
 	eksisterendePersonPath: string
 	label: string
@@ -18,7 +23,27 @@ interface PdlPersonValues {
 	eksisterendeNyPerson?: Option
 }
 
+const StyledToggleGroup = styled(ToggleGroup)`
+	&&&& {
+		div {
+			background-color: #ffffff;
+		}
+
+		button {
+			margin-right: unset;
+		}
+	}
+
+	margin: 5px 0;
+`
+
+const PersonType = {
+	NY_PERSON: 'nyPerson',
+	EKSISTERENDE_PERSON: 'eksisterendePerson',
+}
+
 export const PdlPersonForm = ({
+	path,
 	nyPersonPath,
 	eksisterendePersonPath,
 	label,
@@ -31,24 +56,62 @@ export const PdlPersonForm = ({
 		return await DollyApi.getGruppeById(gruppeId)
 	}, [])
 	//@ts-ignore
-	const gruppeIdenter = gruppe?.value?.data?.identer?.map((person) => person.ident)
 	const opts: any = useContext(BestillingsveilederContext)
+	const [type, setType] = useState(
+		formMethods.watch(eksisterendePersonPath)
+			? PersonType.EKSISTERENDE_PERSON
+			: PersonType.NY_PERSON,
+	)
+
+	const gruppeIdenter = gruppe?.value?.data?.identer?.map((person) => person.ident)
 
 	const isTestnorgeIdent = opts?.identMaster === 'PDL'
 
+	useEffect(() => {
+		formMethods.setValue(nyPersonPath, type === PersonType.NY_PERSON ? initialPdlPerson : undefined)
+		formMethods.setValue(
+			eksisterendePersonPath,
+			type === PersonType.EKSISTERENDE_PERSON ? eksisterendeNyPerson?.value : undefined,
+		)
+		formMethods.setValue(`${path}.eksisterendePerson`, type === PersonType.EKSISTERENDE_PERSON)
+		formMethods.trigger()
+	}, [type])
+
 	return (
 		<>
 			{!isTestnorgeIdent && (
 				<>
-					<h4>Opprett ny person</h4>
-					<PdlNyPerson
-						nyPersonPath={nyPersonPath}
-						eksisterendePersonPath={eksisterendePersonPath}
-						formMethods={formMethods}
-						erNyIdent={nyIdentValg !== null}
-						gruppeIdenter={gruppeIdenter}
-						eksisterendeNyPerson={eksisterendeNyPerson}
-					/>
+					<StyledToggleGroup size={'small'} value={type} onChange={setType} label={'Personvalg'}>
+						<ToggleGroup.Item key={PersonType.NY_PERSON} value={PersonType.NY_PERSON}>
+							<Icon
+								key={PersonType.NY_PERSON}
+								size={13}
+								kind={type === PersonType.NY_PERSON ? 'person-plus' : 'person-plus-fill'}
+							/>
+							{'Opprett ny person'}
+						</ToggleGroup.Item>
+						<ToggleGroup.Item
+							key={PersonType.EKSISTERENDE_PERSON}
+							value={PersonType.EKSISTERENDE_PERSON}
+						>
+							<Icon
+								key={PersonType.EKSISTERENDE_PERSON}
+								size={13}
+								kind={type === PersonType.EKSISTERENDE_PERSON ? 'person' : 'person-fill'}
+							/>
+							{'Velg eksisterende person'}
+						</ToggleGroup.Item>
+					</StyledToggleGroup>
+					{type === PersonType.NY_PERSON && (
+						<PdlNyPerson
+							nyPersonPath={nyPersonPath}
+							eksisterendePersonPath={eksisterendePersonPath}
+							formMethods={formMethods}
+							erNyIdent={nyIdentValg !== null}
+							gruppeIdenter={gruppeIdenter}
+							eksisterendeNyPerson={eksisterendeNyPerson}
+						/>
+					)}
 				</>
 			)}
 			<>
@@ -58,16 +121,17 @@ export const PdlPersonForm = ({
 							(opts?.antall > 1 && 'Valg er kun tilgjengelig for individ, ikke for gruppe') || ''
 						}
 					>
-						<h4>Velg eksisterende person</h4>
-						<PdlEksisterendePerson
-							nyPersonPath={nyPersonPath}
-							eksisterendePersonPath={eksisterendePersonPath}
-							label={label}
-							formMethods={formMethods}
-							nyIdentValg={nyIdentValg}
-							eksisterendeNyPerson={eksisterendeNyPerson}
-							disabled={opts?.antall > 1}
-						/>
+						{type === PersonType.EKSISTERENDE_PERSON && (
+							<PdlEksisterendePerson
+								nyPersonPath={nyPersonPath}
+								eksisterendePersonPath={eksisterendePersonPath}
+								label={label}
+								formMethods={formMethods}
+								nyIdentValg={nyIdentValg}
+								eksisterendeNyPerson={eksisterendeNyPerson}
+								disabled={opts?.antall > 1}
+							/>
+						)}
 					</div>
 				}
 			</>

diff --git a/...-frontend/src/main/js/src/components/fagsystem/pdlf/form/partials/vergemaal/Vergemaal.tsx b/...-frontend/src/main/js/src/components/fagsystem/pdlf/form/partials/vergemaal/Vergemaal.tsx
@@ -45,6 +45,7 @@ export const VergemaalForm = ({
 			<FormDatepicker name={`${path}.gyldigFraOgMed`} label="Gyldig f.o.m." />
 			<FormDatepicker name={`${path}.gyldigTilOgMed`} label="Gyldig t.o.m." />
 			<PdlPersonExpander
+				path={path}
 				nyPersonPath={`${path}.nyVergeIdent`}
 				eksisterendePersonPath={`${path}.vergeIdent`}
 				eksisterendeNyPerson={eksisterendeNyPerson}

diff --git a/apps/dolly-frontend/src/main/js/src/components/fagsystem/pdlf/visning/partials/Vergemaal.tsx b/apps/dolly-frontend/src/main/js/src/components/fagsystem/pdlf/visning/partials/Vergemaal.tsx
@@ -123,7 +123,6 @@ const VergemaalVisning = ({
 }: VergemaalVisningTypes) => {
 	const initVergemaal = Object.assign(_.cloneDeep(initialVergemaal), data[idx])
 	let initialValues = { vergemaal: initVergemaal }
-	initialValues.vergemaal.nyVergeIdent = initialPdlPerson
 
 	const redigertVergemaalPdlf = _.get(tmpPersoner, `${ident}.person.vergemaal`)?.find(
 		(a: VergemaalValues) => a.id === vergemaalData.id,
@@ -136,6 +135,9 @@ const VergemaalVisning = ({
 	}
 
 	const vergemaalValues = redigertVergemaalPdlf ? redigertVergemaalPdlf : vergemaalData
+
+	initialValues.vergemaal.nyVergeIdent = initialPdlPerson
+
 	let redigertVergemaalValues = redigertVergemaalPdlf
 		? {
 				vergemaal: Object.assign(_.cloneDeep(initialVergemaal), redigertVergemaalPdlf),

diff --git a/...src/main/js/src/components/fagsystem/pdlf/visning/visningRedigerbar/VisningRedigerbar.tsx b/...src/main/js/src/components/fagsystem/pdlf/visning/visningRedigerbar/VisningRedigerbar.tsx
@@ -39,9 +39,11 @@ import { Form, FormProvider, useForm } from 'react-hook-form'
 import { visningRedigerbarValidation } from '@/components/fagsystem/pdlf/visning/visningRedigerbar/VisningRedigerbarValidation'
 import { yupResolver } from '@hookform/resolvers/yup'
 import './VisningRedigerbarForm.less'
-import { boolean } from 'yup'
 import { FoedestedForm } from '@/components/fagsystem/pdlf/form/partials/foedsel/Foedested'
 import { FoedselsdatoForm } from '@/components/fagsystem/pdlf/form/partials/foedsel/Foedselsdato'
+import DisplayFormState from '@/utils/DisplayFormState'
+import DisplayFormErrors from '@/utils/DisplayFormErrors'
+import { devEnabled } from '@/components/bestillingsveileder/stegVelger/StegVelger'
 
 type VisningTypes = {
 	getPdlForvalter: Function
@@ -51,6 +53,7 @@ type VisningTypes = {
 	redigertAttributt?: any
 	path: string
 	ident: string
+	identMaster?: string
 	identtype?: string
 	disableSlett?: boolean
 	personFoerLeggTil?: any
@@ -121,7 +124,7 @@ export const VisningRedigerbar = ({
 	path,
 	ident,
 	identtype,
-	identMaster = boolean,
+	identMaster = '',
 	disableSlett = false,
 	personValues = null,
 	relasjoner = null,
@@ -151,7 +154,7 @@ export const VisningRedigerbar = ({
 
 	const sendData = (data) => {
 		const id = _.get(data, `${path}.id`)
-		const itemData = _.get(data, path)
+		const itemData = formMethods.watch(path)
 		return PdlforvalterApi.putAttributt(ident, path?.toLowerCase(), id, itemData)
 			.catch((error: Error) => {
 				pdlfError(error)
@@ -400,8 +403,18 @@ export const VisningRedigerbar = ({
 					</>
 				)}
 				{visningModus === Modus.Skriv && (
-					<Form onSubmit={(data) => handleSubmit(data?.data)}>
+					<Form
+						onSubmit={(data) => {
+							return handleSubmit(data?.data)
+						}}
+					>
 						<>
+							{devEnabled && (
+								<>
+									<DisplayFormState />
+									<DisplayFormErrors errors={formMethods.formState.errors} label={'Vis errors'} />
+								</>
+							)}
 							<FieldArrayEdit>
 								<div className="flexbox--flex-wrap visning-redigerbar-form">
 									{getForm(formMethods)}