Fjerner bruk av Popover fra ft-plattform-komponenter (#6953)

* Lager en v2-versjon av dekoratør (#6825) * Lager en v2-versjon av dekoratør * Trenger decodeHtmlEntity for å formatere feilmeldinger fra backend * TSFF-916 sorterer behandlinger med nyeste behandling øverst i listen.… (#6829) * TSFF-916 sorterer behandlinger med nyeste behandling øverst i listen. Er helt tilfeldig i dag * toSorted() i stedet for sort(), lager nytt array i stedet for å mutere * Prosess vilkar overstyring v2 (#6756) * Laget v2-versjon av prosess-vilkar-overstyring * Bort med react-intl Fikset tester og stories * Fiks av tester * Bruker v2-panel for ungdomsytelse * Sender ned vilkårstype slik at avslagsårsaker kan mappes * Retter feil i tester * Flyttet tester inn i stories * Retter overskrift * Fiks imports * fiks css * Legger til eksplisitt type istadenfor any. * Bruker structuredClone fremfor JSON.stringify Lager en delt komponent for OverstyrBekreftKnappPanel * Tar bort duplisert kode * Tar bort ubrukt kode --------- Co-authored-by: Jostein Stuhaug <[email protected]> * Bump @navikt/k9-sak-typescript-client (#6787) Bumps [@navikt/k9-sak-typescript-client](https://github.com/navikt/k9-sak) from 1.0.20241028110915 to 1.0.20241105125420. - [Commits](https://github.com/navikt/k9-sak/commits) --- updated-dependencies: - dependency-name: "@navikt/k9-sak-typescript-client" dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Bruke Json.stringify for cloning av objekter inntil videre (#6837) * Vise 0% fravær om faktisk og normal arbeidstid er 0 (#6849) * Bump the patch-and-minor group across 1 directory with 7 updates (#6848) Bumps the patch-and-minor group with 7 updates in the / directory: | Package | From | To | | --- | --- | --- | | [@sentry/browser](https://github.com/getsentry/sentry-javascript) | `8.38.0` | `8.39.0` | | [@sentry/react](https://github.com/getsentry/sentry-javascript) | `8.38.0` | `8.39.0` | | [@playwright/test](https://github.com/microsoft/playwright) | `1.48.2` | `1.49.0` | | [eslint](https://github.com/eslint/eslint) | `9.14.0` | `9.15.0` | | [husky](https://github.com/typicode/husky) | `9.1.6` | `9.1.7` | | [msw](https://github.com/mswjs/msw) | `2.6.4` | `2.6.5` | | [@tanstack/react-query](https://github.com/TanStack/query/tree/HEAD/packages/react-query) | `5.60.2` | `5.61.0` | Updates `@sentry/browser` from 8.38.0 to 8.39.0 - [Release notes](https://github.com/getsentry/sentry-javascript/releases) - [Changelog](https://github.com/getsentry/sentry-javascript/blob/develop/CHANGELOG.md) - [Commits](getsentry/sentry-javascript@8.38.0...8.39.0) Updates `@sentry/react` from 8.38.0 to 8.39.0 - [Release notes](https://github.com/getsentry/sentry-javascript/releases) - [Changelog](https://github.com/getsentry/sentry-javascript/blob/develop/CHANGELOG.md) - [Commits](getsentry/sentry-javascript@8.38.0...8.39.0) Updates `@playwright/test` from 1.48.2 to 1.49.0 - [Release notes](https://github.com/microsoft/playwright/releases) - [Commits](microsoft/playwright@v1.48.2...v1.49.0) Updates `eslint` from 9.14.0 to 9.15.0 - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md) - [Commits](eslint/eslint@v9.14.0...v9.15.0) Updates `husky` from 9.1.6 to 9.1.7 - [Release notes](https://github.com/typicode/husky/releases) - [Commits](typicode/husky@v9.1.6...v9.1.7) Updates `msw` from 2.6.4 to 2.6.5 - [Release notes](https://github.com/mswjs/msw/releases) - [Changelog](https://github.com/mswjs/msw/blob/main/CHANGELOG.md) - [Commits](mswjs/msw@v2.6.4...v2.6.5) Updates `@tanstack/react-query` from 5.60.2 to 5.61.0 - [Release notes](https://github.com/TanStack/query/releases) - [Commits](https://github.com/TanStack/query/commits/v5.61.0/packages/react-query) --- updated-dependencies: - dependency-name: "@sentry/browser" dependency-type: direct:production update-type: version-update:semver-minor dependency-group: patch-and-minor - dependency-name: "@sentry/react" dependency-type: direct:production update-type: version-update:semver-minor dependency-group: patch-and-minor - dependency-name: "@playwright/test" dependency-type: direct:development update-type: version-update:semver-minor dependency-group: patch-and-minor - dependency-name: eslint dependency-type: direct:development update-type: version-update:semver-minor dependency-group: patch-and-minor - dependency-name: husky dependency-type: direct:development update-type: version-update:semver-patch dependency-group: patch-and-minor - dependency-name: msw dependency-type: direct:development update-type: version-update:semver-patch dependency-group: patch-and-minor - dependency-name: "@tanstack/react-query" dependency-type: direct:production update-type: version-update:semver-minor dependency-group: patch-and-minor ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Prøver å gi hjelpefunksjon et mer logisk navn (#6851) Vi bruker ikke microfrontends mer * Tar bort decodeHtmlEntity-funksjon igjen * Fjerner kode relatert til risikoklassifisering (#6855) Dersom det skal håndterers i fremtiden anbefales det å se på Foreldrepengers løsning * Bruker aksel-deler for dekoratør fremfor hjemmesnekret Sletter gammel dekoratør * Revert "Merge branch 'master' into v2-dekoratør" This reverts commit 80e4215, reversing changes made to 9ea6d16. * Fiks yarn.lock * fiks --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Vebjørn Nordby <[email protected]> Co-authored-by: Jostein Stuhaug <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Thomas H. Wiberg <[email protected]> * Viser grønn dekoratør for ung i Q også (#6863) * Legger inn ytelse og lenke i dekoratør * Fjerner bruk av Popover fra ft-plattform-komponenter Bruker aksel-komponenter * Bumper ft-plattform-komponenter Blir helt kvitt react-popper * fiks test * fiks test --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Vebjørn Nordby <[email protected]> Co-authored-by: Jostein Stuhaug <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Thomas H. Wiberg <[email protected]>
navikt · Jan 6, 2025 · 21b0443 · 21b0443
1 parent 3a823a9
commit 21b0443
Show file tree

Hide file tree

Showing 23 changed files with 80 additions and 159 deletions.
diff --git a/package.json b/package.json
@@ -48,7 +48,7 @@
     "@navikt/ds-react": "7.6.0",
     "@navikt/ds-tailwind": "^7.6.0",
     "@navikt/familie-endringslogg": "13.1.4",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "@popperjs/core": "2.11.8",
     "@sentry/browser": "8.46.0",
     "@sentry/react": "^8.46.0",
@@ -105,7 +105,6 @@
     "msw-storybook-addon": "^2.0.4",
     "postcss": "^8.4.49",
     "prettier": "3.4.2",
-    "react-popper": "2.3.0",
     "storybook": "^8.4.7",
     "stylelint": "16.12.0",
     "stylelint-config-standard": "^36.0.1",

diff --git a/packages/behandling-felles/package.json b/packages/behandling-felles/package.json
@@ -15,7 +15,7 @@
     "@k9-sak-web/modal-sett-pa-vent": "1.0.0",
     "@k9-sak-web/rest-api-hooks": "1.0.0",
     "@k9-sak-web/types": "1.0.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "classnames": "2.5.1",
     "react": "18.3.1",
     "react-intl": "7.0.1",

diff --git a/packages/fakta-etablert-tilsyn/package.json b/packages/fakta-etablert-tilsyn/package.json
@@ -17,16 +17,15 @@
     "@navikt/ds-css": "7.6.0",
     "@navikt/ds-icons": "3.4.3",
     "@navikt/ds-react": "7.6.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "@popperjs/core": "2.11.8",
     "classnames": "2.5.1",
     "dayjs": "1.11.13",
     "lodash": "4.17.21",
     "react": "18.3.1",
     "react-collapse": "5.1.1",
     "react-dom": "18.3.1",
-    "react-hook-form": "7.53.2",
-    "react-popper": "2.3.0"
+    "react-hook-form": "7.53.2"
   },
   "msw": {
     "workerDirectory": "public"

diff --git a/packages/fakta-inntektsmelding/package.json b/packages/fakta-inntektsmelding/package.json
@@ -19,15 +19,14 @@
     "@navikt/ds-icons": "3.4.3",
     "@navikt/ds-react": "7.6.0",
     "@navikt/ft-form-hooks": "5.2.9",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "@popperjs/core": "2.11.8",
     "classnames": "2.5.1",
     "dayjs": "1.11.13",
     "react": "18.3.1",
     "react-collapse": "5.1.1",
     "react-dom": "18.3.1",
-    "react-hook-form": "7.53.2",
-    "react-popper": "2.3.0"
+    "react-hook-form": "7.53.2"
   },
   "msw": {
     "workerDirectory": "public"

diff --git a/packages/fakta-institusjon/package.json b/packages/fakta-institusjon/package.json
@@ -7,7 +7,7 @@
   "dependencies": {
     "@fpsak-frontend/form": "*",
     "@k9-sak-web/types": "*",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "formik": "2.4.6"
   }
 }
diff --git a/packages/fakta-medisinsk-vilkår/package.json b/packages/fakta-medisinsk-vilkår/package.json
@@ -21,7 +21,7 @@
     "@navikt/ds-css": "7.6.0",
     "@navikt/ds-icons": "3.4.3",
     "@navikt/ds-react": "7.6.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "@popperjs/core": "2.11.8",
     "@tanstack/react-query": "^5.62.8",
     "axios": "1.7.9",
@@ -31,8 +31,7 @@
     "react-collapse": "5.1.1",
     "react-dom": "18.3.1",
     "react-hook-form": "7.53.2",
-    "react-outside-click-handler": "1.3.0",
-    "react-popper": "2.3.0"
+    "react-outside-click-handler": "1.3.0"
   },
   "msw": {
     "workerDirectory": "public"

diff --git a/packages/fakta-medlemskap/package.json b/packages/fakta-medlemskap/package.json
@@ -12,7 +12,7 @@
     "@fpsak-frontend/shared-components": "1.0.0",
     "@fpsak-frontend/utils": "1.0.0",
     "@navikt/ft-form-hooks": "5.2.9",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "i18n-iso-countries": "7.13.0",
     "moment": "2.30.1",
     "prop-types": "15.8.1",

diff --git a/packages/fakta-om-barnet/package.json b/packages/fakta-om-barnet/package.json
@@ -16,15 +16,14 @@
   },
   "dependencies": {
     "@navikt/ds-react": "7.6.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "@popperjs/core": "2.11.8",
     "classnames": "2.5.1",
     "dayjs": "1.11.13",
     "react": "18.3.1",
     "react-collapse": "5.1.1",
     "react-dom": "18.3.1",
     "react-hook-form": "7.53.2",
-    "react-popper": "2.3.0",
     "tailwindcss": "^3.4.17"
   },
   "msw": {

diff --git a/packages/fakta-omsorgen-for/package.json b/packages/fakta-omsorgen-for/package.json
@@ -19,7 +19,7 @@
     "@navikt/ds-icons": "3.4.3",
     "@navikt/ds-react": "7.6.0",
     "@navikt/fnrvalidator": "2.1.5",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "@popperjs/core": "2.11.8",
     "classnames": "2.5.1",
     "dayjs": "1.11.13",
@@ -28,8 +28,7 @@
     "react-collapse": "5.1.1",
     "react-dom": "18.3.1",
     "react-hook-form": "7.53.2",
-    "react-intl": "7.0.1",
-    "react-popper": "2.3.0"
+    "react-intl": "7.0.1"
   },
   "msw": {
     "workerDirectory": "public"

diff --git a/packages/fakta-opplaering/package.json b/packages/fakta-opplaering/package.json
@@ -10,7 +10,7 @@
     "@k9-sak-web/types": "*",
     "@navikt/ds-icons": "3.4.3",
     "@navikt/ds-react": "7.6.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "classnames": "2.5.1",
     "dayjs": "1.11.13",
     "formik": "2.4.6",

diff --git a/packages/form/package.json b/packages/form/package.json
@@ -8,7 +8,7 @@
   "dependencies": {
     "@fpsak-frontend/shared-components": "1.0.0",
     "@fpsak-frontend/utils": "1.0.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "classnames": "2.5.1",
     "formik": "2.4.6",
     "moment": "2.30.1",

diff --git a/packages/prosess-uttak/package.json b/packages/prosess-uttak/package.json
@@ -19,15 +19,14 @@
     "@navikt/ds-react": "7.6.0",
     "@navikt/ft-form-hooks": "5.2.9",
     "@navikt/ft-form-validators": "2.5.7",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "@popperjs/core": "2.11.8",
     "classnames": "2.5.1",
     "dayjs": "1.11.13",
     "react": "18.3.1",
     "react-collapse": "5.1.1",
     "react-dom": "18.3.1",
     "react-hook-form": "7.53.2",
-    "react-popper": "2.3.0",
     "yup": "1.6.1"
   }
 }
