Skip to content

Commit d16de9d

Browse files
committed
IS-2999-3: Be om oppfolgingsplan design finpuss
1 parent 1c38630 commit d16de9d

File tree

4 files changed

+230
-201
lines changed

4 files changed

+230
-201
lines changed

src/sider/oppfolgingsplan/container/OppfoelgingsPlanerOversiktContainer.tsx

Lines changed: 6 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React from "react";
22
import Side from "../../Side";
33
import OppfolgingsplanerOversikt from "../oppfolgingsplaner/OppfolgingsplanerOversikt";
4-
import IngenPlaner from "../oppfolgingsplaner/IngenPlaner";
54
import { activeOppfolgingsplaner } from "@/utils/oppfolgingsplanerUtils";
65
import SideLaster from "../../../components/SideLaster";
76
import { useValgtPersonident } from "@/hooks/useValgtBruker";
@@ -33,31 +32,19 @@ export const OppfoelgingsPlanerOversiktContainer = () => {
3332
const inaktivePlaner = oppfolgingsplaner.filter(
3433
(plan) => !aktivePlaner.includes(plan)
3534
);
36-
const hasNoPlans =
37-
aktivePlaner.length === 0 &&
38-
inaktivePlaner.length === 0 &&
39-
oppfolgingsplanerLPS.length === 0;
4035

4136
return (
4237
<Side
4338
tittel="Oppfølgingsplaner"
4439
aktivtMenypunkt={Menypunkter.OPPFOELGINGSPLANER}
4540
>
4641
<SideLaster henter={henter} hentingFeilet={hentingFeilet}>
47-
{(() => {
48-
if (hasNoPlans) {
49-
return <IngenPlaner />;
50-
} else {
51-
return (
52-
<OppfolgingsplanerOversikt
53-
aktivePlaner={aktivePlaner}
54-
inaktivePlaner={inaktivePlaner}
55-
oppfolgingsplanerLPS={oppfolgingsplanerLPS}
56-
fnr={fnr}
57-
/>
58-
);
59-
}
60-
})()}
42+
<OppfolgingsplanerOversikt
43+
aktivePlaner={aktivePlaner}
44+
inaktivePlaner={inaktivePlaner}
45+
oppfolgingsplanerLPS={oppfolgingsplanerLPS}
46+
fnr={fnr}
47+
/>
6148
</SideLaster>
6249
</Side>
6350
);
Lines changed: 153 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
import { Alert, Heading } from "@navikt/ds-react";
2+
import BeOmOppfolgingsplan from "@/sider/oppfolgingsplan/oppfolgingsplaner/BeOmOppfolgingsplan";
3+
import OppfolgingsplanerOversiktLPS from "@/sider/oppfolgingsplan/lps/OppfolgingsplanerOversiktLPS";
4+
import OppfolgingsplanLink from "@/sider/oppfolgingsplan/oppfolgingsplaner/OppfolgingsplanLink";
5+
import React from "react";
6+
import { erIdag, tilLesbarDatoMedArUtenManedNavn } from "@/utils/datoUtils";
7+
import dayjs from "dayjs";
8+
import { useLedereQuery } from "@/data/leder/ledereQueryHooks";
9+
import {
10+
useGetOppfolgingsplanForesporselQuery,
11+
usePostOppfolgingsplanForesporsel,
12+
} from "@/data/oppfolgingsplan/oppfolgingsplanForesporselHooks";
13+
import { useOppfolgingstilfellePersonQuery } from "@/data/oppfolgingstilfelle/person/oppfolgingstilfellePersonQueryHooks";
14+
import { useFeatureToggles } from "@/data/unleash/unleashQueryHooks";
15+
import { NarmesteLederRelasjonDTO } from "@/data/leder/ledereTypes";
16+
import { OppfolgingstilfelleDTO } from "@/data/oppfolgingstilfelle/person/types/OppfolgingstilfellePersonDTO";
17+
import { OppfolgingsplanLPSMedPersonoppgave } from "@/data/oppfolgingsplan/types/OppfolgingsplanLPS";
18+
import { OppfolgingsplanDTO } from "@/data/oppfolgingsplan/types/OppfolgingsplanDTO";
19+
20+
const texts = {
21+
aktiveOppfolgingsplaner: "Aktive oppfølgingsplaner",
22+
ingenAktiveOppfolgingsplaner: "Det er ingen aktive oppfølgingsplaner",
23+
foresporselSendt: "Forespørsel om oppfølgingsplan ble sendt",
24+
aktivForesporsel:
25+
"Obs! Det ble bedt om oppfølgingsplan fra denne arbeidsgiveren",
26+
};
27+
28+
function activeNarmesteLederForCurrentOppfolgingstilfelle(
29+
ledere: NarmesteLederRelasjonDTO[],
30+
oppfolgingsTilfelle: OppfolgingstilfelleDTO
31+
): NarmesteLederRelasjonDTO[] {
32+
return ledere.filter(
33+
(leder) =>
34+
leder.status === "INNMELDT_AKTIV" &&
35+
oppfolgingsTilfelle.virksomhetsnummerList.includes(
36+
leder.virksomhetsnummer
37+
)
38+
);
39+
}
40+
41+
interface Props {
42+
aktivePlaner: OppfolgingsplanDTO[];
43+
oppfolgingsplanerLPSMedPersonoppgave: OppfolgingsplanLPSMedPersonoppgave[];
44+
}
45+
46+
export default function AktiveOppfolgingsplaner({
47+
aktivePlaner,
48+
oppfolgingsplanerLPSMedPersonoppgave,
49+
}: Props) {
50+
const { toggles } = useFeatureToggles();
51+
const { currentLedere } = useLedereQuery();
52+
const getOppfolgingsplanForesporsel = useGetOppfolgingsplanForesporselQuery();
53+
const postOppfolgingsplanForesporsel = usePostOppfolgingsplanForesporsel();
54+
const { latestOppfolgingstilfelle, hasActiveOppfolgingstilfelle } =
55+
useOppfolgingstilfellePersonQuery();
56+
const currentOppfolgingstilfelle = hasActiveOppfolgingstilfelle
57+
? latestOppfolgingstilfelle
58+
: undefined;
59+
60+
const oppfolgingsplanerLPSUnprocessed = oppfolgingsplanerLPSMedPersonoppgave
61+
.filter((oppfolgingsplanLPS) => {
62+
if (oppfolgingsplanLPS.personoppgave) {
63+
if (oppfolgingsplanLPS.personoppgave.behandletTidspunkt) {
64+
return (
65+
Date.now() <
66+
dayjs(oppfolgingsplanLPS.personoppgave.behandletTidspunkt)
67+
.add(1, "days")
68+
.toDate()
69+
.getTime()
70+
);
71+
}
72+
return !oppfolgingsplanLPS.personoppgave.behandletTidspunkt;
73+
}
74+
return erIdag(oppfolgingsplanLPS.opprettet);
75+
})
76+
.sort((a, b) => {
77+
return new Date(b.opprettet).getTime() - new Date(a.opprettet).getTime();
78+
});
79+
80+
const hasActivePlan =
81+
aktivePlaner.length !== 0 || oppfolgingsplanerLPSUnprocessed.length !== 0;
82+
83+
const activeNarmesteLedere = !!currentOppfolgingstilfelle
84+
? activeNarmesteLederForCurrentOppfolgingstilfelle(
85+
currentLedere,
86+
currentOppfolgingstilfelle
87+
)
88+
: [];
89+
const activeNarmesteLederIfSingle =
90+
activeNarmesteLedere.length === 1 ? activeNarmesteLedere[0] : undefined;
91+
const isBeOmOppfolgingsplanVisible =
92+
toggles.isBeOmOppfolgingsplanEnabled &&
93+
!hasActivePlan &&
94+
!!currentOppfolgingstilfelle &&
95+
!!activeNarmesteLederIfSingle &&
96+
!postOppfolgingsplanForesporsel.isSuccess;
97+
98+
const lastForesporselCreatedAt =
99+
getOppfolgingsplanForesporsel.data?.[0]?.createdAt;
100+
101+
const isAktivForesporsel =
102+
!!lastForesporselCreatedAt &&
103+
!!currentOppfolgingstilfelle &&
104+
!postOppfolgingsplanForesporsel.isSuccess
105+
? currentOppfolgingstilfelle.start <= lastForesporselCreatedAt &&
106+
lastForesporselCreatedAt <= currentOppfolgingstilfelle.end
107+
: false;
108+
const aktivForesporselTekst = `${
109+
texts.aktivForesporsel
110+
} ${tilLesbarDatoMedArUtenManedNavn(lastForesporselCreatedAt)}`;
111+
112+
return (
113+
<div className="mb-8">
114+
<Heading spacing level="2" size="medium">
115+
{texts.aktiveOppfolgingsplaner}
116+
</Heading>
117+
{!hasActivePlan &&
118+
!postOppfolgingsplanForesporsel.isSuccess &&
119+
!isAktivForesporsel && (
120+
<Alert variant="info" className="mb-4">
121+
<p>{texts.ingenAktiveOppfolgingsplaner}</p>
122+
</Alert>
123+
)}
124+
{isAktivForesporsel && (
125+
<Alert variant="warning" className="mb-2">
126+
{aktivForesporselTekst}
127+
</Alert>
128+
)}
129+
{postOppfolgingsplanForesporsel.isSuccess && (
130+
<Alert variant="success" className="mb-4">
131+
{texts.foresporselSendt}
132+
</Alert>
133+
)}
134+
{isBeOmOppfolgingsplanVisible && (
135+
<BeOmOppfolgingsplan
136+
aktivNarmesteLeder={activeNarmesteLederIfSingle}
137+
postOppfolgingsplanForesporsel={postOppfolgingsplanForesporsel}
138+
/>
139+
)}
140+
{oppfolgingsplanerLPSUnprocessed.map((planLPS, index) => {
141+
return (
142+
<OppfolgingsplanerOversiktLPS
143+
key={index}
144+
oppfolgingsplanLPSBistandsbehov={planLPS}
145+
/>
146+
);
147+
})}
148+
{aktivePlaner.map((dialog, index) => {
149+
return <OppfolgingsplanLink key={index} dialog={dialog} />;
150+
})}
151+
</div>
152+
);
153+
}
Lines changed: 30 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,18 @@
1-
import {
2-
Alert,
3-
BodyLong,
4-
BodyShort,
5-
Box,
6-
Button,
7-
Heading,
8-
} from "@navikt/ds-react";
1+
import { BodyLong, BodyShort, Box, Button, Heading } from "@navikt/ds-react";
92
import React from "react";
103
import { useValgtPersonident } from "@/hooks/useValgtBruker";
114
import { NarmesteLederRelasjonDTO } from "@/data/leder/ledereTypes";
12-
import { OppfolgingstilfelleDTO } from "@/data/oppfolgingstilfelle/person/types/OppfolgingstilfellePersonDTO";
13-
import { tilLesbarDatoMedArUtenManedNavn } from "@/utils/datoUtils";
145
import * as Amplitude from "@/utils/amplitude";
156
import { EventType } from "@/utils/amplitude";
16-
import {
17-
NewOppfolgingsplanForesporselDTO,
18-
useGetOppfolgingsplanForesporselQuery,
19-
usePostOppfolgingsplanForesporsel,
20-
} from "@/data/oppfolgingsplan/oppfolgingsplanForesporselHooks";
7+
import { NewOppfolgingsplanForesporselDTO } from "@/data/oppfolgingsplan/oppfolgingsplanForesporselHooks";
8+
import { UseMutationResult } from "@tanstack/react-query";
219

2210
const texts = {
2311
header: "Be om oppfølgingsplan fra arbeidsgiver",
2412
description:
2513
"Her kan du be om oppfølgingsplan fra arbeidsgiver eller purre om det mangler.",
2614
virksomhet: "Virksomhet:",
2715
narmesteLeder: "Nærmeste leder:",
28-
aktivForesporsel:
29-
"Obs! Det ble bedt om oppfølgingsplan fra denne arbeidsgiveren",
3016
button: "Be om oppfølgingsplan",
3117
};
3218

@@ -42,17 +28,19 @@ function logOppfolgingsplanForesporselEvent() {
4228

4329
interface Props {
4430
aktivNarmesteLeder: NarmesteLederRelasjonDTO;
45-
currentOppfolgingstilfelle: OppfolgingstilfelleDTO;
31+
postOppfolgingsplanForesporsel: UseMutationResult<
32+
NewOppfolgingsplanForesporselDTO,
33+
Error,
34+
NewOppfolgingsplanForesporselDTO,
35+
unknown
36+
>;
4637
}
4738

4839
export default function BeOmOppfolgingsplan({
4940
aktivNarmesteLeder,
50-
currentOppfolgingstilfelle,
41+
postOppfolgingsplanForesporsel,
5142
}: Props) {
5243
const personident = useValgtPersonident();
53-
const getOppfolgingsplanForesporsel = useGetOppfolgingsplanForesporselQuery();
54-
55-
const postOppfolgingsplanForesporsel = usePostOppfolgingsplanForesporsel();
5644

5745
function onClick() {
5846
const foresporsel: NewOppfolgingsplanForesporselDTO = {
@@ -67,47 +55,26 @@ export default function BeOmOppfolgingsplan({
6755
});
6856
}
6957

70-
const lastForesporselCreatedAt =
71-
getOppfolgingsplanForesporsel.data?.[0]?.createdAt;
72-
73-
const isAktivForesporsel = !!lastForesporselCreatedAt
74-
? currentOppfolgingstilfelle.start <= lastForesporselCreatedAt &&
75-
lastForesporselCreatedAt <= currentOppfolgingstilfelle.end
76-
: false;
77-
const aktivForesporselTekst = `${
78-
texts.aktivForesporsel
79-
} ${tilLesbarDatoMedArUtenManedNavn(lastForesporselCreatedAt)}`;
80-
8158
return (
82-
<>
83-
{postOppfolgingsplanForesporsel.isSuccess && (
84-
<Alert variant="success" className="mb-2" size="small">
85-
Forespørsel om oppfølgingsplan ble sendt
86-
</Alert>
87-
)}
88-
<Box background="surface-default" className="mb-4 flex flex-col p-4">
89-
<Heading size="medium">{texts.header}</Heading>
90-
<BodyLong className="mb-2">{texts.description}</BodyLong>
91-
<BodyShort>
92-
{texts.virksomhet} {aktivNarmesteLeder.virksomhetsnavn}
93-
</BodyShort>
94-
<BodyShort className="mb-2">
95-
{texts.narmesteLeder} {aktivNarmesteLeder.narmesteLederNavn}
96-
</BodyShort>
97-
{isAktivForesporsel && !!lastForesporselCreatedAt && (
98-
<Alert inline variant="warning" className="mb-2">
99-
{aktivForesporselTekst}
100-
</Alert>
101-
)}
102-
<Button
103-
className="w-fit mb-2"
104-
size="small"
105-
onClick={onClick}
106-
loading={postOppfolgingsplanForesporsel.isPending}
107-
>
108-
{texts.button}
109-
</Button>
110-
</Box>
111-
</>
59+
<Box background="surface-default" className="mb-4 flex flex-col p-4">
60+
<Heading size="small" level="3">
61+
{texts.header}
62+
</Heading>
63+
<BodyLong className="mb-2">{texts.description}</BodyLong>
64+
<BodyShort>
65+
{texts.virksomhet} {aktivNarmesteLeder.virksomhetsnavn}
66+
</BodyShort>
67+
<BodyShort className="mb-2">
68+
{texts.narmesteLeder} {aktivNarmesteLeder.narmesteLederNavn}
69+
</BodyShort>
70+
<Button
71+
className="w-fit mb-2"
72+
size="small"
73+
onClick={onClick}
74+
loading={postOppfolgingsplanForesporsel.isPending}
75+
>
76+
{texts.button}
77+
</Button>
78+
</Box>
11279
);
11380
}

0 commit comments

Comments
 (0)