Merge remote-tracking branch 'origin/kontantstøttePerioder' into kont…

…antstøttePerioder

src/frontend/App/context/toggles.ts

@@ -18,6 +18,7 @@ export enum ToggleName {
 
     // Release-toggles
     konvertereDelmalblokkTilHtmlFelt = 'familie.ef.sak.konverter-delmalblokk-til-html-input',
+    visMarkereGodkjenneVedtakOppgaveModal = 'familie.ef.sak.vis-markere-godkjenne-vedtak-oppgave-modal',
 
     // Midlertidige toggles - kan fjernes etterhvert
 }

src/frontend/App/hooks/useHentOppgaver.ts

@@ -0,0 +1,31 @@
+import { byggHenterRessurs, byggTomRessurs, Ressurs } from '../typer/ressurs';
+import { useApp } from '../context/AppContext';
+import { useCallback, useState } from 'react';
+import { IOppgaveRequest } from '../../Komponenter/Oppgavebenk/typer/oppgaverequest';
+import { IOppgave } from '../../Komponenter/Oppgavebenk/typer/oppgave';
+
+export interface IOppgaverResponse {
+    antallTreffTotalt: number;
+    oppgaver: IOppgave[];
+}
+
+export const useHentOppgaver = () => {
+    const { axiosRequest } = useApp();
+    const [oppgaver, settOppgaver] = useState<Ressurs<IOppgaverResponse>>(byggTomRessurs());
+
+    const hentOppgaver = useCallback(
+        (data: IOppgaveRequest) => {
+            settOppgaver(byggHenterRessurs());
+            axiosRequest<IOppgaverResponse, IOppgaveRequest>({
+                method: 'POST',
+                url: `/familie-ef-sak/api/oppgave/soek`,
+                data,
+            }).then((res: Ressurs<IOppgaverResponse>) => {
+                settOppgaver(res);
+            });
+        },
+        [axiosRequest]
+    );
+
+    return { hentOppgaver, oppgaver };
+};

src/frontend/App/hooks/useHentOppgaverForOpprettelse.ts

@@ -1,63 +1,44 @@
-import { RessursFeilet, RessursStatus, RessursSuksess } from '../typer/ressurs';
+import { byggTomRessurs, Ressurs } from '../typer/ressurs';
 import { useApp } from '../context/AppContext';
-import { useCallback, useState, useEffect } from 'react';
+import { useCallback, useState } from 'react';
 import { OppgaveTypeForOpprettelse } from '../../Komponenter/Behandling/Totrinnskontroll/oppgaveForOpprettelseTyper';