diff --git a/packages/prosess-vilkar-opptjening-oms/package.json b/packages/prosess-vilkar-opptjening-oms/package.json
@@ -11,7 +11,7 @@
     "@fpsak-frontend/utils": "1.0.0",
     "@k9-sak-web/prosess-felles": "1.0.0",
     "@k9-sak-web/types": "1.0.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "classnames": "2.5.1",
     "dayjs": "1.11.13",
     "lodash": "4.17.21",

diff --git a/packages/prosess-vilkar-overstyring/package.json b/packages/prosess-vilkar-overstyring/package.json
@@ -13,7 +13,7 @@
     "@k9-sak-web/prosess-felles": "1.0.0",
     "@k9-sak-web/sak-app": "1.0.0",
     "@k9-sak-web/types": "1.0.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "classnames": "2.5.1",
     "moment": "2.30.1",
     "react": "18.3.1",

diff --git a/packages/prosess-vilkar-sykdom/package.json b/packages/prosess-vilkar-sykdom/package.json
@@ -9,7 +9,7 @@
     "@fpsak-frontend/kodeverk": "1.0.0",
     "@fpsak-frontend/shared-components": "1.0.0",
     "@fpsak-frontend/utils": "1.0.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "classnames": "2.5.1",
     "lodash": "4.17.21",
     "react": "18.3.1",

