diff --git a/apps/frontend/src/components/etterlevelse/Edit/EtterlevelseEditFields.tsx b/apps/frontend/src/components/etterlevelse/Edit/EtterlevelseEditFields.tsx index 59136bff2..ef009c58f 100644 --- a/apps/frontend/src/components/etterlevelse/Edit/EtterlevelseEditFields.tsx +++ b/apps/frontend/src/components/etterlevelse/Edit/EtterlevelseEditFields.tsx @@ -1,5 +1,5 @@ -import { Alert, BodyShort, Button, Checkbox, Label, Modal } from '@navikt/ds-react' -import { Form, Formik, FormikProps, validateYupSchema, yupToFormErrors } from 'formik' +import { Alert, BodyShort, Button, Checkbox, ErrorSummary, Label, Modal } from '@navikt/ds-react' +import { Form, Formik, FormikErrors, FormikProps, validateYupSchema, yupToFormErrors } from 'formik' import _ from 'lodash' import moment from 'moment' import React, { useEffect, useState } from 'react' @@ -16,6 +16,7 @@ import { ERelationType, IDocumentRelation, IEtterlevelse, + ISuksesskriterieBegrunnelse, TEtterlevelseDokumentasjonQL, TKravQL, } from '../../../constants' @@ -24,6 +25,7 @@ import { DateField } from '../../common/Inputs' import { syncEtterlevelseKriterieBegrunnelseWithKrav } from '../../etterlevelseDokumentasjonTema/common/utils' import EtterlevelseCard from '../EtterlevelseCard' import { SuksesskriterierBegrunnelseEdit } from './SuksesskriterieBegrunnelseEdit' +import SuksesskriterieErrorFields from './SuksesskriterieErrorFields' import { etterlevelseSchema } from './etterlevelseSchema' type TEditProps = { @@ -68,6 +70,9 @@ export const EtterlevelseEditFields = ({ const [morDokumentRelasjon, setMorDokumentRelasjon] = useState() const [morEtterlevelse, setMorEtterlevelse] = useState() + const errorSummaryRef = React.useRef(null) + const [validateOnBlur, setValidateOnBlur] = useState(false) + const navigate = useNavigate() useEffect(() => { if (navigatePath) { @@ -137,7 +142,7 @@ export const EtterlevelseEditFields = ({ }} innerRef={formRef} validateOnChange={false} - validateOnBlur={false} + validateOnBlur={validateOnBlur} > {({ values, @@ -174,14 +179,6 @@ export const EtterlevelseEditFields = ({ forGjenbruk={etterlevelseDokumentasjon?.forGjenbruk} morEtterlevelse={morEtterlevelse} /> - -
- {Object.keys(errors).length > 0 && ( - - Du må fylle ut alle obligatoriske felter - - )} -
@@ -199,7 +196,7 @@ export const EtterlevelseEditFields = ({ {isOppfylesSenere && ( -
+
@@ -213,12 +210,35 @@ export const EtterlevelseEditFields = ({
)} -
+ {!_.isEmpty(errors) && ( + console.debug(errors)} + > + {errors.suksesskriterieBegrunnelser && ( + [] + } + /> + )} + + {errors.fristForFerdigstillelse && ( + + {errors.fristForFerdigstillelse} + + )} + + )} + +
- - )} diff --git a/apps/frontend/src/components/krav/Edit/KravCreatePage.tsx b/apps/frontend/src/components/krav/Edit/KravCreatePage.tsx index f92e0f1c0..e81cd140e 100644 --- a/apps/frontend/src/components/krav/Edit/KravCreatePage.tsx +++ b/apps/frontend/src/components/krav/Edit/KravCreatePage.tsx @@ -6,7 +6,6 @@ import { createKrav, kravMapToFormVal } from '../../../api/KravApi' import { EKravStatus, IKrav, TKravQL } from '../../../constants' import { kravBreadCrumbPath } from '../../../pages/util/BreadCrumbPath' import { CodelistService, EListName, ICode, TLovCode } from '../../../services/Codelist' -import { ScrollToFieldError } from '../../../util/formikUtils' import ErrorModal from '../../ErrorModal' import { TextAreaField } from '../../common/Inputs' import { PageLayout } from '../../scaffold/Page' @@ -119,7 +118,6 @@ export const KravCreatePage = () => { errorMessage={errorModalMessage} submit={setShowErrorModal} /> - )} diff --git a/apps/frontend/src/components/krav/Edit/KravEditPage.tsx b/apps/frontend/src/components/krav/Edit/KravEditPage.tsx index 3a5e745f6..85dc106e5 100644 --- a/apps/frontend/src/components/krav/Edit/KravEditPage.tsx +++ b/apps/frontend/src/components/krav/Edit/KravEditPage.tsx @@ -22,7 +22,6 @@ import { import { kravBreadCrumbPath } from '../../../pages/util/BreadCrumbPath' import { CodelistService, EListName, ICode, TLovCode } from '../../../services/Codelist' import { user } from '../../../services/User' -import { ScrollToFieldError } from '../../../util/formikUtils' import ErrorModal from '../../ErrorModal' import { TextAreaField } from '../../common/Inputs' import { PageLayout } from '../../scaffold/Page' @@ -340,7 +339,6 @@ export const KravEditPage = () => { errorMessage={errorModalMessage} submit={setShowErrorModal} /> - )} diff --git a/apps/frontend/src/components/krav/Edit/KravNyVersjonPage.tsx b/apps/frontend/src/components/krav/Edit/KravNyVersjonPage.tsx index b7f6f0b80..1f9cd314b 100644 --- a/apps/frontend/src/components/krav/Edit/KravNyVersjonPage.tsx +++ b/apps/frontend/src/components/krav/Edit/KravNyVersjonPage.tsx @@ -7,7 +7,6 @@ import { GetKravData, IKravDataProps, TKravById } from '../../../api/KravEditApi import { EKravStatus, IKrav, TKravQL } from '../../../constants' import { kravBreadCrumbPath } from '../../../pages/util/BreadCrumbPath' import { CodelistService, EListName, ICode, TLovCode } from '../../../services/Codelist' -import { ScrollToFieldError } from '../../../util/formikUtils' import { TextAreaField } from '../../common/Inputs' import { FormError } from '../../common/ModalSchema' import { PageLayout } from '../../scaffold/Page' @@ -152,7 +151,6 @@ export const KravNyVersjonPage = () => { />
- )} diff --git a/apps/frontend/src/components/krav/Edit/KravSchemaValidation.ts b/apps/frontend/src/components/krav/Edit/KravSchemaValidation.ts index 417585ef8..08c4e754c 100644 --- a/apps/frontend/src/components/krav/Edit/KravSchemaValidation.ts +++ b/apps/frontend/src/components/krav/Edit/KravSchemaValidation.ts @@ -52,7 +52,7 @@ const checkIfVersjonEndringIsEmpty = (versjonEndringer: string, kravVersjon: num const hensiktCheck = yup.string().test({ name: 'hensiktCheck', - message: EYupErrorMessage.PAAKREVD, + message: 'Du må oppgi et hensikt til kravet', test: function (hensikt) { const { parent } = this return activeStatusValueValidation(parent.status, checkIfHensiktHasValue(hensikt as string)) @@ -73,7 +73,7 @@ const suksesskriterierCheck = yup.array().test({ const regelverkCheck = yup.array().test({ name: 'regelverkCheck', - message: EYupErrorMessage.PAAKREVD, + message: 'Kravet må være knyttet til et regelverk', test: function (regelverk) { const { parent } = this return activeStatusValueValidation( diff --git a/apps/frontend/src/components/krav/Edit/KravSuksesskriterieEdit.tsx b/apps/frontend/src/components/krav/Edit/KravSuksesskriterieEdit.tsx index 4ad8618dd..0e6f9bf75 100644 --- a/apps/frontend/src/components/krav/Edit/KravSuksesskriterieEdit.tsx +++ b/apps/frontend/src/components/krav/Edit/KravSuksesskriterieEdit.tsx @@ -99,7 +99,7 @@ const KriterieList = ({ {newKrav && } {!newKrav && - (fieldArrayRenderProps.form.values.status !== EKravStatus.AKTIV || newVersion) && ( + (fieldArrayRenderProps.form.initialValues.status !== EKravStatus.AKTIV || newVersion) && ( )} @@ -162,7 +162,8 @@ const Kriterie = ({
- {(fieldArrayRenderProps.form.values.status !== EKravStatus.AKTIV || newVersion) && ( + {(fieldArrayRenderProps.form.initialValues.status !== EKravStatus.AKTIV || + newVersion) && (