IS-2649: Show content of oppfolgingsoppgave in oversikt

navikt · Nov 5, 2024 · f37c224 · f37c224
1 parent d23c1e5
commit f37c224
Show file tree

Hide file tree

Showing 5 changed files with 252 additions and 157 deletions.
diff --git a/src/api/types/personoversiktTypes.ts b/src/api/types/personoversiktTypes.ts
@@ -107,3 +107,34 @@ export enum Oppfolgingsgrunn {
   VURDER_ANNEN_YTELSE = 'VURDER_ANNEN_YTELSE',
   ANNET = 'ANNET',
 }
+
+export function oppfolgingsgrunnToString(
+  oppfolgingsgrunn: Oppfolgingsgrunn
+): string {
+  switch (oppfolgingsgrunn) {
+    case Oppfolgingsgrunn.TA_KONTAKT_SYKEMELDT:
+      return 'Ta kontakt med den sykmeldte';
+    case Oppfolgingsgrunn.TA_KONTAKT_ARBEIDSGIVER:
+      return 'Ta kontakt med arbeidsgiver';
+    case Oppfolgingsgrunn.TA_KONTAKT_BEHANDLER:
+      return 'Ta kontakt med behandler';
+    case Oppfolgingsgrunn.VURDER_DIALOGMOTE_SENERE:
+      return 'Vurder behov for dialogmøte';
+    case Oppfolgingsgrunn.FOLG_OPP_ETTER_NESTE_SYKMELDING:
+      return 'Følg opp etter neste sykmelding';
+    case Oppfolgingsgrunn.VURDER_TILTAK_BEHOV:
+      return 'Vurder behov for tiltak';
+    case Oppfolgingsgrunn.VURDER_ARBEIDSUFORHET:
+      return 'Vurder §8-4 - Arbeidsuførhet';
+    case Oppfolgingsgrunn.FRISKMELDING_TIL_ARBEIDSFORMIDLING:
+      return 'Vurder §8-5 - Friskmelding til arbeidsformidling';
+    case Oppfolgingsgrunn.VURDER_14A:
+      return 'Vurder §14a';
+    case Oppfolgingsgrunn.VURDER_ANNEN_YTELSE:
+      return 'Vurder annen ytelse';
+    case Oppfolgingsgrunn.ANNET:
+      return 'Annet';
+    default:
+      return 'Ukjent oppfølgingsgrunn';
+  }
+}
diff --git a/src/components/FristColumn.tsx → src/components/FristDataCell.tsx b/src/components/FristColumn.tsx → src/components/FristDataCell.tsx
@@ -5,12 +5,14 @@ import {
   FileTextIcon,
   HourglassTopFilledIcon,
 } from '@navikt/aksel-icons';
-import React, { ReactElement } from 'react';
+import React, { ReactElement, useState } from 'react';
 import {
   AktivitetskravStatus,
-  Oppfolgingsgrunn,
+  oppfolgingsgrunnToString,
 } from '@/api/types/personoversiktTypes';
