diff --git a/apps/dolly-frontend/src/main/js/package-lock.json b/apps/dolly-frontend/src/main/js/package-lock.json index fc4bf591c7..6b09a93712 100644 --- a/apps/dolly-frontend/src/main/js/package-lock.json +++ b/apps/dolly-frontend/src/main/js/package-lock.json @@ -1974,16 +1974,16 @@ } }, "node_modules/@navikt/aksel-icons": { - "version": "7.14.2", - "resolved": "https://npm.pkg.github.com/download/@navikt/aksel-icons/7.14.2/31e37d1f509e440652024be048a9d72a0704b705", - "integrity": "sha512-oJO6kVuMdSfJLAq2CEWUfbnb1lZDm9vl1+hT0M8hBETPpTaZ0rkBn8ZYimU/mjEJHs2753f+LKyvCH886ksskw==", + "version": "7.14.3", + "resolved": "https://npm.pkg.github.com/download/@navikt/aksel-icons/7.14.3/a40b7802d3233a0ad26aed85ee8bf6ad9e630555", + "integrity": "sha512-OAmWUtkUBy+GWY52jzwajxuH1wZwaS0QEPYeQ4s2wUFKDxJTk23GaUhII0ggss2GZZgIePspes/niC5DETqaUw==", "dev": true, "license": "MIT" }, "node_modules/@navikt/ds-css": { - "version": "7.14.2", - "resolved": "https://npm.pkg.github.com/download/@navikt/ds-css/7.14.2/63c8d178c3813a6ddc26cba3d120caf749d7867b", - "integrity": "sha512-F/lxu1dH7RtFr2dLDRKkCN3GdoWZ6pwCBVtTVpS4Js4lIlG+LozOa3yh6wofqfDjfNpqSq78ja+ua2pxeDqhpg==", + "version": "7.14.3", + "resolved": "https://npm.pkg.github.com/download/@navikt/ds-css/7.14.3/ea3085cb7f7f98237beff5df3192f7a744c5f685", + "integrity": "sha512-CyRtN00UIkokSh7KQFOUwjcrD+6I0TfN7YTS33Hn4n3UblCG3bGaYqP+f2bciNMi23/+Mi5TIr6znWM0BuXr9A==", "dev": true, "license": "MIT" }, @@ -2005,16 +2005,16 @@ } }, "node_modules/@navikt/ds-react": { - "version": "7.14.2", - "resolved": "https://npm.pkg.github.com/download/@navikt/ds-react/7.14.2/3ca5fca06c8842dea5ddee5332720c7ce07f83e8", - "integrity": "sha512-s2MFaMl1p94G0+u56u0EciiOwxpRTZOqjbagFDmAuYed5UiHWx5Jlheyyu7HvLv7NSBuR/VmIDtcXMVPmaz8wg==", + "version": "7.14.3", + "resolved": "https://npm.pkg.github.com/download/@navikt/ds-react/7.14.3/91c478486263b23e6d9e150d7ae508d6a2b7683e", + "integrity": "sha512-R36UgfRRwoqLvw+IhzjfvLm80v1DB9PBTHOskVUSXmdTH8sXH8veLqvZsitSAENe6nt3DcXUsBhg59ihAmGgkw==", "dev": true, "license": "MIT", "dependencies": { "@floating-ui/react": "0.25.4", "@floating-ui/react-dom": "^2.0.9", - "@navikt/aksel-icons": "^7.14.2", - "@navikt/ds-tokens": "^7.14.2", + "@navikt/aksel-icons": "^7.14.3", + "@navikt/ds-tokens": "^7.14.3", "clsx": "^2.1.0", "date-fns": "^4.0.0", "react-day-picker": "9.5.0" @@ -2025,9 +2025,9 @@ } }, "node_modules/@navikt/ds-tokens": { - "version": "7.14.2", - "resolved": "https://npm.pkg.github.com/download/@navikt/ds-tokens/7.14.2/53d678e7e12650c8d1aad8b06a329697680e6c1f", - "integrity": "sha512-F7V1aeSB3r+rEf0xAWWfy82e3PY07PGibV1D9xnHq2gJ0Y2YI9Gnrm9llJ9wicD11Jz5zJx4PuBiJ0LvLhF0Vg==", + "version": "7.14.3", + "resolved": "https://npm.pkg.github.com/download/@navikt/ds-tokens/7.14.3/d128b01d9ad7a696f24391a8769d4cfaa6f1d838", + "integrity": "sha512-6tZZ/xPoxohkboNzbgJmemGcBt5yl89v4RkuOsOyfO2mTb1aEv8uQw3kZLtlzm7CaZ95F/lTLbF0IpDgalMW0A==", "dev": true, "license": "MIT" }, @@ -5025,9 +5025,9 @@ "license": "MIT" }, "node_modules/electron-to-chromium": { - "version": "1.5.107", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.107.tgz", - "integrity": "sha512-dJr1o6yCntRkXElnhsHh1bAV19bo/hKyFf7tCcWgpXbuFIF0Lakjgqv5LRfSDaNzAII8Fnxg2tqgHkgCvxdbxw==", + "version": "1.5.109", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.109.tgz", + "integrity": "sha512-AidaH9JETVRr9DIPGfp1kAarm/W6hRJTPuCnkF+2MqhF4KaAgRIcBc8nvjk+YMXZhwfISof/7WG29eS4iGxQLQ==", "dev": true, "license": "ISC" }, @@ -10842,22 +10842,22 @@ } }, "node_modules/tldts": { - "version": "6.1.78", - "resolved": "https://registry.npmjs.org/tldts/-/tldts-6.1.78.tgz", - "integrity": "sha512-fSgYrW0ITH0SR/CqKMXIruYIPpNu5aDgUp22UhYoSrnUQwc7SBqifEBFNce7AAcygUPBo6a/gbtcguWdmko4RQ==", + "version": "6.1.79", + "resolved": "https://registry.npmjs.org/tldts/-/tldts-6.1.79.tgz", + "integrity": "sha512-wjlYwK8lC/WcywLWf3A7qbK07SexezXjTRVwuPWXHvcjD7MnpPS2RXY5rLO3g12a8CNc7Y7jQRQsV7XyuBZjig==", "dev": true, "license": "MIT", "dependencies": { - "tldts-core": "^6.1.78" + "tldts-core": "^6.1.79" }, "bin": { "tldts": "bin/cli.js" } }, "node_modules/tldts-core": { - "version": "6.1.78", - "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-6.1.78.tgz", - "integrity": "sha512-jS0svNsB99jR6AJBmfmEWuKIgz91Haya91Z43PATaeHJ24BkMoNRb/jlaD37VYjb0mYf6gRL/HOnvS1zEnYBiw==", + "version": "6.1.79", + "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-6.1.79.tgz", + "integrity": "sha512-HM+Ud/2oQuHt4I43Nvjc213Zji/z25NSH5OkJskJwHXNtYh9DTRlHMDFhms9dFMP7qyve/yVaXFIxmcJ7TdOjw==", "dev": true, "license": "MIT" }, diff --git a/apps/dolly-frontend/src/main/js/src/allRoutes.tsx b/apps/dolly-frontend/src/main/js/src/allRoutes.tsx index bd7c9a4b14..4e3fddab81 100644 --- a/apps/dolly-frontend/src/main/js/src/allRoutes.tsx +++ b/apps/dolly-frontend/src/main/js/src/allRoutes.tsx @@ -8,9 +8,7 @@ const OrganisasjonTenorSoekPage = lazyWithPreload( () => import('@/pages/organisasjoner/OrganisasjonTenorSoek/OrganisasjonTenorSoekPage'), ) const NyansettelserPage = lazyWithPreload(() => import('@/pages/nyansettelser/NyansettelserPage')) -const GruppeOversikt = lazyWithPreload( - () => import('@/pages/gruppeOversikt/GruppeOversiktConnector'), -) +const GruppeOversikt = lazyWithPreload(() => import('@/pages/gruppeOversikt/GruppeOversikt')) const Organisasjon = lazyWithPreload(() => import('@/pages/organisasjoner/Organisasjoner')) const MinSide = lazyWithPreload(() => import('@/pages/minSide/MinSide')) const UI = lazyWithPreload(() => import('@/pages/ui/index')) diff --git a/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/startModal/MalVelgerIdent.tsx b/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/startModal/MalVelgerIdent.tsx index fef70b8769..4faf9e4be9 100644 --- a/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/startModal/MalVelgerIdent.tsx +++ b/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/startModal/MalVelgerIdent.tsx @@ -60,7 +60,7 @@ export const MalVelgerIdent = ({ brukernavn, gruppeId }: MalVelgerProps) => { opts.mal = undefined const options = BVOptions(opts, gruppeId, dollyEnvironments) formMethods.reset(options.initialValues) - formMethods.setValue('mal', undefined) + formMethods.setValue('mal', null) formMethods.setValue('gruppeId', gruppeId) } } @@ -70,13 +70,13 @@ export const MalVelgerIdent = ({ brukernavn, gruppeId }: MalVelgerProps) => { const options = BVOptions(opts, gruppeId, dollyEnvironments) toggleMalAktiv() formMethods.reset(options.initialValues) - formMethods.setValue('mal', undefined) + formMethods.setValue('mal', null) formMethods.setValue('gruppeId', gruppeId) } const handleBrukerChange = (event: { value: string }) => { setBruker(event.value) - formMethods.setValue('mal', undefined) + formMethods.setValue('mal', null) } const valgtMalValue = formMethods.watch('mal') diff --git a/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/stegVelger/steg/steg0/Steg0.tsx b/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/stegVelger/steg/steg0/Steg0.tsx index 66fc6c89eb..776d3f0e1c 100644 --- a/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/stegVelger/steg/steg0/Steg0.tsx +++ b/apps/dolly-frontend/src/main/js/src/components/bestillingsveileder/stegVelger/steg/steg0/Steg0.tsx @@ -29,14 +29,14 @@ const Steg0 = () => {
{!isOrganisasjon && ( <> -
- -
{isNyIdent && (
)} +
+ +
)}
diff --git a/apps/dolly-frontend/src/main/js/src/pages/gruppeOversikt/GruppeOversikt.tsx b/apps/dolly-frontend/src/main/js/src/pages/gruppeOversikt/GruppeOversikt.tsx index fc1ea97fe4..d75864aed0 100644 --- a/apps/dolly-frontend/src/main/js/src/pages/gruppeOversikt/GruppeOversikt.tsx +++ b/apps/dolly-frontend/src/main/js/src/pages/gruppeOversikt/GruppeOversikt.tsx @@ -1,11 +1,11 @@ -import React, { useEffect, useState } from 'react' +import React, { useCallback, useEffect, useMemo, useState } from 'react' import useBoolean from '@/utils/hooks/useBoolean' import NavButton from '@/components/ui/button/NavButton/NavButton' import Icon from '@/components/ui/icon/Icon' import Liste from './Liste' import { useCurrentBruker } from '@/utils/hooks/useBruker' import { useGrupper } from '@/utils/hooks/useGruppe' -import { useDispatch } from 'react-redux' +import { useDispatch, useSelector } from 'react-redux' import { setSidetall, setVisning } from '@/ducks/finnPerson' import { Hjelpetekst } from '@/components/hjelpetekst/Hjelpetekst' import { bottom } from '@popperjs/core' @@ -15,15 +15,15 @@ import { TestComponentSelectors } from '#/mocks/Selectors' import FinnPersonBestilling from '@/pages/gruppeOversikt/FinnPersonBestilling' import { RedigerGruppe } from '@/components/redigerGruppe/RedigerGruppe' -type GruppeOversiktProps = { - importerteZIdenter: any - sidetall: number - sideStoerrelse: number - gruppeInfo: any - searchActive: boolean +type RootState = { + search: any + finnPerson: { + sidetall: number + sideStoerrelse: number + } } -export enum VisningType { +export const enum VisningType { MINE = 'mine', ALLE = 'alle', FAVORITTER = 'favoritter', @@ -47,29 +47,57 @@ const StyledDiv = styled.div` } ` -const GruppeOversikt = ({ searchActive, sideStoerrelse, sidetall }: GruppeOversiktProps) => { - const { - currentBruker: { brukerId, brukertype }, - } = useCurrentBruker() - const [visningType, setVisningType] = useState(VisningType.MINE) +const GruppeOversikt: React.FC = () => { + const searchActive = useSelector((state: RootState) => Boolean(state.search)) + const sidetall = useSelector((state: RootState) => state.finnPerson.sidetall) + const sideStoerrelse = useSelector((state: RootState) => state.finnPerson.sideStoerrelse) + + const dispatch = useDispatch() + const { currentBruker } = useCurrentBruker() + const { brukerId, brukertype } = currentBruker + + const [visningType, setVisningType] = useState(VisningType.MINE) const [visNyGruppeState, visNyGruppe, skjulNyGruppe] = useBoolean(false) + const { grupper, loading } = useGrupper( sidetall, sideStoerrelse, visningType === VisningType.ALLE ? null : brukerId, ) - const dispatch = useDispatch() useEffect(() => { dispatch(setVisning('personer')) - }, []) + }, [dispatch]) - const byttVisning = (value: VisningType) => { - setVisningType(value) - dispatch(setSidetall(0)) - } + const isBankIdBruker = useMemo(() => brukertype === 'BANKID', [brukertype]) - const bankIdBruker = brukertype === 'BANKID' + const gruppeDetaljer = useMemo( + () => ({ + pageSize: sideStoerrelse, + antallPages: + visningType === VisningType.FAVORITTER + ? Math.ceil((grupper?.favoritter?.length || 0) / sideStoerrelse) + : grupper?.antallPages, + antallElementer: + visningType === VisningType.FAVORITTER + ? grupper?.favoritter?.length + : grupper?.antallElementer, + }), + [grupper, sideStoerrelse, visningType], + ) + + const items = useMemo( + () => (visningType === VisningType.FAVORITTER ? grupper?.favoritter : grupper?.contents), + [grupper, visningType], + ) + + const handleVisningChange = useCallback( + (value: VisningType) => { + setVisningType(value) + dispatch(setSidetall(0)) + }, + [dispatch], + ) return (
@@ -79,11 +107,10 @@ const GruppeOversikt = ({ searchActive, sideStoerrelse, sidetall }: GruppeOversi className="page-header flexbox--align-center--justify-start" >

Grupper

- - Gruppene inneholder alle personene dine (FNR/DNR/NPID). - + temp
+
Ny gruppe - {!bankIdBruker && } + {!isBankIdBruker && }
{visNyGruppeState && } @@ -100,47 +127,37 @@ const GruppeOversikt = ({ searchActive, sideStoerrelse, sidetall }: GruppeOversi - + Mine - + Favoritter - + Alle ) } + export default GruppeOversikt diff --git a/apps/dolly-frontend/src/main/js/src/pages/gruppeOversikt/GruppeOversiktConnector.tsx b/apps/dolly-frontend/src/main/js/src/pages/gruppeOversikt/GruppeOversiktConnector.tsx deleted file mode 100644 index 3533562c23..0000000000 --- a/apps/dolly-frontend/src/main/js/src/pages/gruppeOversikt/GruppeOversiktConnector.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import { connect } from 'react-redux' -import GruppeOversikt from './GruppeOversikt' - -const mapStateToProps = (state: { - search: any - finnPerson: { sidetall: number; sideStoerrelse: number } -}) => ({ - searchActive: Boolean(state.search), - sidetall: state.finnPerson.sidetall, - sideStoerrelse: state.finnPerson.sideStoerrelse, -}) - -export default connect(mapStateToProps)(GruppeOversikt) diff --git a/apps/dolly-frontend/src/main/js/src/pages/organisasjoner/MalVelgerOrganisasjon.tsx b/apps/dolly-frontend/src/main/js/src/pages/organisasjoner/MalVelgerOrganisasjon.tsx index 579d349826..4e6a1d3eb5 100644 --- a/apps/dolly-frontend/src/main/js/src/pages/organisasjoner/MalVelgerOrganisasjon.tsx +++ b/apps/dolly-frontend/src/main/js/src/pages/organisasjoner/MalVelgerOrganisasjon.tsx @@ -54,7 +54,7 @@ export const MalVelgerOrganisasjon = ({ brukernavn, gruppeId }: MalVelgerProps) formMethods.setValue('mal', mal.value) } else { opts.mal = undefined - formMethods.setValue('mal', undefined) + formMethods.setValue('mal', null) const options = BVOptions(opts, gruppeId, dollyEnvironments) formMethods.reset(options.initialValues) } @@ -63,14 +63,14 @@ export const MalVelgerOrganisasjon = ({ brukernavn, gruppeId }: MalVelgerProps) const handleMalEnable = () => { opts.mal = undefined toggleMalAktiv() - formMethods.setValue('mal', undefined) + formMethods.setValue('mal', null) const options = BVOptions(opts, gruppeId, dollyEnvironments) formMethods.reset(options.initialValues) } const handleBrukerChange = (event: { value: string }) => { setBruker(event.value) - formMethods.setValue('mal', undefined) + formMethods.setValue('mal', null) } return (