Context refaktorering

src/Pages/Artikkel/Artikkel.tsx

@@ -1,9 +1,9 @@
 import { Link as RouterLink, useParams } from 'react-router-dom';
 import { Brodsmulesti, Spinner } from '../Banner';
-import React, { useContext, useEffect } from 'react';
+import React, { useEffect } from 'react';
 import { Alert, BodyShort, Heading, Link } from '@navikt/ds-react';
 import './Artikkel.css';
-import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
+import { useOrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 import { LenkepanelMedLogging } from '../../GeneriskeElementer/LenkepanelMedLogging';
 import { useRawArtikkelHtml } from './useRawHtmlFromStorage';
 import { OrganisasjonInfo } from '../OrganisasjonerOgTilgangerProvider';
@@ -30,7 +30,7 @@ const artikler: Record<string, Artikkel> = {
 };
 
 export const Artikler = () => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     if (!valgtOrganisasjon) {
         return null;
     }

src/Pages/Banner.tsx

@@ -1,8 +1,8 @@
-import React, { FunctionComponent, useContext, useEffect, useCallback } from 'react';
+import React, { FunctionComponent, useCallback, useEffect } from 'react';
 import Bedriftsmeny from '@navikt/bedriftsmeny';
 import '@navikt/bedriftsmeny/lib/bedriftsmeny.css';
-import { OrganisasjonsDetaljerContext } from './OrganisasjonDetaljerProvider';
-import { OrganisasjonerOgTilgangerContext } from './OrganisasjonerOgTilgangerProvider';
+import { useOrganisasjonsDetaljerContext } from './OrganisasjonDetaljerProvider';
+import { useOrganisasjonerOgTilgangerContext } from './OrganisasjonerOgTilgangerProvider';
 import * as Record from '../utils/Record';
 import { NotifikasjonWidget } from '@navikt/arbeidsgiver-notifikasjon-widget';
 import { useSearchParams } from 'react-router-dom';
@@ -32,8 +32,8 @@ export const SaksoversiktBanner = () => (
 );
 
 export const BannerMedBedriftsmeny: FunctionComponent<OwnProps> = ({ sidetittel }) => {
-    const { organisasjoner } = useContext(OrganisasjonerOgTilgangerContext);
-    const { endreOrganisasjon, valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { organisasjoner } = useOrganisasjonerOgTilgangerContext();
+    const { endreOrganisasjon, valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
 
     const [params, setParams] = useSearchParams();
     const orgnrFraUrl = params.get('bedrift');

src/Pages/Hovedside/AktueltRubrikk.tsx

@@ -1,10 +1,10 @@
 import { Heading, LinkPanel } from '@navikt/ds-react';
-import React, { useContext } from 'react';
+import React from 'react';
 import { loggNavigasjonTags } from '../../utils/funksjonerForAmplitudeLogging';
 import { DisplayBetween, shouldDisplay } from '../../GeneriskeElementer/DisplayBetween';
 import { useLocation } from 'react-router-dom';
 import './AktueltRubrikk.css';
-import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
+import { useOrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 import { OrganisasjonInfo } from '../OrganisasjonerOgTilgangerProvider';
 
 type AktueltProps = {
@@ -36,7 +36,9 @@ const Aktuelt = ({ lenke, tittel, beskrivelse, visFra, visTil }: AktueltProps) =
                 }}
             >
                 <LinkPanel.Title>{tittel}</LinkPanel.Title>
-                <LinkPanel.Description>{beskrivelse ?? dateFormat.format(visFra)}</LinkPanel.Description>
+                <LinkPanel.Description>
+                    {beskrivelse ?? dateFormat.format(visFra)}
+                </LinkPanel.Description>
             </LinkPanel>
         </DisplayBetween>
     );
@@ -46,15 +48,16 @@ const aktuelt: Array<AktueltProps> = [
     {
         lenke: 'https://arbeidsgiver.nav.no/min-side-arbeidsgiver/artikkel/saferoad_ansetter_ved_hjelp_av_nav',
         tittel: 'Ønsker dere hjelpe fra Nav til å rekruttere?',
-        beskrivelse: "Les om hvordan Nav bidrar til at Saferoad kan ansette over 100 nye folk hvert år.",
+        beskrivelse:
+            'Les om hvordan Nav bidrar til at Saferoad kan ansette over 100 nye folk hvert år.',
         visFra: new Date('2024-12-13T00:00:00+02:00'),
         visTil: new Date('2025-01-31T00:00:00+02:00'),
         tilgangssjekk: (orgInfo) => orgInfo.altinntilgang.rekruttering,
-    }
+    },
 ];
 
 export const AktueltRubrikk = () => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     if (!valgtOrganisasjon) {
         return null;
     }

src/Pages/Hovedside/BeOmTilgang/BeOmTilgang.tsx

@@ -1,16 +1,12 @@
-import React, { FC, FunctionComponent, MouseEventHandler, useContext } from 'react';
+import React, { FC, FunctionComponent, MouseEventHandler } from 'react';
 import { Ekspanderbartpanel } from '../../../GeneriskeElementer/Ekspanderbartpanel';
 import {
-    OrganisasjonerOgTilgangerContext,
     OrganisasjonInfo,
+    useOrganisasjonerOgTilgangerContext,
 } from '../../OrganisasjonerOgTilgangerProvider';
-import { OrganisasjonsDetaljerContext } from '../../OrganisasjonDetaljerProvider';
+import { useOrganisasjonsDetaljerContext } from '../../OrganisasjonDetaljerProvider';
 import Organisasjonsbeskrivelse from './Organisasjonsbeskrivelse';
-import {
-    AltinntilgangAlleredeSøkt,
-    BeOmTilgangBoks,
-    BeOmSyfotilgang,
-} from './TjenesteInfo';
+import { AltinntilgangAlleredeSøkt, BeOmSyfotilgang, BeOmTilgangBoks } from './TjenesteInfo';
 import './BeOmTilgang.css';
 import { altinntjeneste, AltinntjenesteId } from '../../../altinn/tjenester';
 import { opprettAltinnTilgangssøknad } from '../../../altinn/tilganger';
@@ -77,8 +73,8 @@ const opprettSøknad = (
 };
 
 const BeOmTilgang: FunctionComponent = () => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
-    const { altinnTilgangssøknad } = useContext(OrganisasjonerOgTilgangerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
+    const { altinnTilgangssøknad } = useOrganisasjonerOgTilgangerContext();
 
     const tjenesteinfoBokser: JSX.Element[] = [];
     if (valgtOrganisasjon === undefined) {

src/Pages/Hovedside/InfoBokser.tsx

@@ -1,10 +1,10 @@
-import React, { FC, useContext, useEffect } from 'react';
+import React, { FC, useEffect } from 'react';
 import * as Record from '../../utils/Record';
 import './InfoBokser.css';
-import { OrganisasjonerOgTilgangerContext } from '../OrganisasjonerOgTilgangerProvider';
+import { useOrganisasjonerOgTilgangerContext } from '../OrganisasjonerOgTilgangerProvider';
 import { gittMiljo } from '../../utils/environment';
 import { shouldDisplay } from '../../GeneriskeElementer/DisplayBetween';
-import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
+import { useOrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 import { Alert, Heading } from '@navikt/ds-react';
 import { useLocalStorage } from '../../hooks/useStorage';
 import { LenkeMedLogging } from '../../GeneriskeElementer/LenkeMedLogging';
@@ -22,7 +22,7 @@ const infobokser: Array<InfoboksProps> = [
         visFra: new Date('2023-11-13T10:00:00+02:00'),
         visTil: new Date('2023-11-15T08:00:00+01:00'),
         Component: () => {
-            const { organisasjoner } = useContext(OrganisasjonerOgTilgangerContext);
+            const { organisasjoner } = useOrganisasjonerOgTilgangerContext();
             const harSyfotilgangPåTvers = Record.values(organisasjoner).some(
                 (org) => org.syfotilgang
             );
@@ -57,7 +57,7 @@ const infobokser: Array<InfoboksProps> = [
         visFra: new Date('2024-04-11T00:00:00+02:00'),
         visTil: new Date('2024-06-11T00:00:00+02:00'),
         Component: () => {
-            const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+            const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
             const [closed, setClosed] = useLocalStorage('yrkesskade-infobokser-closed', false);
 
             if (!valgtOrganisasjon || !valgtOrganisasjon.altinntilgang.yrkesskade) {

src/Pages/Hovedside/Kalenderavtaler.tsx

@@ -1,5 +1,5 @@
 import './Kalenderavtaler.css';
-import React, { FunctionComponent, useContext } from 'react';
+import React, { FunctionComponent } from 'react';
 import { BodyShort, Button, Heading, Tag } from '@navikt/ds-react';
 import {
     ChevronDownIcon,
@@ -10,7 +10,7 @@ import {
 } from '@navikt/aksel-icons';
 import { KalenderavtaleTilstand, Lokasjon, Query } from '../../api/graphql-types';
 import { gql, TypedDocumentNode, useQuery } from '@apollo/client';
-import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
+import { useOrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 
 const HENT_KALENDERAVTALER: TypedDocumentNode<Pick<Query, 'kommendeKalenderavtaler'>> = gql`
     query HentKalenderavtaler($virksomhetsnumre: [String!]!) {
@@ -36,7 +36,7 @@ const HENT_KALENDERAVTALER: TypedDocumentNode<Pick<Query, 'kommendeKalenderavtal
 const VIS_ANTALL = 2;
 
 export const Kalenderavtaler: FunctionComponent = () => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     const [visAlle, settVisAlle] = React.useState(false);
     const virksomhetsnumre =
         valgtOrganisasjon !== undefined ? [valgtOrganisasjon?.organisasjon.OrganizationNumber] : [];

src/Pages/Hovedside/ManglerKofuviAlert.tsx

@@ -1,7 +1,7 @@
 import { z } from 'zod';
 import useSWR from 'swr';
-import { useContext, useEffect, useState } from 'react';
-import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
+import { useEffect, useState } from 'react';
+import { useOrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 import { Alert, Heading } from '@navikt/ds-react';
 import { LenkeMedLogging } from '../../GeneriskeElementer/LenkeMedLogging';
 import { erDriftsforstyrrelse } from '../../utils/util';
@@ -54,7 +54,7 @@ const fallbackData: VarslingStatus = {
 };
 
 const manglerKofuviAlert = (): VarslingStatus => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     const [retries, setRetries] = useState(0);
     const { data } = useSWR(
         valgtOrganisasjon !== undefined

src/Pages/Hovedside/ManglerKontonummerAlert.tsx

@@ -1,7 +1,7 @@
 import { z } from 'zod';
 import useSWR from 'swr';
-import { useContext, useEffect, useState } from 'react';
-import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
+import { useEffect, useState } from 'react';
+import { useOrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 import { Alert, Heading } from '@navikt/ds-react';
 import { LenkeMedLogging } from '../../GeneriskeElementer/LenkeMedLogging';
 import { erDriftsforstyrrelse } from '../../utils/util';
@@ -10,7 +10,7 @@ import amplitude from '../../utils/amplitude';
 
 export const ManglerKontonummerAlert = () => {
     const kontonummerStatus = manglerKontonummerAlert();
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     const kanEndreKontonummer =
         valgtOrganisasjon?.altinntilgang.endreBankkontonummerForRefusjoner ?? false;
 
@@ -74,7 +74,7 @@ const fallbackData: KontonummerStatus = {
 };
 
 const manglerKontonummerAlert = (): KontonummerStatus => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     const [retries, setRetries] = useState(0);
     const { data } = useSWR(
         valgtOrganisasjon !== undefined

src/Pages/Hovedside/NyttigForDegContainer/Bedriftsinfoknapp/Bedriftsinfoknapp.tsx

@@ -1,12 +1,12 @@
-import React, { useContext } from 'react';
-import { OrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvider';
+import React from 'react';
+import { useOrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvider';
 import bedriftinfoikon from './infoombedriftikon.svg';
 import './Bedriftsinfoknapp.css';
 import { InternalLenkepanelMedLogging } from '../../../../GeneriskeElementer/LenkepanelMedLogging';
 import { TittelMedIkon } from '../../../../GeneriskeElementer/TittelMedIkon';
 
 const Bedriftsinfoknapp = () => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
 
     if (valgtOrganisasjon === undefined) {
         return null;

src/Pages/Hovedside/NyttigForDegContainer/NyttigForDegContainer.tsx

@@ -1,10 +1,10 @@
-import React, { useContext } from 'react';
-import { OrganisasjonsDetaljerContext } from '../../OrganisasjonDetaljerProvider';
+import React from 'react';
+import { useOrganisasjonsDetaljerContext } from '../../OrganisasjonDetaljerProvider';
 import Bedriftsinfoknapp from './Bedriftsinfoknapp/Bedriftsinfoknapp';
 import './NyttigForDegContainer.css';
 
 const NyttigForDegContainer = () => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
 
     return (
         <div className="nyttig-for-deg">

src/Pages/Hovedside/SisteSaker.tsx

@@ -1,13 +1,13 @@
-import React, { useContext, useEffect } from 'react';
+import React, { useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
-import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
+import { useOrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 import './SisteSaker.css';
 import { useSaker } from '../Saksoversikt/useSaker';
 import amplitude from '../../utils/amplitude';
 import { Heading, Tag } from '@navikt/ds-react';
 import { useSessionStateForside } from '../Saksoversikt/useOversiktSessionStorage';
 import { SakSortering } from '../../api/graphql-types';
-import { OrganisasjonerOgTilgangerContext } from '../OrganisasjonerOgTilgangerProvider';
+import { useOrganisasjonerOgTilgangerContext } from '../OrganisasjonerOgTilgangerProvider';
 import { Set } from 'immutable';
 import { InternalLenkepanelMedLogging } from '../../GeneriskeElementer/LenkepanelMedLogging';
 
@@ -33,10 +33,8 @@ const Saksikon = () => (
 );
 
 const SisteSaker = () => {
-    const { valgtOrganisasjon, antallSakerForAlleBedrifter } = useContext(
-        OrganisasjonsDetaljerContext
-    );
-    const { organisasjoner } = useContext(OrganisasjonerOgTilgangerContext);
+    const { valgtOrganisasjon, antallSakerForAlleBedrifter } = useOrganisasjonsDetaljerContext();
+    const { organisasjoner } = useOrganisasjonerOgTilgangerContext();
     const location = useLocation();
 
     const { loading, data } = useSaker(0, {

src/Pages/Hovedside/SøknaderOgSkjemaer.tsx

@@ -1,10 +1,9 @@
-import React, { useContext } from 'react';
+import React from 'react';
 import {
     lenkeTilPermitteringOgMasseoppsigelsesSkjema,
     skjemaForArbeidsgiverURL,
 } from '../../lenker';
 import './SøknaderOgSkjemaer.css';
-import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 import { LenkeMedLogging } from '../../GeneriskeElementer/LenkeMedLogging';
 import {
     InternalLenkepanelMedLogging,
@@ -14,9 +13,10 @@ import { altinnskjema, AltinnskjemaId, altinntjeneste } from '../../altinn/tjene
 import { HoyreChevron } from '../../GeneriskeElementer/HoyreChevron';
 import { Heading } from '@navikt/ds-react';
 import { gittMiljo } from '../../utils/environment';
+import { useOrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
 
 export const SøknaderOgSkjemaer = () => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     const tilgangInntektsmelding = valgtOrganisasjon?.altinntilgang?.inntektsmelding;
     const tilgangYrkesskade = valgtOrganisasjon?.altinntilgang?.yrkesskade;
     if (valgtOrganisasjon === undefined) {
@@ -102,19 +102,16 @@ export const SøknaderOgSkjemaer = () => {
                           })
                       )
                     : null}
-                {tilgangInntektsmelding === true
-                    ? <li>
+                {tilgangInntektsmelding === true ? (
+                    <li>
                         <InternalLenkepanelMedLogging
-                            loggLenketekst={
-                                'Inntektsmelding sykepenger (Opprett manuelt)'
-                            }
+                            loggLenketekst={'Inntektsmelding sykepenger (Opprett manuelt)'}
                             to={'/saksoversikt#opprett-inntektsmelding'}
                         >
                             Inntektsmelding sykepenger
                         </InternalLenkepanelMedLogging>
                     </li>
-                    : null
-                }
+                ) : null}
                 {altinnSkjemaLenke('inntektsmelding')}
                 {altinnSkjemaLenke('ekspertbistand')}
                 {altinnSkjemaLenke('utsendtArbeidstakerEØS')}

src/Pages/Hovedside/Tjenestebokser/Arbeidsforhold/Arbeidsforhold.tsx

@@ -1,17 +1,16 @@
-import React, { useContext } from 'react';
+import React from 'react';
 import { innsynAaregURL } from '../../../../lenker';
 import arbeidsforholdikon from './arbeidsforhold-ikon.svg';
 import { useAntallArbeidsforholdFraAareg } from './useAntallArbeidsforholdFraAareg';
 import './Arbeidsforhold.css';
 import { StortTall, Tjenesteboks } from '../Tjenesteboks';
-import { OrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvider';
+import { useOrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvider';
 
 const Arbeidsforhold = () => {
     const antallArbeidsforhold = useAntallArbeidsforholdFraAareg();
 
     const orgnr =
-        useContext(OrganisasjonsDetaljerContext).valgtOrganisasjon?.organisasjon
-            .OrganizationNumber ?? '';
+        useOrganisasjonsDetaljerContext().valgtOrganisasjon?.organisasjon.OrganizationNumber ?? '';
     const href = innsynAaregURL + (orgnr === '' ? '' : `?bedrift=${orgnr}`);
 
     return (

src/Pages/Hovedside/Tjenestebokser/Arbeidsforhold/useAntallArbeidsforholdFraAareg.ts

@@ -1,11 +1,11 @@
 import { z } from 'zod';
 import useSWR from 'swr';
-import { useContext, useState } from 'react';
-import { OrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvider';
+import { useState } from 'react';
+import { useOrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvider';
 import { erDriftsforstyrrelse } from '../../../../utils/util';
 
 export const useAntallArbeidsforholdFraAareg = (): number => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     const [retries, setRetries] = useState(0);
     const { data } = useSWR(
         valgtOrganisasjon !== undefined

src/Pages/Hovedside/Tjenestebokser/Arbeidsplassen/Arbeidsplassen.tsx

@@ -5,8 +5,7 @@ import './Arbeidsplassen.css';
 import { StortTall, Tjenesteboks } from '../Tjenesteboks';
 import { z } from 'zod';
 import useSWR from 'swr';
-import { useContext } from 'react';
-import { OrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvider';
+import { useOrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvider';
 import { erDriftsforstyrrelse } from '../../../../utils/util';
 
 const Arbeidsplassen = () => {
@@ -48,7 +47,7 @@ const PamStatusAnnonser = z.object({
 });
 
 const useAntallannonser = () => {
-    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useOrganisasjonsDetaljerContext();
     const orgnr = valgtOrganisasjon?.organisasjon?.OrganizationNumber;
     const [retries, setRetries] = useState(0);