Merge pull request #1423 from pagopa/feature/rework_contacts

Feature/PN-13345 - Rework contacts
pagopa · Feb 25, 2025 · b12c4f9 · b12c4f9
2 parents f8ad602 + a6f4682
commit b12c4f9
Show file tree

Hide file tree

Showing 616 changed files with 12,390 additions and 12,304 deletions.
diff --git a/packages/pn-commons/package.json b/packages/pn-commons/package.json
@@ -27,8 +27,6 @@
   "scripts": {
     "build": "tsc -p tsconfig.prod.json",
     "test": "tsc --noEmit && vitest --run",
-    "test:fast": "vitest --run",
-    "test:all": "vitest --run --config ./vite.config.all.ts",
     "test:coverage": "tsc --noEmit && vitest run --coverage",
     "lint": "eslint . -c .eslintrc.js --ext .ts,.tsx --fix",
     "format": "prettier \"./**/*.{ts,tsx}\" --write",

diff --git a/packages/pn-commons/sonar-project.properties b/packages/pn-commons/sonar-project.properties
@@ -3,4 +3,4 @@ sonar.exclusions=src/**/__tests__/**, src/**/__test__/**, src/__mocks__/**
 sonar.test.inclusions=src/**/__tests__/**, src/**/__test__/**
 sonar.scm.exclusions.disabled=true
 sonar.javascript.lcov.reportPaths=coverage/lcov.info
-sonar.coverage.exclusions=src/models/**, src/assets/**, src/**/__tests__/**, src/**/__test__/**, src/__mocks__/**, src/setupTests.ts, src/test-utils.tsx
+sonar.coverage.exclusions=src/models/**, src/assets/**, src/**/__tests__/**, src/**/__test__/**, src/__mocks__/**, src/setupTests.tsx, src/test-utils.tsx
diff --git a/packages/pn-commons/src/components/CodeModal/CodeModal.tsx b/packages/pn-commons/src/components/CodeModal/CodeModal.tsx
@@ -67,6 +67,7 @@ const CodeModal = forwardRef<ModalHandle, Props>(
       error,
     }: Props,
     ref
+    // eslint-disable-next-line sonarjs/cognitive-complexity
   ) => {
     const [code, setCode] = useState(initialValues);
     const [internalError, setInternalError] = useState({
@@ -78,6 +79,7 @@ const CodeModal = forwardRef<ModalHandle, Props>(
     const { internalHasError, internalErrorTitle, internalErrorMessage } = internalError;
 
     const codeIsValid = code.every((v) => (!isNaN(Number(v)) ? v : false));
+    const codeIsEmpty = code.some((v) => !v);
 
     const changeHandler = useCallback((inputsValues: Array<string>) => {
       setCode(inputsValues);
@@ -106,6 +108,28 @@ const CodeModal = forwardRef<ModalHandle, Props>(
       if (!confirmCallback) {
         return;
       }
+      if (codeIsEmpty) {
+        setInternalError({
+          internalHasError: true,
+          internalErrorTitle: getLocalizedOrDefaultLabel('common', `errors.empty_code.title`),
+          internalErrorMessage: getLocalizedOrDefaultLabel('common', `errors.empty_code.message`),
+        });
+        return;
+      }
+      if (!codeIsValid) {
+        setInternalError({
+          internalHasError: true,
+          internalErrorTitle: getLocalizedOrDefaultLabel(
+            'common',
+            `errors.invalid_type_code.title`
+          ),
+          internalErrorMessage: getLocalizedOrDefaultLabel(
+            'common',
+            `errors.invalid_type_code.message`
+          ),
+        });
+        return;
+      }
       confirmCallback(code);
     };
 
@@ -175,10 +199,10 @@ const CodeModal = forwardRef<ModalHandle, Props>(
           {confirmLabel && confirmCallback && (
             <Button
               id="code-confirm-button"
-              variant="contained"
+              variant={internalHasError ? 'outlined' : 'contained'}
+              color={internalHasError ? 'error' : 'primary'}
               data-testid="codeConfirmButton"
               onClick={confirmHandler}
-              disabled={!codeIsValid}
             >
               {confirmLabel}
             </Button>

diff --git a/packages/pn-commons/src/components/CodeModal/__test__/CodeModal.test.tsx b/packages/pn-commons/src/components/CodeModal/__test__/CodeModal.test.tsx
@@ -119,7 +119,7 @@ describe('CodeModal Component', () => {
     render(<CodeModalWrapper open />);
     const dialog = screen.getByTestId('codeDialog');
     const button = within(dialog).getByTestId('codeConfirmButton');
-    expect(button).toBeDisabled();
+    expect(button).toBeEnabled();
     const codeInputs = within(dialog).getAllByTestId(/code-input-[0-4]/);
     // fill inputs with values
     codeInputs?.forEach((input, index) => {
@@ -155,6 +155,21 @@ describe('CodeModal Component', () => {
     expect(errorAlert).toHaveTextContent('mocked-errorMessage');
   });
 
+  it('shows error in case of empty or incomplete code', async () => {
+    // render component
+    render(<CodeModalWrapper open />);
+    const dialog = screen.getByTestId('codeDialog');
+    const button = within(dialog).getByTestId('codeConfirmButton');
+
+    let errorAlert = within(dialog).queryByTestId('errorAlert');
+    expect(errorAlert).not.toBeInTheDocument();
+    fireEvent.click(button);
+    errorAlert = within(dialog).queryByTestId('errorAlert');
+    expect(errorAlert).toBeInTheDocument();
+    expect(errorAlert).toHaveTextContent('errors.empty_code.title');
+    expect(errorAlert).toHaveTextContent('errors.empty_code.message');
+  });
+
   it('shows error in case of letters as input values', async () => {
     // render component
     render(<CodeModalWrapper open />);
@@ -190,6 +205,6 @@ describe('CodeModal Component', () => {
     const codePasted = '123';
     await userEvent.paste(codePasted);
     const button = screen.getByTestId('codeConfirmButton');
-    expect(button).toBeDisabled();
+    expect(button).toBeEnabled();
   });
 });
diff --git a/packages/pn-commons/src/components/ConfirmationModal.tsx b/packages/pn-commons/src/components/ConfirmationModal.tsx
@@ -0,0 +1,60 @@
+import * as React from 'react';
+
+import { Button, ButtonProps, DialogTitle } from '@mui/material';
+import { PnDialog, PnDialogActions, PnDialogContent } from '@pagopa-pn/pn-commons';
+
+type Props = {
+  open: boolean;
+  title: string;
+  slotsProps?: {
+    confirmButton?: ButtonProps;
+    closeButton?: ButtonProps;
+  };
+  onConfirmLabel?: string;
+  onCloseLabel?: string;
+  children?: React.ReactNode;
+};
+
+const ConfirmationModal: React.FC<Props> = ({
+  open,
+  title,
+  slotsProps,
+  onConfirmLabel = 'Riprova',
+  onCloseLabel = 'Annulla',
+  children,
+}: Props) => (
+  <PnDialog
+    id="confirmation-dialog"
+    open={open}
+    onClose={slotsProps?.closeButton?.onClick}
+    aria-labelledby="confirmation-dialog-title"
+    aria-describedby="confirmation-dialog-description"
+    maxWidth="sm"
+    data-testid="confirmationDialog"
+  >
+    <DialogTitle id="confirmation-dialog-title">{title}</DialogTitle>
+    {children && <PnDialogContent>{children}</PnDialogContent>}
+    <PnDialogActions>
+      <Button
+        id="dialog-close-button"
+        color="primary"
+        variant="outlined"
+        data-testid="closeButton"
+        {...slotsProps?.closeButton}
+      >
+        {onCloseLabel}
+      </Button>
+      <Button
+        id="dialog-confirm-button"
+        color="primary"
+        variant="contained"
+        data-testid="confirmButton"
+        {...slotsProps?.confirmButton}
+      >
+        {onConfirmLabel}
+      </Button>
+    </PnDialogActions>
+  </PnDialog>
+);
+
+export default ConfirmationModal;
diff --git a/packages/pn-commons/src/components/Footer/__test__/Footer.test.tsx b/packages/pn-commons/src/components/Footer/__test__/Footer.test.tsx
@@ -17,9 +17,6 @@ const i18n: Partial<i18nInterface> = {
       i18n.language = lang;
     }),
 };
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ i18n }),
-}));
 
 describe('Footer Component', () => {
   const original = window.open;

diff --git a/packages/pn-commons/src/components/Illustrations/IllusAppIO.tsx b/packages/pn-commons/src/components/Illustrations/IllusAppIO.tsx
@@ -4,7 +4,7 @@ export const IllusAppIO = ({ title = 'AppIO' }: IllustrationProps) => (
   <Illustration
     name={title}
     viewBox="0 0 297 223"
-    sx={{ width: 400, height: 300, maxWidth: '100%', maxHeight: '100%' }}
+    sx={{ width: 400, height: 200, maxWidth: '100%', maxHeight: '100%' }}
   >
     <path
       d="M0 49.8657C0 38.82 8.95431 29.8657 20 29.8657H137.293C148.338 29.8657 157.293 38.82 157.293 49.8657V222.997H0V49.8657Z"

diff --git a/packages/pn-commons/src/components/Illustrations/IllusAppIOLogo.tsx b/packages/pn-commons/src/components/Illustrations/IllusAppIOLogo.tsx
@@ -0,0 +1,16 @@
+import { Illustration, IllustrationProps } from '@pagopa/mui-italia';
+
+export const IllusAppIoLogo = ({ title = 'AppIoLogo' }: IllustrationProps) => (
+  <Illustration
+    name={title}
+    viewBox="0 0 22 19"
+    sx={{ width: 22, height: 19, maxWidth: '100%', maxHeight: '100%' }}
+  >
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M4.58333 2.82096C4.58333 1.55531 3.55732 0.529297 2.29167 0.529297C1.02601 0.529297 0 1.55531 0 2.82096C0 4.08662 1.02601 5.11263 2.29167 5.11263C3.55732 5.11263 4.58333 4.08662 4.58333 2.82096ZM14.5575 18.8626C18.2584 18.8626 21.5417 15.5794 21.5417 11.5293C21.5417 7.47921 18.2584 4.19596 14.5575 4.19596C10.1582 4.19596 6.875 7.47921 6.875 11.5293C6.875 15.5794 10.1582 18.8626 14.5575 18.8626ZM2.29167 7.4043C3.30419 7.4043 4.125 8.22511 4.125 9.23763V17.0293C4.125 18.0418 3.30419 18.8626 2.29167 18.8626C1.27914 18.8626 0.458333 18.0418 0.458333 17.0293V9.23763C0.458333 8.22511 1.27914 7.4043 2.29167 7.4043ZM16.9861 10.7596H16.0098V12.4799C16.0098 12.6512 16.0169 12.7629 16.0239 12.8374C16.0309 12.9044 16.059 12.964 16.1082 13.0161C16.1573 13.0682 16.2346 13.0906 16.34 13.0906L16.944 13.0757L16.9932 13.9693C16.642 14.0512 16.3681 14.0959 16.1854 14.0959C15.7078 14.0959 15.3847 13.9842 15.2162 13.7533C15.0406 13.5299 14.9563 13.1129 14.9563 12.5022V8.63723H16.0169V9.79896H16.9861V10.7596ZM12.8141 13.9991V9.80641H13.8746V13.9991H12.8141ZM11.6856 9.88945C11.5644 9.76459 11.4075 9.70215 11.2222 9.70215C11.0368 9.70215 10.88 9.75765 10.7588 9.88251C10.6447 10.0074 10.5805 10.16 10.5805 10.3404C10.5805 10.5207 10.6447 10.6733 10.7659 10.7982C10.8871 10.9231 11.0439 10.9855 11.2293 10.9855C11.4218 10.9855 11.5715 10.9231 11.6856 10.8121C11.8068 10.6872 11.8638 10.5415 11.8638 10.3542C11.8638 10.1669 11.8068 10.0143 11.6856 9.88945Z"
+      fill="white"
+    />
+  </Illustration>
+);
diff --git a/packages/pn-commons/src/components/Illustrations/IllusSendLogo.tsx b/packages/pn-commons/src/components/Illustrations/IllusSendLogo.tsx
@@ -0,0 +1,16 @@
+import { Illustration, IllustrationProps } from '@pagopa/mui-italia';
+
+export const IllusSendLogo = ({ title = 'SendLogo' }: IllustrationProps) => (
+  <Illustration
+    name={title}
+    viewBox="0 0 24 9"
+    sx={{ width: 24, height: 9, maxWidth: '100%', maxHeight: '100%' }}
+  >
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M2.46772 3.45821C2.77593 3.48242 3.10981 3.50864 3.43419 3.60586C4.24966 3.85058 4.73908 4.46635 4.73908 5.33667C4.73908 6.55063 3.80571 7.43876 2.38314 7.43876C1.01495 7.43876 0 6.60523 0 5.37277H1.07938C1.07938 5.989 1.64124 6.39662 2.40233 6.39662C3.19062 6.39662 3.66176 5.97118 3.66176 5.39996C3.66176 5.00124 3.41728 4.75676 3.09991 4.63886C2.86366 4.55077 2.56344 4.52433 2.24768 4.49652C1.94592 4.46995 1.62998 4.44212 1.34214 4.35805C0.508616 4.11334 0.0555226 3.46991 0.0555226 2.65444C0.0555226 1.48572 0.988899 0.625 2.33904 0.625C3.66176 0.625 4.64038 1.43134 4.64038 2.60028H3.55323C3.52581 2.03843 3.03662 1.66691 2.3299 1.66691C1.60376 1.66691 1.14176 2.07476 1.14176 2.60028C1.14176 2.94462 1.341 3.20738 1.68533 3.33419C1.90224 3.41379 2.17326 3.43508 2.46772 3.45821ZM18.5633 0.724624H20.6926C22.6135 0.724624 24 2.16524 24 4.04091C24 5.91657 22.6135 7.33914 20.6926 7.33914H20.2078V8.3991L18.62 6.80905L20.2078 5.22037V6.27895H20.6746C21.9792 6.27895 22.9126 5.30948 22.9126 4.04091C22.9126 2.75429 21.9792 1.78481 20.6746 1.78481H19.6505V4.08341L18.5633 5.18381V0.724624ZM5.87125 7.33914H10.9183V6.27895H6.94971V4.54815H9.18753V3.48819H6.94971V1.78458H10.9183V0.724624H5.87125V7.33914ZM13.2105 0.724624L16.2821 5.43629V0.724624H17.3604V7.33914H16.2821L13.2105 2.62748V7.33914H12.1321V0.724624H13.2105Z"
+      fill="white"
+    />
+  </Illustration>
+);
diff --git a/packages/pn-commons/src/components/Notifications/__test__/NotificationsDataSwitch.test.tsx b/packages/pn-commons/src/components/Notifications/__test__/NotificationsDataSwitch.test.tsx
@@ -5,13 +5,6 @@ import { createMatchMedia, fireEvent, render } from '../../../test-utils';
 import { formatDate, getNotificationStatusInfos } from '../../../utility';
 import NotificationsDataSwitch from '../NotificationsDataSwitch';
 
-vi.mock('react-i18next', () => ({
-  // this mock makes sure any components using the translate hook can use it without a warning being shown
-  useTranslation: () => ({
-    t: (str: string) => str,
-  }),
-}));
-
 const data = {
   id: '0',
   iun: 'DAPQ-LWQV-DKQH-202308-A-1',