Merge branch 'master' into fjern_login_context

server/mock/innloggetMock.js

@@ -1,26 +1,8 @@
-const sessions = {};
 export const mock = function (app) {
     app.get('/min-side-arbeidsgiver/api/innlogget', (req, res) => {
-        const token = sessions[req.ip];
-        if (token) {
-            console.log('innlogget? ja (session eksisterer)');
-            res.status(200).send();
-        } else {
-            console.log('innlogget? nei (session mangler)');
-            res.status(401).send();
-        }
+        res.status(200).send();
     });
     app.get('/min-side-arbeidsgiver/redirect-til-login', async (req, res) => {
-        const response = await fetch('https://fakedings.intern.dev.nav.no/fake/custom', {
-            method: 'POST',
-            headers: {
-                'Content-type': 'application/x-www-form-urlencoded',
-            },
-            body: `sub=00112233445&aud=${encodeURIComponent('bruker-api')}&acr=Level4`,
-        });
-        const token = await response.text();
-        sessions[req.ip] = token;
-        console.log(`login: setter session til ${token}`);
         res.redirect(req.get('referer'));
     });
 };

server/mock/kontaktinfoApiMock.js

@@ -0,0 +1,53 @@
+const response = [
+    {
+        hovedenhet: null,
+        underenhet: null,
+    },
+    {
+        hovedenhet: {
+            eposter: [],
+            telefonnumre: [],
+        },
+        underenhet: {
+            eposter: [],
+            telefonnumre: [],
+        },
+    },
+    {
+        hovedenhet: {
+            eposter: ['[email protected]'],
+            telefonnumre: [],
+        },
+        underenhet: {
+            eposter: [],
+            telefonnumre: ['+4700000'],
+        },
+    },
+    {
+        hovedenhet: {
+            eposter: ['[email protected]', '[email protected]'],
+            telefonnumre: [],
+        },
+        underenhet: {
+            eposter: ['[email protected]'],
+            telefonnumre: ['+4700000'],
+        },
+    },
+    {
+        hovedenhet: {
+            eposter: ['[email protected]', '[email protected]'],
+            telefonnumre: ['+4700000'],
+        },
+        underenhet: {
+            eposter: [],
+            telefonnumre: ['+4700000'],
+        },
+    },
+];
+
+export const mock = (app) => {
+    app.post('/min-side-arbeidsgiver/api/kontaktinfo/v1', (req, res) => {
+        const randomRespons = response[Math.floor(Math.random() * 5)];
+        return res.send(randomRespons);
+    });
+};

server/server.js

