IS-1801: Innstilling om stans vurdering aktivitetskrav

Author: vetlesolgaard

src/data/aktivitetskrav/aktivitetskravTypes.ts

@@ -88,7 +88,9 @@ export type VurderingArsak =
   | OppfyltVurderingArsak
   | IkkeAktuellArsak;
 
-export interface CreateAktivitetskravVurderingDTO {
+export interface NewVurderingDTO {}
+
+export interface CreateAktivitetskravVurderingDTO extends NewVurderingDTO {
   status: AktivitetskravStatus;
   beskrivelse?: string;
   arsaker: VurderingArsak[];
@@ -102,6 +104,13 @@ export interface SendForhandsvarselDTO {
   frist: Date;
 }
 
+export interface InnstillingOmStansVurderingDTO extends NewVurderingDTO {
+  status: AktivitetskravStatus.STANS;
+  stansFom: Date;
+  beskrivelse?: string;
+  document?: DocumentComponentDto[];
+}
+
 export interface NewAktivitetskravDTO {
   previousAktivitetskravUuid: string;
 }

src/data/aktivitetskrav/useVurderAktivitetskrav.ts

@@ -1,6 +1,6 @@
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { ISAKTIVITETSKRAV_ROOT } from "@/apiConstants";
-import { CreateAktivitetskravVurderingDTO } from "@/data/aktivitetskrav/aktivitetskravTypes";
+import { NewVurderingDTO } from "@/data/aktivitetskrav/aktivitetskravTypes";
 import { post } from "@/api/axios";
 import { aktivitetskravQueryKeys } from "@/data/aktivitetskrav/aktivitetskravQueryHooks";
 import { useValgtPersonident } from "@/hooks/useValgtBruker";
@@ -9,9 +9,8 @@ export const useVurderAktivitetskrav = (aktivitetskravUuid: string) => {
   const personident = useValgtPersonident();
   const queryClient = useQueryClient();
   const path = `${ISAKTIVITETSKRAV_ROOT}/aktivitetskrav/${aktivitetskravUuid}/vurder`;
-  const postVurderAktivitetskrav = (
-    vurdering: CreateAktivitetskravVurderingDTO
-  ) => post(path, vurdering, personident);
+  const postVurderAktivitetskrav = (vurdering: NewVurderingDTO) =>
+    post(path, vurdering, personident);
 
   return useMutation({
     mutationFn: postVurderAktivitetskrav,

src/mocks/isaktivitetskrav/aktivitetskravMock.ts

@@ -194,17 +194,11 @@ const aktivitetskravForhandsvarsel: AktivitetskravDTO = {
       varsel: {
         uuid: varselUuid,
         createdAt: daysFromToday(-2),
-        svarfrist: daysFromToday(19),
+        svarfrist: daysFromToday(-2),
         document: getForhandsvarselDocument(begrunnelse, daysFromToday(1)),
       },
     },
   ],
 };
 
-export const aktivitetskravMock = [
-  aktivitetskravNy,
-  aktivitetskravAutomatiskOppfylt,
-  aktivitetskravOppfylt,
-  aktivitetskravUnntak,
-  aktivitetskravForhandsvarsel,
-];
+export const aktivitetskravMock = [aktivitetskravForhandsvarsel];

src/sider/aktivitetskrav/useAktivitetskravNotificationAlert.ts

@@ -7,6 +7,7 @@ type AktivitetskravStatusSuccess =
   | AktivitetskravStatus.OPPFYLT
   | AktivitetskravStatus.UNNTAK
   | AktivitetskravStatus.IKKE_OPPFYLT
+  | AktivitetskravStatus.STANS
   | AktivitetskravStatus.IKKE_AKTUELL;
 
 export const useAktivitetskravNotificationAlert = () => {

src/sider/aktivitetskrav/vurdering/ForhandsvarselOppsummering.tsx

@@ -10,15 +10,15 @@ const texts = {
   merInfo: "Husk å sjekke Gosys og Modia for mer informasjon før du vurderer. ",
 };
 
-interface ForhandsvarselOppsummeringProps {
+interface Props {
   varsel: AktivitetskravVarselDTO;
   beskrivelse: string | undefined;
 }
 
-export const ForhandsvarselOppsummering = ({
+export default function ForhandsvarselOppsummering({
   varsel,
   beskrivelse,
-}: ForhandsvarselOppsummeringProps) => {
+}: Props) {
   const fristDato = tilLesbarDatoMedArUtenManedNavn(varsel.svarfrist);
 
   return (
@@ -38,4 +38,4 @@ export const ForhandsvarselOppsummering = ({
       <BodyShort>{texts.merInfo}</BodyShort>
     </Panel>
   );
-};
+}

src/sider/aktivitetskrav/vurdering/IkkeOppfyltAktivitetskravSkjema.tsx

@@ -1,54 +1,116 @@
 import {
   AktivitetskravStatus,
-  CreateAktivitetskravVurderingDTO,
+  InnstillingOmStansVurderingDTO,
 } from "@/data/aktivitetskrav/aktivitetskravTypes";
 import React from "react";
 import { useVurderAktivitetskrav } from "@/data/aktivitetskrav/useVurderAktivitetskrav";
 import { SkjemaHeading } from "@/sider/aktivitetskrav/vurdering/SkjemaHeading";
 import { SkjemaInnsendingFeil } from "@/components/SkjemaInnsendingFeil";
-import { VurderAktivitetskravSkjemaProps } from "@/sider/aktivitetskrav/vurdering/vurderAktivitetskravSkjemaTypes";
-import { Button } from "@navikt/ds-react";
-import { ButtonRow } from "@/components/Layout";
+import { Button, DatePicker, Textarea, useDatepicker } from "@navikt/ds-react";
 import { useAktivitetskravNotificationAlert } from "@/sider/aktivitetskrav/useAktivitetskravNotificationAlert";
+import { useForm } from "react-hook-form";
 
 const texts = {
   lagre: "Lagre",
   avbryt: "Avbryt",
   title: "Ikke oppfylt",
+  form: {
+    stansDatoLabel: "Stans gjelder fra (obligatorisk)",
+    missingStansDato: "Vennligst angi stansdato",
+    begrunnelseLabel: "Begrunnelse (obligatorisk)",
+    missingBegrunnelse: "Vennligst angi begrunnelse",
+  },
   subtitle1:
     "Innstilling må skrives og sendes til NAY i Gosys. Ved å lagre fjerner du hendelsen fra oversikten.",
 };
 
-export const IkkeOppfyltAktivitetskravSkjema = ({
+const begrunnelseMaxLength = 5000;
+
+interface FormValues {
+  stansFom: Date;
+  begrunnelse: string;
+}
+
+interface Props {
+  aktivitetskravUuid: string;
+  varselSvarfrist: Date;
+}
+
+export default function IkkeOppfyltAktivitetskravSkjema({
   aktivitetskravUuid,
-}: VurderAktivitetskravSkjemaProps) => {
+  varselSvarfrist,
+}: Props) {
+  const formMethods = useForm<FormValues>();
+  const {
+    register,
+    watch,
+    formState: { errors },
+    handleSubmit,
+    setValue,
+    clearErrors,
+  } = formMethods;
   const vurderAktivitetskrav = useVurderAktivitetskrav(aktivitetskravUuid);
   const { displayNotification } = useAktivitetskravNotificationAlert();
 
-  const submit = () => {
-    const status = AktivitetskravStatus.IKKE_OPPFYLT;
-    const createAktivitetskravVurderingDTO: CreateAktivitetskravVurderingDTO = {
-      status,
-      arsaker: [],
+  function submit(values: FormValues) {
+    const createAktivitetskravVurderingDTO: InnstillingOmStansVurderingDTO = {
+      status: AktivitetskravStatus.STANS,
+      stansFom: values.stansFom,
+      beskrivelse: values.begrunnelse,
     };
     vurderAktivitetskrav.mutate(createAktivitetskravVurderingDTO, {
       onSuccess: () => {
-        displayNotification(status);
+        displayNotification(AktivitetskravStatus.STANS);
       },
     });
-  };
+  }
+
+  const { datepickerProps, inputProps } = useDatepicker({
+    fromDate: varselSvarfrist,
+    onDateChange: (date: Date | undefined) => {
+      if (!!date) {
+        setValue("stansFom", date);
+        clearErrors("stansFom");
+      }
+    },
+  });
 
   return (
-    <>
+    <form onSubmit={handleSubmit(submit)}>
       <SkjemaHeading title={texts.title} subtitles={[texts.subtitle1]} />
       {vurderAktivitetskrav.isError && (
         <SkjemaInnsendingFeil error={vurderAktivitetskrav.error} />
       )}
-      <ButtonRow>
-        <Button loading={vurderAktivitetskrav.isPending} onClick={submit}>
-          {texts.lagre}
-        </Button>
-      </ButtonRow>
-    </>
+      <DatePicker {...datepickerProps} strategy="fixed">
+        <DatePicker.Input
+          {...inputProps}
+          size="small"
+          label={texts.form.stansDatoLabel}
+          {...register("stansFom", {
+            required: texts.form.missingStansDato,
+          })}
+          error={errors.stansFom?.message}
+          className="mb-4"
+        />
+      </DatePicker>
+
+      <Textarea
+        {...register("begrunnelse", {
+          maxLength: begrunnelseMaxLength,
+          required: texts.form.missingBegrunnelse,
+        })}
+        value={watch("begrunnelse")}
+        label={texts.form.begrunnelseLabel}
+        error={errors.begrunnelse?.message}
+        size="small"
+        minRows={6}
+        maxLength={begrunnelseMaxLength}
+        className="mb-4"
+      />
+
+      <Button loading={vurderAktivitetskrav.isPending} type="submit">
+        {texts.lagre}
+      </Button>
+    </form>
   );
-};
+}

src/sider/aktivitetskrav/vurdering/VurderAktivitetskrav.tsx

@@ -9,7 +9,7 @@ import { VurderAktivitetskravButtons } from "@/sider/aktivitetskrav/vurdering/Vu
 import { GjelderOppfolgingstilfelle } from "@/sider/aktivitetskrav/GjelderOppfolgingstilfelle";
 import { useOppfolgingstilfellePersonQuery } from "@/data/oppfolgingstilfelle/person/oppfolgingstilfellePersonQueryHooks";
 import { AktivitetskravVurderingAlert } from "@/sider/aktivitetskrav/vurdering/AktivitetskravVurderingAlert";
-import { ForhandsvarselOppsummering } from "@/sider/aktivitetskrav/vurdering/ForhandsvarselOppsummering";
+import ForhandsvarselOppsummering from "@/sider/aktivitetskrav/vurdering/ForhandsvarselOppsummering";
 import {
   isDateInOppfolgingstilfelle,
   OppfolgingstilfelleDTO,

src/sider/aktivitetskrav/vurdering/VurderAktivitetskravTabs.tsx

@@ -7,7 +7,7 @@ import { Tabs } from "@navikt/ds-react";
 import { UnntakAktivitetskravSkjema } from "@/sider/aktivitetskrav/vurdering/UnntakAktivitetskravSkjema";
 import { OppfyltAktivitetskravSkjema } from "@/sider/aktivitetskrav/vurdering/OppfyltAktivitetskravSkjema";
 import { SendForhandsvarselSkjema } from "@/sider/aktivitetskrav/vurdering/SendForhandsvarselSkjema";
-import { IkkeOppfyltAktivitetskravSkjema } from "@/sider/aktivitetskrav/vurdering/IkkeOppfyltAktivitetskravSkjema";
+import IkkeOppfyltAktivitetskravSkjema from "@/sider/aktivitetskrav/vurdering/IkkeOppfyltAktivitetskravSkjema";
 import styled from "styled-components";
 import { isExpiredForhandsvarsel } from "@/utils/datoUtils";
 
@@ -44,13 +44,11 @@ const isValidStateForForhandsvarsel = (
   );
 };
 
-interface VurderAktivitetskravTabsProps {
+interface Props {
   aktivitetskrav: AktivitetskravDTO;
 }
 
-export const VurderAktivitetskravTabs = ({
-  aktivitetskrav,
-}: VurderAktivitetskravTabsProps) => {
+export const VurderAktivitetskravTabs = ({ aktivitetskrav }: Props) => {
   const latestVurdering = aktivitetskrav.vurderinger[0];
   const isIkkeOppfyltTabVisible =
     latestVurdering &&
@@ -84,10 +82,11 @@ export const VurderAktivitetskravTabs = ({
           <SendForhandsvarselSkjema aktivitetskravUuid={aktivitetskravUuid} />
         </Tabs.Panel>
       )}
-      {isIkkeOppfyltTabVisible && (
+      {isIkkeOppfyltTabVisible && !!latestVurdering.varsel?.svarfrist && (
         <Tabs.Panel value={Tab.IKKE_OPPFYLT}>
           <IkkeOppfyltAktivitetskravSkjema
             aktivitetskravUuid={aktivitetskravUuid}
+            varselSvarfrist={latestVurdering.varsel?.svarfrist}
           />
         </Tabs.Panel>
       )}

src/utils/datoUtils.ts

@@ -298,14 +298,12 @@ export const getWeeksBetween = (date1, date2): number => {
   return Math.abs(dayjs(date1).diff(date2, "week"));
 };
 
-export const isExpiredForhandsvarsel = (
-  svarfrist: Date | undefined
-): boolean => {
+export function isExpiredForhandsvarsel(svarfrist: Date | undefined): boolean {
   if (svarfrist) {
     const frist = dayjs(svarfrist);
     const today = dayjs(new Date());
     return frist.isBefore(today, "date");
+  } else {
+    return false;
   }
-
-  return false;
-};
+}