Skip to content

Commit

Permalink
En del mer bugfiksing og refaktorering for react-hook-forms
Browse files Browse the repository at this point in the history
  • Loading branch information
stigus committed Dec 18, 2023
1 parent ee261d9 commit 6a08fa3
Show file tree
Hide file tree
Showing 7 changed files with 111 additions and 97 deletions.
72 changes: 36 additions & 36 deletions apps/dolly-frontend/src/main/js/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions apps/dolly-frontend/src/main/js/src/app/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import { runningCypressE2E } from '@/service/services/Request'
import { navigateToLogin } from '@/components/utlogging/navigateToLogin'
import { FaroErrorBoundary } from '@grafana/faro-react'
import { ErrorBoundary } from '@/components/ui/appError/ErrorBoundary'
import { InfoStripe } from '@/components/infostripe/InfoStripe'

const logout = (feilmelding: string) => {
if (!runningCypressE2E()) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,12 @@ import { FormikSelect } from '@/components/ui/form/inputs/select/Select'
import { FormikDatepicker } from '@/components/ui/form/inputs/datepicker/Datepicker'
import { FormikTextInput } from '@/components/ui/form/inputs/textInput/TextInput'
import { ArbeidKodeverk } from '@/config/kodeverk'
import { useFormContext } from 'react-hook-form'

export const ArbeidsavtaleForm = ({ path, onChangeLenket, ...props }) => {
const { watch } = useFormContext()
const yrke = watch(`${path}.yrke`)
console.log('yrke: ', yrke) //TODO - SLETT MEG
return (
<div>
<h3>Ansettelsesdetaljer</h3>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -158,12 +158,14 @@ export const ArbeidsforholdForm = ({
arbeidsforholdstype: event.value,
arbeidsgiver: gjeldendeArbeidsgiver,
})
trigger()
} else if (arbeidsgiverType === ArbeidsgiverTyper.privat) {
setFieldValue(path, {
...initialForenkletOppgjoersordningPers,
arbeidsforholdstype: event.value,
arbeidsgiver: gjeldendeArbeidsgiver,
})
trigger()
}
}
} else {
Expand All @@ -177,23 +179,27 @@ export const ArbeidsforholdForm = ({
arbeidsforholdstype: event.value,
arbeidsgiver: gjeldendeArbeidsgiver,
})
trigger()
} else if (arbeidsgiverType === ArbeidsgiverTyper.privat) {
setFieldValue(path, {
...initialArbeidsforholdPers,
arbeidsforholdstype: event.value,
arbeidsgiver: gjeldendeArbeidsgiver,
})
trigger
}
} else {
setFieldValue(`${path}.arbeidsforholdstype`, event.value)
trigger
}
if (event.value === 'maritimtArbeidsforhold') {
setFieldValue(`${path}.fartoy`, initialFartoy)
trigger()
} else {
setFieldValue(`${path}.fartoy`, undefined)
trigger()
}
}
trigger(path)
}

