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';