React hook forms select orgnr og inntektsaarForm fix

#deploy-test-frontend
navikt · Jan 18, 2024 · 312e5d2 · 312e5d2
1 parent 2346b2b
commit 312e5d2
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 19 deletions.
diff --git a/...ontend/src/main/js/src/components/fagsystem/inntektstub/form/partials/orgnummerToggle.tsx b/...ontend/src/main/js/src/components/fagsystem/inntektstub/form/partials/orgnummerToggle.tsx
@@ -32,7 +32,8 @@ export const OrgnummerToggle = ({ formMethods, opplysningspliktigPath, path }: P
 	const [success, setSuccess] = useBoolean(false)
 	const [loading, setLoading] = useBoolean(false)
 	const [environment, setEnvironment] = useState(null)
-	const [orgnummer, setOrgnummer] = useState(null)
+	const [orgnummer, setOrgnummer] = useState(formMethods.watch(path) || null)
+	console.log('path: ', path) //TODO - SLETT MEG
 
 	const { organisasjon } = useFasteDataOrganisasjon(orgnummer)
 
@@ -48,12 +49,12 @@ export const OrgnummerToggle = ({ formMethods, opplysningspliktigPath, path }: P
 		formMethods.trigger(opplysningspliktigPath)
 		formMethods.setValue(`${path}`, value.orgnr)
 	}
+	//TODO: Fikse henting fra testnav-org-service
 
 	const handleManualOrgChange = (org: string, miljo: string) => {
 		if (!org || !miljo) {
 			return
 		}
-		formMethods.setValue(path, '')
 		setError(null)
 		setLoading(true)
 		setSuccess(false)
@@ -113,11 +114,14 @@ export const OrgnummerToggle = ({ formMethods, opplysningspliktigPath, path }: P
 					loading={loading}
 					success={success}
 					onTextBlur={(event) => {
+						console.log('event: ', event) //TODO - SLETT MEG
 						const org = event.target.value
 						setOrgnummer(org)
 						handleManualOrgChange(org, environment)
 					}}
 					onMiljoeChange={(event) => {
+						console.log('orgnummer: ', orgnummer) //TODO - SLETT MEG
+						console.log('event2: ', event) //TODO - SLETT MEG
 						setEnvironment(event.value)
 						handleManualOrgChange(orgnummer, event.value)
 					}}

diff --git a/...rontend/src/main/js/src/components/fagsystem/sigrunstub/form/partials/inntektsaarForm.tsx b/...rontend/src/main/js/src/components/fagsystem/sigrunstub/form/partials/inntektsaarForm.tsx
@@ -4,9 +4,13 @@ import { FormikSelect } from '@/components/ui/form/inputs/select/Select'
 import { SelectOptionsManager as Options } from '@/service/SelectOptions'
 import { EnkeltinntektForm } from './enkeltinntektForm'
 import { getYearRangeOptions } from '@/utils/DataFormatter'
-import React from 'react'
+import React, { useContext } from 'react'
 import { ErrorBoundary } from '@/components/ui/appError/ErrorBoundary'
 import { ErrorMessage } from '@hookform/error-message'
+import {
+	ShowErrorContext,
+	ShowErrorContextType,
+} from '@/components/bestillingsveileder/ShowErrorContext'
 
 const initialValues = {
 	inntektsaar: new Date().getFullYear(),
@@ -16,6 +20,7 @@ const initialValues = {
 }
 
 export const InntektsaarForm = ({ formMethods }) => {
+	const errorContext: ShowErrorContextType = useContext(ShowErrorContext)
 	const initialGrunnlag = {
 		tekniskNavn: '',
 		verdi: '',
@@ -76,9 +81,11 @@ export const InntektsaarForm = ({ formMethods }) => {
 								<ErrorMessage
 									errors={formMethods.formState.errors}
 									name={`${path}.grunnlag`}
-									render={({ message }) => (
-										<span style={{ color: '#ba3a26', fontStyle: 'italic' }}>{message}</span>
-									)}
+									render={({ message }) =>
+										errorContext.showError && (
+											<span style={{ color: '#ba3a26', fontStyle: 'italic' }}>{message}</span>
+										)
+									}
 								/>
 							</div>
 						</React.Fragment>

diff --git a/...lly-frontend/src/main/js/src/components/fagsystem/sigrunstubPensjonsgivende/form/Form.tsx b/...lly-frontend/src/main/js/src/components/fagsystem/sigrunstubPensjonsgivende/form/Form.tsx
@@ -14,15 +14,22 @@ import {
 	usePensjonsgivendeInntektSkatteordning,
 } from '@/utils/hooks/useSigrunstub'
 import { getInitialInntekt } from '@/components/fagsystem/sigrunstubPensjonsgivende/utils'
-import * as _ from 'lodash'
 import { validation } from '@/components/fagsystem/sigrunstubPensjonsgivende/form/validation'
 import { useFormContext } from 'react-hook-form'
 
 export const getInitialSigrunstubPensjonsgivende = (kodeverk = null, skatteordning = null) => {
 	return {
 		inntektsaar: new Date().getFullYear(),
-		pensjonsgivendeInntekt:
-			kodeverk && skatteordning ? [getInitialInntekt(kodeverk, skatteordning)] : [],
+		pensjonsgivendeInntekt: [
+			{
+				skatteordning: 'FASTLAND',
+				datoForFastsetting: new Date(),
+				pensjonsgivendeInntektAvLoennsinntekt: null,
+				pensjonsgivendeInntektAvLoennsinntektBarePensjonsdel: null,
+				pensjonsgivendeInntektAvNaeringsinntekt: null,
+				pensjonsgivendeInntektAvNaeringsinntektFraFiskeFangstEllerFamiliebarnehage: null,
+			},
+		],
 		testdataEier: '',
 	}
 }
@@ -38,12 +45,13 @@ export const SigrunstubPensjonsgivendeForm = () => {
 		const pensjonsgivendeInntektPath = 'sigrunstubPensjonsgivende[0].pensjonsgivendeInntekt'
 		const forstePensjonsgivendeInntekt = formMethods.watch(pensjonsgivendeInntektPath)
 		if (
-			_.has(formMethods.getValues(), 'sigrunstubPensjonsgivende') &&
+			formMethods.watch('sigrunstubPensjonsgivende') &&
 			kodeverk &&
 			skatteordning &&
 			(!forstePensjonsgivendeInntekt || forstePensjonsgivendeInntekt.length < 1)
 		) {
 			formMethods.setValue(pensjonsgivendeInntektPath, [getInitialInntekt(kodeverk, skatteordning)])
+			formMethods.trigger(pensjonsgivendeInntektPath)
 		}
 	}, [kodeverk, skatteordning])
 

diff --git a/...ly-frontend/src/main/js/src/components/organisasjonSelect/OrganisasjonMedMiljoeSelect.tsx b/...ly-frontend/src/main/js/src/components/organisasjonSelect/OrganisasjonMedMiljoeSelect.tsx
@@ -19,7 +19,6 @@ export const OrganisasjonMedMiljoeSelect = ({
 	path,
 	environment,
 	miljoeOptions,
-	error,
 	success,
 	loading = false,
 	onTextBlur,
@@ -42,18 +41,12 @@ export const OrganisasjonMedMiljoeSelect = ({
 				onBlur={onTextBlur}
 			/>
 			<DollySelect
-				name={path}
 				size={'small'}
 				isClearable={false}
 				label={'Organisasjon Miljø'}
 				options={options}
 				value={environment}
 				onChange={onMiljoeChange}
-				feil={
-					!environment && {
-						feilmelding: 'Må velge miljø',
-					}
-				}
 			/>
 			{loading && (
 				<div className={'flexbox--align-center'} style={{ marginTop: '20px' }}>

diff --git a/apps/dolly-frontend/src/main/js/src/components/ui/form/inputs/select/Select.tsx b/apps/dolly-frontend/src/main/js/src/components/ui/form/inputs/select/Select.tsx
@@ -62,12 +62,18 @@ export const Select = ({
 }: SelectProps) => {
 	const formMethods = useFormContext()
 	const val = formMethods?.watch(name)
-	let _value = isMulti
+	let formValue = isMulti
 		? options?.filter?.((o) => val?.some((el) => el === o?.value))
 		: options?.filter?.((o) => {
 				return o?.value === val
 			})
 
+	let propValue = isMulti
+		? options?.filter?.((o) => value?.some((el) => el === o?.value))
+		: options?.filter?.((o) => {
+				return o?.value === value
+			})
+
 	if (!onChange) {
 		onChange = (selected, meta) => {
 			formMethods?.setValue(name, selected?.value)
@@ -77,7 +83,7 @@ export const Select = ({
 
 	return (
 		<ReactSelect
-			value={_value}
+			value={!_.isEmpty(formValue) ? formValue : propValue}
 			options={options}
 			name={name}
 			inputId={id || name}