diff --git a/packages/sak-app/package.json b/packages/sak-app/package.json
@@ -45,7 +45,7 @@
     "@navikt/ds-react": "7.6.0",
     "@navikt/ft-fakta-beregning": "7.1.10",
     "@navikt/ft-form-hooks": "5.2.9",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "@navikt/ft-prosess-beregningsgrunnlag": "7.1.10",
     "@navikt/ft-ui-komponenter": "2.6.5",
     "@sentry/browser": "8.46.0",

diff --git a/packages/sak-app/src/behandlingmenu/BehandlingMenuIndex.spec.tsx b/packages/sak-app/src/behandlingmenu/BehandlingMenuIndex.spec.tsx
@@ -130,12 +130,12 @@ describe('BehandlingMenuIndex', () => {
     expect(await knapp).not.toBeNull();
 
     expect(screen.queryByText('Fortsett behandlingen')).toBeNull();
-    expect(screen.queryByText('Sett behandlingen på vent')).not.toBeVisible();
-    expect(screen.queryByText('Henlegg behandlingen og avslutt')).not.toBeVisible();
-    expect(screen.queryByText('Endre behandlende enhet')).not.toBeVisible();
+    expect(screen.queryByText('Sett behandlingen på vent')).not.toBeInTheDocument();
+    expect(screen.queryByText('Henlegg behandlingen og avslutt')).not.toBeInTheDocument();
+    expect(screen.queryByText('Endre behandlende enhet')).not.toBeInTheDocument();
     // expect(screen.queryByText('Marker behandling')).not.toBeVisible();
-    expect(screen.queryByText('Opprett ny behandling')).not.toBeVisible();
-    expect(screen.queryByText('Opprett verge/fullmektig')).not.toBeVisible();
+    expect(screen.queryByText('Opprett ny behandling')).not.toBeInTheDocument();
+    expect(screen.queryByText('Opprett verge/fullmektig')).not.toBeInTheDocument();
 
     /**
      * Åpne behandlingsmenyen
@@ -145,11 +145,11 @@ describe('BehandlingMenuIndex', () => {
     });
 
     expect(screen.queryByText('Fortsett behandlingen')).toBeNull();
-    expect(screen.queryByRole('button', { name: 'Sett behandlingen på vent' })).toBeVisible();
-    expect(screen.queryByRole('button', { name: 'Henlegg behandlingen og avslutt' })).toBeVisible();
-    expect(screen.queryByRole('button', { name: 'Endre behandlende enhet' })).toBeVisible();
+    expect(screen.getByRole('menuitem', { name: 'Sett behandlingen på vent' })).toBeInTheDocument();
+    expect(screen.getByRole('menuitem', { name: 'Henlegg behandlingen og avslutt' })).toBeInTheDocument();
+    expect(screen.getByRole('menuitem', { name: 'Endre behandlende enhet' })).toBeInTheDocument();
     // expect(screen.queryByRole('button', { name: 'Marker behandling' })).toBeVisible();
-    expect(screen.queryByRole('button', { name: 'Opprett ny behandling' })).toBeVisible();
-    expect(screen.queryByRole('button', { name: 'Opprett verge/fullmektig' })).toBeVisible();
+    expect(screen.getByRole('menuitem', { name: 'Opprett ny behandling' })).toBeInTheDocument();
+    expect(screen.getByRole('menuitem', { name: 'Opprett verge/fullmektig' })).toBeInTheDocument();
   });
 });
diff --git a/packages/sak-meny/package.json b/packages/sak-meny/package.json
@@ -7,7 +7,7 @@
   "dependencies": {
     "@fpsak-frontend/assets": "1.0.0",
     "@fpsak-frontend/shared-components": "1.0.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "react": "18.3.1",
     "react-intl": "7.0.1"
   },

diff --git a/packages/sak-meny/src/MenySakIndex.spec.tsx b/packages/sak-meny/src/MenySakIndex.spec.tsx
@@ -1,7 +1,6 @@
 import { renderWithIntl } from '@fpsak-frontend/utils-test/test-utils';
 import { act, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import React from 'react';
 import messages from '../i18n/nb_NO.json';
 import MenyData from './MenyData';
 import MenySakIndex from './MenySakIndex';
@@ -17,11 +16,11 @@ describe('<MenySakIndex>', () => {
       { messages },
     );
 
-    expect(screen.queryByRole('button', { name: 'Lag ny behandling' })).not.toBeInTheDocument();
+    expect(screen.queryByRole('menuitem', { name: 'Lag ny behandling' })).not.toBeInTheDocument();
     await act(async () => {
       await userEvent.click(screen.getByRole('button', { name: 'Behandlingsmeny' }));
     });
-    expect(screen.getByRole('button', { name: 'Lag ny behandling' })).toBeInTheDocument();
+    expect(screen.getByRole('menuitem', { name: 'Lag ny behandling' })).toBeInTheDocument();
   });
 
   it('skal åpne modal ved trykk på menyinnslag og så lukke den ved å bruke funksjon for lukking', async () => {
@@ -34,14 +33,14 @@ describe('<MenySakIndex>', () => {
       { messages },
     );
 
-    expect(screen.queryByRole('button', { name: 'Lag ny behandling' })).not.toBeInTheDocument();
+    expect(screen.queryByRole('menuitem', { name: 'Lag ny behandling' })).not.toBeInTheDocument();
     await act(async () => {
       await userEvent.click(screen.getByRole('button', { name: 'Behandlingsmeny' }));
     });
-    expect(screen.getByRole('button', { name: 'Lag ny behandling' })).toBeInTheDocument();
+    expect(screen.getByRole('menuitem', { name: 'Lag ny behandling' })).toBeInTheDocument();
     await act(async () => {
       await userEvent.click(screen.getByRole('button', { name: 'Behandlingsmeny' }));
     });
-    expect(screen.queryByRole('button', { name: 'Lag ny behandling' })).not.toBeInTheDocument();
+    expect(screen.queryByRole('menuitem', { name: 'Lag ny behandling' })).not.toBeInTheDocument();
   });
 });
diff --git a/packages/sak-meny/src/MenySakIndex.tsx b/packages/sak-meny/src/MenySakIndex.tsx
@@ -1,10 +1,7 @@
-import closedImage from '@fpsak-frontend/assets/images/pil_ned.svg';
-import openImage from '@fpsak-frontend/assets/images/pil_opp.svg';
-import { Image } from '@fpsak-frontend/shared-components';
-import { Button } from '@navikt/ds-react';
-import { BoxedListWithSelection, Popover } from '@navikt/ft-plattform-komponenter';
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { FormattedMessage, RawIntlProvider, createIntl, createIntlCache } from 'react-intl';
+import { ChevronDownIcon } from '@navikt/aksel-icons';
+import { ActionMenu, Button } from '@navikt/ds-react';
+import { useState } from 'react';
+import { RawIntlProvider, createIntl, createIntlCache } from 'react-intl';
 import messages from '../i18n/nb_NO.json';
 import MenyData from './MenyData';
 
@@ -24,63 +21,24 @@ interface OwnProps {
 
 const MenySakIndex = ({ data }: OwnProps) => {
   const filtrertData = data.filter(d => d.erSynlig);
-
-  const [visMenySomApen, setVisMenyTilApen] = useState(false);
-  const toggleMenyVisning = useCallback(() => setVisMenyTilApen(!visMenySomApen), [visMenySomApen]);
-
   const [valgtModal, setValgtModal] = useState(-1);
 
-  const menyRef = useRef(null);
-  const handleClickOutside = event => {
-    if (menyRef.current && !menyRef.current.contains(event.target)) {
-      toggleMenyVisning();
-    }
-  };
-  useEffect(() => {
-    if (visMenySomApen) {
-      document.addEventListener('mousedown', handleClickOutside);
-    }
-    return () => {
-      document.removeEventListener('mousedown', handleClickOutside);
-    };
-  }, [visMenySomApen]);
-
   return (
     <RawIntlProvider value={intl}>
-      <div ref={menyRef}>
-        <Popover
-          popperIsVisible={visMenySomApen}
-          renderArrowElement={false}
-          customPopperStyles={{ top: '2px', zIndex: 1 }}
-          popperProps={{
-            children: () => (
-              <BoxedListWithSelection
-                items={filtrertData.map(d => ({
-                  name: d.tekst,
-                }))}
-                onClick={index => {
-                  setValgtModal(index);
-                  toggleMenyVisning();
-                }}
-              />
-            ),
-            placement: 'bottom-start',
-            strategy: 'absolute',
-          }}
-          referenceProps={{
-            children: ({ ref }) => (
-              <div ref={ref}>
-                <Button variant="secondary" size="small" onClick={toggleMenyVisning}>
-                  <FormattedMessage id="MenySakIndex.Behandlingsmeny" />
-                  <span style={{ marginLeft: '5px' }}>
-                    <Image src={visMenySomApen ? openImage : closedImage} />
-                  </span>
-                </Button>
-              </div>
-            ),
-          }}
-        />
-      </div>
+      <ActionMenu>
+        <ActionMenu.Trigger>
+          <Button icon={<ChevronDownIcon aria-hidden />} iconPosition="right" variant="secondary" size="small">
+            Behandlingsmeny
+          </Button>
+        </ActionMenu.Trigger>
+        <ActionMenu.Content>
+          {filtrertData.map((d, index) => (
+            <ActionMenu.Item key={d.tekst} onClick={() => setValgtModal(index)} className="cursor-pointer">
+              {d.tekst}
+            </ActionMenu.Item>
+          ))}
+        </ActionMenu.Content>
+      </ActionMenu>
       {valgtModal !== -1 && filtrertData[valgtModal].modal(() => setValgtModal(-1))}
     </RawIntlProvider>
   );

diff --git a/packages/sak-visittkort/package.json b/packages/sak-visittkort/package.json
@@ -10,7 +10,7 @@
     "@fpsak-frontend/utils": "1.0.0",
     "@k9-sak-web/sak-app": "1.0.0",
     "@k9-sak-web/types": "1.0.0",
-    "@navikt/ft-plattform-komponenter": "5.3.0",
+    "@navikt/ft-plattform-komponenter": "5.3.1",
     "dayjs": "1.11.13",
     "moment": "2.30.1",
     "react": "18.3.1",