vis informasjon om innsynsrett (#1300)

* mark en test akivitet som kassert

* Legg til tag kassert aktiviteter

* farge forandring på kassert tag

* endre tekst fra Kassert til Slettet

* Lagt til under 18 imformasjon på hva er aktivitestplan
tabben under rettigheter og personvern panel

* Forandret text på under 18 info på rettigheter og personvern panel

* Lagt til under 18 info box når man lager ny aktivitet og oppdatert info på hva er rettigheter og personvern panel

* Gjort om under 18 info på aktiviterts kort til komponent og skal bre vises når ekstern bruker er under 18

* gjort om om no info. og lagd egen accordian til under 18 på hva er aktivitetsplan

* wip

* ✨ Lag innsynsrettslice

* wip

* Fiks URL i mock

* Hent innsynsrett når appen starter

* Fikset sånn at over 18 ekstern brukere ikke ser under 18 info

* Tillatt innsynsrettkall kun for ekstern bruker

* clean up

* Rename

* Rename

* Fix

---------

Co-authored-by: johannetronstad <johanne.tronstad@nav.no>
Co-authored-by: Mads Lee Giil <mads.lee.giil@nav.no>

src/api/aktivitetAPI.ts

@@ -17,6 +17,10 @@ export const lagNyAktivitet = (aktivitet: VeilarbAktivitet, oppfolgingsperiodeId
 export const oppdaterAktivitet = (aktivitet: VeilarbAktivitet): Promise<VeilarbAktivitet> =>
     putAsJson(`${AKTIVITET_BASE_URL}/aktivitet/${aktivitet.id}`, aktivitet);
 
+export const hentInnsynsrett = (): Promise<{ foresatteHarInnsynsrett: boolean }> => {
+    return fetchToJson(`${AKTIVITET_BASE_URL}/ekstern/innsynsrett`);
+};
+
 export const settAktivitetTilAvtalt = (
     aktivitetId: string,
     aktivitetVersjon: string,

src/mocks/handlers.ts

@@ -159,7 +159,7 @@ export const handlers = [
         '/veilarbaktivitet/api/arkivering/journalfor',
         failOrGetResponse(journalforingFeiler, () => journalføring, 2000),
     ),
-
+    rest.get('/veilarbaktivitet/api/ekstern/innsynsrett', jsonResponse({ foresatteHarInnsynsrett: false })),
     // veilarblest
     rest.post('/veilarblest/api/aktivitetsplan/les', jsonResponse(lest)),
     rest.put('/veilarblest/api/informasjon/les', jsonResponse(lest)),

src/moduler/aktivitet/aktivitet-forms/behandling/MedisinskBehandlingForm.tsx

@@ -12,6 +12,7 @@ import AktivitetFormHeader from '../AktivitetFormHeader';
 import CustomErrorSummary from '../CustomErrorSummary';
 import { dateOrUndefined } from '../ijobb/AktivitetIjobbForm';
 import LagreAktivitetKnapp from '../LagreAktivitetKnapp';
+import { InnsynsrettInfo } from '../../innsynsrett/InnsynsrettInfo';
 
 const schema = z
     .object({
@@ -94,6 +95,7 @@ const MedisinskBehandlingForm = (props: Props) => {
             <FormProvider {...formHandlers}>
                 <div className="space-y-8">
                     <AktivitetFormHeader aktivitetstype={VeilarbAktivitetType.BEHANDLING_AKTIVITET_TYPE} />
+                    <InnsynsrettInfo/>
                     <TextField
                         disabled={avtalt}
                         label="Type behandling (obligatorisk)"

src/moduler/aktivitet/aktivitet-forms/egen/AktivitetEgenForm.tsx

@@ -13,6 +13,7 @@ import AktivitetFormHeader from '../AktivitetFormHeader';
 import CustomErrorSummary from '../CustomErrorSummary';
 import { dateOrUndefined } from '../ijobb/AktivitetIjobbForm';
 import LagreAktivitetKnapp from '../LagreAktivitetKnapp';
+import { InnsynsrettInfo } from '../../innsynsrett/InnsynsrettInfo';
 
 const schema = z
     .object({
@@ -104,6 +105,7 @@ const EgenAktivitetForm = (props: Props) => {
                 <div className="space-y-8">
                     <AktivitetFormHeader aktivitetstype={VeilarbAktivitetType.EGEN_AKTIVITET_TYPE} />
 
+                    <InnsynsrettInfo/>
                     <Malverk visible={erVeileder} endre={!!aktivitet} onChange={onMalChange} type="EGEN" />
 
                     <TextField

src/moduler/aktivitet/aktivitet-forms/ijobb/AktivitetIjobbForm.tsx

@@ -10,6 +10,7 @@ import MaybeAvtaltDateRangePicker from '../../../../felles-komponenter/skjema/da
 import AktivitetFormHeader from '../AktivitetFormHeader';
 import CustomErrorSummary from '../CustomErrorSummary';
 import LagreAktivitetKnapp from '../LagreAktivitetKnapp';
+import { InnsynsrettInfo } from '../../innsynsrett/InnsynsrettInfo';
 
 const schema = z.object({
     tittel: z.string().min(1, 'Du må fylle ut stillingstittel').max(100, 'Du må korte ned teksten til 100 tegn'),
@@ -80,6 +81,7 @@ const IJobbAktivitetForm = (props: Props) => {
             <FormProvider {...methods}>
                 <div className="space-y-8">
                     <AktivitetFormHeader aktivitetstype={VeilarbAktivitetType.IJOBB_AKTIVITET_TYPE} />
+                    <InnsynsrettInfo/>
                     <TextField
                         disabled={avtalt}
                         label="Stillingstittel (obligatorisk)"

src/moduler/aktivitet/aktivitet-forms/stilling/AktivitetStillingForm.tsx

@@ -11,6 +11,7 @@ import AktivitetFormHeader from '../AktivitetFormHeader';
 import CustomErrorSummary from '../CustomErrorSummary';
 import { dateOrUndefined } from '../ijobb/AktivitetIjobbForm';
 import LagreAktivitetKnapp from '../LagreAktivitetKnapp';
+import { InnsynsrettInfo } from '../../innsynsrett/InnsynsrettInfo';
 
 const schema = z.object({
     tittel: z.string().min(1, 'Du må fylle ut stillingstittel').max(100, 'Du må korte ned teksten til 100 tegn'),
@@ -69,6 +70,7 @@ const StillingAktivitetForm = (props: Props) => {
             <FormProvider {...formHandlers}>
                 <div className="space-y-8">
                     <AktivitetFormHeader aktivitetstype={VeilarbAktivitetType.STILLING_AKTIVITET_TYPE} />
+                    <InnsynsrettInfo/>
                     <TextField
                         disabled={avtalt}
                         label="Stillingstittel (obligatorisk)"

src/moduler/aktivitet/innsynsrett/InnsynsrettInfo.tsx

@@ -0,0 +1,11 @@
+import { GuidePanel } from '@navikt/ds-react';
+import { useSelector } from 'react-redux';
+import { selectInnsynsrett } from './innsynsrett-selector';
+
+export const InnsynsrettInfo = () => {
+    const innsynsrett = useSelector(selectInnsynsrett);
+
+    if (!innsynsrett || !innsynsrett.foresatteHarInnsynsrett) return null;
+
+    return <GuidePanel poster={true}>Husk at dine foresatte kan lese det du skriver her.</GuidePanel>;
+};

src/moduler/aktivitet/innsynsrett/innsynsrett-selector.ts

@@ -0,0 +1,5 @@
+import { RootState } from '../../../store';
+
+export const selectInnsynsrett = (state: RootState) => {
+    return state.data.innsynsrett.data;
+};

src/moduler/aktivitet/innsynsrett/innsynsrett-slice.ts

@@ -0,0 +1,19 @@
+import createGenericSlice, { Status } from '../../../createGenericSlice';
+import { createAsyncThunk } from '@reduxjs/toolkit';
+import * as Api from '../../../api/aktivitetAPI';
+
+interface Innsynsrett {
+    foresatteHarInnsynsrett: boolean | undefined;
+    status: Status;
+}
+
+const innsynsrettSlice = createGenericSlice<Innsynsrett>({
+    name: 'innsynsrett',
+    reducers: {},
+});
+
+export const hentInnsynsrett = createAsyncThunk(`${innsynsrettSlice.name}/fetchInnsynsrett`, async () => {
+    return await Api.hentInnsynsrett();
+});
+
+export const innsynsrettReducer = innsynsrettSlice.reducer;

src/moduler/aktivitet/visning/aktivitetingress/AktivitetIngress.tsx

@@ -6,7 +6,8 @@ import CustomBodyLong from '../hjelpekomponenter/CustomBodyLong';
 
 const aktivitetingress: Record<AktivitetType, string | ReactElement | undefined> = {
     BEHANDLING: (
-        <div className="mt-4">
+        <div className="mt-4 space-y-4">
+
             <BodyShort>
                 Her kan du legge inn medisinsk behandling som påvirker muligheten din til å jobbe eller være på kurs og
                 tiltak.

src/moduler/informasjon/informasjon-modal.tsx

@@ -17,6 +17,7 @@ import { DialogPanel } from './dialogPanel';
 import IntroduksjonVideo from './Video/IntroduksjonVideo';
 import { useNavigate } from 'react-router-dom';
 import { useRoutes } from '../../routing/useRoutes';
+import { InnsynsrettPanel } from './innsynsrettPanel';
 
 export const INFORMASJON_MODAL_VERSJON = 'v1';
 
@@ -51,6 +52,7 @@ const InformasjonModal = ({ erBruker, underOppfolging, lestInfo }: Props) => {
                 </BodyShort>
                 <IntroduksjonVideo />
                 <Accordion className="mt-4">
+                    <InnsynsrettPanel />
                     <BrukePlanenPanel />
                     <DialogPanel />
                     <OkonomiskStotte />

src/moduler/informasjon/innsynsrettPanel.tsx

@@ -0,0 +1,39 @@
+import { Accordion, BodyShort, Heading } from '@navikt/ds-react';
+import React, { useState } from 'react';
+import { logAccordionAapnet } from '../../amplitude/amplitude';
+
+export const InnsynsrettPanel = () => {
+    const [open, setOpen] = useState(false);
+
+    function handleClick() {
+        if (!open) {
+            logAccordionAapnet('Slik bruker du aktivitetsplanen');
+        }
+        setOpen(!open);
+    }
+
+    return (
+        <Accordion.Item>
+            <Accordion.Header onClick={handleClick}>
+                <Heading level="2" size="small">
+                    Er du under 18 år?
+                </Heading>
+            </Accordion.Header>
+            <Accordion.Content>
+                <Heading level="3" size="xsmall" className="pt-4">
+                    Er du under 18 år?
+                </Heading>
+                <BodyShort className="pb-4">
+                    Når du er under 18 år så har dine foreldre eller foresatte rett til innsyn i din sak. Det betyr at
+                    foreldrene dine kan be om å få se alt du skriver i NAV sine tjenester. Derfor bør du ikke skrive noe
+                    her som du ikke vil at foreldrene dine skal lese.
+                </BodyShort>
+
+                <BodyShort>
+                    Når du blir 18 år vil de ikke kunne lese nye ting du skriver, men de kan fortsatt lese det du skrev
+                    før du fylte 18 år
+                </BodyShort>
+            </Accordion.Content>
+        </Accordion.Item>
+    );
+};

src/reducer.ts

@@ -19,6 +19,7 @@ import oppfolgingReducer from './moduler/oppfolging-status/oppfolging-slice';
 import eskaleringsvarselReducer from './moduler/varslinger/eskaleringsvarsel-slice';
 import veilederReducer from './moduler/veileder/veileder-slice';
 import { arkivReducer } from './moduler/verktoylinje/arkivering/arkiv-slice';
+import { innsynsrettReducer } from './moduler/aktivitet/innsynsrett/innsynsrett-slice';
 
 const reducer = {
     data: combineReducers({
@@ -39,6 +40,7 @@ const reducer = {
         eskaleringsvarsel: eskaleringsvarselReducer,
         feature: featureReducer,
         errors: errorReducer,
+        innsynsrett: innsynsrettReducer,
     }),
     view: combineReducers({
         visteAktiviteterMedEndringer: aktivitetViewReducer,

src/routing/initialPageLoadThunk.ts

@@ -17,6 +17,7 @@ import { selectArenaAktivitetStatus } from '../moduler/aktivitet/arena-aktivitet
 import { selectAktivitetStatus } from '../moduler/aktivitet/aktivitet-selector';
 import { hentLest } from '../moduler/lest/lest-slice';
 import { selectLestStatus } from '../moduler/lest/lest-selector';
+import { hentInnsynsrett } from '../moduler/aktivitet/innsynsrett/innsynsrett-slice';
 
 const createFetchIfNotStartedThunk = (sliceLoader: CacheableSliceLoader) => {
     return createAsyncThunk('initialPageLoad/' + sliceLoader.key, async (isVeileder: boolean, thunkApi) => {
@@ -56,6 +57,7 @@ export const initialPageLoadThunks = {
     }),
     lest: createFetchIfNotStartedThunk({ fetchAction: hentLest, statusSelector: selectLestStatus, key: 'lest' }),
     dialoger: hentDialoger,
+    innsynsrett: hentInnsynsrett,
 } as const;
 
 interface CacheableSliceLoader {

src/routing/loaders.ts

@@ -19,6 +19,7 @@ export const initialPageLoader =
             aktiviteter: dispatch(thunks.aktiviteter(isVeileder)),
             arenaAktiviteter: dispatch(thunks.arenaAktiviteter(isVeileder)),
             lest: dispatch(thunks.lest(isVeileder)),
+            innsynsrett: !isVeileder ? dispatch(thunks.innsynsrett()) : undefined, // backend støtter foreløpig ikke at vi gjør dette kallet for veiledere
         });
     };
 

src/utils.test.ts

@@ -151,7 +151,6 @@ describe('app utils', () => {
             expect(datoComparator(undefined, '2014-02-16T23:00:00.000Z')).toBeLessThan(0);
         });
     });
-
     describe('storeForbokstaver', () => {
         it('Formatterer ord med stor forbokstav', () => {
             expect(storeForbokstaver('KARI')).toEqual('Kari');

src/utils/utils.ts

@@ -1,5 +1,7 @@
 import { ReactElement } from 'react';
 
+
+
 export function fn(value: any) {
     return typeof value === 'function' ? value : () => value;
 }