UISACQCOMP-240 Add GroupByOrgActionMenuItem action button for claims

CHANGELOG.md

@@ -9,6 +9,7 @@
 * Move reusable claiming code from `ui-receiving` to the shared library. Refs UISACQCOMP-236.
 * Support `CLAIMS` export type in the `useIntegrationConfigs` hook. Refs UISACQCOMP-238.
 * Exclude unsupported currencies on `getInvoiceExportData`. Refs UISACQCOMP-237.
+* Add `GroupByOrgActionMenuItem` action button. Refs UICLAIM-2.
 
 ## [6.0.3](https://github.com/folio-org/stripes-acq-components/tree/v6.0.3) (2024-12-27)
 [Full Changelog](https://github.com/folio-org/stripes-acq-components/compare/v6.0.2...v6.0.3)

lib/claiming/components/menu-items/GroupByOrgActionMenuItem/GroupByOrgActionMenuItem.js

@@ -0,0 +1,27 @@
+import PropTypes from 'prop-types';
+import { FormattedMessage } from 'react-intl';
+
+import {
+  Button,
+  Icon,
+} from '@folio/stripes/components';
+
+export const GroupByOrgActionMenuItem = ({
+  onClick,
+}) => {
+  return (
+    <Button
+      data-testid="group-by-org-button"
+      buttonStyle="dropdownItem"
+      onClick={onClick}
+    >
+      <Icon icon="house">
+        <FormattedMessage id="stripes-acq-components.claiming.action.groupByOrganization" />
+      </Icon>
+    </Button>
+  );
+};
+
+GroupByOrgActionMenuItem.propTypes = {
+  onClick: PropTypes.func.isRequired,
+};

lib/claiming/components/menu-items/GroupByOrgActionMenuItem/GroupByOrgActionMenuItem.test.js

@@ -0,0 +1,38 @@
+import {
+  render,
+  screen,
+} from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+import { GroupByOrgActionMenuItem } from './GroupByOrgActionMenuItem';
+
+const defaultProps = {
+  onClick: jest.fn(),
+};
+
+const renderComponent = (props = {}) => render(
+  <GroupByOrgActionMenuItem
+    {...defaultProps}
+    {...props}
+  />,
+);
+
+describe('GroupByOrgActionMenuItem', () => {
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should render the button', () => {
+    renderComponent();
+
+    expect(screen.getByTestId('group-by-org-button')).toBeInTheDocument();
+  });
+
+  it('should call onClick when button is clicked', async () => {
+    renderComponent();
+
+    await userEvent.click(screen.getByTestId('group-by-org-button'));
+
+    expect(defaultProps.onClick).toHaveBeenCalled();
+  });
+});

lib/claiming/components/menu-items/GroupByOrgActionMenuItem/index.js

@@ -0,0 +1 @@
+export { GroupByOrgActionMenuItem } from './GroupByOrgActionMenuItem';

lib/claiming/components/menu-items/index.js

@@ -1,3 +1,4 @@
 export { DelayClaimActionMenuItem } from './DelayClaimActionMenuItem';
 export { MarkUnreceivableActionMenuItem } from './MarkUnreceivableActionMenuItem';
 export { SendClaimActionMenuItem } from './SendClaimActionMenuItem';
+export { GroupByOrgActionMenuItem } from './GroupByOrgActionMenuItem';

translations/stripes-acq-components/en.json

@@ -144,6 +144,7 @@
   "receiving.itemStatus.Order closed": "Order closed",
   "receiving.itemStatus.Undefined": "Undefined",
 
+  "claiming.action.groupByOrganization": "Group by organization",
   "claiming.action.sendClaim": "Send claim",
   "claiming.action.delayClaim": "Delay claim",
   "claiming.action.unreceivable": "Unreceivable",