diff --git a/lib/Donors/DonorsContainer.js b/lib/Donors/DonorsContainer.js
index 90f156cf..60add8db 100644
--- a/lib/Donors/DonorsContainer.js
+++ b/lib/Donors/DonorsContainer.js
@@ -5,7 +5,7 @@ import { useIntl } from 'react-intl';
import { useStripes } from '@folio/stripes/core';
-import { defaultVisibleColumns } from './constants';
+import { defaultContainerVisibleColumns } from './constants';
import { DonorsList } from './DonorsList';
import { DonorsLookup } from './DonorsLookup';
import { getDonorsFormatter } from './utils';
@@ -21,6 +21,7 @@ export function DonorsContainer({
searchLabel,
showTriggerButton,
visibleColumns,
+ ...rest
}) {
const stripes = useStripes();
const intl = useIntl();
@@ -69,6 +70,7 @@ export function DonorsContainer({
formatter={resultsFormatter}
columnMapping={columnMapping}
columnWidths={columnWidths}
+ {...rest}
/>
{
@@ -100,5 +102,5 @@ DonorsContainer.propTypes = {
DonorsContainer.defaultProps = {
showTriggerButton: true,
- visibleColumns: defaultVisibleColumns,
+ visibleColumns: defaultContainerVisibleColumns,
};
diff --git a/lib/Donors/DonorsList.js b/lib/Donors/DonorsList.js
index 1eed1df8..a2b8a90c 100644
--- a/lib/Donors/DonorsList.js
+++ b/lib/Donors/DonorsList.js
@@ -1,5 +1,5 @@
import PropTypes from 'prop-types';
-import { useCallback, useMemo } from 'react';
+import { useMemo } from 'react';
import { MultiColumnList } from '@folio/stripes/components';
import { useStripes } from '@folio/stripes/core';
@@ -19,6 +19,7 @@ export const DonorsList = ({
formatter: formatterProp,
id,
visibleColumns,
+ ...rest
}) => {
const stripes = useStripes();
const canViewOrganizations = stripes.hasPerm('ui-organizations.view');
@@ -26,9 +27,7 @@ export const DonorsList = ({
return formatterProp || getDonorsListFormatter({ canViewOrganizations });
}, [canViewOrganizations, formatterProp]);
- const anchoredRowFormatter = useCallback((rowProps) => {
- return acqRowFormatter(rowProps);
- }, []);
+ const anchoredRowFormatter = (rowProp) => acqRowFormatter(rowProp);
return (
);
};
diff --git a/lib/Donors/DonorsListContainer.js b/lib/Donors/DonorsListContainer.js
new file mode 100644
index 00000000..c8d4b240
--- /dev/null
+++ b/lib/Donors/DonorsListContainer.js
@@ -0,0 +1,26 @@
+import PropTypes from 'prop-types';
+
+import { Loading } from '@folio/stripes/components';
+
+import { DonorsList } from './DonorsList';
+import { useFetchDonors } from './hooks';
+
+export const DonorsListContainer = ({ donorOrganizationIds, ...rest }) => {
+ const { donors, isLoading } = useFetchDonors(donorOrganizationIds);
+
+ if (isLoading) {
+ return ;
+ }
+
+ return (
+
+ );
+};
+
+DonorsListContainer.propTypes = {
+ donorOrganizationIds: PropTypes.arrayOf(PropTypes.string).isRequired,
+};
diff --git a/lib/Donors/DonorsListContainer.test.js b/lib/Donors/DonorsListContainer.test.js
new file mode 100644
index 00000000..4339df50
--- /dev/null
+++ b/lib/Donors/DonorsListContainer.test.js
@@ -0,0 +1,58 @@
+import { MemoryRouter } from 'react-router-dom';
+import { render, screen } from '@testing-library/react';
+
+import { DonorsListContainer } from './DonorsListContainer';
+import { useFetchDonors } from './hooks';
+
+jest.mock('@folio/stripes/components', () => ({
+ ...jest.requireActual('@folio/stripes/components'),
+ Loading: jest.fn(() => 'Loading'),
+}));
+
+jest.mock('./DonorsList', () => ({
+ DonorsList: jest.fn(() => 'DonorsList'),
+}));
+
+jest.mock('./hooks', () => ({
+ useFetchDonors: jest.fn().mockReturnValue({
+ donors: [],
+ isLoading: false,
+ }),
+}));
+
+const defaultProps = {
+ donorOrganizationIds: [],
+};
+
+const wrapper = ({ children }) => (
+
+ {children}
+
+);
+
+const renderComponent = (props = {}) => (render(
+ ,
+ { wrapper },
+));
+
+describe('DonorsListContainer', () => {
+ it('should render component', () => {
+ renderComponent();
+
+ expect(screen.getByText('DonorsList')).toBeDefined();
+ });
+
+ it('should render loading component', () => {
+ useFetchDonors.mockClear().mockReturnValue({
+ donors: [],
+ isLoading: true,
+ });
+
+ renderComponent();
+
+ expect(screen.getByText('Loading')).toBeDefined();
+ });
+});
diff --git a/lib/Donors/constants.js b/lib/Donors/constants.js
index f145e44a..f0b0d217 100644
--- a/lib/Donors/constants.js
+++ b/lib/Donors/constants.js
@@ -11,6 +11,11 @@ export const defaultVisibleColumns = [
'code',
];
+export const defaultContainerVisibleColumns = [
+ ...defaultVisibleColumns,
+ 'unassignDonor',
+];
+
export const alignRowProps = { alignLastColToEnd: true };
export const modalLabel = ;
diff --git a/lib/Donors/index.js b/lib/Donors/index.js
index bfdd00b0..f625423c 100644
--- a/lib/Donors/index.js
+++ b/lib/Donors/index.js
@@ -1,3 +1,4 @@
export { Donors } from './Donors';
export { DonorsList } from './DonorsList';
+export { DonorsListContainer } from './DonorsListContainer';
export { useFetchDonors } from './hooks/useFetchDonors';