From 28c12b786c9de0bba1019f1263a62f4c4611e0db Mon Sep 17 00:00:00 2001 From: taniaholst Date: Tue, 6 Feb 2024 13:16:32 +0100 Subject: [PATCH] =?UTF-8?q?lukkeknapp=20p=C3=A5=20filtre=20+=20ny=20infobo?= =?UTF-8?q?ks=20+=20ny=20helptext?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/App.module.scss | 4 +++ .../views/NavArbeidsmarkedstiltakOversikt.tsx | 28 +++++++++++++++-- .../components/feilmelding/Feilmelding.tsx | 2 +- .../filtrering/Filtertags.module.scss | 3 +- .../src/components/filtrering/Filtertags.tsx | 4 +-- .../FiltertagsArbeidsmarkedstiltak.tsx | 31 ++++++++++++------- .../InnsatsgruppeFilter.module.scss | 10 ++++++ .../filtrering/InnsatsgruppeFilter.tsx | 29 ++++++++++++----- .../components/filtrering/NavEnhetFilter.tsx | 2 +- .../src/components/knapper/Ikonknapp.tsx | 2 +- .../src/components/tags/FilterTag.tsx | 2 +- .../src/components/tags/NavEnhetTag.tsx | 21 ++++++------- .../api/utils/SanityFilters.kt | 4 +-- 13 files changed, 98 insertions(+), 44 deletions(-) diff --git a/frontend/mulighetsrommet-veileder-flate/src/App.module.scss b/frontend/mulighetsrommet-veileder-flate/src/App.module.scss index a39f43fcc3..424c786e37 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/App.module.scss +++ b/frontend/mulighetsrommet-veileder-flate/src/App.module.scss @@ -2,6 +2,10 @@ max-width: none; } +:global(.navds-internalheader) { + margin-bottom: 1rem; +} + .svg_success { color: var(--a-green-600); } diff --git a/frontend/mulighetsrommet-veileder-flate/src/apps/nav/views/NavArbeidsmarkedstiltakOversikt.tsx b/frontend/mulighetsrommet-veileder-flate/src/apps/nav/views/NavArbeidsmarkedstiltakOversikt.tsx index d722379e32..98f5d5ca7e 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/apps/nav/views/NavArbeidsmarkedstiltakOversikt.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/apps/nav/views/NavArbeidsmarkedstiltakOversikt.tsx @@ -1,23 +1,47 @@ import { TiltakLoader } from "@/components/TiltakLoader"; import { Feilmelding } from "@/components/feilmelding/Feilmelding"; import { FilterAndTableLayout } from "@/components/filtrering/FilterAndTableLayout"; -import { Filtertags } from "@/components/filtrering/Filtertags"; import { Tiltaksgjennomforingsoversikt } from "@/components/oversikt/Tiltaksgjennomforingsoversikt"; import { useNavTiltaksgjennomforinger } from "@/core/api/queries/useTiltaksgjennomforinger"; import { FilterMenyMedSkeletonLoader } from "@/components/filtrering/FilterMenyMedSkeletonLoader"; +import { Button } from "@navikt/ds-react"; +import { + useResetArbeidsmarkedstiltakFilterUtenBrukerIKontekst, + valgteEnhetsnumre, +} from "@/hooks/useArbeidsmarkedstiltakFilter"; +import { FiltertagsArbeidsmarkedstiltak } from "@/components/filtrering/FiltertagsArbeidsmarkedstiltak"; export const NavArbeidsmarkedstiltakOversikt = () => { const { data: tiltaksgjennomforinger = [], isLoading } = useNavTiltaksgjennomforinger(); + const { filter, filterHasChanged, resetFilterToDefaults } = + useResetArbeidsmarkedstiltakFilterUtenBrukerIKontekst(); return ( } - tags={} + tags={} + resetButton={ + filterHasChanged && ( + + ) + } table={
{isLoading ? ( + ) : valgteEnhetsnumre(filter).length === 0 || filter.innsatsgruppe === undefined ? ( + ) : tiltaksgjennomforinger.length === 0 ? ( - + {filter.search && ( + setFilter({ ...filter, search: "" })} + /> + )} {filter.apentForInnsok !== ApentForInnsok.APENT_ELLER_STENGT && ( )} - {filter.innsatsgruppe && } + {filter.innsatsgruppe && ( + { + setFilter({ ...filter, innsatsgruppe: undefined }); + }} + /> + )} + e.stopPropagation()} /> @@ -41,12 +54,6 @@ export function Filtertags() { }) } /> - {filter.search && ( - setFilter({ ...filter, search: "" })} - /> - )}
); } diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/InnsatsgruppeFilter.module.scss b/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/InnsatsgruppeFilter.module.scss index e69de29bb2..d294f85009 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/InnsatsgruppeFilter.module.scss +++ b/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/InnsatsgruppeFilter.module.scss @@ -0,0 +1,10 @@ +.accordion_header { + display: flex; + justify-content: flex-start; + + .accordion_header_text { + display: flex; + justify-content: space-between; + width: 16rem; + } +} diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/InnsatsgruppeFilter.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/InnsatsgruppeFilter.tsx index 4800f72abd..d7267e4a76 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/InnsatsgruppeFilter.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/InnsatsgruppeFilter.tsx @@ -1,11 +1,12 @@ -import { Accordion, Alert, Radio, RadioGroup } from "@navikt/ds-react"; +import { Accordion, Alert, HelpText, Radio, RadioGroup } from "@navikt/ds-react"; import { useAtom } from "jotai"; import { Innsatsgruppe } from "mulighetsrommet-api-client"; -import { useInnsatsgrupper } from "../../core/api/queries/useInnsatsgrupper"; -import { filterAccordionAtom } from "../../core/atoms/atoms"; -import { useArbeidsmarkedstiltakFilter } from "../../hooks/useArbeidsmarkedstiltakFilter"; -import { addOrRemove, kebabCase } from "../../utils/Utils"; +import { useInnsatsgrupper } from "@/core/api/queries/useInnsatsgrupper"; +import { filterAccordionAtom } from "@/core/atoms/atoms"; +import { useArbeidsmarkedstiltakFilter } from "@/hooks/useArbeidsmarkedstiltakFilter"; +import { addOrRemove, kebabCase } from "@/utils/Utils"; import "./Filtermeny.module.scss"; +import styles from "./InnsatsgruppeFilter.module.scss"; interface InnsatsgruppeFilterProps< T extends { id: string; tittel: string; nokkel?: Innsatsgruppe }, @@ -42,11 +43,23 @@ const InnsatsgruppeAccordion = { setAccordionsOpen([...addOrRemove(accordionsOpen, "innsatsgruppe")]); }} - data-testid={"filter_accordionheader_innsatsgruppe"} + data-testid="filter_accordionheader_innsatsgruppe" + className={styles.accordion_header} > - Innsatsgruppe +
+ Innsatsgruppe + e.stopPropagation()}> + Dette filteret baserer seg på brukerens innsatsgruppe etter behovsvurdering av + arbeidsevne (NAV-loven § 14 a), og viser de tiltakene brukeren har krav på med valgt + innsatsgruppe. +
+ + Klikk her for mer informasjon. + + +
- + {options.length !== 0 && ( - NAV enhet + NAV-enhet void; + handleClick: (e: React.MouseEvent) => void; ariaLabel: string; dataTestId?: string; } diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tags/FilterTag.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/tags/FilterTag.tsx index 3880d6ffe6..3274a5c02a 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/tags/FilterTag.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tags/FilterTag.tsx @@ -1,5 +1,5 @@ import { Tag } from "@navikt/ds-react"; -import { kebabCase } from "../../utils/Utils"; +import { kebabCase } from "@/utils/Utils"; import Ikonknapp from "../knapper/Ikonknapp"; import styles from "./Filtertag.module.scss"; import { XMarkIcon } from "@navikt/aksel-icons"; diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tags/NavEnhetTag.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/tags/NavEnhetTag.tsx index 30428fafdb..531e32efa6 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/tags/NavEnhetTag.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tags/NavEnhetTag.tsx @@ -1,5 +1,6 @@ import { Tag } from "@navikt/ds-react"; import { + useArbeidsmarkedstiltakFilterUtenBrukerIKontekst, useArbeidsmarkedstiltakFilterValue, valgteEnhetsnumre, } from "@/hooks/useArbeidsmarkedstiltakFilter"; @@ -7,17 +8,17 @@ import { useNavEnheter } from "@/core/api/queries/useNavEnheter"; import { NavEnhet } from "mulighetsrommet-api-client"; import Ikonknapp from "@/components/knapper/Ikonknapp"; import { XMarkIcon } from "@navikt/aksel-icons"; -import { kebabCase } from "@/utils/Utils"; import styles from "./Filtertag.module.scss"; interface Props { - handleClick?: (id: string) => void; + handleClick?: (e: React.MouseEvent) => void; } export function NavEnhetTag({ handleClick }: Props) { const filter = useArbeidsmarkedstiltakFilterValue(); const { data: alleEnheter } = useNavEnheter(); const enheter = valgteEnhetsnumre(filter); + const [, setFilter] = useArbeidsmarkedstiltakFilterUtenBrukerIKontekst(); if (!alleEnheter || !filter || enheter.length === 0) { return null; @@ -38,23 +39,19 @@ export function NavEnhetTag({ handleClick }: Props) { key="navenhet" size="small" data-testid="filtertag_navenhet" - title="Valgt enhet" + title={enheter + .map((enhet) => alleEnheter.find((e) => e.enhetsnummer === enhet)?.navn) + .join(", ")} variant="info" > {tagLabel()} + {handleClick ? ( handleClick(filtertype.id)} + handleClick={() => setFilter({ ...filter, regionMap: {} })} ariaLabel="Lukke" - data-testid={`filtertag_lukkeknapp_${kebabCase(filtertype.tittel)}`} - icon={ - - } + icon={} /> ) : null} diff --git a/mulighetsrommet-api/src/main/kotlin/no/nav/mulighetsrommet/api/utils/SanityFilters.kt b/mulighetsrommet-api/src/main/kotlin/no/nav/mulighetsrommet/api/utils/SanityFilters.kt index 386d755f66..8c9eeb610c 100644 --- a/mulighetsrommet-api/src/main/kotlin/no/nav/mulighetsrommet/api/utils/SanityFilters.kt +++ b/mulighetsrommet-api/src/main/kotlin/no/nav/mulighetsrommet/api/utils/SanityFilters.kt @@ -21,8 +21,6 @@ fun byggSokeFilter(sokestreng: String?): String { } fun byggInnsatsgruppeFilter(innsatsgruppe: String?): String { - if (innsatsgruppe.isNullOrBlank()) return "" - return """ && tiltakstype->innsatsgruppe->nokkel in ${utledInnsatsgrupper(innsatsgruppe).toSanityListe()} """.trimIndent() @@ -32,7 +30,7 @@ private fun List.toSanityListe(): String { return "[${this.joinToString { "'$it'" }}]" } -fun utledInnsatsgrupper(innsatsgruppe: String): List { +fun utledInnsatsgrupper(innsatsgruppe: String?): List { return when (innsatsgruppe) { Innsatsgruppe.STANDARD_INNSATS.name -> listOf(Innsatsgruppe.STANDARD_INNSATS.name) Innsatsgruppe.SITUASJONSBESTEMT_INNSATS.name -> listOf(