@@ -175,6 +175,7 @@ const main = async () => {
         (await import('./mock/refusjonsStatusMock.js')).mock(app);
         (await import('./mock/presenterteKandidaterMock.js')).mock(app);
         (await import('./mock/storageMock.js')).mock(app);
+        (await import('./mock/kontaktinfoApiMock.js')).mock(app);
 
         const {
             applyNotifikasjonMockMiddleware,

src/App/App.tsx

@@ -1,15 +1,16 @@
-import React, { FunctionComponent, useEffect, useState } from 'react';
+import React, { FunctionComponent, useContext, useEffect, useState } from 'react';
 import { BrowserRouter, Route, Link as RouterLink, Routes, useLocation } from 'react-router-dom';
 import { basename } from '../paths';
 import Hovedside from './Hovedside/Hovedside';
-import { LoginBoundary } from './LoginBoundary';
+import LoginBoundary from './LoginBoundary';
 import { AlertsProvider } from './Alerts/Alerts';
 import { OrganisasjonerOgTilgangerProvider } from './OrganisasjonerOgTilgangerProvider';
 import { OrganisasjonsDetaljerProvider } from './OrganisasjonDetaljerProvider';
 import InformasjonOmBedrift from './InformasjonOmBedrift/InformasjonOmBedrift';
 import { ManglerTilgangContainer } from './Hovedside/ManglerTilgangContainer/ManglerTilgangContainer';
 import { loggSidevisning } from '../utils/funksjonerForAmplitudeLogging';
 import './App.css';
+import { Innlogget, LoginContext, LoginProvider } from './LoginProvider';
 import { NotifikasjonWidgetProvider } from '@navikt/arbeidsgiver-notifikasjon-widget';
 import Banner from './HovedBanner/HovedBanner';
 import { Saksoversikt } from './Hovedside/Sak/Saksoversikt/Saksoversikt';
@@ -28,10 +29,13 @@ const miljø = gittMiljo<'local' | 'labs' | 'dev' | 'prod'>({
 
 const AmplitudeSidevisningEventLogger: FunctionComponent = (props) => {
     const location = useLocation();
+    const { innlogget } = useContext(LoginContext);
 
     useEffect(() => {
-        loggSidevisning(location.pathname);
-    }, [location.pathname]);
+        if (innlogget !== Innlogget.LASTER) {
+            loggSidevisning(location.pathname, innlogget);
+        }
+    }, [location.pathname, innlogget]);
 
     return <>{props.children}</>;
 };
@@ -58,12 +62,12 @@ const App: FunctionComponent = () => {
                     revalidateOnFocus: false,
                 }}
             >
-                <BrowserRouter basename={basename}>
-                    <LoginBoundary>
-                        <NotifikasjonWidgetProvider
-                            miljo={miljø}
-                            apiUrl={`${basename}/notifikasjon-bruker-api`}
-                        >
+                <LoginBoundary>
+                    <NotifikasjonWidgetProvider
+                        miljo={miljø}
+                        apiUrl={`${basename}/notifikasjon-bruker-api`}
+                    >
+                        <BrowserRouter basename={basename}>
                             <AmplitudeSidevisningEventLogger>
                                 <Routes>
                                     <Route
@@ -78,7 +82,7 @@ const App: FunctionComponent = () => {
                                                                 path="/bedriftsinformasjon"
                                                                 element={
                                                                     <SideTittelWrapper
-                                                                        tittel={'Virksomhetsprofil'}
+                                                                        tittel={'Om virksomheten'}
                                                                         setTittel={setSidetittel}
                                                                     >
                                                                         <InformasjonOmBedrift />
@@ -174,9 +178,9 @@ const App: FunctionComponent = () => {
                                     />
                                 </Routes>
                             </AmplitudeSidevisningEventLogger>
-                        </NotifikasjonWidgetProvider>
-                    </LoginBoundary>
-                </BrowserRouter>
+                        </BrowserRouter>
+                    </NotifikasjonWidgetProvider>
+                </LoginBoundary>
             </SWRConfig>
         </div>
     );

src/App/Hovedside/NyttigForDegContainer/Bedriftsinfoknapp/Bedriftsinfoknapp.tsx

@@ -3,7 +3,7 @@ import { OrganisasjonsDetaljerContext } from '../../../OrganisasjonDetaljerProvi
 import bedriftinfoikon from './infoombedriftikon.svg';
 import './Bedriftsinfoknapp.css';
 import { InternalLenkepanelMedLogging } from '../../../../GeneriskeElementer/LenkepanelMedLogging';
-import {TittelMedIkon} from "../../../../GeneriskeElementer/TittelMedIkon";
+import { TittelMedIkon } from '../../../../GeneriskeElementer/TittelMedIkon';
 
 const Bedriftsinfoknapp = () => {
     const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
@@ -14,14 +14,18 @@ const Bedriftsinfoknapp = () => {
 
     return (
         <InternalLenkepanelMedLogging
-            to={"/bedriftsinformasjon" + '?bedrift=' + valgtOrganisasjon.organisasjon.OrganizationNumber}
-            onClick={()=>scroll(0,0)}
+            to={
+                '/bedriftsinformasjon' +
+                '?bedrift=' +
+                valgtOrganisasjon.organisasjon.OrganizationNumber
+            }
+            onClick={() => scroll(0, 0)}
             className="bedriftsinfo-knapp"
             loggLenketekst="Informasjon om din virksomhet"
         >
-            <TittelMedIkon tittel={"Informasjon fra enhetsregisteret"} ikon={bedriftinfoikon}/>
+            <TittelMedIkon tittel={'Om virksomheten'} ikon={bedriftinfoikon} />
         </InternalLenkepanelMedLogging>
     );
 };
 
-export default Bedriftsinfoknapp;
+export default Bedriftsinfoknapp;

src/App/InformasjonOmBedrift/InformasjonOmBedrift.css

@@ -1,14 +1,14 @@
 .informasjon-om-bedrift {
-  margin: 2rem auto;
-  padding: 2rem;
-  max-width: 60rem;
-  width: 100%;
+    margin: 24px auto;
+    padding: 2rem;
+    max-width: 60rem;
+    width: 100%;
 }
 
 .informasjon-om-bedrift .ny-fane-ikon {
-  margin-top: 3px;
+    margin-top: 3px;
 }
 
 .informasjon-om-bedrift hr {
-  width: 100%;
-}
+    width: 100%;
+}

src/App/InformasjonOmBedrift/InformasjonOmBedrift.tsx

@@ -1,60 +1,72 @@
-import React, {FunctionComponent, useContext, useEffect, useState} from 'react';
-import {OrganisasjonsDetaljerContext} from '../OrganisasjonDetaljerProvider';
-import {Enhet, hentOverordnetEnhet, hentUnderenhet} from '../../api/enhetsregisteretApi';
+import React, { FunctionComponent, useContext, useEffect, useState } from 'react';
+import { OrganisasjonsDetaljerContext } from '../OrganisasjonDetaljerProvider';
+import { Enhet, hentOverordnetEnhet, hentUnderenhet } from '../../api/enhetsregisteretApi';
 import Underenhet from './Underenhet/Underenhet';
 import OverordnetEnhet from './OverordnetEnhet/OverordnetEnhet';
 import Brodsmulesti from '../Brodsmulesti/Brodsmulesti';
 import './InformasjonOmBedrift.css';
-import {Panel} from "@navikt/ds-react";
+import { Panel } from '@navikt/ds-react';
 
-interface Enheter {
+export interface Enheter {
     underenhet: Enhet;
     hovedenhet: Enhet;
 }
 
 const hentEnheter = async (orgnr: string): Promise<Enheter | undefined> => {
-    const underenhet = await hentUnderenhet(orgnr)
+    const underenhet = await hentUnderenhet(orgnr);
     if (underenhet === undefined) {
-        return undefined
+        return undefined;
     }
     if (underenhet.overordnetEnhet === undefined) {
-        return undefined
+        return undefined;
     }
-    const hovedenhet = await hentOverordnetEnhet(underenhet.overordnetEnhet)
+    const hovedenhet = await hentOverordnetEnhet(underenhet.overordnetEnhet);
     if (hovedenhet === undefined) {
-        return undefined
+        return undefined;
     }
-    return {underenhet, hovedenhet}
-}
+    return { underenhet, hovedenhet };
+};
+
+const Kontaktpanel = ({ children }: { children: React.ReactNode }) => (
+    <Panel className="informasjon-om-bedrift">{children}</Panel>
+);
 
 const InformasjonOmBedrift: FunctionComponent = () => {
-    const {valgtOrganisasjon} = useContext(OrganisasjonsDetaljerContext);
+    const { valgtOrganisasjon } = useContext(OrganisasjonsDetaljerContext);
     const [enheter, setEnheter] = useState<Enheter | undefined>(undefined);
-    const orgnr = valgtOrganisasjon?.organisasjon.OrganizationNumber ?? '';
+    const orgnr = valgtOrganisasjon?.organisasjon.OrganizationNumber;
 
     useEffect(() => {
-        if (orgnr !== '') {
-            hentEnheter(orgnr).then(setEnheter)
+        if (orgnr !== undefined) {
+            hentEnheter(orgnr).then(setEnheter);
         } else {
-            setEnheter(undefined)
+            setEnheter(undefined);
         }
     }, [orgnr]);
 
     return (
         <>
-            <Brodsmulesti brodsmuler={[{url: '/bedriftsinformasjon', title: 'Bedriftsprofil', handleInApp: true}]}/>
-            <Panel className='informasjon-om-bedrift'>
-                {enheter !== undefined ? (
-                    <>
-                        <Underenhet underenhet={enheter.underenhet}/>
-                        <OverordnetEnhet overordnetenhet={enheter.hovedenhet}/>
-                    </>
-                ) : (
+            <Brodsmulesti
+                brodsmuler={[
+                    { url: '/bedriftsinformasjon', title: 'Bedriftsprofil', handleInApp: true },
+                ]}
+            />
+            {enheter !== undefined ? (
+                <>
+                    <Kontaktpanel>
+                        <Underenhet underenhet={enheter.underenhet} />
+                    </Kontaktpanel>
+                    <Kontaktpanel>
+                        <OverordnetEnhet overordnetenhet={enheter.hovedenhet} />
+                    </Kontaktpanel>
+                </>
+            ) : (
+                <Kontaktpanel>
                     <div>Kunne ikke hente informasjon</div>
-                )}
-            </Panel>
+                </Kontaktpanel>
+            )}
         </>
     );
 };
 
-export default InformasjonOmBedrift;
+export default InformasjonOmBedrift;

src/App/InformasjonOmBedrift/Kontaktinfo.css

@@ -0,0 +1,23 @@
+.kontaktinfo {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+    max-width: 32rem;
+    margin-top: 16px;
+}
+
+.kontaktinfo li {
+    margin: 0;
+    list-style: none;
+}
+
+.kontaktinfo ul {
+    margin: 0;
+    padding: 0;
+}
+
+.kontaktinfo-tittel {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}