Skip to content

Commit

Permalink
UISACQCOMP-208: ECS - clear Select location filters on change another…
Browse files Browse the repository at this point in the history
… Affiliation (#799)

* UISACQCOMP-208: ECS - clear Select location filters on change another Affiliation

* fix holding selection issue

* test: add unit test

* test: add test coverage

* refactor resetFilters function

* reset filter on change affiliation

* add initial value constanta
  • Loading branch information
alisher-epam authored Jul 31, 2024
1 parent d4faea1 commit f096bdf
Show file tree
Hide file tree
Showing 6 changed files with 218 additions and 8 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
* Add translation for `Unavailable` item status message. Refs UISACQCOMP-205.
* Keep returnUrl in routing list navigation. Refs UISACQCOMP-206.
* ECS - clear Location/Holding field when affiliation selected. Refs UISACQCOMP-201.
* ECS - clear Select location filters on change another Affiliation. Refs UISACQCOMP-208.

## [5.1.1](https://github.com/folio-org/stripes-acq-components/tree/v5.1.1) (2024-04-22)
[Full Changelog](https://github.com/folio-org/stripes-acq-components/compare/v5.1.0...v5.1.1)
Expand Down
4 changes: 3 additions & 1 deletion lib/FieldHolding/FieldHolding.js
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,9 @@ export const FieldHolding = ({
}, [locationFieldName, onChange]);

useEffect(() => {
if (previousTenantId !== tenantId) {
const shouldResetLocation = tenantId && previousTenantId && (tenantId !== previousTenantId);

if (shouldResetLocation) {
clearSelectedLocation();
onChangeHolding(undefined);
}
Expand Down
21 changes: 21 additions & 0 deletions lib/FieldHolding/FieldHolding.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -88,4 +88,25 @@ describe('FieldHolding component', () => {
expect(screen.getAllByText(locationsMap[holdings[0].permanentLocationId].name)[0]).toBeInTheDocument();
expect(screen.queryByText(locationsMap[holdings[1].permanentLocationId].name)).not.toBeInTheDocument();
});

it('should clear selected holding when tenant changes', () => {
const onChange = jest.fn();
const { rerender } = renderFieldHolding({ tenantId: 'tenant1', onChange });

rerender(
<Form
onSubmit={jest.fn()}
initialValues={{ holdingId: holdings[0].id }}
render={() => (
<FieldHolding
{...defaultProps}
tenantId="tenant2"
onChange={onChange}
/>
)}
/>,
);

expect(onChange).toHaveBeenCalledWith(null, defaultProps.locationFieldName);
});
});
13 changes: 9 additions & 4 deletions lib/FindLocation/FindLocationLookup.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,8 @@ import {
useLocationsRecords,
} from './hooks';

const INITIAL_FILTERS = {};

export const FindLocationLookup = (props) => {
const {
affiliationsLabel,
Expand All @@ -51,7 +53,7 @@ export const FindLocationLookup = (props) => {
const currUserTenants = useCurrentUserTenants();

const [selectedLocations, setSelectedLocations] = useState({});
const [filters, setFilters] = useState({});
const [filters, setFilters] = useState(INITIAL_FILTERS);

const options = {
tenantId,
Expand Down Expand Up @@ -116,7 +118,6 @@ export const FindLocationLookup = (props) => {
|| isCampusesLoading
|| isLibrariesLoading
);

const renderFilters = useCallback((activeFilters, applyFilters) => (
<FindLocationFilters
activeFilters={activeFilters}
Expand All @@ -135,13 +136,17 @@ export const FindLocationLookup = (props) => {
libraries,
]);

const renderBeforeSearch = useCallback(() => {
const renderBeforeSearch = useCallback((resetFilters) => {
return crossTenant
? (
<AffiliationsSelection
affiliations={affiliations}
label={affiliationsLabel}
onChange={onTenantChange}
onChange={(tenant) => {
onTenantChange?.(tenant);
resetFilters?.();
setFilters(INITIAL_FILTERS);
}}
isLoading={isLoading}
value={tenantId}
/>
Expand Down
178 changes: 178 additions & 0 deletions lib/FindLocation/FindLocationLookup.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,178 @@
import { useLocalStorage } from '@rehooks/local-storage';
import { render, screen } from '@testing-library/react';
import user from '@testing-library/user-event';

import {
useCampusesQuery,
useCurrentUserTenants,
useInstitutionsQuery,
useLibrariesQuery,
} from '../hooks';
import { FindLocationLookup } from './FindLocationLookup';
import {
useLocationsList,
useLocationsRecords,
} from './hooks';

jest.mock('@rehooks/local-storage', () => ({
useLocalStorage: jest.fn(),
}));

jest.mock('../AcqList', () => ({
...jest.requireActual('../AcqList'),
useFiltersToogle: () => ({ isFiltersOpened: true, toggleFilters: jest.fn }),
}));
jest.mock('../hooks', () => ({
...jest.requireActual('../hooks'),
useCampusesQuery: jest.fn(),
useCurrentUserTenants: jest.fn(),
useEventEmitter: jest.fn().mockReturnValue({
emit: jest.fn(),
on: jest.fn(),
off: jest.fn(),
}),
useInstitutionsQuery: jest.fn(),
useLibrariesQuery: jest.fn(),
}));
jest.mock('./hooks', () => ({
useLocationsList: jest.fn(),
useLocationsRecords: jest.fn(),
}));

const setItem = jest.fn();
const removeItem = jest.fn();
const mockTenants = [
{
id: 'central',
name: 'Central Office',
isPrimary: true,
},
{
id: 'college',
name: 'College',
isPrimary: false,
},
];

const renderFindLocationLookup = (props) => render(
<FindLocationLookup
affiliationsLabel="affiliationsLabel"
crossTenant
filterRecords={jest.fn()}
idPrefix="idPrefix"
isMultiSelect
modalLabel="modalLabel"
onRecordsSelect={jest.fn()}
resultsPaneTitle="resultsPaneTitle"
sortableColumns={['sortableColumns']}
tenantId={mockTenants[0].id}
visibleColumns={['visibleColumns']}
{...props}
/>,
);

describe('FindLocationLookup', () => {
beforeEach(() => {
useCampusesQuery.mockClear().mockReturnValue({
campuses: [],
isLoading: false,
});
useInstitutionsQuery.mockClear().mockReturnValue({
institutions: [],
isLoading: false,
});
useLibrariesQuery.mockClear().mockReturnValue({
libraries: [],
isLoading: false,
});
useLocationsList.mockClear().mockReturnValue({ locations: [] });
useLocationsRecords.mockClear().mockReturnValue({
locations: [],
isLoading: false,
});
useLocalStorage.mockReturnValue([
null,
setItem,
removeItem,
]);
useCurrentUserTenants.mockClear().mockReturnValue(mockTenants);
});
it('should render FindRecords component', () => {
const { getByText } = renderFindLocationLookup();

expect(getByText('resultsPaneTitle')).toBeDefined();
});

it('should clear filters on tenant change', async () => {
const onTenantChange = jest.fn();

useInstitutionsQuery.mockClear().mockReturnValue({
institutions: [
{
'id': 'a0ba27d5-aa76-4bfb-904d-1ba9b80ab882',
'tenantId': 'cs00000int',
'name': 'Test 1',
},
],
isLoading: false,
});
useCampusesQuery.mockClear().mockReturnValue({
campuses: [{
'id': '124da306-a838-40c4-812d-4e2d1e82ebdd',
'tenantId': 'cs00000int',
'name': 'Campus 1',
'institutionId': '9d1b77e5-f02e-4b7f-b296-3f2042ddac54',
}],
isLoading: false,
});
useLibrariesQuery.mockClear().mockReturnValue({
libraries: [{
'id': '563e0d8b-180d-45fb-abfe-5d0696ba4f60',
'tenantId': 'cs00000int',
'name': 'library',
'campusId': '124da306-a838-40c4-812d-4e2d1e82ebdd',
}],
isLoading: false,
});
useLocationsList.mockClear().mockReturnValue({
locations: [
{
'id': '65578bd8-0e87-472e-8579-9db5cfe846dc',
'name': 'Folio name',
'tenantId': 'cs00000int',
'code': 'location-new',
'discoveryDisplayName': 'Location new',
'isActive': 'true',
'institutionId': '9d1b77e5-f02e-4b7f-b296-3f2042ddac54',
'campusId': '124da306-a838-40c4-812d-4e2d1e82ebdd',
'libraryId': '563e0d8b-180d-45fb-abfe-5d0696ba4f60',
'primaryServicePoint': '9d1b77e8-f02e-4b7f-b296-3f2042ddac54',
'servicePointIds': [
'9d1b77e8-f02e-4b7f-b296-3f2042ddac54',
],
'campus': {
'id': '124da306-a838-40c4-812d-4e2d1e82ebdd',
'tenantId': 'cs00000int',
'name': 'Campus 1',
'institutionId': '9d1b77e5-f02e-4b7f-b296-3f2042ddac54',
},
'library': {
'id': '563e0d8b-180d-45fb-abfe-5d0696ba4f60',
'tenantId': 'cs00000int',
'name': 'library',
'campusId': '124da306-a838-40c4-812d-4e2d1e82ebdd',
},
},
],
});

renderFindLocationLookup({ onTenantChange });

const affiliationSelection = await screen.findByText('affiliationsLabel');

expect(affiliationSelection).toBeInTheDocument();
await user.click(screen.getByText(mockTenants[1].name));

expect(onTenantChange).toHaveBeenCalledWith(mockTenants[1].id);
});
});
9 changes: 6 additions & 3 deletions lib/FindRecords/FindRecordsModal.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
import { pickBy, noop } from 'lodash';
import PropTypes from 'prop-types';
import React, { useEffect } from 'react';
import {
createRef,
useEffect,
} from 'react';
import { FormattedMessage, useIntl } from 'react-intl';

import {
Expand Down Expand Up @@ -240,7 +243,7 @@ export const FindRecordsModal = ({
label={modalLabel}
onClose={closeModal}
open
ref={modalRef || React.createRef()}
ref={modalRef || createRef()}
size="large"
style={{ minHeight: '500px' }}
>
Expand All @@ -260,7 +263,7 @@ export const FindRecordsModal = ({
toggleFilters={toggleFilters}
width="22%"
>
{renderBeforeSearch()}
{renderBeforeSearch(resetFilters)}
<SingleSearchForm
applySearch={applySearch}
changeSearch={changeSearch}
Expand Down

0 comments on commit f096bdf

Please sign in to comment.