refactor mutation name

folio-org · Jun 19, 2024 · 4e48aab · 4e48aab
1 parent 6d02388
commit 4e48aab
Show file tree

Hide file tree

Showing 5 changed files with 63 additions and 72 deletions.
diff --git a/src/common/hooks/usePiecesMutation/usePiecesMutation.js b/src/common/hooks/usePiecesMutation/usePiecesMutation.js
@@ -13,7 +13,7 @@ const usePiecesMutation = (options = {}) => {
 
   return {
     isLoading,
-    unboundPiece: mutateAsync,
+    updatePiece: mutateAsync,
   };
 };
 

diff --git a/src/components/BoundPiecesList/BoundPiecesList.js b/src/components/BoundPiecesList/BoundPiecesList.js
@@ -23,15 +23,15 @@ import {
   usePiecesMutation,
 } from '../../common/hooks';
 import {
-  COLUMN_FORMATTER,
   PIECE_COLUMN_MAPPING,
   VISIBLE_COLUMNS,
 } from './constants';
+import { getColumnFormatter } from './utils';
 
 const BoundPiecesList = ({ id, itemId }) => {
   const stripes = useStripes();
   const showCallout = useShowCallout();
-  const { unboundPiece } = usePiecesMutation();
+  const { updatePiece } = usePiecesMutation();
   const {
     boundPieces,
     isFetching,
@@ -50,7 +50,7 @@ const BoundPiecesList = ({ id, itemId }) => {
   };
 
   const handleRemove = () => {
-    return unboundPiece(selectedPieceRef.current)
+    return updatePiece(selectedPieceRef.current)
       .then(() => {
         refetch();
         toggleOpen();
@@ -67,7 +67,7 @@ const BoundPiecesList = ({ id, itemId }) => {
   };
 
   const formatter = useMemo(() => {
-    return COLUMN_FORMATTER({ onRemove, hasViewReceivingPermissions });
+    return getColumnFormatter({ onRemove, hasViewReceivingPermissions });
   }, [hasViewReceivingPermissions]);
 
   if (isFetching) return <Loading />;

diff --git a/src/components/BoundPiecesList/BoundPiecesList.test.js b/src/components/BoundPiecesList/BoundPiecesList.test.js
@@ -1,17 +1,10 @@
-import { IntlProvider } from 'react-intl';
-
-import {
-  render,
-  cleanup,
-  screen,
-} from '@folio/jest-config-stripes/testing-library/react';
+import { screen } from '@folio/jest-config-stripes/testing-library/react';
 import userEvent from '@folio/jest-config-stripes/testing-library/user-event';
-import {
-  ConfirmationModal,
-} from '@folio/stripes/components';
+import { ConfirmationModal } from '@folio/stripes/components';
 
 import '@folio/stripes-acq-components/test/jest/__mock__';
 
+import { renderWithIntl } from '../../../test/jest/helpers';
 import {
   useBoundPieces,
   usePiecesMutation,
@@ -41,17 +34,15 @@ const boundPieces = [{
   id: 'id',
 }];
 
-const mockUnboundPiece = jest.fn().mockResolvedValue(() => Promise.resolve());
+const mockUpdatePiece = jest.fn().mockResolvedValue(() => Promise.resolve());
 
-const renderBoundPiecesList = (props = {}) => (render(
-  <IntlProvider locale="en">
-    <BoundPiecesList
-      id="boundPiecesListId"
-      itemId={boundPieces[0].itemId}
-      {...props}
-    />
-  </IntlProvider>,
-));
+const renderBoundPiecesList = (props = {}) => renderWithIntl(
+  <BoundPiecesList
+    id="boundPiecesListId"
+    itemId={boundPieces[0].itemId}
+    {...props}
+  />
+);
 
 describe('BoundPiecesList', () => {
   beforeEach(() => {
@@ -61,13 +52,11 @@ describe('BoundPiecesList', () => {
       isFetching: false,
     });
     usePiecesMutation.mockClear().mockReturnValue({
-      unboundPiece: mockUnboundPiece,
+      updatePiece: mockUpdatePiece,
       isLoading: false,
     });
   });
 
-  afterEach(cleanup);
-
   it('should render component', () => {
     renderBoundPiecesList();
 
@@ -92,7 +81,7 @@ describe('BoundPiecesList', () => {
     expect(screen.getByTestId('textLink')).toBeInTheDocument();
   });
 
-  it('should call `unboundPiece` mutation on click remove button', async () => {
+  it('should call `updatePiece` mutation on click remove button', async () => {
     useBoundPieces.mockClear().mockReturnValue({
       boundPieces: [{
         ...boundPieces[0],
@@ -107,7 +96,7 @@ describe('BoundPiecesList', () => {
     await userEvent.click(screen.getByRole('button'));
 
     ConfirmationModal.mock.calls[0][0].onConfirm();
-    expect(mockUnboundPiece).toHaveBeenCalled();
+    expect(mockUpdatePiece).toHaveBeenCalled();
   });
 
   it('should not render component when pieces are not fetched', () => {

diff --git a/src/components/BoundPiecesList/constants.js b/src/components/BoundPiecesList/constants.js
@@ -1,13 +1,5 @@
 import { FormattedMessage } from 'react-intl';
 
-import { FolioFormattedDate } from '@folio/stripes-acq-components';
-import {
-  Button,
-  Icon,
-  NoValue,
-  TextLink,
-} from '@folio/stripes/components';
-
 export const PIECE_COLUMNS = {
   displaySummary: 'displaySummary',
   chronology: 'chronology',
@@ -37,37 +29,3 @@ export const VISIBLE_COLUMNS = [
   PIECE_COLUMNS.receiptDate,
   PIECE_COLUMNS.remove,
 ];
-
-export const COLUMN_FORMATTER = ({ hasViewReceivingPermissions, onRemove }) => {
-  return ({
-    [PIECE_COLUMNS.barcode]: record => {
-      const { barcode, titleId } = record;
-
-      if (!barcode) return <NoValue />;
-
-      if (!hasViewReceivingPermissions) return barcode;
-
-      if (titleId) {
-        return <TextLink target="_blank" to={`/receiving/${titleId}/view`}>{barcode}</TextLink>;
-      }
-
-      return barcode;
-    },
-    [PIECE_COLUMNS.displaySummary]: record => record.displaySummary || <NoValue />,
-    [PIECE_COLUMNS.chronology]: record => record.chronology || <NoValue />,
-    [PIECE_COLUMNS.copyNumber]: record => record.copyNumber || <NoValue />,
-    [PIECE_COLUMNS.enumeration]: record => record.enumeration || <NoValue />,
-    [PIECE_COLUMNS.receiptDate]: record => <FolioFormattedDate value={record.receiptDate} />,
-    [PIECE_COLUMNS.remove]: record => (
-      <Button
-        buttonStyle="fieldControl"
-        align="end"
-        type="button"
-        id={`clickable-remove-user-${record.id}`}
-        onClick={() => onRemove(record)}
-      >
-        <Icon icon="times-circle" />
-      </Button>
-    ),
-  });
-};
diff --git a/src/components/BoundPiecesList/utils.js b/src/components/BoundPiecesList/utils.js
@@ -0,0 +1,44 @@
+import { FolioFormattedDate } from '@folio/stripes-acq-components';
+import {
+  Button,
+  Icon,
+  NoValue,
+  TextLink,
+} from '@folio/stripes/components';
+
+import { PIECE_COLUMNS } from './constants';
+
+// eslint-disable-next-line import/prefer-default-export
+export const getColumnFormatter = ({ hasViewReceivingPermissions, onRemove }) => {
+  return ({
+    [PIECE_COLUMNS.barcode]: record => {
+      const { barcode, titleId } = record;
+
+      if (!barcode) return <NoValue />;
+
+      if (!hasViewReceivingPermissions) return barcode;
+
+      if (titleId) {
+        return <TextLink target="_blank" to={`/receiving/${titleId}/view`}>{barcode}</TextLink>;
+      }
+
+      return barcode;
+    },
+    [PIECE_COLUMNS.displaySummary]: record => record.displaySummary || <NoValue />,
+    [PIECE_COLUMNS.chronology]: record => record.chronology || <NoValue />,
+    [PIECE_COLUMNS.copyNumber]: record => record.copyNumber || <NoValue />,
+    [PIECE_COLUMNS.enumeration]: record => record.enumeration || <NoValue />,
+    [PIECE_COLUMNS.receiptDate]: record => <FolioFormattedDate value={record.receiptDate} />,
+    [PIECE_COLUMNS.remove]: record => (
+      <Button
+        buttonStyle="fieldControl"
+        align="end"
+        type="button"
+        id={`clickable-remove-user-${record.id}`}
+        onClick={() => onRemove(record)}
+      >
+        <Icon icon="times-circle" />
+      </Button>
+    ),
+  });
+};