Skip to content

Commit

Permalink
håndter navigering mellom forside og saksoversikt
Browse files Browse the repository at this point in the history
  • Loading branch information
kenglxn committed Nov 27, 2023
1 parent 2890eb9 commit 1f3ee97
Show file tree
Hide file tree
Showing 2 changed files with 64 additions and 58 deletions.
23 changes: 12 additions & 11 deletions src/Pages/Saksoversikt/useOversiktSessionStorage.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Store copy of oversikts-filter in sessionStorage

import { useContext, useEffect, useMemo } from 'react';
import { useContext, useEffect, useMemo, useState } from 'react';
import { useSearchParams } from 'react-router-dom';
import { useSessionStorage } from '../../hooks/useStorage';
import { equalAsSets, Filter } from './useOversiktStateTransitions';
Expand All @@ -18,14 +18,12 @@ type SessionStateSaksoversikt = {
tekstsoek: string;
virksomhetsnumre: string[] | 'ALLEBEDRIFTER';
sortering: SakSortering;
bedrift: string | undefined;
sakstyper: string[];
oppgaveTilstand: OppgaveTilstand[];
valgtFilterId: string | undefined;
};
type SessionStateForside = {
route: '/';
bedrift: string | undefined;
};

type SessionState = SessionStateSaksoversikt | SessionStateForside;
Expand All @@ -35,7 +33,6 @@ const filterToSessionState = (
valgtFilterId: string | undefined
): SessionStateSaksoversikt => ({
route: '/saksoversikt',
bedrift: undefined,
side: filter.side,
tekstsoek: filter.tekstsoek,
sortering: filter.sortering,
Expand Down Expand Up @@ -67,12 +64,11 @@ const equalVirksomhetsnumre = (

export const equalSessionState = (a: SessionState, b: SessionState): boolean => {
if (a.route === '/' && b.route === '/') {
return a.bedrift === b.bedrift;
return true;
} else if (a.route === '/saksoversikt' && b.route === '/saksoversikt') {
return (
a.side === b.side &&
a.tekstsoek === b.tekstsoek &&
a.bedrift === b.bedrift &&
a.sortering === b.sortering &&
a.valgtFilterId === b.valgtFilterId &&
equalVirksomhetsnumre(a, b) &&
Expand All @@ -86,14 +82,14 @@ export const equalSessionState = (a: SessionState, b: SessionState): boolean =>

export const useSessionStateForside = (): void => {
const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
const [_, setSessionState] = useSessionStorage(SESSION_STORAGE_KEY, { route: '/' });
const bedrift = valgtOrganisasjon?.organisasjon?.OrganizationNumber;

useEffect(() => {
const sessionState: SessionStateForside = {
route: '/',
bedrift,
};
sessionStorage.setItem(SESSION_STORAGE_KEY, JSON.stringify(sessionState));
setSessionState(sessionState);
}, [bedrift]);
};

Expand All @@ -111,17 +107,22 @@ const defaultSessionState: SessionStateSaksoversikt = {
tekstsoek: '',
virksomhetsnumre: 'ALLEBEDRIFTER',
sortering: SakSortering.Oppdatert,
bedrift: undefined,
sakstyper: [],
oppgaveTilstand: [],
valgtFilterId: undefined,
};

export const useSessionState = (alleVirksomheter: Organisasjon[]): UseSessionState => {
const [sessionState, setSessionState] = useSessionStorage(
export const useSessionStateOversikt = (alleVirksomheter: Organisasjon[]): UseSessionState => {
const [sessionStorage, setSessionStorage] = useSessionStorage<SessionState>(
SESSION_STORAGE_KEY,
defaultSessionState
);
const [sessionState, setSessionState] = useState<SessionStateSaksoversikt>(() =>
sessionStorage.route === '/saksoversikt' ? sessionStorage : defaultSessionState
);
useEffect(() => {
setSessionStorage(sessionState);
}, [sessionState]);

const [params, setParams] = useSearchParams();

Expand Down
99 changes: 52 additions & 47 deletions src/Pages/Saksoversikt/useOversiktStateTransitions.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { useEffect, useReducer } from 'react';
import { SIDE_SIZE } from './Saksoversikt';
import { useSessionState } from './useOversiktSessionStorage';
import { useSessionStateOversikt } from './useOversiktSessionStorage';
import { useSaker } from './useSaker';
import amplitude from '../../utils/amplitude';
import {
Expand All @@ -15,53 +15,57 @@ import Immutable, { Set } from 'immutable';
import { Organisasjon } from '../../altinn/organisasjon';

export type Filter = {
side: number,
tekstsoek: string,
virksomheter: Set<string>,
sortering: SakSortering,
sakstyper: string[],
oppgaveTilstand: OppgaveTilstand[],
}
side: number;
tekstsoek: string;
virksomheter: Set<string>;
sortering: SakSortering;
sakstyper: string[];
oppgaveTilstand: OppgaveTilstand[];
};

export type State = {
state: 'loading';
filter: Filter;
valgtFilterId: string | undefined;
sider: number | undefined;
totaltAntallSaker: number | undefined;
forrigeSaker: Array<Sak> | null;
sakstyper: Array<Sakstype> | undefined;
oppgaveTilstandInfo: Array<OppgaveTilstandInfo> | undefined;
startTid: Date;
} | {
state: 'done';
filter: Filter;
valgtFilterId: string | undefined;
sider: number;
saker: Array<Sak>;
sakstyper: Array<Sakstype>;
totaltAntallSaker: number;
oppgaveTilstandInfo: Array<OppgaveTilstandInfo>;
} | {
state: 'error';
filter: Filter;
valgtFilterId: string | undefined;
sider: number | undefined;
sakstyper: Array<Sakstype> | undefined;
totaltAntallSaker: number | undefined;
oppgaveTilstandInfo: Array<OppgaveTilstandInfo> | undefined;
}
export type State =
| {
state: 'loading';
filter: Filter;
valgtFilterId: string | undefined;
sider: number | undefined;
totaltAntallSaker: number | undefined;
forrigeSaker: Array<Sak> | null;
sakstyper: Array<Sakstype> | undefined;
oppgaveTilstandInfo: Array<OppgaveTilstandInfo> | undefined;
startTid: Date;
}
| {
state: 'done';
filter: Filter;
valgtFilterId: string | undefined;
sider: number;
saker: Array<Sak>;
sakstyper: Array<Sakstype>;
totaltAntallSaker: number;
oppgaveTilstandInfo: Array<OppgaveTilstandInfo>;
}
| {
state: 'error';
filter: Filter;
valgtFilterId: string | undefined;
sider: number | undefined;
sakstyper: Array<Sakstype> | undefined;
totaltAntallSaker: number | undefined;
oppgaveTilstandInfo: Array<OppgaveTilstandInfo> | undefined;
};

type Action =
| { action: 'bytt-filter', filter: Filter }
| { action: 'sett-valgt-filterid', id: string | undefined }
| { action: 'bytt-filter'; filter: Filter }
| { action: 'sett-valgt-filterid'; id: string | undefined }
| { action: 'lasting-pågår' }
| { action: 'lasting-ferdig', resultat: SakerResultat }
| { action: 'lasting-feilet' }

| { action: 'lasting-ferdig'; resultat: SakerResultat }
| { action: 'lasting-feilet' };

export const useOversiktStateTransitions = (alleVirksomheter: Organisasjon[]) => {
const [sessionState, setSessionState] = useSessionState(alleVirksomheter)
const [sessionState, setSessionState] = useSessionStateOversikt(alleVirksomheter);

console.log('useOversiktStateTransitions', { sessionState });

const [state, dispatch] = useReducer(reduce, {
state: 'loading',
Expand All @@ -78,8 +82,8 @@ export const useOversiktStateTransitions = (alleVirksomheter: Organisasjon[]) =>
const { loading, data } = useSaker(SIDE_SIZE, state.filter);

useEffect(() => {
setSessionState(state.filter, state.valgtFilterId)
}, [state.filter, state.valgtFilterId])
setSessionState(state.filter, state.valgtFilterId);
}, [state.filter, state.valgtFilterId]);

useEffect(() => {
if (loading) {
Expand All @@ -100,7 +104,8 @@ export const useOversiktStateTransitions = (alleVirksomheter: Organisasjon[]) =>
return {
state,
byttFilter: (filter: Filter) => dispatch({ action: 'bytt-filter', filter }),
setValgtFilterId: (id: string | undefined) => dispatch({ action: 'sett-valgt-filterid', id }),
setValgtFilterId: (id: string | undefined) =>
dispatch({ action: 'sett-valgt-filterid', id }),
};
};

Expand All @@ -118,7 +123,7 @@ const reduce = (current: State, action: Action): State => {
return {
...current,
valgtFilterId: action.id,
}
};
case 'lasting-pågår':
return {
state: 'loading',
Expand Down Expand Up @@ -186,7 +191,7 @@ const finnForrigeSaker = (state: State): Array<Sak> | null => {
};

export function equalAsSets(a: string[], b: string[]) {
return a.length === b.length && a.every(aa => b.includes(aa));
return a.length === b.length && a.every((aa) => b.includes(aa));
}

export const equalFilter = (a: Filter, b: Filter): boolean =>
Expand Down

0 comments on commit 1f3ee97

Please sign in to comment.