Clarify not logged in flow

navikt · Nov 19, 2024 · 25d97e6 · 25d97e6
1 parent f30d2f6
commit 25d97e6
Show file tree

Hide file tree

Showing 5 changed files with 141 additions and 7 deletions.
diff --git a/frontend/src/components/case/innlogget/summary/oppsummering-page.tsx b/frontend/src/components/case/innlogget/summary/oppsummering-page.tsx
@@ -52,7 +52,7 @@ const DigitalCaseOppsummeringPage = ({ data }: Props) => {
       <div>
         <Icon title={icons.summary} />
         <CenteredHeading level="2" size="medium">
-          {skjema.summary.title}
+          {skjema.summary.title.logged_in}
         </CenteredHeading>
       </div>
 

diff --git a/frontend/src/components/case/uinnlogget/summary/oppsummering-page.tsx b/frontend/src/components/case/uinnlogget/summary/oppsummering-page.tsx
@@ -7,7 +7,10 @@ import { useTranslation } from '@app/language/use-translation';
 import { CaseType } from '@app/redux-api/case/types';
 import { CenteredContainer } from '@app/styled-components/common';
 import { CenteredHeading } from '@app/styled-components/page-title';
-import { BodyLong, BodyShort, Button, Heading, Panel } from '@navikt/ds-react';
+import { getLoginRedirectPath } from '@app/user/login';
+import { EnterIcon } from '@navikt/aksel-icons';
+import { Alert, BodyLong, BodyShort, Button, ConfirmationPanel, Heading, Panel } from '@navikt/ds-react';
+import { useState } from 'react';
 import { Link } from 'react-router-dom';
 import { styled } from 'styled-components';
 import { InformationPointBox } from '../../../information-point-box/information-point-box';
@@ -35,6 +38,8 @@ const PostKlageoppsummeringPage = ({ data }: Props) => {
   const { common, skjema, icons } = useTranslation();
   const validate = useSessionCaseErrors(data.type);
   const [isValid] = validate(data);
+  const [isUnderstood, setIsUnderstood] = useState(false);
+  const [isUnderstoodError, setIsUnderstoodError] = useState<string | null>(null);
 
   useGoToBegrunnelseOnError(isValid);
 
@@ -52,9 +57,10 @@ const PostKlageoppsummeringPage = ({ data }: Props) => {
       <div>
         <Icon title={icons.summary} />
         <CenteredHeading level="2" size="medium">
-          {skjema.summary.title}
+          {skjema.summary.title.not_logged_in}
         </CenteredHeading>
       </div>
+
       <StyledPanel border>
         <Section>
           <Heading level="1" size="small" spacing>
@@ -94,11 +100,38 @@ const PostKlageoppsummeringPage = ({ data }: Props) => {
         </Section>
       </StyledPanel>
 
+      <Alert variant="info">
+        <BodyShort spacing>{skjema.summary.sections.login.notice[data.type]}</BodyShort>
+        <Button variant="primary" size="medium" as="a" href={getLoginRedirectPath()} icon={<EnterIcon aria-hidden />}>
+          {skjema.summary.sections.login.action}
+        </Button>
+      </Alert>
+
+      <ConfirmationPanel
+        checked={isUnderstood}
+        label={skjema.summary.sections.confirm.label[data.type]}
+        onChange={() => setIsUnderstood((u) => !u)}
+        error={isUnderstoodError}
+      />
+
       <CenteredContainer>
         <Button as={Link} variant="secondary" to="../begrunnelse">
           {common.back}
         </Button>
-        <DownloadButton caseData={data} />
+        <DownloadButton
+          caseData={data}
+          validForm={() => {
+            if (isUnderstood) {
+              setIsUnderstoodError(null);
+
+              return true;
+            }
+
+            setIsUnderstoodError(skjema.summary.sections.confirm.error[data.type]);
+
+            return false;
+          }}
+        />
       </CenteredContainer>
     </PostFormContainer>
   );

diff --git a/frontend/src/language/en.tsx b/frontend/src/language/en.tsx
@@ -133,7 +133,10 @@ export const en: Translations = {
       },
     },
     summary: {
-      title: 'Review before you submit',
+      title: {
+        logged_in: 'Review before you submit',
+        not_logged_in: 'Review',
+      },
       submit_error: {
         [CaseType.KLAGE]: 'Failed to submit complaint. Unknown error.',
         [CaseType.ANKE]: 'Failed to submit appeal. Unknown error.',
@@ -178,6 +181,37 @@ export const en: Translations = {
           },
           documents: 'Attached documents',
         },
+        login: {
+          notice: {
+            [CaseType.KLAGE]:
+              'You can still log in to submit the complaint digitally. Then you do not have to print and send the complaint by post yourself.',
+            [CaseType.ANKE]:
+              'You can still log in to submit the appeal digitally. Then you do not have to print and send the appeal by post yourself.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'You can still log in to submit the additional documentation digitally. Then you do not have to print and send the additional documentation by post yourself.',
+            [CaseType.ETTERSENDELSE_ANKE]:
+              'You can still log in to submit the additional documentation digitally. Then you do not have to print and send the additional documentation by post yourself.',
+          },
+          action: 'Log in',
+        },
+        confirm: {
+          label: {
+            [CaseType.KLAGE]: 'I understand that I have to print and send the complaint by post myself.',
+            [CaseType.ANKE]: 'I understand that I have to print and send the appeal by post myself.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'I understand that I have to print and send the additional documentation by post myself.',
+            [CaseType.ETTERSENDELSE_ANKE]:
+              'I understand that I have to print and send the additional documentation by post myself.',
+          },
+          error: {
+            [CaseType.KLAGE]: 'You must confirm that you want to print and send the complaint by post yourself.',
+            [CaseType.ANKE]: 'You must confirm that you want to print and send the appeal by post yourself.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'You must confirm that you want to print and send the additional documentation by post yourself.',
+            [CaseType.ETTERSENDELSE_ANKE]:
+              'You must confirm that you want to print and send the additional documentation by post yourself.',
+          },
+        },
       },
       next: (status: CaseStatus, type: CaseType) =>
         status === CaseStatus.DRAFT ? 'Submit' : `See submitted ${CASE_TYPE_NAMES_LOWER_CASE_EN[type]}`,

diff --git a/frontend/src/language/nb.tsx b/frontend/src/language/nb.tsx
@@ -137,7 +137,10 @@ export const nb = {
       },
     },
     summary: {
-      title: 'Se over før du sender inn',
+      title: {
+        logged_in: 'Se over før du sender inn',
+        not_logged_in: 'Se over',
+      },
       submit_error: {
         [CaseType.KLAGE]: 'Klarte ikke å sende inn klagen. Ukjent feil.',
         [CaseType.ANKE]: 'Klarte ikke å sende inn anken. Ukjent feil.',
@@ -181,6 +184,37 @@ export const nb = {
           },
           documents: 'Vedlagte dokumenter',
         },
+        login: {
+          notice: {
+            [CaseType.KLAGE]:
+              'Du kan fortsatt logge inn for å sende inn klagen digitalt. Da slipper du å skrive ut og sende klagen i posten selv.',
+            [CaseType.ANKE]:
+              'Du kan fortsatt logge inn for å sende inn anken digitalt. Da slipper du å skrive ut og sende anken i posten selv.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'Du kan fortsatt logge inn for å sende inn ettersendelsen digitalt. Da slipper du å skrive ut og sende ettersendelsen i posten selv.',
+            [CaseType.ETTERSENDELSE_ANKE]:
+              'Du kan fortsatt logge inn for å sende inn ettersendelsen digitalt. Da slipper du å skrive ut og sende ettersendelsen i posten selv.',
+          },
+          action: 'Logg inn',
+        },
+        confirm: {
+          label: {
+            [CaseType.KLAGE]: 'Jeg forstår at jeg selv må skrive ut og sende klagen i posten selv.',
+            [CaseType.ANKE]: 'Jeg forstår at jeg selv må skrive ut og sende anken i posten selv.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'Jeg forstår at jeg selv må skrive ut og sende ettersendelsen i posten selv.',
+            [CaseType.ETTERSENDELSE_ANKE]:
+              'Jeg forstår at jeg selv må skrive ut og sende ettersendelsen i posten selv.',
+          },
+          error: {
+            [CaseType.KLAGE]: 'Du må bekrefte at du ønsker å skrive ut og sende klagen i posten selv.',
+            [CaseType.ANKE]: 'Du må bekrefte at du ønsker å skrive ut og sende anken i posten selv.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'Du må bekrefte at du ønsker å skrive ut og sende ettersendelsen i posten selv.',
+            [CaseType.ETTERSENDELSE_ANKE]:
+              'Du må bekrefte at du ønsker å skrive ut og sende ettersendelsen i posten selv.',
+          },
+        },
       },
       next: (status: CaseStatus, type: CaseType): string =>
         status === CaseStatus.DRAFT ? 'Send inn' : `Se innsendt ${CASE_TYPE_NAMES_LOWER_CASE_NB[type]}`,

diff --git a/frontend/src/language/nn.tsx b/frontend/src/language/nn.tsx
@@ -136,7 +136,10 @@ export const nn: Translations = {
       },
     },
     summary: {
-      title: 'Sjå over før du sender inn',
+      title: {
+        logged_in: 'Sjå over før du sender inn',
+        not_logged_in: 'Sjå over',
+      },
       submit_error: {
         [CaseType.KLAGE]: 'Klarte ikkje å sende inn klaga. Ukjent feil.',
         [CaseType.ANKE]: 'Klarte ikkje å sende inn anka. Ukjent feil.',
@@ -180,6 +183,36 @@ export const nn: Translations = {
           },
           documents: 'Vedlagte dokument',
         },
+        login: {
+          notice: {
+            [CaseType.KLAGE]:
+              'Du kan fortsatt logge inn for å sende inn klaga digitalt. Da slepp du å skrive ut og sende klaga i posten sjølv.',
+            [CaseType.ANKE]:
+              'Du kan fortsatt logge inn for å sende inn anka digitalt. Da slepp du å skrive ut og sende anka i posten sjølv.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'Du kan fortsatt logge inn for å sende inn ettersendinga digitalt. Da slepp du å skrive ut og sende ettersendinga i posten sjølv.',
+            [CaseType.ETTERSENDELSE_ANKE]:
+              'Du kan fortsatt logge inn for å sende inn ettersendinga digitalt. Da slepp du å skrive ut og sende ettersendinga i posten sjølv.',
+          },
+          action: 'Logg inn',
+        },
+        confirm: {
+          label: {
+            [CaseType.KLAGE]: 'Eg forstår at eg sjølv må skrive ut klaga og sende klaga i posten sjølv.',
+            [CaseType.ANKE]: 'Eg forstår at eg sjølv må skrive ut anka og sende anka i posten sjølv.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'Eg forstår at eg sjølv må skrive ut og sende ettersendinga i posten sjølv.',
+            [CaseType.ETTERSENDELSE_ANKE]: 'Eg forstår at eg sjølv må skrive ut og sende ettersendinga i posten sjølv.',
+          },
+          error: {
+            [CaseType.KLAGE]: 'Du må bekrefte at du ønsker å skrive ut og sende klaga i posten sjølv.',
+            [CaseType.ANKE]: 'Du må bekrefte at du ønsker å skrive ut og sende anka i posten sjølv.',
+            [CaseType.ETTERSENDELSE_KLAGE]:
+              'Du må bekrefte at du ønsker å skrive ut og sende ettersendinga i posten sjølv.',
+            [CaseType.ETTERSENDELSE_ANKE]:
+              'Du må bekrefte at du ønsker å skrive ut og sende ettersendinga i posten sjølv.',
+          },
+        },
       },
       next: (status: CaseStatus, type: CaseType): string =>
         status === CaseStatus.DRAFT ? 'Send inn' : `Sjå innsendt ${CASE_TYPE_NAMES_LOWER_CASE_NN[type]}`,