Skip to content

Commit

Permalink
UIOR-1365 Close actions dropdown before navigation to another page (#…
Browse files Browse the repository at this point in the history
…1689)

* Solution attempt

* Wrap onReceive with Promise

* Add change log

* Write tests for POLine and Order receive buttons

* Update change log ticket number

* Add small comment for promise usage

* Improve goToReceive formatting
  • Loading branch information
azizjonnurov authored Dec 23, 2024
1 parent a2475dc commit d130047
Show file tree
Hide file tree
Showing 8 changed files with 68 additions and 2 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
## 7.1.0 (IN PROGRESS)

* Display the “Record deleted” label in version history only if the UUID no longer exists. Refs UIOR-1355.
* Close actions dropdown before navigation to another page. Refs UIOR-1365.

## [7.0.3](https://github.com/folio-org/ui-orders/tree/v7.0.3) (2024-12-06)
[Full Changelog](https://github.com/folio-org/ui-orders/compare/v7.0.2...v7.0.3)
Expand Down
8 changes: 8 additions & 0 deletions src/OrderLinesList/Details/OrderLineDetails.js
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,13 @@ const OrderLineDetails = ({
[lineId, order],
);

const goToReceive = useCallback(() => {
history.push({
pathname: '/receiving',
search: `qindex=poLine.poLineNumber&query=${line?.poLineNumber}`,
});
}, [history, line?.poLineNumber]);

const deleteLine = useCallback(
() => {
const lineNumber = line.poLineNumber;
Expand Down Expand Up @@ -206,6 +213,7 @@ const OrderLineDetails = ({
materialTypes={materialTypes}
funds={funds}
goToOrderDetails={goToOrderDetails}
goToReceive={goToReceive}
deleteLine={deleteLine}
cancelLine={cancelLine}
tagsToggle={toggleTagsPane}
Expand Down
8 changes: 8 additions & 0 deletions src/components/POLine/POLine.js
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,13 @@ function POLine({
[orderId],
);

const goToReceive = useCallback(() => {
history.push({
pathname: '/receiving',
search: `qindex=poLine.poLineNumber&query=${line?.poLineNumber}`,
});
}, [history, line?.poLineNumber]);

const deleteLine = useCallback(
() => {
const lineNumber = line?.poLineNumber;
Expand Down Expand Up @@ -211,6 +218,7 @@ function POLine({
locations={locations}
poURL={poURL}
funds={funds}
goToReceive={goToReceive}
deleteLine={deleteLine}
cancelLine={cancelLine}
tagsToggle={toggleTagsPane}
Expand Down
15 changes: 15 additions & 0 deletions src/components/POLine/POLine.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,10 @@ const defaultProps = {
},
},
poURL: '',
receiving: {
pathname: '/receiving',
search: `qindex=poLine.poLineNumber&query=${orderLine.poLineNumber}`,
},
resources: {},
};

Expand Down Expand Up @@ -128,6 +132,17 @@ describe('POLine actions', () => {
});
});

it('should go to receive', async () => {
renderPOLine();

await waitFor(() => POLineView.mock.calls[0][0].goToReceive());

expect(history.push).toHaveBeenCalledWith({
pathname: defaultProps.receiving.pathname,
search: defaultProps.receiving.search,
});
});

it('should delete POLine', async () => {
renderPOLine();

Expand Down
9 changes: 8 additions & 1 deletion src/components/POLine/POLineActionMenu/POLineActionMenu.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ export const POLineActionMenu = ({
onDeleteLine,
onEditLine,
onNavigateToOrder,
onReceive,
onPrintLine,
onPrintOrder,
onReexport,
Expand Down Expand Up @@ -56,6 +57,11 @@ export const POLineActionMenu = ({
onNavigateToOrder();
}, [onNavigateToOrder, onToggle]);

const onClickReceive = useCallback(() => {
onToggle();
Promise.resolve().then(() => onReceive()); // Delay to ensure toggle is complete before redirection
}, [onReceive, onToggle]);

const onClickReexport = useCallback(() => {
onToggle();
onReexport();
Expand Down Expand Up @@ -137,7 +143,7 @@ export const POLineActionMenu = ({
data-testid="line-details-receive-action"
buttonStyle="dropdownItem"
data-test-line-receive-button
to={`/receiving?qindex=poLine.poLineNumber&query=${line.poLineNumber}`}
onClick={onClickReceive}
>
<Icon size="small" icon="receive">
<FormattedMessage id="ui-orders.paneBlock.receiveBtn" />
Expand Down Expand Up @@ -232,6 +238,7 @@ POLineActionMenu.propTypes = {
onDeleteLine: PropTypes.func.isRequired,
onEditLine: PropTypes.func.isRequired,
onNavigateToOrder: PropTypes.func,
onReceive: PropTypes.func,
onPrintLine: PropTypes.func.isRequired,
onPrintOrder: PropTypes.func.isRequired,
onReexport: PropTypes.func.isRequired,
Expand Down
20 changes: 20 additions & 0 deletions src/components/POLine/POLineActionMenu/POLineActionMenu.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { MemoryRouter } from 'react-router-dom';

import user from '@folio/jest-config-stripes/testing-library/user-event';
import { act, render, screen } from '@folio/jest-config-stripes/testing-library/react';
import { RECEIPT_STATUS } from '@folio/stripes-acq-components';

import { order, orderLine } from 'fixtures';
import { WORKFLOW_STATUS } from '../../../common/constants';
Expand All @@ -21,6 +22,7 @@ const defaultProps = {
onEditLine: jest.fn(),
onPrintLine: jest.fn(),
onPrintOrder: jest.fn(),
onReceive: jest.fn(),
onReexport: jest.fn(),
onToggle: jest.fn(),
restrictions: {},
Expand All @@ -44,6 +46,7 @@ describe('POLineActionMenu', () => {
defaultProps.onEditLine.mockClear();
defaultProps.onPrintLine.mockClear();
defaultProps.onPrintOrder.mockClear();
defaultProps.onReceive.mockClear();
defaultProps.onReexport.mockClear();
defaultProps.onToggle.mockClear();
defaultProps.toggleForceVisibility.mockClear();
Expand Down Expand Up @@ -75,6 +78,23 @@ describe('POLineActionMenu', () => {
expect(defaultProps.onChangeInstance).toHaveBeenCalled();
});

it('should call \'onReceive\' when \'Receive\' action was triggered', async () => {
renderPOLineActionMenu({
order: {
...order,
workflowStatus: WORKFLOW_STATUS.open,
},
line: {
...orderLine,
receiptStatus: RECEIPT_STATUS.fullyReceived,
},
});

await act(async () => user.click(screen.getByTestId('line-details-receive-action')));

expect(defaultProps.onReceive).toHaveBeenCalled();
});

it('should call \'onReexport\' when \'Reexport\' action was triggered', async () => {
renderPOLineActionMenu({
order: {
Expand Down
4 changes: 4 additions & 0 deletions src/components/POLine/POLineView.js
Original file line number Diff line number Diff line change
Expand Up @@ -127,6 +127,7 @@ const POLineView = ({
deleteLine,
editable,
goToOrderDetails,
goToReceive,
history,
line,
location,
Expand Down Expand Up @@ -265,6 +266,7 @@ const POLineView = ({
onDeleteLine={toggleConfirmDelete}
onEditLine={onEditPOLine}
onNavigateToOrder={goToOrderDetails}
onReceive={goToReceive}
onPrintLine={togglePrintLineModal}
onPrintOrder={togglePrintOrderModal}
onReexport={toggleOrderLineReexportModal}
Expand All @@ -274,6 +276,7 @@ const POLineView = ({
}, [
editable,
goToOrderDetails,
goToReceive,
hiddenFields,
isCancelable,
isRestrictionsLoading,
Expand Down Expand Up @@ -646,6 +649,7 @@ POLineView.propTypes = {
onClose: PropTypes.func,
editable: PropTypes.bool,
goToOrderDetails: PropTypes.func,
goToReceive: PropTypes.func,
deleteLine: PropTypes.func,
cancelLine: PropTypes.func,
tagsToggle: PropTypes.func.isRequired,
Expand Down
5 changes: 4 additions & 1 deletion src/components/PurchaseOrder/getPOActionMenu.js
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,10 @@ export function getPOActionMenu({
buttonStyle="dropdownItem"
data-test-receiving-button
data-testid="order-receiving-button"
onClick={clickReceive}
onClick={() => {
onToggle();
Promise.resolve().then(() => clickReceive()); // Delay to ensure toggle is complete before redirection
}}
>
<Icon size="small" icon="receive">
<FormattedMessage id="ui-orders.paneBlock.receiveBtn" />
Expand Down

0 comments on commit d130047

Please sign in to comment.