fikset alert, maal, utskrift

navikt · Oct 3, 2023 · cdf3e28 · cdf3e28
1 parent 64b5553
commit cdf3e28
Show file tree

Hide file tree

Showing 14 changed files with 50 additions and 49 deletions.
diff --git a/src/felles-komponenter/modal/Modal.tsx b/src/felles-komponenter/modal/Modal.tsx
@@ -31,10 +31,8 @@ const Modal = (props: Props) => {
         children,
         avhengigheter,
         onRequestClose,
-        className,
         minstEnAvhengighet = false,
         feilmeldinger,
-        contentClass,
         tilbakeLenke,
         // ariaLabelledby,
         // contentLabel,
@@ -70,7 +68,7 @@ const Modal = (props: Props) => {
             </AkselModal.Header>
             <AkselModal.Body>
                 <div className="flex flex-col max-w-2xl mx-auto">
-                    <Heading className="text-text-subtle" level="2" size="small">
+                    <Heading className="" level="2" size="xsmall">
                         {subHeading}
                     </Heading>
                     {feilmeldinger && <Feilmelding feilmeldinger={feilmeldinger} />}

diff --git a/src/moduler/aktivitet/avslutt/BegrunnelseForm.tsx b/src/moduler/aktivitet/avslutt/BegrunnelseForm.tsx
@@ -1,5 +1,5 @@
 import { zodResolver } from '@hookform/resolvers/zod';
-import { Button, Heading, Textarea } from '@navikt/ds-react';
+import { Button, Textarea } from '@navikt/ds-react';
 import React from 'react';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
@@ -20,7 +20,7 @@ interface Props {
 }
 
 const BegrunnelseForm = (props: Props) => {
-    const { beskrivelseLabel, headerTekst, lagrer, onSubmit } = props;
+    const { beskrivelseLabel, lagrer, onSubmit } = props;
 
     const defaultValues: BegrunnelseFormValues = {
         begrunnelse: '',
@@ -42,11 +42,9 @@ const BegrunnelseForm = (props: Props) => {
     return (
         <form onSubmit={handleSubmit(onSubmit)}>
             <div>
-                <Heading level="1" size="large">
-                    {headerTekst}
-                </Heading>
                 <Textarea
-                    label={beskrivelseLabel}
+                    label="Begrunnelse"
+                    description={beskrivelseLabel}
                     maxLength={255}
                     disabled={lagrer}
                     {...register('begrunnelse')}

diff --git a/src/moduler/aktivitet/avslutt/FullforAktivitet.tsx b/src/moduler/aktivitet/avslutt/FullforAktivitet.tsx
@@ -37,7 +37,6 @@ const FullforAktivitet = () => {
 
     const begrunnelse = (
         <BegrunnelseForm
-            headerTekst={headerTekst}
             beskrivelseLabel={beskrivelseTekst}
             lagrer={lagrer}
             onSubmit={async (beskrivelseForm) => {

diff --git a/src/moduler/aktivitet/avslutt/PubliserReferat.tsx b/src/moduler/aktivitet/avslutt/PubliserReferat.tsx
@@ -22,7 +22,11 @@ const getManglerPubliseringTekst = (aktivitet: SamtalereferatAktivitet | MoteAkt
 
 const PubliserReferat = ({ aktivitet, nyStatus, children }: Props) => {
     if (manglerPubliseringAvSamtaleReferat(aktivitet, nyStatus)) {
-        return <Alert variant="error">{getManglerPubliseringTekst(aktivitet)}</Alert>;
+        return (
+            <Alert variant="error" inline>
+                {getManglerPubliseringTekst(aktivitet)}
+            </Alert>
+        );
     }
     return children;
 };

diff --git a/src/moduler/aktivitet/avslutt/vis-advarsel.tsx b/src/moduler/aktivitet/avslutt/vis-advarsel.tsx
@@ -1,18 +1,16 @@
-import { Alert, Button, Heading } from '@navikt/ds-react';
-import React from 'react';
+import { Alert, Button } from '@navikt/ds-react';
+import React, { MouseEventHandler } from 'react';
 
 interface Props {
-    headerTekst: string;
-    onSubmit: (value: any) => any;
+    onSubmit: MouseEventHandler<HTMLButtonElement>;
 }
 
-const VisAdvarsel = ({ onSubmit, headerTekst }: Props) => {
+const VisAdvarsel = ({ onSubmit }: Props) => {
     return (
         <div className="flex flex-col gap-8">
-            <Heading level="1" size="large">
-                {headerTekst}
-            </Heading>
-            <Alert variant="warning">Når du lagrer, blir aktiviteten låst og du kan ikke lenger endre innholdet.</Alert>
+            <Alert variant="warning" inline>
+                Når du lagrer, blir aktiviteten låst og du kan ikke lenger endre innholdet.
+            </Alert>
             <Button className="self-baseline" onClick={onSubmit}>
                 Lagre
             </Button>

diff --git a/src/moduler/aktivitet/visning/AktivitetvisningModal.test.tsx b/src/moduler/aktivitet/visning/AktivitetvisningModal.test.tsx
@@ -1,4 +1,3 @@
-import { Modal } from '@navikt/ds-react';
 import { configureStore } from '@reduxjs/toolkit';
 import { ToolkitStore } from '@reduxjs/toolkit/dist/configureStore';
 import { render } from '@testing-library/react';

diff --git a/src/moduler/mal-linje/MittMaal.tsx b/src/moduler/mal-linje/MittMaal.tsx
@@ -110,7 +110,7 @@ function MittMaal() {
         erNyEndringIMal(
             malData,
             useSelector(selectLestAktivitetsplan) as any,
-            useSelector(selectIdentitetData) as any
+            useSelector(selectIdentitetData) as any,
         ) && harSkriveTilgang;
 
     const noeHarFeilet = avhengigheter === 'ERROR';
@@ -158,7 +158,7 @@ function erNyEndringIMal(maal: Mal, aktivitetsplanLestInfo: Lest, me: Me): boole
 
     const maalLagdEtterSistLestAktivitetsplan = isAfter(
         parseISO(maal.dato),
-        parseISO(aktivitetsplanLestInfo.tidspunkt)
+        parseISO(aktivitetsplanLestInfo.tidspunkt),
     );
 
     return !sisteEndringVarFraMeg && !maal.lest && maalLagdEtterSistLestAktivitetsplan;

diff --git a/src/moduler/mal/mal-modal.tsx b/src/moduler/mal/mal-modal.tsx
@@ -7,14 +7,15 @@ import { selectHentMalListeFeil } from '../feilmelding/feil-selector';
 interface Props {
     children: React.ReactNode;
     onRequestClosed: () => void;
+    heading: string;
 }
 
 export function MalModal(props: Props) {
-    const { children } = props;
+    const { children, heading } = props;
     const feil = useSelector(selectHentMalListeFeil);
 
     return (
-        <Modal onRequestClose={props.onRequestClosed} feilmeldinger={feil} header={null} contentLabel={'Mitt mål'}>
+        <Modal onRequestClose={props.onRequestClosed} feilmeldinger={feil} heading={heading}>
             {children}
         </Modal>
     );

diff --git a/src/moduler/mal/mal.tsx b/src/moduler/mal/mal.tsx
@@ -49,13 +49,15 @@ const Mal = () => {
     };
 
     return (
-        <MalModal onRequestClosed={onModalRequestClosed}>
+        <MalModal
+            onRequestClosed={onModalRequestClosed}
+            heading={
+                viserHistoriskPeriode || !underOppfolging || !harSkriveTilgang
+                    ? 'Mitt mål fra en tidligere periode'
+                    : 'Mitt mål'
+            }
+        >
             <div>
-                <Heading id="modal-heading" level="1" size="large" className="mb-8">
-                    {viserHistoriskPeriode || !underOppfolging || !harSkriveTilgang
-                        ? 'Mitt mål fra en tidligere periode'
-                        : 'Mitt mål'}
-                </Heading>
                 <ReadMore className="mb-8" header="Tips til mål" defaultOpen={historiskeMal.length === 0}>
                     Skriv noen ord om hva som er målet ditt slik at vi kan veilede deg bedre.
                     <ul className="list-disc mt-4 pl-8">

diff --git a/src/moduler/oppfolging-status/oppfolging-selector.ts b/src/moduler/oppfolging-status/oppfolging-selector.ts
@@ -78,7 +78,7 @@ export function selectErUnderKvp(state: RootState) {
 }
 
 export function selectHarSkriveTilgang(state: RootState) {
-    return selectOppfolgingData(state)?.harSkriveTilgang;
+    return selectOppfolgingData(state)?.harSkriveTilgang || false;
 }
 
 export function selectKanReaktiveres(state: RootState) {
@@ -92,7 +92,7 @@ export function selectInaktiveringsDato(state: RootState) {
 export const selectHistoriskeOppfolgingsPerioder: (state: RootState) => HistoriskOppfolgingsperiode[] = createSelector(
     selectOppfolgingsPerioder,
     (oppfolgingsPerioder: Oppfolgingsperiode[]) =>
-        oppfolgingsPerioder.filter((p) => p.sluttDato) as HistoriskOppfolgingsperiode[]
+        oppfolgingsPerioder.filter((p) => p.sluttDato) as HistoriskOppfolgingsperiode[],
 );
 
 export const selectForrigeHistoriskeSluttDato: (store: RootState) => string | undefined = createSelector(
@@ -101,5 +101,5 @@ export const selectForrigeHistoriskeSluttDato: (store: RootState) => string | un
         historiskeOppfolgingsPerioder
             .map((p) => p.sluttDato)
             .sort()
-            .reverse()[0]
+            .reverse()[0],
 );
diff --git a/src/moduler/utskrift/AktivitetsplanPrint.tsx b/src/moduler/utskrift/AktivitetsplanPrint.tsx
@@ -115,7 +115,11 @@ const AktivitetsplanPrint = () => {
     const getPrompt = () => {
         if (steps[stepIndex] === STEP_MELDING_FORM) {
             return (
-                <Modal onClose={goBack} open>
+                <Modal
+                    onClose={goBack}
+                    open
+                    header={{ heading: `Aktivitetsplan for ${bruker.fornavn}`, closeButton: true }}
+                >
                     <Innholdslaster avhengigheter={avhengigheter}>
                         <PrintMeldingForm bruker={bruker} onSubmit={printMeldingSubmit} />
                     </Innholdslaster>
@@ -124,10 +128,12 @@ const AktivitetsplanPrint = () => {
         }
         if (steps[stepIndex] === STEP_VELG_PLAN) {
             return (
-                <Modal onClose={goBack} open>
-                    <Innholdslaster avhengigheter={avhengigheter}>
-                        <VelgPlanUtskriftForm kvpPerioder={kvpPerioder} onSubmit={velgPlanSubmit} />
-                    </Innholdslaster>
+                <Modal onClose={goBack} open header={{ heading: 'Velg hva du ønsker å skrive ut', closeButton: true }}>
+                    <Modal.Body>
+                        <Innholdslaster avhengigheter={avhengigheter}>
+                            <VelgPlanUtskriftForm kvpPerioder={kvpPerioder} onSubmit={velgPlanSubmit} />
+                        </Innholdslaster>
+                    </Modal.Body>
                 </Modal>
             );
         }

diff --git a/src/moduler/utskrift/PrintMeldingForm.tsx b/src/moduler/utskrift/PrintMeldingForm.tsx
@@ -44,9 +44,8 @@ const PrintMeldingForm = (props: Props) => {
     const begrunnelseValue = watch('beskrivelse');
 
     return (
-        <form onSubmit={handleSubmit((data) => submit(data))} className="p-4 space-y-8">
+        <form onSubmit={handleSubmit((data) => submit(data))} className="space-y-8">
             <div className="space-y-8">
-                <Heading size="large" level="1">{`Aktivitetsplan for ${bruker.fornavn}`}</Heading>
                 <Textarea
                     label="Rediger teksten under så den passer til brukeren."
                     maxLength={2000}

diff --git a/src/moduler/utskrift/velgPlan/KvpPlanValg.tsx b/src/moduler/utskrift/velgPlan/KvpPlanValg.tsx
@@ -33,7 +33,7 @@ const KvpPlanListeValg = (props: Props) => {
     const { kvpPerioder } = props;
 
     return (
-        <div className="pl-6">
+        <div className="">
             <UtskriftValg tittelId="KVP-perioden" tekstId="Du skriver ut innholdet i KVP-perioden" />
             {kvpPerioder &&
                 kvpPerioder.map((kvpPeriode) => (

diff --git a/src/moduler/utskrift/velgPlan/VelgPlanUtskriftForm.tsx b/src/moduler/utskrift/velgPlan/VelgPlanUtskriftForm.tsx
@@ -1,5 +1,5 @@
 import { zodResolver } from '@hookform/resolvers/zod/dist/zod';
-import { Button, Heading, Radio, RadioGroup } from '@navikt/ds-react';
+import { Button, Radio, RadioGroup } from '@navikt/ds-react';
 import React from 'react';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
@@ -34,13 +34,10 @@ const VelgPlanUtskriftForm = (props: Props) => {
     };
 
     return (
-        <form onSubmit={handleSubmit((data) => onSubmit(data))} className="p-4 space-y-8">
+        <form onSubmit={handleSubmit((data) => onSubmit(data))} className="space-y-8">
             <RadioGroup
-                legend={
-                    <Heading className="mb-4" level="1" size="medium">
-                        Velg hva du ønsker å skrive ut
-                    </Heading>
-                }
+                legend="Velg hva du ønsker å skrive ut"
+                hideLegend
                 defaultValue={'helePlanen'}
                 onChange={onChangeRadioGroup}
             >