-
-export interface IOppgaverForOpprettelse {
-    feilmelding: string | undefined;
-    hentOppgaverForOpprettelse: (behandlingId: string) => void;
-    oppgavetyperSomKanOpprettes: OppgaveTypeForOpprettelse[];
-    oppgavetyperSomSkalOpprettes: OppgaveTypeForOpprettelse[];
-    settOppgavetyperSomSkalOpprettes: React.Dispatch<
-        React.SetStateAction<OppgaveTypeForOpprettelse[]>
-    >;
+import { AxiosRequestConfig } from 'axios';
+import { useRerunnableEffect } from '../hooks/felles/useRerunnableEffect';
+interface OppgaverForOpprettelseRequest {
+    hentOppgaverForOpprettelseCallback: {
+        rerun: () => void;
+    };
+    oppgaverForOpprettelse: Ressurs<OppgaverForOpprettelse>;
 }
 
-interface OppgaverForOpprettelseRequest {
+interface OppgaverForOpprettelse {
     oppgavetyperSomKanOpprettes: OppgaveTypeForOpprettelse[];
     oppgavetyperSomSkalOpprettes: OppgaveTypeForOpprettelse[];
 }
 
-export const useHentOppgaverForOpprettelse = (behandlingId: string): IOppgaverForOpprettelse => {
+export const useHentOppgaverForOpprettelse = (
+    behandlingId: string
+): OppgaverForOpprettelseRequest => {
     const { axiosRequest } = useApp();
-    const [oppgavetyperSomKanOpprettes, settOppgavetyperSomKanOpprettes] = useState<
-        OppgaveTypeForOpprettelse[]
-    >([]);
-    const [oppgavetyperSomSkalOpprettes, settOppgavetyperSomSkalOpprettes] = useState<
-        OppgaveTypeForOpprettelse[]
-    >([]);
-    const [feilmelding, settFeilmelding] = useState<string>();
 
-    const hentOppgaverForOpprettelse = useCallback(
-        (behandlingId: string) => {
-            settFeilmelding(undefined);
-            axiosRequest<OppgaverForOpprettelseRequest, undefined>({
+    const [oppgaverForOpprettelse, settOppgaverForOpprettelse] =
+        useState<Ressurs<OppgaverForOpprettelse>>(byggTomRessurs());
+
+    const hentOppgaverForOpprettelseCallback = useRerunnableEffect(
+        useCallback(() => {
+            const behandlingConfig: AxiosRequestConfig = {
                 method: 'GET',
                 url: `/familie-ef-sak/api/oppgaverforopprettelse/${behandlingId}`,
-            }).then((res: RessursSuksess<OppgaverForOpprettelseRequest> | RessursFeilet) => {
-                if (res.status === RessursStatus.SUKSESS) {
-                    settOppgavetyperSomSkalOpprettes(res.data.oppgavetyperSomSkalOpprettes);
-                    settOppgavetyperSomKanOpprettes(res.data.oppgavetyperSomKanOpprettes);
-                } else {
-                    settFeilmelding(
-                        'Noe gikk galt under henting av oppgaver som kan opprettes. Forsøk å last siden på nytt. ' +
-                            res.frontendFeilmelding
-                    );
-                }
-            });
-        },
-        [axiosRequest]
+            };
+            axiosRequest<OppgaverForOpprettelse, null>(behandlingConfig).then(
+                (res: Ressurs<OppgaverForOpprettelse>) => settOppgaverForOpprettelse(res)
+            );
+        }, [axiosRequest, behandlingId]),
+        [axiosRequest, behandlingId]
     );
 
-    useEffect(() => {
-        hentOppgaverForOpprettelse(behandlingId);
-    }, [behandlingId, hentOppgaverForOpprettelse]);
-
     return {
-        feilmelding,
-        hentOppgaverForOpprettelse,
-        oppgavetyperSomKanOpprettes,
-        oppgavetyperSomSkalOpprettes,
-        settOppgavetyperSomSkalOpprettes,
+        oppgaverForOpprettelse,
+        hentOppgaverForOpprettelseCallback,
     };
 };

src/frontend/App/hooks/useVerdierForBrev.ts

@@ -167,3 +167,12 @@ export const beregnTiProsentØkningIMånedsinntekt = (årsinntekt: number) =>
 
 export const beregnTiProsentReduksjonIMånedsinntekt = (årsinntekt: number) =>
     formaterTallMedTusenSkille(Math.floor((årsinntekt / 12) * 0.9));
+
+export const genererBeregnetInntektsTekst = (årsinntekt: number): string => {
+    const minusTi = beregnTiProsentReduksjonIMånedsinntekt(årsinntekt);
+    const plusTi = beregnTiProsentØkningIMånedsinntekt(årsinntekt);
+
+    return `Forventet årsinntekt fra [DATO]: ${formaterTallMedTusenSkille(årsinntekt)} kroner.
+    - 10 % ned: ${minusTi} kroner per måned.
+    - 10 % opp: ${plusTi} kroner per måned.`;
+};

src/frontend/App/typer/revurderingstype.ts

@@ -13,7 +13,7 @@ export interface BarnForRevurdering {
     fødselsdato: string;
 }
 
-export interface RevurderingInnhold {
+export interface RevurderingPayload {
     fagsakId: string;
     behandlingsårsak: Behandlingsårsak;
     kravMottatt: string;

src/frontend/App/utils/miljø.ts

@@ -3,7 +3,7 @@ export const erProd = (): boolean => window.location.host === 'ensligmorellerfar
 export const tilbakekrevingBaseUrl = (): string =>
     erProd()
         ? 'https://familietilbakekreving.intern.nav.no'
-        : 'https://familie-tilbake-frontend.ansatt.dev.nav.no';
+        : 'https://tilbakekreving.ansatt.dev.nav.no';
 
 export const klageBaseUrl = (): string =>
     erProd() ? 'https://familie-klage.intern.nav.no' : 'https://familie-klage.ansatt.dev.nav.no';

src/frontend/Felles/Divider/Divider.tsx

@@ -0,0 +1,11 @@
+import React, { FC } from 'react';
+import styled from 'styled-components';
+import { AGray900 } from '@navikt/ds-tokens/dist/tokens';
+
+export const StyledDiv = styled.div<{ $farge: string }>`
+    border-bottom: 2px solid ${({ $farge }) => $farge};
+`;
+
+export const Divider: FC<{ farge?: string }> = ({ farge = `${AGray900}` }) => {
+    return <StyledDiv $farge={farge} />;
+};

src/frontend/Felles/HeaderMedSøk/SøkeresultatVisning.tsx

@@ -5,15 +5,16 @@ import { BodyShort, HStack } from '@navikt/ds-react';
 import { formaterPersonIdent } from '@navikt/familie-header/dist/søk/formatter';
 import { AlertWarning } from '../Visningskomponenter/Alerts';
 import { adressebeskyttelsestyper } from './adressebeskyttelsegradering';
+import { AFontSizeSmall, AGray100, AOrange300 } from '@navikt/ds-tokens/dist/tokens';
 
 const ResultatElement = styled.div<{ $fokus: boolean }>`
     list-style-type: none;
     padding: 0.5rem;
-    outline: ${({ $fokus }) => ($fokus ? `3px solid var(--a-orange-300)` : '')};
+    outline: ${({ $fokus }) => ($fokus ? `3px solid ${AOrange300}` : '')};
     border-radius: 8px;
 
     &:hover {
-        background-color: var(--a-gray-100);
+        background-color: ${AGray100};
         cursor: pointer;
     }
 `;
@@ -24,7 +25,7 @@ const ResultatIkonOgRolle = styled.div`
     padding-right: 1rem;
     align-items: center;
     min-width: 3.5rem;
-    font-size: var(--a-font-size-small);
+    font-size: ${AFontSizeSmall};
 
     svg {
         text-align: center;

src/frontend/Felles/HtmlEditor/HtmlEditor.tsx

@@ -3,7 +3,8 @@ import React, { forwardRef, useEffect, useLayoutEffect, useRef, useState } from
 import 'quill/dist/quill.snow.css';
 import { BlockBlot } from 'parchment';
 import { AlertError } from '../Visningskomponenter/Alerts';
-
+import styled from 'styled-components';
+import { ASurfaceDefault, ATextSubtle } from '@navikt/ds-tokens/dist/tokens';
 type Props = {
     defaultValue?: string;
     onTextChange: (html: string, renTekst: string) => void;
@@ -18,6 +19,42 @@ Block.tagName = 'div';
 // @ts-expect-error Utypet kode - usikkert hvordan vi får dette til
 Quill.register(Block);
 
+const HtmlEditorWrapper = styled.div`
+    .ql-bold {
+        &:hover::after,
+        &:active::after,
+        &:focus::after {
+            content: 'Fet skrift';
+        }
+    }
+    .ql-clean {
+        &:hover::after,
+        &:active::after,
+        &:focus::after {
+            content: 'Fjern formattering';
+        }
+    }
+    .ql-list {
+        &:hover::after,
+        &:active::after,
+        &:focus::after {
+            content: 'Liste';
+        }
+    }
+    .ql-list,
+    .ql-bold,
+    .ql-clean {
+        &:hover::after,
+        &:active::after,
+        &:focus::after {
+            font-size: 0.8rem;
+            background-color: ${ASurfaceDefault};
+            color: ${ATextSubtle} !important;
+            white-space: nowrap;
+            padding: 0.3rem;
+        }
+    }
+`;
 export const HtmlEditor = forwardRef(({ defaultValue, onTextChange }: Props, ref) => {
     const defaultValueRef = useRef(defaultValue);
     const containerRef = useRef<HTMLDivElement>(null);
@@ -38,7 +75,7 @@ export const HtmlEditor = forwardRef(({ defaultValue, onTextChange }: Props, ref
         settFeilVedOpprettelse(false);
         const editorContainer = container.appendChild(container.ownerDocument.createElement('div'));
 
-        const verktøySomSkalMed = [[{ list: 'bullet' }], ['clean']];
+        const verktøySomSkalMed = [[{ list: 'bullet' }], ['bold'], ['clean']];
 
         const quill = new Quill(editorContainer, {
             theme: 'snow',
@@ -76,7 +113,7 @@ export const HtmlEditor = forwardRef(({ defaultValue, onTextChange }: Props, ref
     return feilVedOpprettelse ? (
         <AlertError>En uventet feil oppstod ved opprettelse av tekstfelt.</AlertError>
     ) : (
-        <div ref={containerRef}></div>
+        <HtmlEditorWrapper ref={containerRef}></HtmlEditorWrapper>
     );
 });
 

src/frontend/Felles/PersonHeader/AksjonsknapperPersonHeader.tsx

@@ -9,6 +9,7 @@ import DataViewer from '../DataViewer/DataViewer';
 import { AnsvarligSaksbehandlerRolle } from '../../App/typer/saksbehandler';
 import { useToggles } from '../../App/context/TogglesContext';
 import { ToggleName } from '../../App/context/toggles';
+import ScrollToTop from '../ScrollToTop/ScrollToTop';
 
 const StyledHamburgermeny = styled(Hamburgermeny)`
     margin-right: -1rem;
@@ -34,7 +35,8 @@ interface Props {
 }
 
 export const AksjonsknapperPersonHeader: React.FC<Props> = ({ erSaksbehandler, behandling }) => {
-    const { ansvarligSaksbehandler, settVisHenleggModal, settVisSettPåVent } = useBehandling();
+    const { ansvarligSaksbehandler, settVisHenleggModal, settVisSettPåVent, visSettPåVent } =
+        useBehandling();
     const { toggles } = useToggles();
 
     const menyvalg = [
@@ -89,6 +91,7 @@ export const AksjonsknapperPersonHeader: React.FC<Props> = ({ erSaksbehandler, b
                             >
                                 Henlegg
                             </ButtonSmall>
+                            {visSettPåVent && <ScrollToTop />}
                         </>
                     );
                 }

src/frontend/Felles/Personopplysninger/TabellWrapper.tsx

@@ -1,12 +1,13 @@
 import styled from 'styled-components';
 import React from 'react';
 import { Table } from '@navikt/ds-react';
+import { AFontSizeMedium } from '@navikt/ds-tokens/dist/tokens';
 
 export const SmallTable = styled(Table).attrs({ size: 'small' })`
     max-width: max-content;
     th,
     td {
-        font-size: var(--a-font-size-medium);
+        font-size: ${AFontSizeMedium};
     }
 `;
 

src/frontend/Felles/Visningskomponenter/ToKolonnerLayout.tsx

@@ -1,10 +1,11 @@
 import React, { ReactNode } from 'react';
 import styled from 'styled-components';
+import { ABorderSubtle } from '@navikt/ds-tokens/dist/tokens';
 
 const Container = styled.div<{ $skillelinje?: boolean }>`
     display: flex;
     margin: 2rem;
-    border-bottom: ${(props) => (props.$skillelinje ? '3px solid var(--a-border-subtle)' : 'none')};
+    border-bottom: ${(props) => (props.$skillelinje ? `3px solid ${ABorderSubtle}` : 'none')};
 
     @media (max-width: 1600px) {
         flex-direction: column;