Skip to content

Commit 062ba1c

Browse files
committed
Flytte appStatus til innsynsData fetch
1 parent b018a9a commit 062ba1c

24 files changed

+433
-1257
lines changed

apps/dine-pleiepenger/api-mock-server/api-mock-server.js

-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ const helmet = require('helmet');
55
const server = express();
66
const søknader = require('./mockdata/soknader.json');
77
const saker = require('./mockdata/saker.json');
8-
const toSaker = require('./mockdata/to-saker.json');
98

109
server.use(express.json());
1110

apps/dine-pleiepenger/api-mock-server/mockdata/saker.json

+133-359
Large diffs are not rendered by default.

apps/dine-pleiepenger/api-mock-server/mockdata/to-saker.json

-636
This file was deleted.

apps/dine-pleiepenger/src/components/process/Process.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,10 @@ export const Process: ProcessComponent = forwardRef<HTMLOListElement, ProcessPro
2626
<>
2727
{React.Children.map(children, (step, index) => {
2828
const stepIndex = index + 1;
29-
const variant = React.isValidElement<ProcessStepProps>(step) ? step.props.variant : undefined;
29+
const isCurrent = React.isValidElement<ProcessStepProps>(step) ? step.props.current : undefined;
3030
return (
3131
<li
32-
className={`process__item${variant ? ` process__item__variant process__item__variant--${variant}` : ''}`}
32+
className={`process__item${isCurrent ? ` process__item__variant process__item__variant--CURRENT` : ''}`}
3333
key={stepIndex + (children?.toString?.() ?? '')}>
3434
<span className="process__line process__line--1" />
3535
{React.isValidElement<ProcessStepProps>(step)

apps/dine-pleiepenger/src/components/process/ProcessStep.tsx

+33-13
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { BodyShort } from '@navikt/ds-react';
22
import cl from 'clsx';
33
import React from 'react';
4+
import CompleteIcon from './checks/Complete';
45

56
export interface ProcessStepProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
67
/**
@@ -21,30 +22,49 @@ export interface ProcessStepProps extends React.AnchorHTMLAttributes<HTMLAnchorE
2122
* If a step is completed or not
2223
*/
2324
completed?: boolean;
24-
25-
variant?: 'CURRENT' | 'WARNING' | string;
26-
27-
useCircle?: boolean;
25+
current?: boolean;
2826

2927
icon?: React.ReactNode;
3028
}
3129

30+
export interface ProcessStepData {
31+
title: string;
32+
content: React.ReactNode;
33+
timestamp?: Date;
34+
completed?: boolean;
35+
current?: boolean;
36+
}
37+
3238
export const ProcessStep: React.FunctionComponent<ProcessStepProps> = ({
3339
completed,
40+
current,
3441
icon,
3542
children,
36-
useCircle = true,
37-
variant,
3843
index,
3944
}) => {
40-
const circleContent =
41-
icon || index || (variant === 'CURRENT' ? <span className="process__circle__dot" /> : undefined);
45+
const getCircleContent = () => {
46+
if (icon) {
47+
return icon;
48+
}
49+
if (index) {
50+
return index;
51+
}
52+
if (completed) {
53+
return <CompleteIcon />;
54+
}
55+
if (current) {
56+
return <span className="process__circle__dot" />;
57+
}
58+
};
4259
return (
43-
<div className={cl('process__step', completed ? 'process__step--completed' : '')}>
44-
<span
45-
className={`process__circle${useCircle === false ? ' process__circle--noCircle' : ''}`}
46-
aria-hidden="true">
47-
{circleContent}
60+
<div
61+
className={cl(
62+
'process__step',
63+
completed ? 'process__step--completed' : '',
64+
current ? 'process__item--current' : '',
65+
)}>
66+
<span className={`process__circle`} aria-hidden="true">
67+
{getCircleContent()}
4868
</span>
4969
<BodyShort as="div" className="process__content">
5070
{children}

apps/dine-pleiepenger/src/components/process/process.css

+2-2
Original file line numberDiff line numberDiff line change
@@ -69,8 +69,8 @@
6969
grid-row: line-2;
7070
}
7171

72-
.process__line:has(+ .process__step__completed),
73-
.process__step--completed + .process__line {
72+
.process__item:not(.process__item__variant--CURRENT) .process__line:has(+ .process__step__completed),
73+
.process__item:not(.process__item__variant--CURRENT) .process__step--completed + .process__line {
7474
border-style: solid;
7575
opacity: 1;
7676
}

apps/dine-pleiepenger/src/components/status-i-sak/StatusISak.tsx

+18-47
Original file line numberDiff line numberDiff line change
@@ -1,68 +1,39 @@
11
import { Box, Heading, Link, VStack } from '@navikt/ds-react';
2+
import React from 'react';
23
import { ChevronRightIcon } from '@navikt/aksel-icons';
3-
4-
import React, { useMemo } from 'react';
4+
import { default as NextLink } from 'next/link';
55
import { Sak } from '../../types/Sak';
66
import { Process } from '../process';
7-
import { getStepsInBehandling } from './statusISakUtils';
8-
import { default as NextLink } from 'next/link';
7+
import { getProcessStepsFraSøknadshendelser } from './statusISakUtils';
8+
import { getAlleHendelserISak } from '../../utils/sakUtils';
9+
import ProcessStep from '../process/ProcessStep';
910

1011
interface Props {
1112
sak: Sak;
1213
visAlleHendelser?: boolean;
1314
}
1415

1516
const StatusISak: React.FunctionComponent<Props> = ({ sak, visAlleHendelser }) => {
16-
const { behandlinger } = sak;
17-
const steps = behandlinger
18-
.map((behandling) => getStepsInBehandling(behandling, sak.saksbehandlingsFrist))
19-
.flat()
20-
.reverse();
21-
22-
const totalt = useMemo(() => steps.length, [steps]);
23-
24-
// const [antall, setAntall] = useState(visAlleHendelser ? totalt : 4);
25-
26-
/** Skille mellom siste og tidligere behandlinger */
27-
/*
28-
const sisteBehandling = behandlinger[0];
29-
const andreBehandlinger = behandlinger.slice(1);
30-
const stepsSisteBehandling = getStepsInBehandling(sisteBehandling, sak.saksbehandlingsFrist).flat().reverse();
31-
const tidligereSteps = andreBehandlinger
32-
.map((behandling) => getStepsInBehandling(behandling, sak.saksbehandlingsFrist))
33-
.flat()
34-
.reverse();
35-
const totaltTidligere = useMemo(() => tidligereSteps.length, [tidligereSteps]);
36-
const synligTidligereSteg = tidligereSteps.slice(-1 * antallTidligere);
37-
*/
38-
// const totalt = useMemo(() => steps.length, [steps]);
39-
// const synligeSteps = steps.slice(-1 * antall);
40-
// const visFlereSteg = () => {
41-
// setAntall(Math.min(steps.length, antall + 5));
42-
// };
43-
17+
const hendelser = getAlleHendelserISak(sak);
18+
const processStep = getProcessStepsFraSøknadshendelser(hendelser);
19+
const totalt = hendelser.length;
4420
return (
4521
<VStack gap="3">
4622
<Heading level="2" size="medium">
4723
Dette skjer i saken din
4824
</Heading>
4925
<Box padding="4" className="bg-white">
50-
<Process>{visAlleHendelser ? [...steps] : [...steps.reverse()]}</Process>
26+
<Process>
27+
{processStep.map((step, idx) => (
28+
<ProcessStep key={idx} completed={step.completed} current={step.current}>
29+
<Heading size="small" level="3">
30+
{step.title}
31+
</Heading>
32+
{step.content}
33+
</ProcessStep>
34+
))}
35+
</Process>
5136
</Box>
52-
{/* {synligeSteps.length === 0 ? null : (
53-
<>
54-
{antall < totalt ? (
55-
<Box className="flex justify-start">
56-
<Button variant="tertiary-neutral" type="button" onClick={visFlereSteg}>
57-
<HStack gap="2" align="center" wrap={false}>
58-
<Add role="presentation" />
59-
Vis tidligere hendelser
60-
</HStack>
61-
</Button>
62-
</Box>
63-
) : null}
64-
</>
65-
)} */}
6637
{(4 < totalt || 1 + 1 === 2) && visAlleHendelser === undefined ? (
6738
<Box className="ml-4">
6839
<Link as={NextLink} href={`/sak/${sak.saksnummer}/historikk`}>
Original file line numberDiff line numberDiff line change
@@ -1,86 +1,18 @@
1-
import { Heading } from '@navikt/ds-react';
2-
import React from 'react';
3-
import { dateFormatter } from '@navikt/sif-common-utils';
41
import { Aksjonspunkt } from '../../server/api-models/AksjonspunktSchema';
5-
import { Behandling } from '../../server/api-models/BehandlingSchema';
6-
import { Behandlingsstatus } from '../../server/api-models/Behandlingsstatus';
7-
import { InnsendtSøknadstype } from '../../types/Søknad';
82
import { Venteårsak } from '../../types/Venteårsak';
9-
import { formatInnsendtSøknadOpprettetDato } from '../../utils/innsendtSøknadUtils';
10-
import CompleteIcon from '../process/checks/Complete';
11-
import ProcessStep from '../process/ProcessStep';
12-
import { Kildesystem } from '../../server/api-models/K9FormatSøknadSchema';
3+
import { ProcessStepData } from '../process/ProcessStep';
4+
import { Søknadstype } from '../../server/api-models/Søknadstype';
5+
import { Søknadshendelse, SøknadshendelseType } from '../../types/Søknadshendelse';
6+
import { Søknad } from '../../server/api-models/SøknadSchema';
7+
import { formatSøknadshendelseTidspunkt } from '../../utils/sakUtils';
138

14-
export const getSøknadstypeStatusmelding = (søknadstype?: InnsendtSøknadstype, kildesystem?: Kildesystem): string => {
15-
if (kildesystem === Kildesystem.søknadsdialog || søknadstype === InnsendtSøknadstype.PP_SYKT_BARN) {
16-
return 'Vi mottok søknad om pleiepenger for sykt barn';
9+
export const getSøknadstypeStatusmelding = (søknadstype: Søknadstype): string => {
10+
switch (søknadstype) {
11+
case Søknadstype.SØKNAD:
12+
return 'Vi mottok søknad om pleiepenger for sykt barn';
13+
case Søknadstype.ENDRINGSMELDING:
14+
return 'Vi mottok søknad om endring av pleiepenger for sykt barn';
1715
}
18-
if (
19-
kildesystem === Kildesystem.endringsdialog ||
20-
søknadstype === InnsendtSøknadstype.PP_SYKT_BARN_ENDRINGSMELDING
21-
) {
22-
return 'Vi mottok søknad om endring av pleiepenger for sykt barn';
23-
}
24-
if (søknadstype === InnsendtSøknadstype.PP_ETTERSENDELSE) {
25-
return 'Vi mottok ettersendelse av dokument';
26-
}
27-
return 'Vi mottok søknad/endringsmelding';
28-
};
29-
export const getStepsInBehandling = (behandling: Behandling, saksbehandlingsFrist?: Date): React.ReactNode[] => {
30-
const { søknader, aksjonspunkter, avsluttetDato, status } = behandling;
31-
const steps: React.ReactNode[] = [];
32-
33-
let key = 0;
34-
søknader.forEach(({ søknadstype, k9FormatSøknad: { kildesystem, mottattDato } }) => {
35-
steps.push(
36-
<ProcessStep key={key++} completed={true} icon={<CompleteIcon />}>
37-
<Heading size="small" level="3">
38-
{getSøknadstypeStatusmelding(søknadstype, kildesystem)}
39-
</Heading>
40-
<p>{formatInnsendtSøknadOpprettetDato(mottattDato)}</p>
41-
</ProcessStep>,
42-
);
43-
});
44-
45-
if (aksjonspunkter.length > 0) {
46-
steps.push(
47-
<ProcessStep key={key++} completed={false} variant="CURRENT">
48-
<Heading size="small" level="3" spacing={true}>
49-
{getAksjonspunkterTekst(aksjonspunkter)}
50-
</Heading>
51-
</ProcessStep>,
52-
);
53-
}
54-
if (status === Behandlingsstatus.AVSLUTTET) {
55-
steps.push(
56-
<ProcessStep key={key++} completed={true} icon={<CompleteIcon />}>
57-
<Heading size="small" level="3">
58-
Søknad er ferdig behandlet
59-
</Heading>
60-
{avsluttetDato ? <p>{dateFormatter.dayDateMonthYear(avsluttetDato)} </p> : null}
61-
</ProcessStep>,
62-
);
63-
} else {
64-
steps.push(
65-
<ProcessStep key={key++} completed={false}>
66-
<Heading size="small" level="3">
67-
Søknaden er ferdig behandlet
68-
</Heading>
69-
{saksbehandlingsFrist ? (
70-
<p>
71-
Du kan forvente svar innen {` `}
72-
<span className="font-bold first-letter:uppercase">
73-
{dateFormatter.dayDateMonthYear(saksbehandlingsFrist)}
74-
</span>
75-
</p>
76-
) : (
77-
<p>Du kan forvente svar innen:</p>
78-
)}
79-
</ProcessStep>,
80-
);
81-
}
82-
83-
return steps;
8416
};
8517

8618
export const getAksjonspunkterTekst = (aksjonspunkter: Aksjonspunkt[]): string => {
@@ -93,3 +25,70 @@ export const getAksjonspunkterTekst = (aksjonspunkter: Aksjonspunkt[]): string =
9325
}
9426
return `Saken er satt på vent fordi vi mangler informajson`;
9527
};
28+
29+
export const getProcessStepFromMottattSøknad = (søknad: Søknad, current: boolean): ProcessStepData => {
30+
switch (søknad.søknadstype) {
31+
case Søknadstype.SØKNAD:
32+
return {
33+
title: 'Vi mottok søknad om pleiepenger for sykt barn',
34+
content: <p>{formatSøknadshendelseTidspunkt(søknad.k9FormatSøknad.mottattDato)}</p>,
35+
completed: true,
36+
current,
37+
};
38+
case Søknadstype.ENDRINGSMELDING:
39+
return {
40+
title: 'Vi mottok søknad om endring av pleiepenger for sykt barn',
41+
content: <p>{formatSøknadshendelseTidspunkt(søknad.k9FormatSøknad.mottattDato)}</p>,
42+
completed: true,
43+
current,
44+
};
45+
}
46+
};
47+
48+
export const getProcessStepsFraSøknadshendelser = (hendelser: Søknadshendelse[]): ProcessStepData[] => {
49+
/** Aksjonspunkt skal ikke vises enda */
50+
const hendelserSomSkalVises = hendelser.filter((h) => h.type !== SøknadshendelseType.AKSJONSPUNKT);
51+
52+
const antall = hendelserSomSkalVises.length;
53+
const erFerdigBehandlet = hendelserSomSkalVises[antall - 1].type === SøknadshendelseType.FERDIG_BEHANDLET;
54+
55+
return hendelserSomSkalVises.map((hendelse, index): ProcessStepData => {
56+
/** Gjeldende hendelse er per må alltid siste hendelse før ferdig behandlet, eller ferdig behandlet */
57+
const erSisteHendelseFørFerdigBehandlet = erFerdigBehandlet ? index === antall - 1 : index === antall - 2;
58+
59+
switch (hendelse.type) {
60+
case SøknadshendelseType.MOTTATT_SØKNAD:
61+
return getProcessStepFromMottattSøknad(hendelse.søknad, erSisteHendelseFørFerdigBehandlet);
62+
63+
case SøknadshendelseType.AKSJONSPUNKT:
64+
return {
65+
title: hendelse.venteårsak,
66+
completed: false,
67+
current: true,
68+
content: '',
69+
timestamp: hendelse.dato,
70+
};
71+
72+
case SøknadshendelseType.FERDIG_BEHANDLET:
73+
return {
74+
title: 'Søknad er ferdig behandlet',
75+
content: <p>{formatSøknadshendelseTidspunkt(hendelse.dato)}</p>,
76+
completed: true,
77+
timestamp: hendelse.dato,
78+
};
79+
80+
case SøknadshendelseType.FORVENTET_SVAR:
81+
return {
82+
title: 'Søknaden er ferdig behandlet',
83+
content: (
84+
<>
85+
Inntektsmelding fra arbeidsgiver og legeerklæring må være sendt inn for at vi kan behandle
86+
saken.
87+
</>
88+
),
89+
completed: false,
90+
timestamp: hendelse.dato,
91+
};
92+
}
93+
});
94+
};

0 commit comments

Comments
 (0)