diff --git a/package-lock.json b/package-lock.json
index d74a7c38b..6cd7d087e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -70,7 +70,8 @@
"react-dom": "~18.3.1",
"react-intl": "6.8.7",
"react-redux": "^9.1.2",
- "react-router-dom": "^6.28.0",
+ "react-router": "^7.0.1",
+ "react-router-dom": "^7.0.1",
"rollup-plugin-visualizer": "^5.12.0",
"sass": "^1.81.0",
"start-server-and-test": "^2.0.8",
@@ -2829,15 +2830,6 @@
}
}
},
- "node_modules/@remix-run/router": {
- "version": "1.21.0",
- "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.21.0.tgz",
- "integrity": "sha512-xfSkCAchbdG5PnbrKqFWwia4Bi61nH+wm8wLEqfHDyp7Y3dZzgqS2itV8i4gAq9pC2HsTpwyBC6Ds8VHZ96JlA==",
- "dev": true,
- "engines": {
- "node": ">=14.0.0"
- }
- },
"node_modules/@rollup/pluginutils": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.2.1.tgz",
@@ -11845,35 +11837,54 @@
}
},
"node_modules/react-router": {
- "version": "6.28.0",
- "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.28.0.tgz",
- "integrity": "sha512-HrYdIFqdrnhDw0PqG/AKjAqEqM7AvxCz0DQ4h2W8k6nqmc5uRBYDag0SBxx9iYz5G8gnuNVLzUe13wl9eAsXXg==",
+ "version": "7.0.1",
+ "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.0.1.tgz",
+ "integrity": "sha512-WVAhv9oWCNsja5AkK6KLpXJDSJCQizOIyOd4vvB/+eHGbYx5vkhcmcmwWjQ9yqkRClogi+xjEg9fNEOd5EX/tw==",
"dev": true,
+ "license": "MIT",
"dependencies": {
- "@remix-run/router": "1.21.0"
+ "@types/cookie": "^0.6.0",
+ "cookie": "^1.0.1",
+ "set-cookie-parser": "^2.6.0",
+ "turbo-stream": "2.4.0"
},
"engines": {
- "node": ">=14.0.0"
+ "node": ">=20.0.0"
},
"peerDependencies": {
- "react": ">=16.8"
+ "react": ">=18",
+ "react-dom": ">=18"
+ },
+ "peerDependenciesMeta": {
+ "react-dom": {
+ "optional": true
+ }
}
},
"node_modules/react-router-dom": {
- "version": "6.28.0",
- "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.28.0.tgz",
- "integrity": "sha512-kQ7Unsl5YdyOltsPGl31zOjLrDv+m2VcIEcIHqYYD3Lp0UppLjrzcfJqDJwXxFw3TH/yvapbnUvPlAj7Kx5nbg==",
+ "version": "7.0.1",
+ "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.0.1.tgz",
+ "integrity": "sha512-duBzwAAiIabhFPZfDjcYpJ+f08TMbPMETgq254GWne2NW1ZwRHhZLj7tpSp8KGb7JvZzlLcjGUnqLxpZQVEPng==",
"dev": true,
+ "license": "MIT",
"dependencies": {
- "@remix-run/router": "1.21.0",
- "react-router": "6.28.0"
+ "react-router": "7.0.1"
},
"engines": {
- "node": ">=14.0.0"
+ "node": ">=20.0.0"
},
"peerDependencies": {
- "react": ">=16.8",
- "react-dom": ">=16.8"
+ "react": ">=18",
+ "react-dom": ">=18"
+ }
+ },
+ "node_modules/react-router/node_modules/cookie": {
+ "version": "1.0.2",
+ "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz",
+ "integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==",
+ "dev": true,
+ "engines": {
+ "node": ">=18"
}
},
"node_modules/read-pkg": {
@@ -12956,6 +12967,12 @@
"integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==",
"dev": true
},
+ "node_modules/set-cookie-parser": {
+ "version": "2.7.1",
+ "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
+ "integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==",
+ "dev": true
+ },
"node_modules/set-function-length": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
@@ -14575,6 +14592,12 @@
"node": "*"
}
},
+ "node_modules/turbo-stream": {
+ "version": "2.4.0",
+ "resolved": "https://registry.npmjs.org/turbo-stream/-/turbo-stream-2.4.0.tgz",
+ "integrity": "sha512-FHncC10WpBd2eOmGwpmQsWLDoK4cqsA/UT/GqNoaKOQnT8uzhtCbg3EoUDMvqpOSAI0S26mr0rkjzbOO6S3v1g==",
+ "dev": true
+ },
"node_modules/tweetnacl": {
"version": "0.14.5",
"resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
diff --git a/package.json b/package.json
index c52403caa..39b581078 100644
--- a/package.json
+++ b/package.json
@@ -93,7 +93,8 @@
"react-dom": "~18.3.1",
"react-intl": "6.8.7",
"react-redux": "^9.1.2",
- "react-router-dom": "^6.28.0",
+ "react-router": "^7.0.1",
+ "react-router-dom": "^7.0.1",
"rollup-plugin-visualizer": "^5.12.0",
"sass": "^1.81.0",
"start-server-and-test": "^2.0.8",
diff --git a/src/components/Grunnlag/Grunnlag.tsx b/src/components/Grunnlag/Grunnlag.tsx
index 901733c44..9655c4219 100644
--- a/src/components/Grunnlag/Grunnlag.tsx
+++ b/src/components/Grunnlag/Grunnlag.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import {
Accordion,
diff --git a/src/components/Grunnlag/GrunnlagAFP/__tests__/GrunnlagAFP.test.tsx b/src/components/Grunnlag/GrunnlagAFP/__tests__/GrunnlagAFP.test.tsx
index bcab1f764..9577763c7 100644
--- a/src/components/Grunnlag/GrunnlagAFP/__tests__/GrunnlagAFP.test.tsx
+++ b/src/components/Grunnlag/GrunnlagAFP/__tests__/GrunnlagAFP.test.tsx
@@ -1,5 +1,3 @@
-import * as ReactRouterUtils from 'react-router'
-
import { add, endOfDay, format } from 'date-fns'
import { GrunnlagAFP } from '..'
@@ -14,6 +12,15 @@ import { userInputInitialState } from '@/state/userInput/userInputReducer'
import { render, screen, userEvent } from '@/test-utils'
import { DATE_BACKEND_FORMAT } from '@/utils/dates'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('Grunnlag - AFP', () => {
it('Når brukeren har valgt AFP offentlig og samtykket til beregning av den, viser riktig tittel med formatert inntekt og tekst', async () => {
const user = userEvent.setup()
@@ -106,10 +113,6 @@ describe('Grunnlag - AFP', () => {
it('Når brukeren har valgt uten AFP, viser riktig tittel med formatert inntekt, tekst og lenke', async () => {
const goToStartMock = vi.fn()
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const user = userEvent.setup()
render(, {
@@ -417,10 +420,6 @@ describe('Grunnlag - AFP', () => {
it('Når hen har valgt uten AFP, viser riktig tittel med formatert inntekt, tekst og lenke', async () => {
const goToStartMock = vi.fn()
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const user = userEvent.setup()
render(, {
diff --git a/src/components/Grunnlag/GrunnlagUtenlandsopphold/GrunnlagUtenlandsopphold.tsx b/src/components/Grunnlag/GrunnlagUtenlandsopphold/GrunnlagUtenlandsopphold.tsx
index 247a23464..73c52cef7 100644
--- a/src/components/Grunnlag/GrunnlagUtenlandsopphold/GrunnlagUtenlandsopphold.tsx
+++ b/src/components/Grunnlag/GrunnlagUtenlandsopphold/GrunnlagUtenlandsopphold.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { ExclamationmarkTriangleFillIcon } from '@navikt/aksel-icons'
import { BodyLong, Button, Link, Modal } from '@navikt/ds-react'
diff --git a/src/components/Grunnlag/GrunnlagUtenlandsopphold/__tests__/GrunnlagUtenlandsopphold.test.tsx b/src/components/Grunnlag/GrunnlagUtenlandsopphold/__tests__/GrunnlagUtenlandsopphold.test.tsx
index c26b717b4..30902e9a2 100644
--- a/src/components/Grunnlag/GrunnlagUtenlandsopphold/__tests__/GrunnlagUtenlandsopphold.test.tsx
+++ b/src/components/Grunnlag/GrunnlagUtenlandsopphold/__tests__/GrunnlagUtenlandsopphold.test.tsx
@@ -1,10 +1,17 @@
-import * as ReactRouterUtils from 'react-router'
-
import { GrunnlagUtenlandsopphold } from '..'
import { fulfilledGetLoependeVedtakLoependeAlderspensjon } from '@/mocks/mockedRTKQueryApiCalls'
import { userInputInitialState } from '@/state/userInput/userInputReducer'
import { render, screen, userEvent } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('GrunnlagUtenlandsopphold', () => {
describe('Gitt at brukeren har svart "nei" på spørsmålet om opphold i utlandet', () => {
it('viser riktig tittel og innhold og liste over utenlandsopphold vises ikke', async () => {
@@ -164,11 +171,6 @@ describe('GrunnlagUtenlandsopphold', () => {
})
it('Når man klikker på lenken for å endre opphold, sendes man til Utenlandsoppholdsteget', async () => {
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
-
const user = userEvent.setup()
render(, {
diff --git a/src/components/Grunnlag/__tests__/Grunnlag.test.tsx b/src/components/Grunnlag/__tests__/Grunnlag.test.tsx
index 2944ed30b..7cb4fc2b9 100644
--- a/src/components/Grunnlag/__tests__/Grunnlag.test.tsx
+++ b/src/components/Grunnlag/__tests__/Grunnlag.test.tsx
@@ -1,5 +1,3 @@
-import * as ReactRouterUtils from 'react-router'
-
import { Grunnlag } from '@/components/Grunnlag'
import { fulfilledGetLoependeVedtak0Ufoeregrad } from '@/mocks/mockedRTKQueryApiCalls'
import { mockErrorResponse, mockResponse } from '@/mocks/server'
@@ -8,6 +6,15 @@ import { userInputInitialState } from '@/state/userInput/userInputReducer'
import * as userInputReducerUtils from '@/state/userInput/userInputReducer'
import { render, screen, userEvent, waitFor } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('Grunnlag', () => {
const renderGrunnlagMedPreloadedState = (
headingLevel: '1' | '2' | '3',
@@ -104,10 +111,6 @@ describe('Grunnlag', () => {
userInputReducerUtils.userInputActions,
'flushCurrentSimulationUtenomUtenlandsperioder'
)
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const user = userEvent.setup()
renderGrunnlagMedPreloadedState('2', 'enkel')
@@ -266,10 +269,6 @@ describe('Grunnlag', () => {
userInputReducerUtils.userInputActions,
'flush'
)
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const user = userEvent.setup()
renderGrunnlagMedPreloadedState('2', 'enkel', {
diff --git a/src/components/GrunnlagForbehold/GrunnlagForbehold.tsx b/src/components/GrunnlagForbehold/GrunnlagForbehold.tsx
index cbba2ef55..bd39061f3 100644
--- a/src/components/GrunnlagForbehold/GrunnlagForbehold.tsx
+++ b/src/components/GrunnlagForbehold/GrunnlagForbehold.tsx
@@ -1,5 +1,5 @@
import { FormattedMessage, useIntl } from 'react-intl'
-import { Link as ReactRouterLink } from 'react-router-dom'
+import { Link as ReactRouterLink } from 'react-router'
import { ExternalLinkIcon } from '@navikt/aksel-icons'
import { BodyLong, Heading, HeadingProps, Link } from '@navikt/ds-react'
diff --git a/src/components/GrunnlagForbehold/__tests__/__snapshots__/GrunnlagForbehold.test.tsx.snap b/src/components/GrunnlagForbehold/__tests__/__snapshots__/GrunnlagForbehold.test.tsx.snap
index 0262a3fe7..506d54e09 100644
--- a/src/components/GrunnlagForbehold/__tests__/__snapshots__/GrunnlagForbehold.test.tsx.snap
+++ b/src/components/GrunnlagForbehold/__tests__/__snapshots__/GrunnlagForbehold.test.tsx.snap
@@ -16,6 +16,7 @@ exports[`GrunnlagForbehold > rendrer riktig 1`] = `
grunnlag.forbehold.ingress_1
diff --git a/src/components/LightBlueFooter/LightBlueFooter.tsx b/src/components/LightBlueFooter/LightBlueFooter.tsx
index 066b14c45..7f27d416e 100644
--- a/src/components/LightBlueFooter/LightBlueFooter.tsx
+++ b/src/components/LightBlueFooter/LightBlueFooter.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { Button, Modal } from '@navikt/ds-react'
diff --git a/src/components/LightBlueFooter/__tests__/LightBlueFooter.test.tsx b/src/components/LightBlueFooter/__tests__/LightBlueFooter.test.tsx
index d47ae5619..ea2d784f1 100644
--- a/src/components/LightBlueFooter/__tests__/LightBlueFooter.test.tsx
+++ b/src/components/LightBlueFooter/__tests__/LightBlueFooter.test.tsx
@@ -1,5 +1,3 @@
-import * as ReactRouterUtils from 'react-router'
-
import { describe, it, vi } from 'vitest'
import { LightBlueFooter } from '..'
@@ -7,6 +5,15 @@ import { paths } from '@/router/constants'
import { userInputInitialState } from '@/state/userInput/userInputReducer'
import { render, screen, userEvent } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('LightBlueFooter', () => {
it('rendrer med riktig tekst og knapper', () => {
const { asFragment } = render()
@@ -17,10 +24,6 @@ describe('LightBlueFooter', () => {
describe('Gitt at brukeren klikker på knappen, åpnes det modalen og brukeren kan avbryte eller gå tilbake til start ved bekreftelse', async () => {
it('Når brukeren bekrefter, nullstiller input fra brukeren og redirigerer til første steg av stegvisning', async () => {
const user = userEvent.setup()
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const { store } = render(, {
preloadedState: {
diff --git a/src/components/Pensjonsavtaler/Pensjonsavtaler.tsx b/src/components/Pensjonsavtaler/Pensjonsavtaler.tsx
index 3cdd1e656..24498dca1 100644
--- a/src/components/Pensjonsavtaler/Pensjonsavtaler.tsx
+++ b/src/components/Pensjonsavtaler/Pensjonsavtaler.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import {
ExclamationmarkTriangleFillIcon,
diff --git a/src/components/Pensjonsavtaler/__tests__/Pensjonsavtaler.test.tsx b/src/components/Pensjonsavtaler/__tests__/Pensjonsavtaler.test.tsx
index e721a8bce..6b6dd66ad 100644
--- a/src/components/Pensjonsavtaler/__tests__/Pensjonsavtaler.test.tsx
+++ b/src/components/Pensjonsavtaler/__tests__/Pensjonsavtaler.test.tsx
@@ -1,5 +1,3 @@
-import * as ReactRouterUtils from 'react-router'
-
import { describe, it, vi } from 'vitest'
import { Pensjonsavtaler } from '../Pensjonsavtaler'
@@ -13,6 +11,15 @@ import {
} from '@/state/userInput/userInputReducer'
import { render, screen, userEvent } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('Pensjonsavtaler', () => {
const currentSimulation: Simulation = {
utenlandsperioder: [],
@@ -32,10 +39,6 @@ describe('Pensjonsavtaler', () => {
describe('Gitt at brukeren ikke har samtykket', () => {
it('viser riktig header og melding med lenke tilbake til start, og skjuler ingress, tabell og info om offentlig tjenestepensjon', async () => {
const user = userEvent.setup()
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const { store } = render(, {
preloadedState: {
diff --git a/src/components/SavnerDuNoe/SavnerDuNoe.tsx b/src/components/SavnerDuNoe/SavnerDuNoe.tsx
index f7a799a11..0f210995d 100644
--- a/src/components/SavnerDuNoe/SavnerDuNoe.tsx
+++ b/src/components/SavnerDuNoe/SavnerDuNoe.tsx
@@ -1,5 +1,5 @@
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { Button } from '@navikt/ds-react'
import { BodyLong, Heading, HeadingProps } from '@navikt/ds-react'
diff --git a/src/components/SavnerDuNoe/__tests__/SavnerDuNoe.test.tsx b/src/components/SavnerDuNoe/__tests__/SavnerDuNoe.test.tsx
index b63d01820..ad510012c 100644
--- a/src/components/SavnerDuNoe/__tests__/SavnerDuNoe.test.tsx
+++ b/src/components/SavnerDuNoe/__tests__/SavnerDuNoe.test.tsx
@@ -1,5 +1,3 @@
-import * as ReactRouterUtils from 'react-router'
-
import { describe, it, vi } from 'vitest'
import { SavnerDuNoe } from '..'
@@ -7,6 +5,15 @@ import { paths } from '@/router/constants'
import { userInputInitialState } from '@/state/userInput/userInputReducer'
import { render, screen, userEvent } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('SavnerDuNoe', () => {
describe('Gitt at brukeren ikke har noe vedtak om alderspensjon', () => {
it('Når showAvansert er true, rendrer med riktig tekst og knapper', () => {
@@ -39,10 +46,7 @@ describe('SavnerDuNoe', () => {
it('nullstiller input fra brukeren og redirigerer til avansert beregning når brukeren klikker på knappen', async () => {
const user = userEvent.setup()
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
+
const { store } = render(
,
{
diff --git a/src/components/TidligstMuligUttaksalder/TidligstMuligUttaksalder.tsx b/src/components/TidligstMuligUttaksalder/TidligstMuligUttaksalder.tsx
index d26b9b67a..487ed87b7 100644
--- a/src/components/TidligstMuligUttaksalder/TidligstMuligUttaksalder.tsx
+++ b/src/components/TidligstMuligUttaksalder/TidligstMuligUttaksalder.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { Alert, BodyLong, Link } from '@navikt/ds-react'
diff --git a/src/components/TidligstMuligUttaksalder/__tests__/TidligstMuligUttaksalder.test.tsx b/src/components/TidligstMuligUttaksalder/__tests__/TidligstMuligUttaksalder.test.tsx
index 588a76997..3a8b0d8c9 100644
--- a/src/components/TidligstMuligUttaksalder/__tests__/TidligstMuligUttaksalder.test.tsx
+++ b/src/components/TidligstMuligUttaksalder/__tests__/TidligstMuligUttaksalder.test.tsx
@@ -1,5 +1,3 @@
-import * as ReactRouterUtils from 'react-router'
-
import { describe, it } from 'vitest'
import { TidligstMuligUttaksalder } from '..'
@@ -9,6 +7,15 @@ import * as userInputReducerUtils from '@/state/userInput/userInputReducer'
import { render, screen, waitFor, userEvent } from '@/test-utils'
import { loggerTeardown } from '@/utils/__tests__/logging-stub'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('TidligstMuligUttaksalder', () => {
afterEach(() => {
loggerTeardown()
@@ -257,10 +264,6 @@ describe('TidligstMuligUttaksalder', () => {
userInputReducerUtils.userInputActions,
'flushCurrentSimulationUtenomUtenlandsperioder'
)
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const user = userEvent.setup()
render(
diff --git a/src/components/common/PageFramework/PageFramework.tsx b/src/components/common/PageFramework/PageFramework.tsx
index 58a6b43a1..c87bc26d4 100644
--- a/src/components/common/PageFramework/PageFramework.tsx
+++ b/src/components/common/PageFramework/PageFramework.tsx
@@ -1,11 +1,12 @@
import React from 'react'
import { useIntl } from 'react-intl'
-import { useLocation, Await } from 'react-router-dom'
+import { useLoaderData, useLocation } from 'react-router'
+import { Await } from 'react-router'
import { Loader } from '@/components/common/Loader'
import { HOST_BASEURL } from '@/paths'
import { LoginContext } from '@/router/loaders'
-import { useDeferAuthenticationAccessData } from '@/router/loaders'
+import { AuthenticationGuardLoader } from '@/router/loaders'
import { CheckLoginOnFocus } from './CheckLoginOnFocus'
import { FrameComponent } from './FrameComponent'
@@ -46,44 +47,64 @@ export const PageFramework: React.FC<{
const { shouldRedirectNonAuthenticated = true, children, ...rest } = props
const intl = useIntl()
const { pathname } = useLocation()
- const loaderData = useDeferAuthenticationAccessData()
+
+ const { authResponse } = useLoaderData() as AuthenticationGuardLoader
React.useEffect(() => {
window.scrollTo(0, 0)
}, [pathname])
return (
- <>
-
+
+ }
+ >
+ {/* Når det oppstår er en feil ved fetch: Hvis det er påkrevd å være
+ pålogget rediriger til login, hvis ikke "fails silently" og vis siden som
+ vanlig og sett isLoggedIn til false */}
+
+ ) : (
+
+ {children &&
+ React.cloneElement(children, {
+ context: {
+ isLoggedIn: false,
+ } satisfies LoginContext,
+ })}
+
+ )
}
>
-
- {(oauth2Query: Response) => {
- return shouldRedirectNonAuthenticated && !oauth2Query.ok ? (
-
- ) : (
-
-
- {children &&
- React.cloneElement(children, {
- context: {
- isLoggedIn: oauth2Query.ok,
- } satisfies LoginContext,
- })}
-
-
- )
- }}
-
-
- >
+ {(resp: Response) => {
+ return shouldRedirectNonAuthenticated && !resp.ok ? (
+
+ ) : (
+
+
+ {children &&
+ React.cloneElement(children, {
+ context: {
+ isLoggedIn: resp.ok,
+ } satisfies LoginContext,
+ })}
+
+
+ )
+ }}
+
+
)
}
+
+export default PageFramework
diff --git a/src/components/common/PageFramework/__tests__/PageFramework.test.tsx b/src/components/common/PageFramework/__tests__/PageFramework.test.tsx
index 8c9d1bc4f..f1d418321 100644
--- a/src/components/common/PageFramework/__tests__/PageFramework.test.tsx
+++ b/src/components/common/PageFramework/__tests__/PageFramework.test.tsx
@@ -1,8 +1,8 @@
-import { Link } from 'react-router-dom'
+import { Link } from 'react-router'
import { describe, it, vi } from 'vitest'
-import { PageFramework } from '..'
+import { PageFramework } from '../PageFramework'
import { mockErrorResponse } from '@/mocks/server'
import { HOST_BASEURL } from '@/paths'
import { render, screen, userEvent, waitFor } from '@/test-utils'
diff --git a/src/components/stegvisning/AFP/AFP.tsx b/src/components/stegvisning/AFP/AFP.tsx
index a3a8c9e19..d697dbc00 100644
--- a/src/components/stegvisning/AFP/AFP.tsx
+++ b/src/components/stegvisning/AFP/AFP.tsx
@@ -1,7 +1,7 @@
import { FormEvent } from 'react'
import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import {
Alert,
diff --git a/src/components/stegvisning/AFP/__tests__/AFP.test.tsx b/src/components/stegvisning/AFP/__tests__/AFP.test.tsx
index fc42059d3..42cda78c4 100644
--- a/src/components/stegvisning/AFP/__tests__/AFP.test.tsx
+++ b/src/components/stegvisning/AFP/__tests__/AFP.test.tsx
@@ -1,20 +1,23 @@
-import * as ReactRouterUtils from 'react-router'
-
import { describe, it, vi } from 'vitest'
import { AFP } from '..'
import { screen, render, waitFor, userEvent } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('stegvisning - AFP', () => {
const onCancelMock = vi.fn()
const onPreviousMock = vi.fn()
const onNextMock = vi.fn()
it('kaller navigate når shouldRedirectTo er angitt', async () => {
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const randomPath = '/random-path'
render(
diff --git a/src/components/stegvisning/Sivilstand/Sivilstand.tsx b/src/components/stegvisning/Sivilstand/Sivilstand.tsx
index 0d00dfe94..08822ae3c 100644
--- a/src/components/stegvisning/Sivilstand/Sivilstand.tsx
+++ b/src/components/stegvisning/Sivilstand/Sivilstand.tsx
@@ -1,7 +1,7 @@
import React from 'react'
import { FormEvent, useMemo, useState } from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { BodyLong, Button, Heading, Radio, RadioGroup } from '@navikt/ds-react'
diff --git a/src/components/stegvisning/Sivilstand/__tests__/Sivilstand.test.tsx b/src/components/stegvisning/Sivilstand/__tests__/Sivilstand.test.tsx
index 96f543478..19b7c8a2b 100644
--- a/src/components/stegvisning/Sivilstand/__tests__/Sivilstand.test.tsx
+++ b/src/components/stegvisning/Sivilstand/__tests__/Sivilstand.test.tsx
@@ -1,11 +1,18 @@
-import * as ReactRouterUtils from 'react-router'
-
import { describe, it, vi } from 'vitest'
import { Sivilstand } from '..'
import { RootState } from '@/state/store'
import { screen, render, waitFor, userEvent } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('stegvisning - Sivilstand', () => {
const onCancelMock = vi.fn()
const onPreviousMock = vi.fn()
@@ -36,10 +43,6 @@ describe('stegvisning - Sivilstand', () => {
})
it('kaller navigate når shouldRedirectTo er angitt', async () => {
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const randomPath = '/random-path'
render(
diff --git a/src/components/stegvisning/Start/Start.tsx b/src/components/stegvisning/Start/Start.tsx
index c52ae9aa1..476e615d1 100644
--- a/src/components/stegvisning/Start/Start.tsx
+++ b/src/components/stegvisning/Start/Start.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { useIntl, FormattedMessage } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { ExternalLinkIcon } from '@navikt/aksel-icons'
import { BodyLong, Button, Heading, Link } from '@navikt/ds-react'
@@ -9,7 +9,6 @@ import FridaPortrett from '../../../assets/frida.svg'
import { Card } from '@/components/common/Card'
import { InfoOmFremtidigVedtak } from '@/components/InfoOmFremtidigVedtak'
import { externalUrls } from '@/router/constants'
-
import { isLoependeVedtakEndring } from '@/utils/loependeVedtak'
import { logOpenLink, wrapLogger } from '@/utils/logging'
import { getFormatMessageValues } from '@/utils/translations'
diff --git a/src/components/stegvisning/Start/__tests__/Start.test.tsx b/src/components/stegvisning/Start/__tests__/Start.test.tsx
index fda996f14..d8f95274a 100644
--- a/src/components/stegvisning/Start/__tests__/Start.test.tsx
+++ b/src/components/stegvisning/Start/__tests__/Start.test.tsx
@@ -1,10 +1,17 @@
-import * as ReactRouterUtils from 'react-router'
-
import { describe, it, vi } from 'vitest'
import { Start } from '..'
import { render, screen, waitFor, userEvent } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('stegvisning - Start', () => {
const onCancelMock = vi.fn()
const onNextMock = vi.fn()
@@ -17,10 +24,6 @@ describe('stegvisning - Start', () => {
}
it('kaller navigate når shouldRedirectTo er angitt', async () => {
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const randomPath = '/random-path'
render(
diff --git a/src/components/stegvisning/__tests__/stegvisning-hooks.test.tsx b/src/components/stegvisning/__tests__/stegvisning-hooks.test.tsx
index ba8649883..4722d61b6 100644
--- a/src/components/stegvisning/__tests__/stegvisning-hooks.test.tsx
+++ b/src/components/stegvisning/__tests__/stegvisning-hooks.test.tsx
@@ -1,5 +1,4 @@
import { Provider } from 'react-redux'
-import * as ReactRouterUtils from 'react-router'
import { RootState, setupStore } from '../../../state/store'
import { useStegvisningNavigation } from '../stegvisning-hooks'
@@ -12,6 +11,15 @@ import { userInputInitialState } from '@/state/userInput/userInputReducer'
import * as userInputReducerUtils from '@/state/userInput/userInputReducer'
import { renderHook } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('stegvisning - hooks', () => {
describe('useStegvisningNavigation', () => {
describe('Gitt at brukeren ikke har noe vedtak om alderspensjon eller AFP', () => {
@@ -20,10 +28,6 @@ describe('stegvisning - hooks', () => {
userInputReducerUtils.userInputActions,
'flush'
)
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const mockedState = {
api: {
@@ -68,10 +72,6 @@ describe('stegvisning - hooks', () => {
userInputReducerUtils.userInputActions,
'flush'
)
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const mockedState = {
api: {
diff --git a/src/components/stegvisning/stegvisning-hooks.tsx b/src/components/stegvisning/stegvisning-hooks.tsx
index 6265a7048..e75bcd23a 100644
--- a/src/components/stegvisning/stegvisning-hooks.tsx
+++ b/src/components/stegvisning/stegvisning-hooks.tsx
@@ -1,5 +1,5 @@
import React from 'react'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import {
paths,
diff --git a/src/main.tsx b/src/main.tsx
index 0e00e90eb..959337122 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { Provider } from 'react-redux'
-import { createBrowserRouter, RouterProvider } from 'react-router-dom'
+import { createBrowserRouter, RouterProvider } from 'react-router'
import ReactDOM from 'react-dom/client'
@@ -33,6 +33,10 @@ if (process.env.NODE_ENV === 'development') {
const router = createBrowserRouter(routes, {
basename: BASE_PATH,
+ future: {
+ v7_fetcherPersist: true,
+ v7_normalizeFormMethod: true,
+ },
})
initializeLogs()
diff --git a/src/mocks/handlers.ts b/src/mocks/handlers.ts
index f02e9ef11..f2e3097a9 100644
--- a/src/mocks/handlers.ts
+++ b/src/mocks/handlers.ts
@@ -20,7 +20,10 @@ const TEST_DELAY = process.env.NODE_ENV === 'test' ? 0 : 30
export const getHandlers = (baseUrl: string = API_PATH) => [
http.get(`${HOST_BASEURL}/oauth2/session`, async () => {
await delay(1500)
- return HttpResponse.json({ data: 'OK' })
+ return HttpResponse.json({
+ session: { active: true, created_at: 'lorem', ends_in_seconds: 21592 },
+ tokens: { expire_at: 'lorem', expire_in_seconds: 3592 },
+ })
}),
http.get(`${baseUrl}/inntekt`, async () => {
diff --git a/src/mocks/mockedRTKQueryApiCalls.ts b/src/mocks/mockedRTKQueryApiCalls.ts
index 8f89290a9..efdf6071f 100644
--- a/src/mocks/mockedRTKQueryApiCalls.ts
+++ b/src/mocks/mockedRTKQueryApiCalls.ts
@@ -418,3 +418,16 @@ export const rejectedGetOmstillingsstoenadOgGjenlevende = {
},
},
}
+
+export const rejectedGetLoependeVedtak = {
+ ['getLoependeVedtak(undefined)']: {
+ status: 'rejected',
+ endpointName: 'getLoependeVedtak',
+ requestId: 'aVfT2Ly4YtGoIOvDdZfmG',
+ startedTimeStamp: 1714725265404,
+ error: {
+ status: 'FETCH_ERROR',
+ error: 'TypeError: Failed to fetch',
+ },
+ },
+}
diff --git a/src/pages/Beregning/Beregning.tsx b/src/pages/Beregning/Beregning.tsx
index 8e2263f15..8c2a6f767 100644
--- a/src/pages/Beregning/Beregning.tsx
+++ b/src/pages/Beregning/Beregning.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { Button, Modal, ToggleGroup } from '@navikt/ds-react'
diff --git a/src/pages/Beregning/BeregningAvansert.tsx b/src/pages/Beregning/BeregningAvansert.tsx
index 768a01504..5c318edba 100644
--- a/src/pages/Beregning/BeregningAvansert.tsx
+++ b/src/pages/Beregning/BeregningAvansert.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { FormattedMessage } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { PencilIcon } from '@navikt/aksel-icons'
import { Button, Heading } from '@navikt/ds-react'
diff --git a/src/pages/Beregning/BeregningEnkel.tsx b/src/pages/Beregning/BeregningEnkel.tsx
index 3c7550756..3978b7efb 100644
--- a/src/pages/Beregning/BeregningEnkel.tsx
+++ b/src/pages/Beregning/BeregningEnkel.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
import { Alert, Heading } from '@navikt/ds-react'
import { FetchBaseQueryError } from '@reduxjs/toolkit/query'
diff --git a/src/pages/Beregning/__tests__/Beregning.test.tsx b/src/pages/Beregning/__tests__/Beregning.test.tsx
index c215bfadb..9b0edcece 100644
--- a/src/pages/Beregning/__tests__/Beregning.test.tsx
+++ b/src/pages/Beregning/__tests__/Beregning.test.tsx
@@ -1,5 +1,3 @@
-import * as ReactRouterUtils from 'react-router'
-
import { describe, expect, it, vi } from 'vitest'
import { Beregning } from '../Beregning'
@@ -18,6 +16,15 @@ import * as userInputReducerUtils from '@/state/userInput/userInputReducer'
import { fireEvent, render, screen, userEvent, waitFor } from '@/test-utils'
const previousWindow = window
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('Beregning', () => {
const preloadedQueries = {
api: {
@@ -182,10 +189,6 @@ describe('Beregning', () => {
})
it('når brukeren begynner å fylle ut skjema på Avansert og bytter fane, gir Modalen muligheten til å avbryte eller avslutte beregningen', async () => {
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const user = userEvent.setup()
const flushCurrentSimulationMock = vi.spyOn(
userInputReducerUtils.userInputActions,
@@ -509,10 +512,6 @@ describe('Beregning', () => {
})
it('når brukeren med vedtak om alderspensjon er på resultatside etter en Avansert simulering og trykker på tilbakeknappen, vises Avbryt-Modalen og brukeren sendes til /start ved bekreftelse', async () => {
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const user = userEvent.setup()
const flushCurrentSimulationMock = vi.spyOn(
userInputReducerUtils.userInputActions,
diff --git a/src/pages/Beregning/__tests__/BeregningAvansert.test.tsx b/src/pages/Beregning/__tests__/BeregningAvansert.test.tsx
index 15461e6d5..de24f9d8a 100644
--- a/src/pages/Beregning/__tests__/BeregningAvansert.test.tsx
+++ b/src/pages/Beregning/__tests__/BeregningAvansert.test.tsx
@@ -1,5 +1,4 @@
-import * as ReactRouterUtils from 'react-router'
-import { createMemoryRouter, RouterProvider } from 'react-router-dom'
+import { createMemoryRouter, RouterProvider } from 'react-router'
import { describe, expect, it, vi } from 'vitest'
@@ -27,6 +26,15 @@ import { UserInputState } from '@/state/userInput/userInputReducer'
import { fireEvent, render, screen, userEvent, waitFor } from '@/test-utils'
import * as loggerUtils from '@/utils/logging'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('BeregningAvansert', () => {
const contextMockedValues = {
avansertSkjemaModus: 'resultat' as AvansertBeregningModus,
@@ -645,11 +653,6 @@ describe('BeregningAvansert', () => {
})
it('Når simulering svarer med errorcode 503, vises ErrorPageUnexpected ', async () => {
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
-
// Må bruke mockResponse for å få riktig status (mockErrorResponse returnerer "originalStatus")
mockResponse('/v7/alderspensjon/simulering', {
status: 503,
diff --git a/src/pages/Beregning/__tests__/BeregningEnkel.test.tsx b/src/pages/Beregning/__tests__/BeregningEnkel.test.tsx
index 227dc7b34..e38dc552f 100644
--- a/src/pages/Beregning/__tests__/BeregningEnkel.test.tsx
+++ b/src/pages/Beregning/__tests__/BeregningEnkel.test.tsx
@@ -1,5 +1,4 @@
-import * as ReactRouterUtils from 'react-router'
-import { createMemoryRouter, RouterProvider } from 'react-router-dom'
+import { createMemoryRouter, RouterProvider } from 'react-router'
import { describe, expect, it, vi } from 'vitest'
@@ -21,6 +20,15 @@ import * as apiSliceUtils from '@/state/api/apiSlice'
import { userInputInitialState } from '@/state/userInput/userInputReducer'
import { render, screen, userEvent, waitFor } from '@/test-utils'
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('BeregningEnkel', () => {
describe('Gitt at en bruker ikke mottar uføretrygd', () => {
it('kalles endepunktet for tidligst mulig uttaksalder med riktig request body', async () => {
@@ -735,11 +743,6 @@ describe('BeregningEnkel', () => {
})
it('viser ErrorPageUnexpected når simulering svarer med errorcode 503', async () => {
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
-
const user = userEvent.setup()
// Må bruke mockResponse for å få riktig status (mockErrorResponse returnerer "originalStatus")
mockResponse('/v7/alderspensjon/simulering', {
diff --git a/src/pages/Henvisning/Henvisning.tsx b/src/pages/Henvisning/Henvisning.tsx
index a105eae4d..2cdf337df 100644
--- a/src/pages/Henvisning/Henvisning.tsx
+++ b/src/pages/Henvisning/Henvisning.tsx
@@ -1,6 +1,7 @@
import React from 'react'
import { useIntl } from 'react-intl'
-import { useNavigate, useParams } from 'react-router-dom'
+import { useParams } from 'react-router'
+import { useNavigate } from 'react-router'
import { Card } from '../../components/common/Card'
import { externalUrls, paths, henvisningUrlParams } from '@/router/constants'
diff --git a/src/pages/Henvisning/__tests__/Henvisning.test.tsx b/src/pages/Henvisning/__tests__/Henvisning.test.tsx
index c071350bf..7deab07ad 100644
--- a/src/pages/Henvisning/__tests__/Henvisning.test.tsx
+++ b/src/pages/Henvisning/__tests__/Henvisning.test.tsx
@@ -1,5 +1,4 @@
-import * as ReactRouterUtils from 'react-router'
-import { createMemoryRouter, RouterProvider } from 'react-router-dom'
+import { createMemoryRouter, RouterProvider } from 'react-router'
import { describe, it, vi } from 'vitest'
@@ -15,12 +14,14 @@ import * as userInputReducerUtils from '@/state/userInput/userInputReducer'
import { render, screen, userEvent } from '@/test-utils'
const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
describe('Henvisning ', async () => {
- beforeEach(() => {
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
- })
afterEach(() => {
navigateMock.mockReset()
})
diff --git a/src/pages/LandingPage/LandingPage.tsx b/src/pages/LandingPage/LandingPage.tsx
index ef746ff1f..01b39d96f 100644
--- a/src/pages/LandingPage/LandingPage.tsx
+++ b/src/pages/LandingPage/LandingPage.tsx
@@ -1,6 +1,11 @@
import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl'
-import { Await, useNavigate, useOutletContext } from 'react-router-dom'
+import {
+ Await,
+ useLoaderData,
+ useNavigate,
+ useOutletContext,
+} from 'react-router'
import { ExternalLinkIcon } from '@navikt/aksel-icons'
import {
@@ -14,7 +19,7 @@ import {
import { Loader } from '@/components/common/Loader'
import { externalUrls, paths } from '@/router/constants'
-import { LoginContext, useLandingPageAccessData } from '@/router/loaders'
+import { LoginContext, LandingPageAccessGuardLoader } from '@/router/loaders'
import { logOpenLink, wrapLogger } from '@/utils/logging'
import styles from './LandingPage.module.scss'
@@ -23,7 +28,7 @@ export const LandingPage = () => {
const intl = useIntl()
const { isLoggedIn } = useOutletContext()
- const loaderData = useLandingPageAccessData()
+ const { shouldRedirectTo } = useLoaderData() as LandingPageAccessGuardLoader
const navigate = useNavigate()
React.useEffect(() => {
@@ -60,16 +65,14 @@ export const LandingPage = () => {
id: 'landingsside.button.enkel_kalkulator_utlogget',
})
- const TopSection: React.FC<{ shouldRedirectTo?: string }> = ({
- shouldRedirectTo,
- }) => {
+ const TopSection: React.FC<{ navigateTo?: string }> = ({ navigateTo }) => {
React.useEffect(() => {
- if (shouldRedirectTo) {
- navigate(shouldRedirectTo)
+ if (navigateTo) {
+ navigate(navigateTo)
}
- }, [shouldRedirectTo])
+ }, [navigateTo])
- if (shouldRedirectTo) {
+ if (navigateTo) {
return null
}
@@ -177,14 +180,16 @@ export const LandingPage = () => {
/>
}
>
-
- {(shouldRedirectTo: string) => (
-
-
-
-
-
- )}
+
+ {(resp: string) => {
+ return (
+
+
+
+
+
+ )
+ }}
) : (
diff --git a/src/pages/LandingPage/__tests__/LandingPage.test.tsx b/src/pages/LandingPage/__tests__/LandingPage.test.tsx
index 190113dab..9ef0bd426 100644
--- a/src/pages/LandingPage/__tests__/LandingPage.test.tsx
+++ b/src/pages/LandingPage/__tests__/LandingPage.test.tsx
@@ -1,5 +1,4 @@
-import * as ReactRouterUtils from 'react-router'
-import { createMemoryRouter, RouterProvider } from 'react-router-dom'
+import { createMemoryRouter, RouterProvider } from 'react-router'
import { describe, it, vi } from 'vitest'
@@ -13,6 +12,15 @@ import { render, screen, userEvent, waitFor } from '@/test-utils'
const initialGetState = store.getState
+const navigateMock = vi.fn()
+vi.mock(import('react-router'), async (importOriginal) => {
+ const actual = await importOriginal()
+ return {
+ ...actual,
+ useNavigate: () => navigateMock,
+ }
+})
+
describe('LandingPage', () => {
afterEach(() => {
vi.clearAllMocks()
@@ -112,10 +120,6 @@ describe('LandingPage', () => {
})
const user = userEvent.setup()
- const navigateMock = vi.fn()
- vi.spyOn(ReactRouterUtils, 'useNavigate').mockImplementation(
- () => navigateMock
- )
const open = vi.fn()
vi.stubGlobal('open', open)
diff --git a/src/pages/LandingPage/__tests__/__snapshots__/LandingPage.test.tsx.snap b/src/pages/LandingPage/__tests__/__snapshots__/LandingPage.test.tsx.snap
index 40a915f6a..c28dc545c 100644
--- a/src/pages/LandingPage/__tests__/__snapshots__/LandingPage.test.tsx.snap
+++ b/src/pages/LandingPage/__tests__/__snapshots__/LandingPage.test.tsx.snap
@@ -111,7 +111,7 @@ exports[`LandingPage > rendrer innlogget side 1`] = `
>
landingsside.link.personopplysninger