From cc9d7834cf862d4cde8fae786def5aa592c934ef Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A5kon=20M=C3=B8ller?= Date: Fri, 27 Sep 2024 08:34:23 +0200 Subject: [PATCH 1/3] Revise question and answer texts on svar page More adapted for each user group (AG and SM). --- .../components/motebehov/SvarBehovForm.tsx | 22 ++++++++++++++----- .../[narmestelederid]/motebehov/svar.page.tsx | 2 +- src/pages/sykmeldt/motebehov/svar.page.tsx | 2 +- 3 files changed, 19 insertions(+), 7 deletions(-) diff --git a/src/common/components/motebehov/SvarBehovForm.tsx b/src/common/components/motebehov/SvarBehovForm.tsx index 232d11c2..95d51ab6 100644 --- a/src/common/components/motebehov/SvarBehovForm.tsx +++ b/src/common/components/motebehov/SvarBehovForm.tsx @@ -19,10 +19,14 @@ const texts = { "Alle felt må fylles ut, bortsett fra de som er markert som valgfrie.", formLabels: { legendRadioHarBehovSykmeldt: - "Har du behov for et møte med NAV og arbeidsgiveren din?", - legendRadioHarBehovArbeidsgiver: "Har dere behov for et møte med NAV?", - radioYes: "Ja, jeg mener det er behov for et møte", - radioNo: "Nei, jeg mener det ikke er behov for et møte", + "Ønsker du et dialogmøte med NAV og arbeidsgiveren din?", + legendRadioHarBehovArbeidsgiver: + "Har dere behov for et dialogmøte med NAV?", + desciptionRadioHarBehovArbeidsgiver: + "Du svarer på vegne av arbeidsgiver. Den ansatte har fått det samme spørsmålet og svarer på vegne av seg selv.", + radioYesSykmeldt: "Ja, jeg ønsker et dialogmøte", + radioYesArbeidsgiver: "Ja, jeg tror vi kan ha nytte av et dialogmøte", + radioNo: "Nei, jeg mener det ikke er behov for et dialogmøte", begrunnelseIfYes: "Begrunnelse (valgfri)", begrunnelseIfNo: "Begrunnelse", }, @@ -108,9 +112,17 @@ function SvarBehovForm({ isSubmitting, onSubmitForm }: Props) { ? texts.formLabels.legendRadioHarBehovSykmeldt : texts.formLabels.legendRadioHarBehovArbeidsgiver } + description={ + !isAudienceSykmeldt && + "Du svarer på vegne av arbeidsgiver. Den ansatte har fått det samme spørsmålet og svarer på vegne av seg selv." + } error={errors[motebehovRadioGroup]?.message} > - {texts.formLabels.radioYes} + + {isAudienceSykmeldt + ? texts.formLabels.radioYesSykmeldt + : texts.formLabels.radioYesArbeidsgiver} + {texts.formLabels.radioNo} )} diff --git a/src/pages/arbeidsgiver/[narmestelederid]/motebehov/svar.page.tsx b/src/pages/arbeidsgiver/[narmestelederid]/motebehov/svar.page.tsx index a91e9fd5..efdde119 100644 --- a/src/pages/arbeidsgiver/[narmestelederid]/motebehov/svar.page.tsx +++ b/src/pages/arbeidsgiver/[narmestelederid]/motebehov/svar.page.tsx @@ -17,7 +17,7 @@ import { } from "@/common/constants/staticUrls"; const texts = { - title: "Har dere behov for et møte med NAV?", + title: "Har dere behov for et dialogmøte med NAV?", topBodyText: "Senest innen 26 ukers sykefravær kaller NAV inn til et dialogmøte, med mindre det er åpenbart unødvendig. Vi ber om at du fyller ut og sender inn skjemaet nedenfor for å hjelpe oss å vurdere behovet for et slikt møte.", }; diff --git a/src/pages/sykmeldt/motebehov/svar.page.tsx b/src/pages/sykmeldt/motebehov/svar.page.tsx index b1e71c41..fb082b6a 100644 --- a/src/pages/sykmeldt/motebehov/svar.page.tsx +++ b/src/pages/sykmeldt/motebehov/svar.page.tsx @@ -12,7 +12,7 @@ import { } from "@/common/constants/staticUrls"; const texts = { - title: "Har du behov for et møte med NAV og arbeidsgiver?", + title: "Ønsker du et dialogmøte med NAV?", topBodyText: "Senest innen 26 ukers sykefravær kaller NAV inn til et dialogmøte, med mindre det er åpenbart unødvendig. Vi ber om at du fyller ut og sender inn skjemaet nedenfor for å hjelpe oss å vurdere behovet for et slikt møte.", }; From 702dfbf00b3c690935ae49cb4e902f49b7dbf300 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A5kon=20M=C3=B8ller?= Date: Sun, 29 Sep 2024 19:29:05 +0200 Subject: [PATCH 2/3] Revise forms on meld- and svar-pages --- .../components/motebehov/MeldBehovForm.tsx | 222 ++++++++----- .../motebehov/MotebehovKvittering.tsx | 4 +- .../components/motebehov/SvarBehovForm.tsx | 309 ++++++++++++------ .../[narmestelederid]/motebehov/meld.page.tsx | 24 +- .../[narmestelederid]/motebehov/meld.test.tsx | 3 +- .../[narmestelederid]/motebehov/svar.page.tsx | 35 +- .../[narmestelederid]/motebehov/svar.test.tsx | 3 +- src/pages/sykmeldt/motebehov/meld.page.tsx | 17 +- src/pages/sykmeldt/motebehov/meld.test.tsx | 3 +- src/pages/sykmeldt/motebehov/svar.page.tsx | 21 +- src/pages/sykmeldt/motebehov/svar.test.tsx | 3 +- 11 files changed, 449 insertions(+), 195 deletions(-) diff --git a/src/common/components/motebehov/MeldBehovForm.tsx b/src/common/components/motebehov/MeldBehovForm.tsx index 500f54dd..6e60f9b4 100644 --- a/src/common/components/motebehov/MeldBehovForm.tsx +++ b/src/common/components/motebehov/MeldBehovForm.tsx @@ -1,5 +1,5 @@ import { Controller, useForm } from "react-hook-form"; -import { BodyLong, Checkbox, CheckboxGroup, Textarea } from "@navikt/ds-react"; +import { Checkbox, CheckboxGroup, Textarea, TextField } from "@navikt/ds-react"; import { useAmplitude } from "@/common/hooks/useAmplitude"; import DialogmotePanel from "@/common/components/panel/DialogmotePanel"; @@ -11,45 +11,62 @@ import { useErrorSummaryFormatter } from "@/common/hooks/useErrorSummaryFormatte import { MotebehovSvarRequest } from "types/shared/motebehov"; import { commonTexts } from "@/common/constants/commonTexts"; -const BEGRUNNELSE_MAX_LENGTH = 1000; +const MAX_LENGTH_TEXT_AREAS = 1000; const texts = { aboutRequiredFields: "Alle felt må fylles ut, bortsett fra de som er markert som valgfrie.", formLabels: { - checkboxesLegend: "Meld behov for møte", - textAreaBegrunnelse: "Begrunnelse (valgfri)", + checkboxesLegend: "Andre valg", + onskerBehandlerMedBegrunnelseLabel: + "Hvorfor ønsker du at lege/behandler deltar i møtet? (Må fylles ut)", + checkboxBehovForTolkLabel: "Vi har behov for tolk.", + hvaSlagsTolkLabel: "Hva slags tolk har dere behov for? (Må fylles ut)", + hvaSlagsTolkDescription: "For eksempel polsk eller tegnspråk.", }, validation: { - requiredHarBehovCheckbox: - "Du må krysse av for møtebehov for å kunne sende inn skjemaet.", - mustAnswerYesOrNo: - "Du må velge ja eller nei for å kunne sende inn skjemaet.", - maxLengthBegrunnelse: `Maks ${BEGRUNNELSE_MAX_LENGTH} tegn er tillatt.`, + requiredBegrunnelse: "Du må oppgi hvorfor du ønsker et dialogmøte.", + maxLengthTextAreas: `Maks ${MAX_LENGTH_TEXT_AREAS} tegn er tillatt.`, + requiredBegrunnelseOnskerBehandlerTextArea: + "Du må begrunne hvorfor du ønsker at behandler deltar.", + requiredHvaSlagsTolkTextField: + "Du må oppgi hva slags tolk dere har behov for.", }, - buttonSendInn: "Send inn", + buttonSendInn: "Be om møte", }; -const motebehovCheckbox = "motebehovCheckbox"; -const behandlerCheckbox = "behandlerCheckbox"; const begrunnelseTextArea = "begrunnelseTextArea"; +const behandlerCheckbox = "behandlerCheckbox"; +const behandlerBegrunnelseTextArea = "onskerBehandlerBegrunnelseTextArea"; +const tolkCheckbox = "tolkCheckbox"; +const hvaSlagsTolkTextField = "hvaSlagsgTolkTextField"; type FormValues = { - [motebehovCheckbox]: boolean; - [behandlerCheckbox]: boolean; [begrunnelseTextArea]: string; + [behandlerCheckbox]: boolean; + [behandlerBegrunnelseTextArea]: string; + [tolkCheckbox]: boolean; + [hvaSlagsTolkTextField]: string; }; +interface FormLabelProps { + begrunnelseLabel: string; + begrunnelseDescription?: string; + checkboxOnskerBehandlerMedLabel: string; +} + interface Props { - checkboxLabelHarBehov: string; - checkboxLabelOnskerAtBehandlerBlirMed: string; + formLabels: FormLabelProps; isSubmitting: boolean; onSubmitForm: (svar: MotebehovSvarRequest) => void; } function MeldBehovForm({ - checkboxLabelHarBehov, - checkboxLabelOnskerAtBehandlerBlirMed, + formLabels: { + begrunnelseLabel, + begrunnelseDescription, + checkboxOnskerBehandlerMedLabel, + }, isSubmitting, onSubmitForm, }: Props) { @@ -59,101 +76,148 @@ function MeldBehovForm({ control, formState: { errors }, handleSubmit, + watch, } = useForm(); const errorList = useErrorSummaryFormatter(errors); + const isOnskerBehandlerDeltarChecked = watch(behandlerCheckbox); + const isHarBehovForTolkChecked = watch(tolkCheckbox); + + const begrunnelseDescriptionWithNoSensitiveInfoText = begrunnelseDescription + ? `${begrunnelseDescription} ${commonTexts.noSensitiveInfo}` + : commonTexts.noSensitiveInfo; + function onSubmit({ - behandlerCheckbox, - motebehovCheckbox, begrunnelseTextArea, - }: FormValues) { + behandlerCheckbox, + }: // TODO: Submit these fields as well + // onskerBehandlerBegrunnelseTextArea, + // tolkCheckbox, + // hvaSlagsgTolkTextField, + FormValues) { const forklaring = !!behandlerCheckbox - ? `${checkboxLabelOnskerAtBehandlerBlirMed} ${begrunnelseTextArea}` + ? `${texts.formLabels.onskerBehandlerMedBegrunnelseLabel} ${begrunnelseTextArea}` : begrunnelseTextArea; onSubmitForm({ - harMotebehov: !!motebehovCheckbox, + harMotebehov: true, forklaring, }); trackEvent(Events.SendMeldBehov); } return ( - <> - - {texts.aboutRequiredFields} - +
+ + + + ( +