Håndtere sak uten behandlinger som vises

Author: frodehansen2

apps/dine-pleiepenger/api-mock-server/api-mock-server.js

@@ -6,6 +6,7 @@ const søknader = require('./mockdata/soknader.json');
 // const saker = require('./mockdata/saker-søknad-og-endring-ubehandlet.json');
 // const saker = require('./mockdata/saker-med-to-vedtak.json');
 // const saker = require('./mockdata/saker-uten-søknad-men-behandling.json');
+// const saker = require('./mockdata/saker-feiler.json');
 const saker = require('./mockdata/saker.json');
 
 server.use(express.json());

apps/dine-pleiepenger/api-mock-server/mockdata/saker-feiler.json

@@ -0,0 +1,19 @@
+[
+    {
+        "pleietrengende": {
+            "identitetsnummer": "11511767808",
+            "fødselsdato": "2017-11-11",
+            "fornavn": "INITIATIVRIK",
+            "mellomnavn": null,
+            "etternavn": "BRIS",
+            "aktørId": "2952714620922"
+        },
+        "sak": {
+            "saksnummer": "1DQB6Z8",
+            "saksbehandlingsFrist": null,
+            "fagsakYtelseType": { "kode": "PSB", "kodeverk": "FAGSAK_YTELSE" },
+            "ytelseType": "PSB",
+            "behandlinger": []
+        }
+    }
+]

apps/dine-pleiepenger/src/components/kontakt-oss/KontaktOss.stories.tsx

@@ -0,0 +1,16 @@
+import { Link } from '@navikt/ds-react';
+import React from 'react';
+import { ExternalLink } from '@navikt/ds-icons';
+import { browserEnv } from '../../utils/env';
+
+interface Props {
+    tekst: string;
+}
+
+const SkrivTilOssLenke: React.FunctionComponent<Props> = ({ tekst }) => (
+    <Link href={browserEnv.NEXT_PUBLIC_SKRIV_TIL_OSS}>
+        {tekst} <ExternalLink className="ml-1" role="presentation" />
+    </Link>
+);
+
+export default SkrivTilOssLenke;

apps/dine-pleiepenger/src/components/kontakt-oss/KontaktOss.tsx

@@ -1,4 +1,4 @@
-import { BodyShort, Box, Heading, Link, Switch, VStack } from '@navikt/ds-react';
+import { Alert, BodyLong, BodyShort, Box, Heading, Link, Switch, VStack } from '@navikt/ds-react';
 import React, { useState } from 'react';
 import { ChevronRightIcon } from '@navikt/aksel-icons';
 import { default as NextLink } from 'next/link';
@@ -7,7 +7,8 @@ import { formatSøknadshendelseTidspunkt, getAlleHendelserISak } from '../../uti
 import { Process } from '../process';
 import ProcessStep from '../process/ProcessStep';
 import { getProcessStepsFraSøknadshendelser } from './statusISakUtils';
