Merge pull request #874 from navikt/dev/amplitude-endretSituasjon

Dev/amplitude endret situasjon

src/contexts/besvarelse.tsx

@@ -1,6 +1,7 @@
 import { createContext, ReactNode, useContext, useEffect, useState } from 'react';
 
 import { useFeatureToggleData, FeatureToggles } from './feature-toggles';
+import { useAmplitudeData } from '../komponenter/hent-initial-data/amplitude-provider';
 
 import { fetchToJson } from '../ducks/api-utils';
 import { BESVARELSE_URL, OPPRETT_DIALOG_URL, requestConfig } from '../ducks/api';
@@ -172,6 +173,7 @@ async function opprettDialog(data: {
 
 function BesvarelseProvider(props: { children: ReactNode }) {
     const featureToggles = useFeatureToggleData();
+    const { oppdaterAmplitudeData } = useAmplitudeData();
     const [besvarelse, settBesvarelse] = useState<BesvarelseResponse>(null);
 
     const erToggletPa = featureToggles[FeatureToggles.BRUK_ENDRING_AV_SITUASJON];
@@ -208,6 +210,14 @@ function BesvarelseProvider(props: { children: ReactNode }) {
         }
     }, [erToggletPa]);
 
+    useEffect(() => {
+        if (besvarelse?.erBesvarelsenEndret === true) {
+            oppdaterAmplitudeData({
+                endretSituasjon: besvarelse.besvarelse?.dinSituasjon?.verdi || 'N/A',
+            });
+        }
+    }, [besvarelse]);
+
     const contextValue = {
         besvarelse,
         lagreBesvarelse,

src/komponenter/endre-situasjon/min-situasjon.tsx

@@ -26,6 +26,7 @@ function MinSituasjon(props: any) {
     const kanViseKomponent = autentiseringData.securityLevel === InnloggingsNiva.LEVEL_4;
 
     const endretStyle = erBesvarelsenEndret ? { background: 'var(--a-blue-50)' } : {};
+
     if (!kanViseKomponent) return null;
 
     return (

src/komponenter/hent-initial-data/amplitude-provider.tsx

@@ -1,16 +1,18 @@
 import * as React from 'react';
 import { createContext, useContext } from 'react';
 import ukerFraDato from '@alheimsins/uker-fra-dato';
+
 import { InnloggingsNiva, useAutentiseringData } from '../../contexts/autentisering';
 import { DinSituasjonSvar, useBrukerregistreringData } from '../../contexts/brukerregistrering';
-import { OppfolgingContext } from '../../contexts/oppfolging';
 import { useBrukerinfoData } from '../../contexts/bruker-info';
 import { FeautreToggleData, useFeatureToggleData } from '../../contexts/feature-toggles';
+import { useArbeidssokerPerioder, useUnderOppfolging } from '../../contexts/arbeidssoker';
+
+import { OppfolgingContext } from '../../contexts/oppfolging';
 import grupperGeografiskTilknytning from '../../utils/grupper-geografisk-tilknytning';
 import beregnArbeidssokerperioder from '../../lib/beregn-arbeidssokerperioder';
 import dagerFraDato from '../../utils/dager-fra-dato';
 import { AmplitudeData } from '../../metrics/amplitude-utils';
-import { useArbeidssokerPerioder, useUnderOppfolging } from '../../contexts/arbeidssoker';
 import * as SprakValg from '../../contexts/sprak';
 import beregnBrukergruppe from '../../lib/beregn-brukergruppe';
 
@@ -36,6 +38,7 @@ export const initialAmplitudeData: AmplitudeData = {
     buildTimestamp: new Date().toISOString(),
     erSykmeldtMedArbeidsgiver: 'ukjent',
     dinSituasjon: DinSituasjonSvar.INGEN_VERDI,
+    endretSituasjon: 'INGEN_DATA',
     reservasjonKRR: 'ukjent',
     aktiveFeatureToggles: [],
     sprakValgFraCookie: 'IKKE_VALGT',
@@ -148,15 +151,24 @@ const AmplitudeProvider = (props: { children: React.ReactNode }) => {
 
     const [amplitudeData, setAmplitudeData] = React.useState(data);
 
+    /*
     const oppdaterAmplitudeData = React.useCallback(
         (data: Partial<AmplitudeData>) => {
             setAmplitudeData({
                 ...amplitudeData,
                 ...data,
             });
         },
-        [amplitudeData]
+        [amplitudeData],
     );
+    */
+
+    const oppdaterAmplitudeData = (data: Partial<AmplitudeData>) => {
+        setAmplitudeData((amplitudeData) => ({
+            ...amplitudeData,
+            ...data,
+        }));
+    };
 
     return (
         <AmplitudeContext.Provider value={{ amplitudeData, oppdaterAmplitudeData }}>

src/metrics/amplitude-utils.ts

@@ -1,9 +1,11 @@
 // tslint:disable align no-any
 import amplitude from 'amplitude-js';
+
 import { AMPLITUDE_API_KEY_PROD, AMPLITUDE_API_KEY_TEST, AMPLITUDE_ENDPOINT } from '../utils/konstanter';
 import { InnloggingsNiva } from '../contexts/autentisering';
 import { erProduksjon } from '../utils/app-state-utils';
 import { DinSituasjonSvar, ForeslattInnsatsgruppe } from '../contexts/brukerregistrering';
+import { PermittertSvar } from '../models/endring-av-situasjon';
 import * as SprakValg from '../contexts/sprak';
 import { DagpengeStatus } from '../lib/beregn-dagpenge-status';
 import { AntattInaktiveringsgrunn } from '../contexts/antatt-inaktiveringsgrunn';
@@ -52,6 +54,7 @@ export type AmplitudeData = {
     buildTimestamp: string;
     erSykmeldtMedArbeidsgiver: string;
     dinSituasjon: DinSituasjonSvar;
+    endretSituasjon: 'INGEN_DATA' | 'N/A' | DinSituasjonSvar | PermittertSvar;
     reservasjonKRR: string;
     aktiveFeatureToggles: string[];
     sprakValgFraCookie?: SprakValg.Sprak | 'IKKE_VALGT';

src/tabs/aia-tabs.tsx

@@ -2,6 +2,10 @@ import { Tabs } from '@navikt/ds-react';
 import { HTMLProps, useEffect, useState } from 'react';
 
 import { useAmplitudeData } from '../komponenter/hent-initial-data/amplitude-provider';
+import useHarGyldigBehovsvurdering from '../hooks/use-har-gyldig-behovsvurdering';
+import { useBeregnDagpengestatus } from '../hooks/use-beregn-dagpengestatus';
+import { Data, useMeldekortData } from '../hooks/use-meldekortdata';
+import { useProfil } from '../contexts/profil';
 
 import RegistrertTittel from '../komponenter/registrert-tittel/registrert-tittel';
 import MinSituasjon from '../komponenter/min-situasjon/min-situasjon';
@@ -10,22 +14,18 @@ import DagpengerOgYtelser from '../komponenter/dagpenger/dagpenger-og-ytelser';
 import Meldekort from '../komponenter/meldekort/meldekort';
 import { loggAktivitet } from '../metrics/metrics';
 import { hentQueryParam, settQueryParam } from '../utils/query-param-utils';
-
-import tabStyles from './tabs.module.css';
-import styles from '../innhold/innhold.module.css';
-import useHarGyldigBehovsvurdering from '../hooks/use-har-gyldig-behovsvurdering';
 import { DagpengeStatus } from '../lib/beregn-dagpenge-status';
-import { useBeregnDagpengestatus } from '../hooks/use-beregn-dagpengestatus';
-import { Data, useMeldekortData } from '../hooks/use-meldekortdata';
 import { datoUtenTid } from '../utils/date-utils';
 import { hentIDag } from '../utils/chrono';
+import { Profil } from '../profil';
 import {
     beregnDagerEtterFastsattMeldedag,
     beregnDagerTilInaktivering,
     hentMeldekortForLevering,
 } from '../utils/meldekort-utils';
-import { Profil } from '../profil';
-import { useProfil } from '../contexts/profil';
+
+import tabStyles from './tabs.module.css';
+import styles from '../innhold/innhold.module.css';
 
 const QUERY_PARAM = 'aia.aktivTab';
 
@@ -114,17 +114,16 @@ function skalViseMeldekortVarsel(meldekortData?: Data) {
     return meldekortForLevering.length === 1 && erInnenforTidsfrist;
 }
 const AiaTabs = () => {
+    const [aktivTab, settAktivTab] = useState<TabValue>(TabValue.MIN_SITUASJON);
+    const harGyldigBehovsvurdering = useHarGyldigBehovsvurdering();
+    const visPengestotteVarsel = harIkkeSoktDagpenger(useBeregnDagpengestatus(), useProfil().profil);
+    const visMeldekortVarsel = skalViseMeldekortVarsel(useMeldekortData().meldekortData);
     const { amplitudeData } = useAmplitudeData();
 
     const loggTabSkifte = (tab: string) => {
         loggAktivitet({ aktivitet: `Bytter til ${tab}`, komponent: 'tabs', ...amplitudeData });
     };
 
-    const [aktivTab, settAktivTab] = useState<TabValue>(TabValue.MIN_SITUASJON);
-    const harGyldigBehovsvurdering = useHarGyldigBehovsvurdering();
-    const visPengestotteVarsel = harIkkeSoktDagpenger(useBeregnDagpengestatus(), useProfil().profil);
-    const visMeldekortVarsel = skalViseMeldekortVarsel(useMeldekortData().meldekortData);
-
     const onChangeTab = (tab: string) => {
         settQueryParam(QUERY_PARAM, tab);
         settAktivTab(tab as TabValue);