fix: EBE 563

src/pages/refundRequests/__tests__/invoiceDataTable.test.tsx

@@ -119,7 +119,7 @@ const mockedDownloadInvoiceFile = downloadInvoiceFile as jest.MockedFunction<
 const mockedUseAlert = useAlert as jest.MockedFunction<typeof useAlert>;
 
 describe('InvoiceDataTable', () => {
-  const mockSetAlert = jest.fn()
+  const mockSetAlert = jest.fn();
   const baseTransactions: any = {
     content: [
       {
@@ -177,7 +177,7 @@ describe('InvoiceDataTable', () => {
         rewardBatchTrxStatus="ELIGIBLE"
         pointOfSaleId="POS-2"
         fiscalCode="BBBBBB00B00B000B"
-        trxCode='TRX-CODE-001'
+        trxCode="TRX-CODE-001"
       />
     );
     await screen.findByTestId('data-table');
@@ -268,9 +268,7 @@ describe('InvoiceDataTable', () => {
     expect(screen.getByTestId('detail-drawer')).toHaveAttribute('data-open', 'true');
     const closeButton = screen.getByTestId('close-drawer');
     fireEvent.click(closeButton);
-    await waitFor(() =>
-      expect(screen.getByTestId('detail-drawer')).toHaveAttribute('data-open', 'false')
-    );
+    await waitFor(() => expect(screen.queryByTestId('detail-drawer')).not.toBeInTheDocument());
   });
 
   it('downloads invoice file PDF and opens new window', async () => {
@@ -463,20 +461,13 @@ describe('InvoiceDataTable', () => {
     expect(screen.getByTestId('detail-drawer')).toHaveAttribute('data-open', 'true');
     const closeButton = screen.getByTestId('close-drawer');
     fireEvent.click(closeButton);
-    await waitFor(() =>
-      expect(screen.getByTestId('detail-drawer')).toHaveAttribute('data-open', 'false')
-    );
-    await waitFor(() =>
-      expect(mockSetAlert).toHaveBeenCalled()
-    );
+    await waitFor(() => expect(screen.queryByTestId('detail-drawer')).not.toBeInTheDocument());
+    await waitFor(() => expect(mockSetAlert).toHaveBeenCalled());
   });
 
   it('handles loading state', async () => {
     mockedGetTransactions.mockImplementation(
-      () =>
-        new Promise((resolve) =>
-          setTimeout(() => resolve(baseTransactions), 100)
-        )
+      () => new Promise((resolve) => setTimeout(() => resolve(baseTransactions), 100))
     );
     render(<InvoiceDataTable />);
     await screen.findByTestId('data-table');
@@ -491,4 +482,4 @@ describe('InvoiceDataTable', () => {
     fireEvent.click(actionIcon);
     await screen.findByTestId('detail-drawer');
   });
-});
+});

src/pages/refundRequests/detail/InvoiceDetail.tsx

@@ -3,7 +3,8 @@ import { useEffect, useState, useMemo } from 'react';
 import { theme } from '@pagopa/mui-italia';
 import { ReceiptLong } from '@mui/icons-material';
 import { useTranslation } from 'react-i18next';
-import { useLocation } from 'react-router-dom';
+import { useLocation, useHistory } from 'react-router-dom';
+import routes from '../../../routes';
 import { downloadInvoiceFile, postponeTransaction } from '../../../services/merchantService';
 import { TYPE_TEXT, MISSING_DATA_PLACEHOLDER } from '../../../utils/constants';
 import { formatValues, currencyFormatter, getEndOfNextMonth } from '../../../utils/formatUtils';
@@ -23,13 +24,15 @@ type Props = DetailDrawerProps & {
   batchId: string;
   storeId: string;
   onSuccess?: () => void;
+  onCloseDrawer?: () => void;
 };
 
 export default function InvoiceDetail({
   itemValues,
   listItem,
   batchId,
   onSuccess,
+  onCloseDrawer,
   isOpen,
   setIsOpen,
   ...rest
@@ -45,6 +48,7 @@ export default function InvoiceDetail({
   const statusBatch = location.state?.store?.status;
   const { t } = useTranslation();
   const initiativesListSel = useAppSelector(intiativesListSelector);
+  const history = useHistory();
 
   useEffect(() => {
     if (
@@ -73,16 +77,26 @@ export default function InvoiceDetail({
 
   const editButton: DetailDrawerProps['buttons'] = useMemo(
     () =>
-      isEditable
+      isEditable && itemValues?.pointOfSaleId
         ? [
             {
               variant: 'contained',
               title: 'Modifica documento',
               dataTestId: 'change-file-btn',
+              onClick: () => {
+                const merchantId = history.location.pathname.split('/')[2];
+
+                const path = routes.MODIFY_DOCUMENT.replace(':id', merchantId)
+                  .replace(':pointOfSaleId', itemValues?.pointOfSaleId)
+                  .replace(':trxId', itemValues.id)
+                  .replace(':fileDocNumber', itemValues?.invoiceData?.docNumber);
+
+                history.push(path, { fromPath: history.location.pathname });
+              },
             },
           ]
         : [],
-    [isEditable]
+    [isEditable, itemValues?.pointOfSaleId, history]
   );
 
   const handlePostponeTransaction = async () => {
@@ -108,6 +122,7 @@ export default function InvoiceDetail({
         contentStyle: { position: 'unset', bottom: '0', right: '0' },
       });
       setInvoiceTransactionModal(false);
+      onCloseDrawer?.();
       onSuccess?.();
     } catch (error) {
       setAlert({
@@ -125,6 +140,7 @@ export default function InvoiceDetail({
         contentStyle: { position: 'unset', bottom: '0', right: '0' },
       });
       setInvoiceTransactionModal(false);
+      onCloseDrawer?.();
     } finally {
       setLoading(false);
     }

src/pages/refundRequests/detail/__tests__/InvoiceDetail.test.tsx

@@ -25,6 +25,25 @@ jest.mock('../../../../components/Chip/StatusChipInvoice', () => (props: any) =>
   <div data-testid="status-chip">{props.status}</div>
 ));
 
+jest.mock('../../../../components/Drawer/DetailDrawer', () => ({
+  __esModule: true,
+  default: (props: any) => (
+    <div data-testid="item-test">
+      {props.buttons?.map((btn: any) => (
+        <button
+          key={btn.dataTestId}
+          data-testid={btn.dataTestId}
+          disabled={btn.disabled}
+          onClick={btn.onClick}
+        >
+          {btn.title}
+        </button>
+      ))}
+      {props.children}
+    </div>
+  ),
+}));
+
 jest.mock(
   '../../../../components/modal/ModalComponent',
   () => (props: any) =>
@@ -241,9 +260,7 @@ describe('InvoiceDetail', () => {
 
   describe('Rendering Base', () => {
     it('renderizza titolo, label e valore base', () => {
-      renderInvoiceDetail({ title: 'Dettaglio transazione' });
-
-      expect(screen.getByText('Dettaglio transazione')).toBeInTheDocument();
+      renderInvoiceDetail();
       expect(screen.getByText('Elettrodomestico')).toBeInTheDocument();
       expect(screen.getByText('formatted-Prodotto di test')).toBeInTheDocument();
       expect(screen.getByText('Numero fattura')).toBeInTheDocument();

src/pages/refundRequests/invoiceDataTable.tsx

@@ -56,6 +56,7 @@ const InvoiceDataTable = ({
   pointOfSaleId,
   trxCode,
   fiscalCode,
+  onDrawerClosed
 }: InvoiceDataTableProps) => {
   const [transactions, setTransactions] = useState<MerchantTransactionsListDTO["content"]>([]);
   const [pagination, setPagination] = useState({
@@ -78,9 +79,13 @@ const InvoiceDataTable = ({
     setDrawerOpened(true);
   };
 
-  const handleToggleDrawer = () => {
+  const handleToggleDrawer = (open: boolean) => {
     setAlert({ ...alert, isOpen: false });
     setDrawerOpened(false);
+    if (!open) {
+      setRowDetail(null);
+      onDrawerClosed?.();
+    }
   };
 
   const downloadFile = async (selectedTransaction: any) => {
@@ -347,6 +352,7 @@ const InvoiceDataTable = ({
       )}
       {rowDetail && (
         <InvoiceDetail
+          onCloseDrawer={() => handleToggleDrawer(false)}
           isOpen={drawerOpened}
           setIsOpen={handleToggleDrawer}
           batchId={batchId ?? ''}