useEffect(() => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const validInputOrCheckboxTest = (val, checkboxPath, feilmelding, inputValidatio
return true
}

const path = testContext.path.substring(0, this.path.lastIndexOf('.'))
const path = testContext.path.substring(0, testContext.path.lastIndexOf('.'))

const checkbox = _.get(fullForm, `${path}.${checkboxPath}`)

Expand All @@ -30,7 +30,7 @@ const validInputOrCheckboxTest = (val, checkboxPath, feilmelding, inputValidatio

// from - begynner med 0
const replaceSubstringAtPos = (str, from, to, replaceWith) => {
return str.substring(0, from) + replaceWith + str.substr(to + 1)
return str.substring(0, from) + replaceWith + str.substring(to + 1)
}

const validateIban = (kontonummer, form) => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -227,8 +227,9 @@ export const EgneOrganisasjoner = ({
onChange={(event) => {
setOrgnr(event.value)
handleChange(event)
formMethods.trigger()
}}
value={_.get(formMethods.getValues(), path)}
value={formMethods.watch(path)}
feil={sjekkOrganisasjoner()}
isClearable={false}
/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import { DollyCheckbox } from '@/components/ui/form/inputs/checbox/Checkbox'
import { allCapsToCapitalized } from '@/utils/DataFormatter'
import * as _ from 'lodash'
import { REGEX_BACKEND_GRUPPER, useMatchMutate } from '@/utils/hooks/useMutate'
import { useFieldArray, useForm } from 'react-hook-form'
import { FormProvider, useFieldArray, useForm } from 'react-hook-form'

type RelatertPersonProps = {
type: string
Expand Down Expand Up @@ -106,7 +106,7 @@ export const RelatertPersonImportButton = ({
}

const identForm = () => {
const fieldMethods = useFieldArray({ name: 'identer' })
const fieldMethods = useFieldArray({ control: formMethods.control, name: 'identer' })
const values = fieldMethods.fields?.values?.identer
const isChecked = (id: string) => values?.includes(id)
const onClick = (e: { target: RelatertPersonProps }) => {
Expand Down Expand Up @@ -135,60 +135,62 @@ export const RelatertPersonImportButton = ({
}

return (
<div>
<Button
onClick={openModal}
disabled={disabled}
title={disabled ? 'Relaterte personer er allerede i gruppen' : ''}
kind="relasjoner"
className="svg-icon-blue"
>
{relatertPersonIdenter.length > 1
? 'IMPORTER RELATERTE PERSONER'
: `IMPORTER ${relatertPersonIdenter[0]?.type}`}
</Button>
{feilmelding && (
<div className="error-message" style={{ margin: '5px 0 0 30px' }}>
{feilmelding}
</div>
)}
<DollyModal isOpen={modalIsOpen} closeModal={closeModal} width="40%" overflow="auto">
<div className="relatertPersonImportModal">
<Icon size={50} kind="personinformasjon" />
{relatertPersonIdenter.length > 1 ? (
<>
<h1>Importer relaterte personer</h1>
<h4>Velg hvilke relaterte personer du ønsker å importere</h4>
{identForm()}
</>
) : (
<>
<div className="relatertPersonImportModal-content-center">
<h1>{`Importer ${foersteRelatertPersonType}`}</h1>
<h4>
{`Er du sikker på at du vil importere og legge til valgt persons ${
foersteRelatertPersonType || 'relaterte person'
} i gruppen?`}
</h4>
</div>
<div className="relatertPersonImportModal-actions">
<NavButton onClick={closeModal} variant={'secondary'}>
Nei
</NavButton>
<NavButton
onClick={() => {
closeModal()
handleImport([relatertPersonIdenter[0]?.id])
}}
variant={'primary'}
>
Ja
</NavButton>
</div>
</>
)}
</div>
</DollyModal>
</div>
<FormProvider {...formMethods}>
<div>
<Button
onClick={openModal}
disabled={disabled}
title={disabled ? 'Relaterte personer er allerede i gruppen' : ''}
kind="relasjoner"
className="svg-icon-blue"
>
{relatertPersonIdenter.length > 1
? 'IMPORTER RELATERTE PERSONER'
: `IMPORTER ${relatertPersonIdenter[0]?.type}`}
</Button>
{feilmelding && (
<div className="error-message" style={{ margin: '5px 0 0 30px' }}>
{feilmelding}
</div>
)}
<DollyModal isOpen={modalIsOpen} closeModal={closeModal} width="40%" overflow="auto">
<div className="relatertPersonImportModal">
<Icon size={50} kind="personinformasjon" />
{relatertPersonIdenter.length > 1 ? (
<>
<h1>Importer relaterte personer</h1>
<h4>Velg hvilke relaterte personer du ønsker å importere</h4>
{identForm()}
</>
) : (
<>
<div className="relatertPersonImportModal-content-center">
<h1>{`Importer ${foersteRelatertPersonType}`}</h1>
<h4>
{`Er du sikker på at du vil importere og legge til valgt persons ${
foersteRelatertPersonType || 'relaterte person'
} i gruppen?`}
</h4>
</div>
<div className="relatertPersonImportModal-actions">
<NavButton onClick={closeModal} variant={'secondary'}>
Nei
</NavButton>
<NavButton
onClick={() => {
closeModal()
handleImport([relatertPersonIdenter[0]?.id])
}}
variant={'primary'}
>
Ja
</NavButton>
</div>
</>
)}
</div>
</DollyModal>
</div>
</FormProvider>
)
}

0 comments on commit 6a08fa3

Please sign in to comment.