Skip to content

Commit b9c142f

Browse files
oyvind-wedoeoyvind-wedoe
authoredSep 24, 2020
Merge pull request #165 from navikt/keep-klage-on-reload
Saves klage info in storage on update, reloads klage if page reloads.
·
2025-03-21T11.09.37-13f45812020.09.24-10.59-b9c142f
2 parents 26cecc5 + 7c26e29 commit b9c142f

File tree

7 files changed

+100
-48
lines changed

7 files changed

+100
-48
lines changed
 

‎src/App.tsx

+30-2
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,11 @@ import { withRouter } from 'react-router-dom';
77
import queryString from 'query-string';
88
import { getTemaObject } from './services/klageService';
99
import { useDispatch } from 'react-redux';
10-
import { setValgtYtelse, setValgtTema } from './store/actions';
10+
import { setValgtYtelse, setValgtTema, setKlageId } from './store/actions';
1111
import NotFoundPage from './pages/not-found/not-found-page';
1212
import NavFrontendSpinner from 'nav-frontend-spinner';
1313
import { CenteredContainer } from './styled-components/main-styled-components';
14+
import { Tema } from './types/tema';
1415

1516
const App = (props: any) => {
1617
const [loading, setLoading] = useState<boolean>(true);
@@ -20,6 +21,33 @@ const App = (props: any) => {
2021
useEffect(() => {
2122
if (props.location.search !== '') {
2223
const query = queryString.parse(props.location.search);
24+
25+
if (sessionStorage.getItem('nav.klage.klageId') && query && !query.klageid) {
26+
if (query.tema) {
27+
let cachedTema = sessionStorage.getItem('nav.klage.tema');
28+
let cachedYtelse = sessionStorage.getItem('nav.klage.ytelse');
29+
if (cachedTema === query.tema) {
30+
if (
31+
cachedYtelse === query.ytelse ||
32+
(query.ytelse === undefined && cachedYtelse === Tema[cachedTema])
33+
) {
34+
if (query.saksnummer || sessionStorage.getItem('nav.klage.saksnr')) {
35+
if (query.saksnummer === sessionStorage.getItem('nav.klage.saksnr')) {
36+
dispatch(setKlageId(sessionStorage.getItem('nav.klage.klageId') as string));
37+
} else {
38+
sessionStorage.removeItem('nav.klage.saksnr');
39+
}
40+
} else {
41+
dispatch(setKlageId(sessionStorage.getItem('nav.klage.klageId') as string));
42+
}
43+
}
44+
}
45+
} else {
46+
dispatch(setKlageId(sessionStorage.getItem('nav.klage.klageId') as string));
47+
}
48+
setLoading(false);
49+
}
50+
2351
if (query && query.tema) {
2452
const tema = query.tema.toString();
2553
dispatch(setValgtTema(tema));
@@ -43,7 +71,7 @@ const App = (props: any) => {
4371
} else {
4472
setLoading(false);
4573
}
46-
}, [dispatch, props.location.search]);
74+
}, [dispatch, props.location.search, props.chosenYtelse]);
4775

4876
if (loading) {
4977
return (

‎src/components/begrunnelse/begrunnelse.tsx

+25-34
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,28 @@
1-
import React, { useState, useRef, useEffect } from 'react';
2-
import { Textarea, RadioPanelGruppe } from 'nav-frontend-skjema';
1+
import React, { useEffect, useRef, useState } from 'react';
2+
import { RadioPanelGruppe, Textarea } from 'nav-frontend-skjema';
33
import {
4-
MarginContainer,
4+
CenteredContainer,
55
FlexCenteredContainer,
6+
Margin40Container,
67
Margin48Container,
78
Margin48TopContainer,
8-
MarginTopContainer,
9-
Margin40Container,
10-
CenteredContainer
9+
MarginContainer,
10+
MarginTopContainer
1111
} from '../../styled-components/main-styled-components';
1212
import { Hovedknapp, Knapp } from 'nav-frontend-knapper';
13-
import { Normaltekst, Undertittel, Element, Undertekst } from 'nav-frontend-typografi';
14-
import { VEDLEGG_STATUS, VedleggProps, toVedleggProps, VedleggErrorMessages } from '../../types/vedlegg';
13+
import { Element, Normaltekst, Undertekst, Undertittel } from 'nav-frontend-typografi';
14+
import { toVedleggProps, VEDLEGG_STATUS, VedleggErrorMessages, VedleggProps } from '../../types/vedlegg';
1515
import VedleggVisning from './vedlegg';
16-
import { postNewKlage, updateKlage } from '../../store/actions';
17-
import { useSelector, useDispatch } from 'react-redux';
16+
import { postNewKlage, setKlageId, updateKlage } from '../../store/actions';
17+
import { useDispatch, useSelector } from 'react-redux';
1818
import { Store } from '../../store/reducer';
1919
import { addVedleggToKlage, deleteVedlegg } from '../../services/fileService';
20-
import { klageSkjemaBasertPaaVedtak, KlageSkjema } from '../../types/klage';
21-
import { isValidDateString, toISOString } from '../../utils/date-util';
22-
import { AlertStripeFeil } from 'nav-frontend-alertstriper';
20+
import { KlageSkjema, klageSkjemaBasertPaaVedtak } from '../../types/klage';
21+
import { toISOString } from '../../utils/date-util';
22+
import AlertStripe, { AlertStripeFeil } from 'nav-frontend-alertstriper';
2323
import { datoValg } from './datoValg';
2424
import { Datovelger } from 'nav-datovelger';
2525
import NavFrontendSpinner from 'nav-frontend-spinner';
26-
import AlertStripe from 'nav-frontend-alertstriper';
27-
import { Tema } from '../../types/tema';
2826
import { getReferrer } from '../../services/klageService';
2927

3028
const Begrunnelse = (props: any) => {
@@ -41,36 +39,26 @@ const Begrunnelse = (props: any) => {
4139
const [submitted, setSubmitted] = useState<boolean>(false);
4240

4341
useEffect(() => {
44-
if ((!activeKlage || !activeKlage.id) && klageId === '') {
42+
if (klageId === '') {
4543
let klageskjema: KlageSkjema;
4644
if (props.chosenVedtak) {
4745
klageskjema = klageSkjemaBasertPaaVedtak(props.chosenVedtak);
4846
klageskjema.referrer = getReferrer();
49-
} else {
50-
klageskjema = {
51-
fritekst: activeBegrunnelse,
52-
tema: 'UKJ',
53-
ytelse: Tema['UKJ'],
54-
datoalternativ: datoalternativ,
55-
saksnummer: '',
56-
referrer: getReferrer()
57-
};
58-
if (activeDatoISO !== '' && isValidDateString(activeDatoISO)) {
59-
klageskjema.vedtaksdatoobjekt = new Date(activeDatoISO);
60-
} else {
61-
klageskjema.vedtaksdatoobjekt = undefined;
62-
}
47+
dispatch(postNewKlage(klageskjema));
6348
}
64-
dispatch(postNewKlage(klageskjema));
6549
}
66-
}, [activeKlage, dispatch, activeBegrunnelse, activeDatoISO, datoalternativ, props.chosenVedtak, klageId]);
50+
}, [dispatch, props.chosenVedtak, klageId]);
51+
6752
useEffect(() => {
6853
setActiveBegrunnelse(activeKlage.fritekst);
6954
setDatoalternativ(activeKlageSkjema.datoalternativ);
55+
if (activeKlage.id !== undefined) {
56+
dispatch(setKlageId(String(activeKlage.id)));
57+
}
7058
if (activeKlageSkjema.vedtaksdatoobjekt) {
7159
setActiveDatoISO(toISOString(activeKlageSkjema.vedtaksdatoobjekt));
7260
}
73-
}, [activeKlage, activeKlageSkjema]);
61+
}, [dispatch, activeKlage, activeKlageSkjema]);
7462

7563
const INPUTDESCRIPTION =
7664
'Skriv inn hvilke endringer du ønsker i vedtaket, og beskriv hva du begrunner klagen med. Legg ved dokumenter som du mener kan være til støtte for klagen.';
@@ -108,7 +96,10 @@ const Begrunnelse = (props: any) => {
10896
console.log(response);
10997
dispatch({
11098
type: 'VEDLEGG_ADD_SUCCESS',
111-
value: { status: VEDLEGG_STATUS.OK, vedlegg: toVedleggProps(response) }
99+
value: {
100+
status: VEDLEGG_STATUS.OK,
101+
vedlegg: toVedleggProps(response)
102+
}
112103
});
113104
setVedleggLoading(false);
114105
})

‎src/components/form-landing/form-landing.tsx

+13-7
Original file line numberDiff line numberDiff line change
@@ -11,24 +11,31 @@ import Error from '../../components/error/error';
1111

1212
const FormLanding = (props: any) => {
1313
const dispatch = useDispatch();
14-
const { loading, chosenTema, chosenYtelse, getKlageError } = useSelector((state: Store) => state);
14+
const { loading, chosenTema, chosenYtelse, getKlageError, klageId, activeKlage } = useSelector(
15+
(state: Store) => state
16+
);
1517

1618
const [chosenVedtak, setChosenVedtak] = useState<Vedtak>();
1719
const [temaNotSet, setTemaNotSet] = useState<boolean>(false);
1820

1921
useEffect(() => {
2022
if (validVedtakQuery(props.query)) {
2123
dispatch(checkAuth(props.location.search));
22-
if (props.query.klageid) {
23-
dispatch(setKlageId(props.query.klageid as string))
24-
dispatch(getExistingKlage(parseInt(props.query.klageid as string)))
24+
if (props.query.klageid && klageId === '') {
25+
dispatch(setKlageId(props.query.klageid as string));
2526
} else {
2627
setChosenVedtak(elementAsVedtak(props.query));
2728
}
2829
} else {
2930
setTemaNotSet(chosenTema === '');
3031
}
31-
}, [dispatch, props.location.search, props.query, chosenTema]);
32+
}, [dispatch, props.location.search, props.query, klageId, chosenTema]);
33+
34+
useEffect(() => {
35+
if (klageId !== '' && activeKlage.tema === '') {
36+
dispatch(getExistingKlage(parseInt(klageId)));
37+
}
38+
}, [dispatch, klageId, activeKlage]);
3239

3340
logInfo('Form landing page visited.', { chosenYtelse: chosenYtelse, referrer: document.referrer });
3441

@@ -49,8 +56,7 @@ const FormLanding = (props: any) => {
4956
<Error
5057
error={{
5158
code: 400,
52-
text:
53-
'Klagen du ba om kan ikke hentes. Prøv på nytt fra lenken på Ditt NAV.'
59+
text: 'Klagen du ba om kan ikke hentes. Prøv på nytt fra lenken på Ditt NAV.'
5460
}}
5561
/>
5662
);

‎src/pages/form-landing-page/main-form-page.tsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,7 @@ const MainFormPage = (props: Props) => {
4040
};
4141

4242
const previous = () => {
43-
history.push(activeRoutes[activeStep - 1].path);
44-
setActiveStep(activeStep - 1);
43+
history.goBack();
4544
};
4645

4746
return (

‎src/pages/oppsummering-skjema-page/oppsummering-skjema-page.tsx

+4
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,10 @@ const OppsummeringSkjemaPage = (props: any) => {
4343
finalizeKlage(activeKlage.id)
4444
.then(response => {
4545
const finalizedDate = response.finalizedDate;
46+
sessionStorage.removeItem('nav.klage.klageId');
47+
sessionStorage.removeItem('nav.klage.tema');
48+
sessionStorage.removeItem('nav.klage.ytelse');
49+
sessionStorage.removeItem('nav.klage.saksnr');
4650
history.push({ pathname: `/kvittering`, state: { finalizedDate } });
4751
setIsLoading(false);
4852
// TODO: Set success message

‎src/store/actions.ts

+25-1
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,7 @@ export function postNewKlage(klageskjema: KlageSkjema) {
7171
return function (dispatch: Dispatch<ActionTypes>) {
7272
return postKlage(klageSkjemaTilKlage(klageskjema))
7373
.then(response => {
74+
setKlageId((response.id as unknown) as string, response.tema, response.ytelse, response.saksnummer);
7475
dispatch({ type: 'KLAGE_POST_SUCCESS', payload: response, klageskjema: klageskjema });
7576
})
7677
.catch(err => {
@@ -95,10 +96,17 @@ export function getExistingKlage(klageId: number) {
9596
return function (dispatch: Dispatch<ActionTypes>) {
9697
return getKlage(klageId)
9798
.then(response => {
99+
setStorageContent(response.tema, response.ytelse, response.saksnummer || '');
98100
dispatch({ type: 'KLAGE_GET_SUCCESS', payload: response });
99101
})
100102
.catch(err => {
101103
logError(err, 'Get existing klage failed');
104+
if (err.response.status !== 401) {
105+
sessionStorage.removeItem('nav.klage.klageId');
106+
sessionStorage.removeItem('nav.klage.tema');
107+
sessionStorage.removeItem('nav.klage.ytelse');
108+
sessionStorage.removeItem('nav.klage.saksnr');
109+
}
102110
dispatch({ type: 'KLAGE_GET_ERROR' });
103111
});
104112
};
@@ -116,12 +124,28 @@ export function setValgtTema(tema: string) {
116124
};
117125
}
118126

119-
export function setKlageId(klageId: string) {
127+
export function setKlageId(
128+
klageId: string,
129+
tema: string = '*UNKNOWN*',
130+
ytelse: string = '*UNKNOWN*',
131+
saksnr: string = ''
132+
) {
133+
sessionStorage.setItem('nav.klage.klageId', klageId);
134+
if (tema !== '*UNKNOWN*' && ytelse !== '*UNKNOWN*') {
135+
setStorageContent(tema, ytelse, saksnr);
136+
}
137+
120138
return function (dispatch: Dispatch<ActionTypes>) {
121139
return dispatch({ type: 'KLAGE_ID_SET', value: klageId });
122140
};
123141
}
124142

143+
export function setStorageContent(tema: string, ytelse: string, saksnr: string) {
144+
sessionStorage.setItem('nav.klage.tema', tema);
145+
sessionStorage.setItem('nav.klage.ytelse', ytelse);
146+
sessionStorage.setItem('nav.klage.saksnr', saksnr);
147+
}
148+
125149
export function sjekkAuth(response: Response, params: string) {
126150
if (response.status === 401 || response.status === 403) {
127151
window.location.assign(getLoginserviceRedirectUrl(encodeURIComponent(decodeURI(params))));

‎src/store/reducer.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -87,8 +87,7 @@ const reducer = (state = initialState, action: ActionTypes): Store => {
8787
return {
8888
...state,
8989
activeKlage: action.payload,
90-
activeKlageSkjema: { ...state.activeKlageSkjema, ...action.klageskjema, ...action.payload },
91-
klageId: action.payload.id?.toString() ?? initialState.klageId
90+
activeKlageSkjema: { ...state.activeKlageSkjema, ...action.klageskjema, ...action.payload }
9291
};
9392
case 'KLAGE_GET_SUCCESS':
9493
const incomingVedlegg = action.payload.vedlegg?.map(function (e): VedleggProps {
@@ -105,6 +104,7 @@ const reducer = (state = initialState, action: ActionTypes): Store => {
105104
activeKlage: action.payload,
106105
activeKlageSkjema: klageTilKlageSkjema(action.payload),
107106
chosenYtelse: action.payload.ytelse,
107+
chosenTema: action.payload.tema,
108108
activeVedlegg: incomingVedlegg!!,
109109
klageId: action.payload.id?.toString() ?? initialState.klageId
110110
};

0 commit comments

Comments
 (0)
Please sign in to comment.