-import { useMessages } from '../../i18n';
+import { Msg, useMessages } from '../../i18n';
+import SkrivTilOssLenke from '../lenker/SkrivTilOssLenke';
 
 interface Props {
     sak: Sak;
@@ -21,6 +22,20 @@ const StatusISak: React.FunctionComponent<Props> = ({ sak, visAlleHendelser, tit
     const hendelser = getAlleHendelserISak(sak);
     const processSteps = getProcessStepsFraSøknadshendelser(text, hendelser);
 
+    if (processSteps.length === 0) {
+        return (
+            <Alert variant="info">
+                <Msg
+                    id="statusISak.ingenHendelser"
+                    values={{
+                        p: (txt) => <BodyLong>{txt}</BodyLong>,
+                        lenke: <SkrivTilOssLenke tekst={text('statusISak.ingenHendelser.skrivTilOssLenkeTekst')} />,
+                    }}
+                />
+            </Alert>
+        );
+    }
+
     if (reverseDirection) {
         processSteps.reverse();
     }

apps/dine-pleiepenger/src/components/lenker/SkrivTilOssLenke.tsx

@@ -41,6 +41,10 @@ export const getProcessStepsFraSøknadshendelser = (text: TextFn, hendelser: Sø
     /** Aksjonspunkt skal ikke vises enda */
     const hendelserSomSkalVises = hendelser.filter((h) => h.type !== SøknadshendelseType.AKSJONSPUNKT);
 
+    if (hendelserSomSkalVises.length === 0) {
+        return [];
+    }
+
     const antall = hendelserSomSkalVises.length;
     const erFerdigBehandlet = hendelserSomSkalVises[antall - 1].type === SøknadshendelseType.FERDIG_BEHANDLET;
 

apps/dine-pleiepenger/src/components/status-i-sak/StatusISak.tsx

@@ -28,28 +28,31 @@ const VelgSakPage: React.FunctionComponent<Props> = ({ saker }) => {
                 </Heading>
 
                 <VStack gap="5" className="max-w-2xl mb-10">
-                    {saker.map((sak) => (
-                        <LinkPanel
-                            as={Link}
-                            border={false}
-                            href={`/sak/${sak.sak.saksnummer}`}
-                            key={sak.sak.saksnummer}>
-                            <LinkPanel.Title className="w-full">
-                                <Heading as="span" size="small">
-                                    {personaliaUtils.navn(sak.pleietrengende)}
-                                </Heading>
-                            </LinkPanel.Title>
-                            <LinkPanel.Description>
-                                <p>
-                                    <Msg
-                                        id="velgSak.barn.fdato"
-                                        values={{ dato: dateFormatter.full(sak.pleietrengende.fødselsdato) }}
-                                    />
-                                </p>
-                                <StatusTag {...getBehandlingsstatusISak(sak.sak)} />
-                            </LinkPanel.Description>
-                        </LinkPanel>
-                    ))}
+                    {saker.map((sak) => {
+                        const status = getBehandlingsstatusISak(sak.sak);
+                        return (
+                            <LinkPanel
+                                as={Link}
+                                border={false}
+                                href={`/sak/${sak.sak.saksnummer}`}
+                                key={sak.sak.saksnummer}>
+                                <LinkPanel.Title className="w-full">
+                                    <Heading as="span" size="small">
+                                        {personaliaUtils.navn(sak.pleietrengende)}
+                                    </Heading>
+                                </LinkPanel.Title>
+                                <LinkPanel.Description>
+                                    <p>
+                                        <Msg
+                                            id="velgSak.barn.fdato"
+                                            values={{ dato: dateFormatter.full(sak.pleietrengende.fødselsdato) }}
+                                        />
+                                    </p>
+                                    {status ? <StatusTag {...status} /> : null}
+                                </LinkPanel.Description>
+                            </LinkPanel>
+                        );
+                    })}
                 </VStack>
             </Box>
         </DefaultPageLayout>

apps/dine-pleiepenger/src/components/status-i-sak/statusISakUtils.tsx

@@ -116,6 +116,9 @@ export const nb = {
     'statusISak.forventetSvar.endring.tittel': 'Endringen er ferdig behandlet',
     'statusISak.forventetSvar.endring.info':
         'Endringsmeldingen vil oppdatere saken og du vil få ett nytt vedtaksbrev når endringene er ferdig behandlet.',
+    'statusISak.ingenHendelser':
+        '<p>Hei, vi kan enn så lenge ikke vise noen detaljert informasjon om saken din enda</p><p>Hvis du lurer på noe angående saken din, kan du ta kontakt via {lenke}.</p>',
+    'statusISak.ingenHendelser.skrivTilOssLenkeTekst': 'Skriv til oss',
 
     'venteårsakMelding.legeerklæring.tittel': 'Vi mangler legeerklæring',
     'venteårsakMelding.legeerklæring.lastOppHer': 'Last opp legeerklæring her',

apps/dine-pleiepenger/src/components/velg-sak-page/VelgSakPage.tsx

@@ -47,20 +47,20 @@ const SakPage: React.FunctionComponent<Props> = ({ sak, pleietrengende, saksbeha
                 <SakPageHeader
                     navn={navn}
                     saksnr={sak.saksnummer}
-                    titleTag={<StatusTag {...getBehandlingsstatusISak(sak)} />}
+                    titleTag={statusISak ? <StatusTag {...statusISak} /> : null}
                 />
             }>
             <Head>
                 <title>Din pleiepengesak - {navn}</title>
             </Head>
             <VStack gap="12">
-                {statusISak.venteårsak && statusISak.status !== Behandlingsstatus.AVSLUTTET ? (
+                {statusISak?.venteårsak && statusISak.status !== Behandlingsstatus.AVSLUTTET ? (
                     <VenteårsakMelding venteårsak={statusISak.venteårsak} />
                 ) : null}
                 <Box className="md:flex md:gap-6">
                     <div className="md:grow mb-10 md:mb-0">{<StatusISak sak={sak} tittel="Dette skjer i saken" />}</div>
                     <div className="md:mb-none shrink-0 md:w-72">
-                        {statusISak.status === Behandlingsstatus.AVSLUTTET ? null : (
+                        {statusISak === undefined || statusISak.status === Behandlingsstatus.AVSLUTTET ? null : (
                             <VStack gap="5">
                                 <Saksbehandlingstid
                                     frist={sak.saksbehandlingsFrist}

apps/dine-pleiepenger/src/i18n/nb.ts

@@ -19,7 +19,7 @@ dayjs.extend(utc);
 dayjs.extend(timezone);
 dayjs.locale('nb');
 
-const getSisteBehandlingISak = (sak: Sak): Behandling => {
+const getSisteBehandlingISak = (sak: Sak): Behandling | undefined => {
     return sortBy(sak.behandlinger, (b) => b.opprettetDato)[0];
 };
 
@@ -48,12 +48,14 @@ export const getBehandlingerISakSorted = (sak: Sak): Behandling[] => {
     return sortBehandlinger(sak.behandlinger);
 };
 
-export const getBehandlingsstatusISak = (sak: Sak): BehandlingsstatusISak => {
+export const getBehandlingsstatusISak = (sak: Sak): BehandlingsstatusISak | undefined => {
     const behandling = getSisteBehandlingISak(sak);
-    return {
-        status: behandling.status,
-        venteårsak: behandling.aksjonspunkter?.length > 0 ? behandling.aksjonspunkter[0]?.venteårsak : undefined,
-    };
+    return behandling
+        ? {
+              status: behandling.status,
+              venteårsak: behandling.aksjonspunkter?.length > 0 ? behandling.aksjonspunkter[0]?.venteårsak : undefined,
+          }
+        : undefined;
 };
 
 const mapSøknadTilSøknadshendelse = (søknad: Søknad): Søknadshendelse => {