-import { Tooltip } from '@navikt/ds-react';
+import { Button, Table, Tooltip } from '@navikt/ds-react';
+import OppfolgingsoppgaveModal from '@/components/OppfolgingsoppgaveModal';
+import * as Amplitude from '@/utils/amplitude';
 
 const texts = {
   tooltipAvventer: 'Avventer til',
@@ -21,8 +23,14 @@ const texts = {
   aktivitetskravvarselFrist: 'Aktivitetskrav: Svarfrist forhåndsvarsel',
 };
 
-interface FristColumnProps {
-  personData: PersonData;
+function logOppfolgingsOppgaveModalOpenEvent() {
+  Amplitude.logEvent({
+    type: Amplitude.EventType.ButtonClick,
+    data: {
+      url: window.location.href,
+      tekst: 'Åpnet oppfølgingsoppgave modal',
+    },
+  });
 }
 
 type Frist = {
@@ -35,45 +43,16 @@ const byFristAsc = (fristA: Frist, fristB: Frist) => {
   return fristA.date > fristB.date ? 1 : -1;
 };
 
-const oppfolgingsgrunnTekster = (
-  oppfolgingsgrunn: Oppfolgingsgrunn
-): string => {
-  switch (oppfolgingsgrunn) {
-    case Oppfolgingsgrunn.TA_KONTAKT_SYKEMELDT:
-      return 'Ta kontakt med den sykmeldte';
-    case Oppfolgingsgrunn.TA_KONTAKT_ARBEIDSGIVER:
-      return 'Ta kontakt med arbeidsgiver';
-    case Oppfolgingsgrunn.TA_KONTAKT_BEHANDLER:
-      return 'Ta kontakt med behandler';
-    case Oppfolgingsgrunn.VURDER_DIALOGMOTE_SENERE:
-      return 'Vurder behov for dialogmøte';
-    case Oppfolgingsgrunn.FOLG_OPP_ETTER_NESTE_SYKMELDING:
-      return 'Følg opp etter neste sykmelding';
-    case Oppfolgingsgrunn.VURDER_TILTAK_BEHOV:
-      return 'Vurder behov for tiltak';
-    case Oppfolgingsgrunn.VURDER_ARBEIDSUFORHET:
-      return 'Vurder §8-4 - Arbeidsuførhet';
-    case Oppfolgingsgrunn.FRISKMELDING_TIL_ARBEIDSFORMIDLING:
-      return 'Vurder §8-5 - Friskmelding til arbeidsformidling';
-    case Oppfolgingsgrunn.VURDER_14A:
-      return 'Vurder §14a';
-    case Oppfolgingsgrunn.VURDER_ANNEN_YTELSE:
-      return 'Vurder annen ytelse';
-    case Oppfolgingsgrunn.ANNET:
-      return 'Annet';
-    default:
-      return 'Ukjent oppfølgingsgrunn';
-  }
-};
-
-export const FristColumn = ({ personData }: FristColumnProps) => {
-  const {
+function fristerInfo(
+  {
     oppfolgingsoppgave,
     friskmeldingTilArbeidsformidlingFom,
     arbeidsuforhetvurdering,
     aktivitetskravvurdering,
     manglendeMedvirkning,
-  } = personData;
+  }: PersonData,
+  setIsModalOpen: (open: boolean) => void
+): Frist[] {
   const frister: Frist[] = [];
   const aktivitetskravStatus = aktivitetskravvurdering?.status;
   const aktivitetskravVurderingFrist =
@@ -108,9 +87,19 @@ export const FristColumn = ({ personData }: FristColumnProps) => {
   }
   if (oppfolgingsoppgave?.frist) {
     frister.push({
-      icon: () => <FileTextIcon aria-hidden fontSize="1.5rem" />,
+      icon: () => (
+        <Button
+          size="xsmall"
+          icon={<FileTextIcon aria-hidden fontSize="1.5rem" />}
+          className="mr-1"
+          onClick={() => {
+            setIsModalOpen(true);
+            logOppfolgingsOppgaveModalOpenEvent();
+          }}
+        />
+      ),
       date: oppfolgingsoppgave.frist,
-      tooltip: `${oppfolgingsgrunnTekster(
+      tooltip: `${oppfolgingsgrunnToString(
         oppfolgingsoppgave.oppfolgingsgrunn
       )}`,
     });
@@ -139,9 +128,19 @@ export const FristColumn = ({ personData }: FristColumnProps) => {
       tooltip: texts.manglendeMedvirkningVarselFrist,
     });
   }
+  return frister;
+}
+
+interface Props {
+  personData: PersonData;
+}
+
+export function FristDataCell({ personData }: Props) {
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const frister: Frist[] = fristerInfo(personData, setIsModalOpen);
 
   return (
-    <>
+    <Table.DataCell textSize="small">
       {frister.sort(byFristAsc).map(({ date, icon, tooltip }, index) => (
         <div key={index} className="flex flex-wrap items-center">
           <Tooltip content={tooltip} arrow={false}>
@@ -150,6 +149,13 @@ export const FristColumn = ({ personData }: FristColumnProps) => {
           <div>{toReadableDate(date)}</div>
         </div>
       ))}
-    </>
+      {personData.oppfolgingsoppgave && (
+        <OppfolgingsoppgaveModal
+          open={isModalOpen}
+          setOpen={setIsModalOpen}
+          oppfolgingsoppgave={personData.oppfolgingsoppgave}
+        />
+      )}
+    </Table.DataCell>
   );
-};
+}