diff --git a/apps/dolly-frontend/src/main/js/src/components/ui/form/fieldArray/DollyFieldArray.tsx b/apps/dolly-frontend/src/main/js/src/components/ui/form/fieldArray/DollyFieldArray.tsx index a8b199028a..869b9a7c18 100644 --- a/apps/dolly-frontend/src/main/js/src/components/ui/form/fieldArray/DollyFieldArray.tsx +++ b/apps/dolly-frontend/src/main/js/src/components/ui/form/fieldArray/DollyFieldArray.tsx @@ -6,7 +6,6 @@ import './dollyFieldArray.less' import { ErrorBoundary } from '@/components/ui/appError/ErrorBoundary' import styled from 'styled-components' import { useFieldArray, useFormContext } from 'react-hook-form' -import { useEffect } from 'react' const numberColor = { ARRAY_LEVEL_ONE: '#CCE3ED', @@ -225,20 +224,12 @@ export const FormDollyFieldArray = ({ errorText = null, }) => { const formMethods = useFormContext() - const { append, update, fields, remove } = useFieldArray({ + const { append, remove } = useFieldArray({ control: formMethods.control, name: name, }) - useEffect(() => { - // Noen ganger blir formet oppdatert utenfra via setValue, - // da vil denne sjekken sørge for at vi oppdaterer fields også - if (formMethods.watch(name).length !== fields.length) { - formMethods.watch(name).forEach((entry, idx) => { - update(idx, entry) - }) - } - }, [fields]) + const values = formMethods.watch(name) || [] const addNewEntry = () => { handleNewEntry ? handleNewEntry() : append(newEntry) @@ -248,8 +239,8 @@ export const FormDollyFieldArray = ({ return ( - {fields.map((curr, idx) => { - const showDeleteButton = canBeEmpty ? true : fields.length >= 2 + {values.map((curr, idx) => { + const showDeleteButton = canBeEmpty ? true : values.length >= 2 const path = `${name}.${idx}` const number = tag ? `${tag}.${idx + 1}` : `${idx + 1}` const handleRemove = () => { @@ -300,10 +291,10 @@ export const FormDollyFieldArray = ({ })} {errorText && {errorText}}