Merge pull request #2844 from navikt/refaktorer-fanekomponenter

BehandlingRoutes skal sende med behandling som props til alle faner i…
navikt · Jul 26, 2024 · c36a998 · c36a998
2 parents 6543be7 + a2cb279
commit c36a998
Show file tree

Hide file tree

Showing 29 changed files with 200 additions and 246 deletions.
diff --git a/src/frontend/Komponenter/Behandling/Aktivitet/Aktivitetsvilkår.tsx b/src/frontend/Komponenter/Behandling/Aktivitet/Aktivitetsvilkår.tsx
diff --git a/src/frontend/Komponenter/Behandling/Aktivitet/AktivitetsvilkårBarnetilsyn.tsx b/src/frontend/Komponenter/Behandling/Aktivitet/AktivitetsvilkårBarnetilsyn.tsx
@@ -22,13 +22,10 @@ const AktivitetsVilkårBarnetilsyn: FC<{
         ikkeVurderVilkår,
     } = vilkårState;
     const skalViseSøknadsdata = behandling.behandlingsårsak === Behandlingsårsak.SØKNAD;
-    const behandlingId = behandling.id;
-    const { opprettet: behandlingOpprettet, stønadstype } = behandling;
 
     useEffect(() => {
-        hentVilkår(behandlingId);
-        // eslint-disable-next-line
-    }, [behandlingId]);
+        hentVilkår(behandling.id);
+    }, [hentVilkår, behandling.id]);
 
     return (
         <DataViewer response={{ vilkår }}>
@@ -54,8 +51,7 @@ const AktivitetsVilkårBarnetilsyn: FC<{
                             lagreVurdering={lagreVurdering}
                             vurderinger={vilkår.vurderinger}
                             skalViseSøknadsdata={skalViseSøknadsdata}
-                            behandlingOpprettet={behandlingOpprettet}
-                            stønadstype={stønadstype}
+                            behandling={behandling}
                         />
                         <AlderPåBarn
                             ikkeVurderVilkår={ikkeVurderVilkår}

diff --git a/src/frontend/Komponenter/Behandling/Aktivitet/AktivitetsvilkårSide.tsx b/src/frontend/Komponenter/Behandling/Aktivitet/AktivitetsvilkårSide.tsx
@@ -0,0 +1,29 @@
+import React, { FC } from 'react';
+import { Stønadstype } from '../../../App/typer/behandlingstema';
+import AktivitetsVilkårBarnetilsyn from './AktivitetsvilkårBarnetilsyn';
+import AktivitetsVilkårSkolepenger from './AktivitetsvilkårSkolepenger';
+import { AktivitetsvilkårHeader } from './AktivitetsvilkårHeader';
+import { Behandling } from '../../../App/typer/fagsak';
+import AktivitetsVilkårOvergangsstønad from './AktivitetsvilkårOvergangsstønad';
+
+interface Props {
+    behandling: Behandling;
+}
+
+export const AktivitetsvilkårSide: FC<Props> = ({ behandling }) => (
+    <>
+        <AktivitetsvilkårHeader />
+        <AktivitetsVilkår behandling={behandling} />
+    </>
+);
+
+const AktivitetsVilkår: FC<Props> = ({ behandling }) => {
+    switch (behandling.stønadstype) {
+        case Stønadstype.OVERGANGSSTØNAD:
+            return <AktivitetsVilkårOvergangsstønad behandling={behandling} />;
+        case Stønadstype.BARNETILSYN:
+            return <AktivitetsVilkårBarnetilsyn behandling={behandling} />;
+        case Stønadstype.SKOLEPENGER:
+            return <AktivitetsVilkårSkolepenger behandling={behandling} />;
+    }
+};
diff --git a/src/frontend/Komponenter/Behandling/Aktivitet/AktivitetsvilkårSkolepenger.tsx b/src/frontend/Komponenter/Behandling/Aktivitet/AktivitetsvilkårSkolepenger.tsx
@@ -21,13 +21,10 @@ const AktivitetsVilkårSkolepenger: FC<{
         ikkeVurderVilkår,
     } = vilkårState;
     const skalViseSøknadsdata = behandling.behandlingsårsak === Behandlingsårsak.SØKNAD;
-    const behandlingId = behandling.id;
-    const { opprettet: behandlingOpprettet, stønadstype } = behandling;
 
     useEffect(() => {
-        hentVilkår(behandlingId);
-        // eslint-disable-next-line
-    }, [behandlingId]);
+        hentVilkår(behandling.id);
+    }, [hentVilkår, behandling.id]);
 
     return (
         <DataViewer response={{ vilkår }}>
@@ -44,8 +41,7 @@ const AktivitetsVilkårSkolepenger: FC<{
                             lagreVurdering={lagreVurdering}
                             vurderinger={vilkår.vurderinger}
                             skalViseSøknadsdata={false}
-                            behandlingOpprettet={behandlingOpprettet}
-                            stønadstype={stønadstype}
+                            behandling={behandling}
                         />
                         <DokumentasjonUtdanning
                             ikkeVurderVilkår={ikkeVurderVilkår}

diff --git a/src/frontend/Komponenter/Behandling/Aktivitet/Inntekt/GrunnbeløpInfoOgSistePeriodeOS.tsx b/src/frontend/Komponenter/Behandling/Aktivitet/Inntekt/GrunnbeløpInfoOgSistePeriodeOS.tsx
@@ -10,19 +10,20 @@ import { styled } from 'styled-components';
 import { IVilkårGrunnlag } from '../../Inngangsvilkår/vilkår';
 import { IGrunnlagsdataSistePeriodeOvergangsstønad } from '../../TidligereVedtaksperioder/typer';
 import SistePeriodeMedOvergangsstønad from './SistePeriodeMedOvergangsstønad';
-import { Stønadstype } from '../../../../App/typer/behandlingstema';
+import { Behandling } from '../../../../App/typer/fagsak';
 
 const Container = styled.div`
     & > *:not(:last-child) {
         margin-bottom: 2rem;
     }
 `;
 
-export const GrunnbeløpInfoOgSistePeriodeOS: FC<{
+interface Props {
     grunnlag: IVilkårGrunnlag;
-    behandlingOpprettet: string;
-    stønadstype: Stønadstype;
-}> = ({ grunnlag, behandlingOpprettet, stønadstype }) => {
+    behandling: Behandling;
+}
+
+export const GrunnbeløpInfoOgSistePeriodeOS: FC<Props> = ({ grunnlag, behandling }) => {
     const sistePeriodeMedOS: IGrunnlagsdataSistePeriodeOvergangsstønad | undefined =
         grunnlag.tidligereVedtaksperioder.sak?.sistePeriodeMedOvergangsstønad;
 
@@ -62,8 +63,7 @@ export const GrunnbeløpInfoOgSistePeriodeOS: FC<{
 
             <SistePeriodeMedOvergangsstønad
                 sistePeriodeMedOS={sistePeriodeMedOS}
-                behandlingOpprettet={behandlingOpprettet}
-                stønadstype={stønadstype}
+                behandling={behandling}
             />
         </Container>
     );

diff --git a/src/frontend/Komponenter/Behandling/Aktivitet/Inntekt/Inntekt.tsx b/src/frontend/Komponenter/Behandling/Aktivitet/Inntekt/Inntekt.tsx
@@ -1,21 +1,20 @@
 import React from 'react';
-import { VilkårPropsMedBehandlingOpprettetOgStønadstype } from '../../Inngangsvilkår/vilkårprops';
+import { VilkårPropsMedBehandling } from '../../Inngangsvilkår/vilkårprops';
 import { AktivitetsvilkårType } from '../../Inngangsvilkår/vilkår';
 import VisEllerEndreVurdering from '../../Vurdering/VisEllerEndreVurdering';
 import { AlertError } from '../../../../Felles/Visningskomponenter/Alerts';
 import { Vilkårpanel } from '../../Vilkårpanel/Vilkårpanel';
 import { VilkårpanelInnhold } from '../../Vilkårpanel/VilkårpanelInnhold';
 import { GrunnbeløpInfoOgSistePeriodeOS } from './GrunnbeløpInfoOgSistePeriodeOS';
 
-export const Inntekt: React.FC<VilkårPropsMedBehandlingOpprettetOgStønadstype> = ({
+export const Inntekt: React.FC<VilkårPropsMedBehandling> = ({
     vurderinger,
     lagreVurdering,
     nullstillVurdering,
     ikkeVurderVilkår,
     feilmeldinger,
     grunnlag,
-    behandlingOpprettet,
-    stønadstype,
+    behandling,
 }) => {
     const vurdering = vurderinger.find((v) => v.vilkårType === AktivitetsvilkårType.INNTEKT);
 
@@ -39,8 +38,7 @@ export const Inntekt: React.FC<VilkårPropsMedBehandlingOpprettetOgStønadstype>
                     venstre: (
                         <GrunnbeløpInfoOgSistePeriodeOS
                             grunnlag={grunnlag}
-                            behandlingOpprettet={behandlingOpprettet}
-                            stønadstype={stønadstype}
+                            behandling={behandling}
                         />
                     ),
                     høyre: (

diff --git a/src/frontend/Komponenter/Behandling/Aktivitet/Inntekt/SistePeriodeMedOvergangsstønad.tsx b/src/frontend/Komponenter/Behandling/Aktivitet/Inntekt/SistePeriodeMedOvergangsstønad.tsx
@@ -10,24 +10,20 @@ import TabellVisning, { Kolonner } from '../../Tabell/TabellVisning';
 import { IGrunnlagsdataSistePeriodeOvergangsstønad } from '../../TidligereVedtaksperioder/typer';
 import SistePeriodeTittelTekst from './SistePeriodeTittelTekst';
 import { Stønadstype } from '../../../../App/typer/behandlingstema';
+import { Behandling } from '../../../../App/typer/fagsak';
 
-interface SistePeriodeMedOvergangsstønadProps {
+interface Props {
     sistePeriodeMedOS: IGrunnlagsdataSistePeriodeOvergangsstønad | undefined;
-    behandlingOpprettet: string;
-    stønadstype: Stønadstype;
+    behandling: Behandling;
 }
 
-const SistePeriodeMedOvergangsstønad: React.FC<SistePeriodeMedOvergangsstønadProps> = ({
-    sistePeriodeMedOS,
-    behandlingOpprettet,
-    stønadstype,
-}) => {
+const SistePeriodeMedOvergangsstønad: React.FC<Props> = ({ sistePeriodeMedOS, behandling }) => {
     if (!sistePeriodeMedOS) {
         return <SistePeriodeTittelTekst />;
     }
 
     const kolonner: Kolonner<IGrunnlagsdataSistePeriodeOvergangsstønad>[] =
-        stønadstype === Stønadstype.SKOLEPENGER
+        behandling.stønadstype === Stønadstype.SKOLEPENGER
             ? [
                   {
                       overskrift: 'Periode',
@@ -77,7 +73,7 @@ const SistePeriodeMedOvergangsstønad: React.FC<SistePeriodeMedOvergangsstønadP
         <>
             <TabellVisning
                 tittel={`Siste periode med overgangsstønad`}
-                ekstraTekstTittel={`(sist oppdatert ${formaterIsoDatoTid(behandlingOpprettet)})`}
+                ekstraTekstTittel={`(sist oppdatert ${formaterIsoDatoTid(behandling.opprettet)})`}
                 verdier={[sistePeriodeMedOS]}
                 minimerKolonnebredde={true}
                 kolonner={kolonner}

diff --git a/src/frontend/Komponenter/Behandling/Aktivitet/Skolepenger/RettTilOvergangsstønad.tsx b/src/frontend/Komponenter/Behandling/Aktivitet/Skolepenger/RettTilOvergangsstønad.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { VilkårPropsMedBehandlingOpprettetOgStønadstype } from '../../Inngangsvilkår/vilkårprops';
+import { VilkårPropsMedBehandling } from '../../Inngangsvilkår/vilkårprops';
 import { AktivitetsvilkårType } from '../../Inngangsvilkår/vilkår';
 import VisEllerEndreVurdering from '../../Vurdering/VisEllerEndreVurdering';
 import { AlertError } from '../../../../Felles/Visningskomponenter/Alerts';
@@ -8,15 +8,14 @@ import { VilkårpanelInnhold } from '../../Vilkårpanel/VilkårpanelInnhold';
 import { IGrunnlagsdataSistePeriodeOvergangsstønad } from '../../TidligereVedtaksperioder/typer';
 import SistePeriodeMedOvergangsstønad from '../Inntekt/SistePeriodeMedOvergangsstønad';
 
-export const RettTilOvergangsstønad: React.FC<VilkårPropsMedBehandlingOpprettetOgStønadstype> = ({
+export const RettTilOvergangsstønad: React.FC<VilkårPropsMedBehandling> = ({
     vurderinger,
     lagreVurdering,
     nullstillVurdering,
     ikkeVurderVilkår,
     feilmeldinger,
     grunnlag,
-    behandlingOpprettet,
-    stønadstype,
+    behandling,
 }) => {
     const vurdering = vurderinger.find(
         (v) => v.vilkårType === AktivitetsvilkårType.RETT_TIL_OVERGANGSSTØNAD
@@ -44,8 +43,7 @@ export const RettTilOvergangsstønad: React.FC<VilkårPropsMedBehandlingOpprette
                     venstre: (
                         <SistePeriodeMedOvergangsstønad
                             sistePeriodeMedOS={sistePeriodeMedOS}
-                            behandlingOpprettet={behandlingOpprettet}
-                            stønadstype={stønadstype}
+                            behandling={behandling}
                         />
                     ),
                     høyre: (

diff --git a/src/frontend/Komponenter/Behandling/BehandlingContainer.tsx b/src/frontend/Komponenter/Behandling/BehandlingContainer.tsx
@@ -92,7 +92,7 @@ const BehandlingContent: FC<{
                     <InfostripeUtestengelse utestengelser={utestengelser} />
                     <Personopplysningsendringer behandlingId={behandling.id} />
                     <EkspanderbareVilkårpanelProvider>
-                        <BehandlingRoutes />
+                        <BehandlingRoutes behandling={behandling} />
                     </EkspanderbareVilkårpanelProvider>
                     <HenleggModal behandling={behandling} />
                     <NyEierModal />

diff --git a/src/frontend/Komponenter/Behandling/BehandlingRoutes.tsx b/src/frontend/Komponenter/Behandling/BehandlingRoutes.tsx
@@ -1,26 +1,21 @@
 import { Navigate, Route, Routes } from 'react-router-dom';
 import * as React from 'react';
 import { filtrerSiderEtterBehandlingstype } from './Fanemeny/sider';
-import { useBehandling } from '../../App/context/BehandlingContext';
-import { RessursSuksess } from '../../App/typer/ressurs';
 import { Behandling } from '../../App/typer/fagsak';
 
-const BehandlingRoutes: React.FC = () => {
-    const { behandling } = useBehandling();
-    const behandlingSuksess = behandling as RessursSuksess<Behandling>;
+interface Props {
+    behandling: Behandling;
+}
 
-    const siderForBehandling = filtrerSiderEtterBehandlingstype(behandlingSuksess.data);
+const BehandlingRoutes: React.FC<Props> = ({ behandling }) => {
+    const siderForBehandling = filtrerSiderEtterBehandlingstype(behandling);
     return (
         <Routes>
             {siderForBehandling.map((side) => (
                 <Route
                     key={side.navn}
                     path={`${side.href}`}
-                    element={React.createElement(
-                        side.komponent,
-                        { behandlingId: behandlingSuksess.data.id },
-                        null
-                    )}
+                    element={React.createElement(side.komponent, { behandling: behandling }, null)}
                 />
             ))}
             <Route path="*" element={<Navigate to={siderForBehandling[0].href} replace={true} />} />

diff --git a/src/frontend/Komponenter/Behandling/Brev/Brev.tsx b/src/frontend/Komponenter/Behandling/Brev/Brev.tsx
@@ -14,6 +14,7 @@ import { useHentOppgaverForOpprettelse } from '../../../App/hooks/useHentOppgave
 import { AlertInfo } from '../../../Felles/Visningskomponenter/Alerts';
 import { oppgaveSomSkalOpprettesTilTekst } from '../Totrinnskontroll/oppgaveForOpprettelseTyper';
 import { HøyreKolonne, StyledBrev, VenstreKolonne } from './StyledBrev';
+import { Behandling } from '../../../App/typer/fagsak';
 
 const InfostripeGruppe = styled.div`
     display: flex;
@@ -28,26 +29,21 @@ const StyledInfostripe = styled(AlertInfo)`
 `;
 
 interface Props {
-    behandlingId: string;
+    behandling: Behandling;
 }
 
-const Brev: React.FC<Props> = ({ behandlingId }) => {
+const Brev: React.FC<Props> = ({ behandling }) => {
     const { axiosRequest } = useApp();
+    const { behandlingErRedigerbar, vedtak, personopplysningerResponse, totrinnskontroll } =
+        useBehandling();
     const [brevRessurs, settBrevRessurs] = useState<Ressurs<string>>(byggTomRessurs());
-    const {
-        behandlingErRedigerbar,
-        vedtak,
-        personopplysningerResponse,
-        totrinnskontroll,
-        behandling,
-    } = useBehandling();
     const [kanSendesTilBeslutter, settKanSendesTilBeslutter] = useState<boolean>(false);
-    const oppgaverForOpprettelse = useHentOppgaverForOpprettelse(behandlingId);
+    const oppgaverForOpprettelse = useHentOppgaverForOpprettelse(behandling.id);
 
     const lagBeslutterBrev = () => {
         axiosRequest<string, null>({
             method: 'POST',
-            url: `/familie-ef-sak/api/brev/${behandlingId}`,
+            url: `/familie-ef-sak/api/brev/${behandling.id}`,
         }).then((respons: Ressurs<string>) => {
             settBrevRessurs(respons);
         });
@@ -56,7 +52,7 @@ const Brev: React.FC<Props> = ({ behandlingId }) => {
     const hentBrev = () => {
         axiosRequest<string, null>({
             method: 'GET',
-            url: `/familie-ef-sak/api/brev/${behandlingId}`,
+            url: `/familie-ef-sak/api/brev/${behandling.id}`,
         }).then((respons: Ressurs<string>) => {
             settBrevRessurs(respons);
         });
@@ -78,8 +74,8 @@ const Brev: React.FC<Props> = ({ behandlingId }) => {
     }, [behandlingErRedigerbar, totrinnskontroll]);
 
     return (
-        <DataViewer response={{ personopplysningerResponse, behandling, vedtak }}>
-            {({ personopplysningerResponse, behandling, vedtak }) => (
+        <DataViewer response={{ personopplysningerResponse, vedtak }}>
+            {({ personopplysningerResponse, vedtak }) => (
                 <>
                     <StyledBrev>
                         <VenstreKolonne>
@@ -100,7 +96,6 @@ const Brev: React.FC<Props> = ({ behandlingId }) => {
                             )}
                             {behandlingErRedigerbar && (
                                 <Brevmeny
-                                    behandlingId={behandlingId}
                                     oppdaterBrevRessurs={oppdaterBrevRessurs}
                                     personopplysninger={personopplysningerResponse}
                                     settKanSendesTilBeslutter={settKanSendesTilBeslutter}