småfiks etter review

Author: sirimykland

packages/fakta/felles/index.ts

@@ -16,5 +16,3 @@ export { Personopplysninger } from './src/components/personer/Personopplysninger
 export { PersonopplysningerForFamilie } from './src/components/personer/PersonopplysningerForFamilie';
 
 export { AdresseTabell } from './src/components/adresser/AdresseTabell';
-
-export { ValueLabel } from './src/components/ValueLabel';

packages/fakta/felles/src/components/ValueLabel.tsx

@@ -31,6 +31,7 @@ const meta = {
   decorators: [withMellomlagretFormData, withPanelData],
   args: {
     submittable: true,
+    isReadOnly: false,
     aksjonspunkterForPanel: [],
     alleMerknaderFraBeslutter: {},
     terminbekreftelseDokument: {

packages/fakta/fodsel/src/FodselFaktaIndex.stories.tsx

@@ -8,8 +8,8 @@ import type { Fødsel } from '@navikt/fp-types';
 import type { DokumentLinkReferanse } from '@navikt/fp-ui-komponenter';
 import { usePanelDataContext } from '@navikt/fp-utils';
 
-import { SjekkFodselDokForm } from './aksjonspunkt/SjekkFodselDokForm';
-import { TermindatoFaktaForm } from './aksjonspunkt/TermindatoFaktaForm';
+import { SjekkManglendeFDselForm } from './aksjonspunkt/SjekkManglendeFødselForm';
+import { SjekkTerminbekreftelseForm } from './aksjonspunkt/SjekkTerminbekreftelseForm';
 import { FaktaFødselFraFReg } from './fakta/FaktaFødselFraFReg';
 import { FaktaFødselFraSøknad } from './fakta/FaktaFødselFraSøknad';
 import { Situasjon } from './fakta/Situasjon';
@@ -52,11 +52,11 @@ export const FodselInfoPanel = ({ submittable, fødsel, terminbekreftelseDokumen
       </HGrid>
 
       {terminbekreftelseAp && (
-        <TermindatoFaktaForm submittable={submittable} fødsel={fødsel} aksjonspunkt={terminbekreftelseAp} />
+        <SjekkTerminbekreftelseForm submittable={submittable} fødsel={fødsel} aksjonspunkt={terminbekreftelseAp} />
       )}
 
       {manglendeFødselAp && (
-        <SjekkFodselDokForm submittable={submittable} fødsel={fødsel} aksjonspunkt={manglendeFødselAp} />
+        <SjekkManglendeFDselForm submittable={submittable} fødsel={fødsel} aksjonspunkt={manglendeFødselAp} />
       )}
     </VStack>
   );

packages/fakta/fodsel/src/components/FodselInfoPanel.tsx

@@ -12,11 +12,11 @@ import type { SjekkManglendeFodselAp } from '@navikt/fp-types-avklar-aksjonspunk
 import { FaktaKort } from '@navikt/fp-ui-komponenter';
 import { useMellomlagretFormData, usePanelDataContext } from '@navikt/fp-utils';
 
-import { type AvklarBarnFormValues, AvklartBarnFieldArray } from './AvklartBarnFieldArray';
+import { BarnFieldArray, type BarnFormValues } from '../form/BarnFieldArray';
 
 type FormValues = {
   dokumentasjonForeligger?: boolean;
-} & AvklarBarnFormValues &
+} & BarnFormValues &
   FaktaBegrunnelseFormValues;
 
 interface Props {
@@ -25,7 +25,7 @@ interface Props {
   aksjonspunkt: Aksjonspunkt;
 }
 
-export const SjekkFodselDokForm = ({ submittable, aksjonspunkt, fødsel: { gjeldende } }: Props) => {
+export const SjekkManglendeFDselForm = ({ submittable, aksjonspunkt, fødsel: { gjeldende } }: Props) => {
   const intl = useIntl();
 
   const { submitCallback, alleMerknaderFraBeslutter, isReadOnly } = usePanelDataContext<SjekkManglendeFodselAp>();
@@ -49,7 +49,7 @@ export const SjekkFodselDokForm = ({ submittable, aksjonspunkt, fødsel: { gjeld
         onSubmit={values => submitCallback(transformValues(values))}
         setDataOnUnmount={setMellomlagretFormData}
       >
-        <VStack gap="2">
+        <VStack gap="6">
           <RadioGroupPanel
             name="dokumentasjonForeligger"
             isEdited={dokumentasjonForeliggerIsEdited}
@@ -63,7 +63,7 @@ export const SjekkFodselDokForm = ({ submittable, aksjonspunkt, fødsel: { gjeld
               {
                 label: <FormattedMessage id="SjekkFodselDokForm.DokumentasjonForeligger" />,
                 value: 'true',
-                element: <AvklartBarnFieldArray readOnly={isReadOnly} />,
+                element: <BarnFieldArray isReadOnly={isReadOnly} />,
               },
               {
                 label: <FormattedMessage id="SjekkFodselDokForm.DokumentasjonForeliggerIkke" />,
@@ -97,14 +97,14 @@ export const SjekkFodselDokForm = ({ submittable, aksjonspunkt, fødsel: { gjeld
 
 const buildInitialValues = (gjeldende: FødselGjeldende, aksjonspunkt: Aksjonspunkt): FormValues => ({
   dokumentasjonForeligger: gjeldende.barn.some(b => b.kilde !== 'SØKNAD'),
-  ...AvklartBarnFieldArray.initialValues(gjeldende),
+  ...BarnFieldArray.initialValues(gjeldende),
   ...FaktaBegrunnelseTextField.initialValues(aksjonspunkt),
 });
 
 const transformValues = (values: FormValues): SjekkManglendeFodselAp => ({
   kode: AksjonspunktKode.SJEKK_MANGLENDE_FODSEL,
   dokumentasjonForeligger: values.dokumentasjonForeligger!,
   brukAntallBarnITps: false,
-  ...AvklartBarnFieldArray.transformValues(values),
+  ...BarnFieldArray.transformValues(values),
   ...FaktaBegrunnelseTextField.transformValues(values),
 });

packages/fakta/fodsel/src/components/aksjonspunkt/SjekkFodselDokForm.tsx renamed to packages/fakta/fodsel/src/components/aksjonspunkt/SjekkManglendeFødselForm.tsx

@@ -34,7 +34,7 @@ import {
   validateMinAntallBarn,
 } from '@navikt/fp-utils';
 
-import styles from './termindatoFaktaForm.module.css';
+import styles from './sjekkTerminbekreftelseForm.module.css';
 
 type FormValues = {
   utstedtdato?: string;
@@ -48,7 +48,7 @@ interface Props {
   fødsel: Fødsel;
 }
 
-export const TermindatoFaktaForm = ({ fødsel: { gjeldende, søknad }, submittable, aksjonspunkt }: Props) => {
+export const SjekkTerminbekreftelseForm = ({ fødsel: { gjeldende, søknad }, submittable, aksjonspunkt }: Props) => {
   const intl = useIntl();
 
   const { submitCallback, alleMerknaderFraBeslutter, isReadOnly } = usePanelDataContext<BekreftTerminbekreftelseAp>();

packages/fakta/fodsel/src/components/aksjonspunkt/TermindatoFaktaForm.tsx renamed to packages/fakta/fodsel/src/components/aksjonspunkt/SjekkTerminbekreftelseForm.tsx

@@ -4,7 +4,6 @@ import { BodyShort, HStack, VStack } from '@navikt/ds-react';
 import { ReadOnlyField } from '@navikt/ft-form-hooks';
 import { DateLabel } from '@navikt/ft-ui-komponenter';
 
-import { ValueLabel } from '@navikt/fp-fakta-felles';
 import type { FødselRegister } from '@navikt/fp-types';
 import { FaktaKort } from '@navikt/fp-ui-komponenter';
 
@@ -30,15 +29,17 @@ export const FaktaFødselFraFReg = ({ register }: Props) => {
       )}
       {barn.length > 0 && erAlleBarnLike && (
         <VStack gap="4">
-          <ValueLabel label={<FormattedMessage id="Label.Fodselsdato" />}>
-            <DateLabel dateString={barn[0].fødselsdato} />
-          </ValueLabel>
+          <ReadOnlyField
+            label={<FormattedMessage id="Label.Fodselsdato" />}
+            value={<DateLabel dateString={barn[0].fødselsdato} />}
+          />
           {barn[0].dødsdato && (
-            <ValueLabel label={<FormattedMessage id="Label.Dodsdato" />}>
-              <DateLabel dateString={barn[0].dødsdato} />
-            </ValueLabel>
+            <ReadOnlyField
+              label={<FormattedMessage id="Label.Dodsdato" />}
+              value={<DateLabel dateString={barn[0].dødsdato} />}
+            />
           )}
-          <ValueLabel label={<FormattedMessage id="Label.AntallBarn" />}>{barn.length}</ValueLabel>
+          <ReadOnlyField label={<FormattedMessage id="Label.AntallBarn" />} value={barn.length} />
         </VStack>
       )}
       {barn.length > 0 && !erAlleBarnLike && (

packages/fakta/fodsel/src/components/aksjonspunkt/termindatoFaktaForm.module.css renamed to packages/fakta/fodsel/src/components/aksjonspunkt/sjekkTerminbekreftelseForm.module.css

@@ -1,9 +1,9 @@
 import { FormattedMessage, useIntl } from 'react-intl';
 
 import { HStack, Label, VStack } from '@navikt/ds-react';
+import { ReadOnlyField } from '@navikt/ft-form-hooks';
 import { DateLabel } from '@navikt/ft-ui-komponenter';
 
-import { ValueLabel } from '@navikt/fp-fakta-felles';
 import type { FødselSøknad } from '@navikt/fp-types';
 import { DokumentLink, type DokumentLinkReferanse, FaktaKort } from '@navikt/fp-ui-komponenter';
 
@@ -22,21 +22,24 @@ export const FaktaFødselFraSøknad = ({
     <FaktaKort label={tittel}>
       <VStack gap="4">
         {termindato && (
-          <ValueLabel label={<FormattedMessage id="Label.Termindato" />}>
-            <DateLabel dateString={termindato} />
-          </ValueLabel>
+          <ReadOnlyField
+            label={<FormattedMessage id="Label.Termindato" />}
+            value={<DateLabel dateString={termindato} />}
+          />
         )}
         {utstedtdato && (
-          <ValueLabel label={<FormattedMessage id="Label.Utstedtdato" />}>
-            <DateLabel dateString={utstedtdato} />
-          </ValueLabel>
+          <ReadOnlyField
+            label={<FormattedMessage id="Label.Utstedtdato" />}
+            value={<DateLabel dateString={utstedtdato} />}
+          />
         )}
-        {antallBarn && <ValueLabel label={<FormattedMessage id="Label.AntallBarn" />}>{antallBarn}</ValueLabel>}
+        {antallBarn && <ReadOnlyField label={<FormattedMessage id="Label.AntallBarn" />} value={antallBarn} />}
 
         {barn.length > 0 && (
-          <ValueLabel label={<FormattedMessage id="Label.Fodselsdato" />}>
-            <DateLabel dateString={barn[0].fødselsdato} />
-          </ValueLabel>
+          <ReadOnlyField
+            label={<FormattedMessage id="Label.Fodselsdato" />}
+            value={<DateLabel dateString={barn[0].fødselsdato} />}
+          />
         )}
 
         {terminbekreftelseDokument && (

packages/fakta/fodsel/src/components/fakta/FaktaFødselFraFReg.tsx

@@ -13,18 +13,11 @@ interface Props {
 
 export const Situasjon = ({ gjeldende: { barn, termindato, utstedtdato } }: Props) => {
   const intl = useIntl();
-  const erLikeBarn =
-    barn.length > 0 &&
-    barn.every(
-      b =>
-        b.kilde === barn[0].kilde &&
-        b.barn.fødselsdato === barn[0].barn.fødselsdato &&
-        b.barn.dødsdato === barn[0].barn.dødsdato,
-    );
+  const barnErLike = erBarnLike(barn);
 
   return (
     <HStack gap="4" aria-label={intl.formatMessage({ id: 'Situasjon.OpplysningerGjeldende' })}>
-      {(barn.length === 1 || erLikeBarn) && (
+      {(barn.length === 1 || barnErLike) && (
         <>
           <FaktaBox
             key={barn[0].barn.fødselsdato}
@@ -42,7 +35,7 @@ export const Situasjon = ({ gjeldende: { barn, termindato, utstedtdato } }: Prop
           )}
         </>
       )}
-      {!erLikeBarn &&
+      {!barnErLike &&
         barn.map((b, index) => (
           <FaktaBox
             key={`${b.barn.fødselsdato}-${b.barn.dødsdato}-${b.kilde}`}
@@ -74,3 +67,11 @@ const formaterLiv = ({ fødselsdato, dødsdato }: BarnHendelseData): string => {
   const død = dødsdato ? dateFormat(dødsdato) : null;
   return dødsdato ? `f. ${født} - d. ${død}` : `f. ${født}`;
 };
+const erBarnLike = (barn: FødselGjeldende['barn']) =>
+  barn.length > 0 &&
+  barn.every(
+    b =>
+      b.kilde === barn[0].kilde &&
+      b.barn.fødselsdato === barn[0].barn.fødselsdato &&
+      b.barn.dødsdato === barn[0].barn.dødsdato,
+  );