From d5a8adccb31e4adf92c81b3fd62a6d2c9a092160 Mon Sep 17 00:00:00 2001 From: Dmytro Melnyshyn Date: Fri, 17 Jan 2025 10:50:39 +0200 Subject: [PATCH] UIEH-1442: Package Record - Title List view - Apply MCL component, add display of managed, custom coverage dates. --- CHANGELOG.md | 5 +- .../custom-labels-edit-section.js | 4 +- .../custom-labels-show-section.js | 2 +- src/components/details-view/details-view.js | 5 +- src/components/inline-form/inline-form.js | 2 +- .../package-coverage-fields.js | 6 +- .../package/create/package-create.js | 4 +- .../PackageTitleList/PackageTitleList.js | 133 +++++++++++++++++ .../PackageTitleList/PackageTitleList.test.js | 137 ++++++++++++++++++ .../show/components/PackageTitleList/index.js | 1 + src/components/package/show/package-show.css | 6 + src/components/package/show/package-show.js | 35 +---- .../package/show/package-show.test.js | 26 ++-- src/components/provider/edit/provider-edit.js | 2 +- src/components/provider/show/provider-show.js | 8 +- .../custom-embargo/custom-embargo-fields.js | 4 +- .../resource-coverage-fields.js | 6 +- src/components/resource/resource-edit.js | 8 +- src/components/search-form/search-form.js | 2 +- src/components/search-modal/search-modal.js | 18 +-- src/components/settings/settings.js | 8 +- src/components/title/create/title-create.js | 2 +- src/components/title/edit/title-edit.js | 2 +- src/components/title/show/title-show.js | 10 +- src/components/toaster/toast.js | 2 +- src/components/toaster/toaster.js | 2 +- src/components/toggle-switch/toggle-switch.js | 4 +- src/components/token/token-field.js | 2 +- .../custom-labels-accordion.js | 6 +- .../application-route/application-route.js | 2 +- src/routes/note-edit.js | 2 +- .../package-edit-route/package-edit-route.js | 2 +- .../package-show-route/package-show-route.js | 16 +- .../package-show-route.test.js | 19 +++ .../provider-edit-route.js | 4 +- .../provider-show-route.js | 6 +- .../resource-edit-route.js | 4 +- .../resource-show-route.js | 6 +- src/routes/search-route/search-route.js | 8 +- .../title-edit-route/title-edit-route.js | 4 +- .../title-show-route/title-show-route.js | 4 +- translations/ui-eholdings/en.json | 9 +- 42 files changed, 410 insertions(+), 128 deletions(-) create mode 100644 src/components/package/show/components/PackageTitleList/PackageTitleList.js create mode 100644 src/components/package/show/components/PackageTitleList/PackageTitleList.test.js create mode 100644 src/components/package/show/components/PackageTitleList/index.js create mode 100644 src/components/package/show/package-show.css diff --git a/CHANGELOG.md b/CHANGELOG.md index 18a456bbd..b343e50c6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,10 +1,11 @@ # Change history for ui-eholdings -## [10.1.0] (IN PROGRESS) +## [11.0.0] (IN PROGRESS) * Add `target="_blank"` to the `New` button of agreements accordion. (UIEH-1446) * Remove `shouldFocus` HOC and all related code. (UIEH-1444) -* Package Record - Title List Accordion - Improve Visibility of Search Within/Filter/Sort options. (UIEH-1440) +* *BREAKING* Package Record - Title List Accordion - Improve Visibility of Search Within/Filter/Sort options. (UIEH-1440) +* *BREAKING* Package Record - Title List view - Apply MCL component, add display of managed, custom coverage dates. (UIEH-1442) ## [10.0.1] (https://github.com/folio-org/ui-eholdings/tree/v10.0.1) (2024-11-12) diff --git a/src/components/custom-labels-section/custom-labels-edit-section.js b/src/components/custom-labels-section/custom-labels-edit-section.js index 92fc5a4b3..4e7b8effc 100644 --- a/src/components/custom-labels-section/custom-labels-edit-section.js +++ b/src/components/custom-labels-section/custom-labels-edit-section.js @@ -19,7 +19,7 @@ class CustomLabelsEditSection extends Component { id: PropTypes.number, }) })).isRequired, - } + }; validateStringLength = (value) => { const message = ( @@ -30,7 +30,7 @@ class CustomLabelsEditSection extends Component { ); return value && value.length > CUSTOM_LABELS_VALUE_MAX_LENGTH ? message : undefined; - } + }; render() { const { diff --git a/src/components/custom-labels-section/custom-labels-show-section.js b/src/components/custom-labels-section/custom-labels-show-section.js index fa4bc7d46..ed86d884c 100644 --- a/src/components/custom-labels-section/custom-labels-show-section.js +++ b/src/components/custom-labels-section/custom-labels-show-section.js @@ -19,7 +19,7 @@ export default class CustomLabelsShowSection extends Component { }), })).isRequired, userDefinedFields: PropTypes.objectOf(PropTypes.string).isRequired, - } + }; render() { const { diff --git a/src/components/details-view/details-view.js b/src/components/details-view/details-view.js index 5e3206eae..66cb29b71 100644 --- a/src/components/details-view/details-view.js +++ b/src/components/details-view/details-view.js @@ -75,7 +75,7 @@ class DetailsView extends Component { static defaultProps = { searchModal: null, - } + }; // used to focus the heading when the model loads $heading = createRef(); // eslint-disable-line react/sort-comp @@ -105,7 +105,6 @@ class DetailsView extends Component { renderAccordionHeader = (props) => ( ); @@ -131,7 +130,7 @@ class DetailsView extends Component { )} ); - } + }; renderItemData() { const { diff --git a/src/components/inline-form/inline-form.js b/src/components/inline-form/inline-form.js index 75a14260b..36d6702e8 100644 --- a/src/components/inline-form/inline-form.js +++ b/src/components/inline-form/inline-form.js @@ -11,7 +11,7 @@ export default class InlineForm extends Component { onCancel: PropTypes.func.isRequired, onSubmit: PropTypes.func.isRequired, pristine: PropTypes.bool.isRequired - } + }; render() { const { diff --git a/src/components/package/_fields/custom-coverage/package-coverage-fields.js b/src/components/package/_fields/custom-coverage/package-coverage-fields.js index af7a267c1..e8df7b4a2 100644 --- a/src/components/package/_fields/custom-coverage/package-coverage-fields.js +++ b/src/components/package/_fields/custom-coverage/package-coverage-fields.js @@ -40,7 +40,7 @@ class PackageCoverageFields extends Component { }); return errorArray; - } + }; validateCoverageDate = (value) => { const { intl } = this.props; @@ -58,7 +58,7 @@ class PackageCoverageFields extends Component { } return errors; - } + }; renderField = (dateRange, index) => { return ( @@ -111,7 +111,7 @@ class PackageCoverageFields extends Component { ); - } + }; renderRepeatableField = ({ fields, meta: { initial } }) => { const hasAddButton = fields.length === 0; diff --git a/src/components/package/create/package-create.js b/src/components/package/create/package-create.js index 400b06f72..030383fee 100644 --- a/src/components/package/create/package-create.js +++ b/src/components/package/create/package-create.js @@ -87,7 +87,7 @@ class PackageCreate extends Component { renderEnd={saveButton} /> ); - } + }; getFirstMenu = () => { const { onCancel } = this.props; @@ -109,7 +109,7 @@ class PackageCreate extends Component { ) : null; - } + }; render() { const { diff --git a/src/components/package/show/components/PackageTitleList/PackageTitleList.js b/src/components/package/show/components/PackageTitleList/PackageTitleList.js new file mode 100644 index 000000000..6ddbc7328 --- /dev/null +++ b/src/components/package/show/components/PackageTitleList/PackageTitleList.js @@ -0,0 +1,133 @@ +import { useIntl } from 'react-intl'; +import PropTypes from 'prop-types'; + +import { + MCLPagingTypes, + MultiColumnList, + TextLink, +} from '@folio/stripes/components'; + +import SelectedLabel from '../../../../selected-label'; +import InternalLink from '../../../../internal-link'; +import CoverageDateList from '../../../../coverage-date-list'; +import { isBookPublicationType } from '../../../../utilities'; + +import styles from '../../package-show.css'; + +const COLUMNS = { + STATUS: 'status', + TITLE: 'title', + MANAGED_COVERAGE: 'managedCoverage', + CUSTOM_COVERAGE: 'customCoverage', + MANAGED_EMBARGO: 'managedEmbargo', +}; + +const MAX_HEIGHT = 526; + +const propTypes = { + count: PropTypes.number.isRequired, + isLoading: PropTypes.bool, + onFetchPackageTitles: PropTypes.func.isRequired, + page: PropTypes.number.isRequired, + records: PropTypes.arrayOf(PropTypes.object).isRequired, + totalResults: PropTypes.number.isRequired, +}; + +const PackageTitleList = ({ + records, + isLoading, + totalResults, + page, + count, + onFetchPackageTitles, +}) => { + const intl = useIntl(); + + const columnMappings = { + [COLUMNS.STATUS]: intl.formatMessage({ id: 'ui-eholdings.titlesList.status' }), + [COLUMNS.TITLE]: intl.formatMessage({ id: 'ui-eholdings.titlesList.title' }), + [COLUMNS.MANAGED_COVERAGE]: intl.formatMessage({ id: 'ui-eholdings.titlesList.managedCoverage' }), + [COLUMNS.CUSTOM_COVERAGE]: intl.formatMessage({ id: 'ui-eholdings.titlesList.customCoverage' }), + [COLUMNS.MANAGED_EMBARGO]: intl.formatMessage({ id: 'ui-eholdings.titlesList.managedEmbargo' }), + }; + + const handleMore = (askAmount, index, firstIndex, direction) => { + const newPage = direction === 'next' ? page + 1 : page - 1; + onFetchPackageTitles(newPage); + }; + + const formatter = { + [COLUMNS.STATUS]: item => { + return ( + + ); + }, + [COLUMNS.TITLE]: item => { + return ( + + {({ className }) => ( + + {item.attributes.name} + + )} + + ); + }, + [COLUMNS.MANAGED_COVERAGE]: item => { + return ( + + ); + }, + [COLUMNS.CUSTOM_COVERAGE]: item => { + return ( + + ); + }, + [COLUMNS.MANAGED_EMBARGO]: item => { + const { embargoUnit, embargoValue } = item.attributes.managedEmbargoPeriod || {}; + + if (!embargoUnit || !embargoValue) { + return null; + } + + return intl.formatMessage({ id: `ui-eholdings.resource.embargoUnit.${embargoUnit}` }, { + value: embargoValue, + }); + }, + }; + + return ( +
+ +
+ ); +}; + +PackageTitleList.propTypes = propTypes; + +export { PackageTitleList }; diff --git a/src/components/package/show/components/PackageTitleList/PackageTitleList.test.js b/src/components/package/show/components/PackageTitleList/PackageTitleList.test.js new file mode 100644 index 000000000..2359e13a0 --- /dev/null +++ b/src/components/package/show/components/PackageTitleList/PackageTitleList.test.js @@ -0,0 +1,137 @@ +import { render } from '@folio/jest-config-stripes/testing-library/react'; +import userEvent from '@folio/jest-config-stripes/testing-library/user-event'; + +import { createMemoryHistory } from 'history'; +import { PackageTitleList } from './PackageTitleList'; +import getAxe from '../../../../../../test/jest/helpers/get-axe'; +import Harness from '../../../../../../test/jest/helpers/harness'; + +const records = [ + { + id: '1', + attributes: { + isSelected: true, + name: 'Title name1', + managedCoverages: [{ + 'beginCoverage': '2005-01-01', + 'endCoverage': '2005-12-31' + }], + customCoverages: [ + { + 'beginCoverage': '2025-01-09', + 'endCoverage': '2026-01-01' + }, + { + 'beginCoverage': '2025-01-07', + 'endCoverage': '2025-01-08' + }, + ], + managedEmbargoPeriod: { + embargoUnit: 'Days', + embargoValue: 11, + }, + publicationType: 'book', + }, + }, + { + id: '2', + attributes: { + isSelected: false, + name: 'Title name2', + managedCoverages: [{ + beginCoverage: '2017-08-01', + endCoverage: '2017-08-01', + }], + customCoverages: [], + managedEmbargoPeriod: { + embargoValue: 0, + }, + publicationType: 'book', + }, + }, +]; + +const mockOnFetchPackageTitles = jest.fn(); +const mockHistoryPush = jest.fn(); + +const history = createMemoryHistory(); +history.push = mockHistoryPush; + +const renderPackageTitleList = (props = {}) => render( + + + +); + +const axe = getAxe(); + +describe('Given PackageTitleList', () => { + beforeEach(() => { + jest.clearAllMocks(); + }); + + it('should have no a11y issues', async () => { + const { container } = renderPackageTitleList(); + + const a11yResults = await axe.run(container); + + expect(a11yResults.violations.length).toEqual(0); + }); + + it('should display the correct columns', () => { + const { getByText } = renderPackageTitleList(); + + expect(getByText('ui-eholdings.titlesList.status')).toBeDefined(); + expect(getByText('ui-eholdings.titlesList.title')).toBeDefined(); + expect(getByText('ui-eholdings.titlesList.managedCoverage')).toBeDefined(); + expect(getByText('ui-eholdings.titlesList.customCoverage')).toBeDefined(); + expect(getByText('ui-eholdings.titlesList.managedEmbargo')).toBeDefined(); + }); + + it('should call onFetchPackageTitles when fetching more data', async () => { + const { getByRole } = renderPackageTitleList(); + + await userEvent.click(getByRole('button', { name: 'stripes-components.next' })); + + expect(mockOnFetchPackageTitles).toHaveBeenCalledWith(2); + }); + + describe('when clicking on the title link', () => { + it('should set location.state.eholdings to true', async () => { + const { getByText } = renderPackageTitleList(); + + await userEvent.click(getByText('Title name1')); + + expect(mockHistoryPush).toHaveBeenCalledWith({ + pathname: '/eholdings/resources/1', + state: { + eholdings: true, + }, + }); + }); + }); + + it('should display records correctly', () => { + const { getByText } = renderPackageTitleList(); + + expect(getByText('ui-eholdings.selected')).toBeDefined(); + expect(getByText('Title name1')).toBeDefined(); + expect(getByText('1/1/2005 - 12/31/2005')).toBeDefined(); + expect(getByText('1/9/2025 - 1/1/2026, 1/7/2025 - 1/8/2025')).toBeDefined(); + expect(getByText('ui-eholdings.resource.embargoUnit.Days')).toBeDefined(); + + expect(getByText('ui-eholdings.notSelected')).toBeDefined(); + expect(getByText('Title name2')).toBeDefined(); + expect(getByText('8/1/2017 - 8/1/2017')).toBeDefined(); + }); +}); diff --git a/src/components/package/show/components/PackageTitleList/index.js b/src/components/package/show/components/PackageTitleList/index.js new file mode 100644 index 000000000..283a71956 --- /dev/null +++ b/src/components/package/show/components/PackageTitleList/index.js @@ -0,0 +1 @@ +export * from './PackageTitleList'; diff --git a/src/components/package/show/package-show.css b/src/components/package/show/package-show.css new file mode 100644 index 000000000..d1299e53e --- /dev/null +++ b/src/components/package/show/package-show.css @@ -0,0 +1,6 @@ +@import "@folio/stripes-components/lib/variables"; + +.titlesListContainer { + max-width: calc(var(--container-max-width) - 2rem); + margin: 0 auto; +} diff --git a/src/components/package/show/package-show.js b/src/components/package/show/package-show.js index 86e3f5f1d..c6bcc3d5d 100644 --- a/src/components/package/show/package-show.js +++ b/src/components/package/show/package-show.js @@ -18,8 +18,6 @@ import { NotesSmartAccordion } from '@folio/stripes/smart-components'; import { Button } from '@folio/stripes/components'; import DetailsView from '../../details-view'; -import QuerySearchList from '../../query-search-list'; -import TitleListItem from '../../title-list-item'; import Toaster from '../../toaster'; import TagsAccordion from '../../tags'; import { @@ -27,13 +25,13 @@ import { UsageConsolidationAccordion, ExportPackageResourcesModal, } from '../../../features'; -import QueryNotFound from '../../query-search-list/not-found'; import KeyShortcutsWrapper from '../../key-shortcuts-wrapper'; import HoldingStatus from './components/holding-status'; import PackageInformation from './components/package-information'; import PackageSettings from './components/package-settings'; import CoverageSettings from './components/coverage-settings'; import SelectionModal from '../../selection-modal'; +import { PackageTitleList } from './components/PackageTitleList'; import { useSectionToggle } from '../../../hooks'; import { @@ -54,7 +52,6 @@ import { qs, } from '../../utilities'; -const ITEM_HEIGHT = 62; const UC_MAX_EXPORT_TITLE_LIMIT = 200000; const CSV_MAX_EXPORT_TITLE_LIMIT = 10000; @@ -382,31 +379,15 @@ const PackageShow = ({ ); }; - const renderTitlesListItem = (item) => { - return ( - - ); - }; - const renderTitlesList = () => { return ( - - - - } - renderItem={renderTitlesListItem} + ); }; diff --git a/src/components/package/show/package-show.test.js b/src/components/package/show/package-show.test.js index 53c80cf8a..df31e4ce6 100644 --- a/src/components/package/show/package-show.test.js +++ b/src/components/package/show/package-show.test.js @@ -94,6 +94,18 @@ const testModel = { }, }; +const pkgSearchParams = { + searchfield: 'title', + count: 100, + page: 1, + filter: { + 'access-type': undefined, + selected: undefined, + tags: undefined, + type: undefined, + } +}; + const mockAddPackageToHoldings = jest.fn(); const mockFetchCostPerUsePackageTitles = jest.fn(); const mockFetchPackageCostPerUse = jest.fn(); @@ -151,6 +163,7 @@ const renderPackageShow = (props = {}) => render( }} toggleSelected={mockToggleSelected} updateFolioTags={mockUpdateFolioTags} + pkgSearchParams={pkgSearchParams} {...props} /> @@ -302,19 +315,6 @@ describe('Given PackageShow', () => { }); describe('when opening', () => { - describe('and the titles are loaded', () => { - it('should not render the accordion list count', () => { - const { queryByTestId } = renderPackageShow({ - isTitlesUpdating: false, - packageTitles: { - isLoading: true, - }, - }); - - expect(queryByTestId('accordion-list-count')).not.toBeInTheDocument(); - }); - }); - it('should call onToggleTitles', () => { const { getByRole } = renderPackageShow(); diff --git a/src/components/provider/edit/provider-edit.js b/src/components/provider/edit/provider-edit.js index fbc2d4f71..5fc241b9b 100644 --- a/src/components/provider/edit/provider-edit.js +++ b/src/components/provider/edit/provider-edit.js @@ -71,7 +71,7 @@ export default class ProviderEdit extends Component { renderEnd={saveButton} /> ); - } + }; renderProxySelectField() { const { diff --git a/src/components/provider/show/provider-show.js b/src/components/provider/show/provider-show.js index 8402e8130..3fb4f5746 100644 --- a/src/components/provider/show/provider-show.js +++ b/src/components/provider/show/provider-show.js @@ -89,12 +89,12 @@ class ProviderShow extends Component { handleSectionToggle = ({ id }) => { const next = update(`sections.${id}`, value => !value, this.state); this.setState(next); - } + }; handleExpandAll = (sections) => { const next = set('sections', sections, this.state); this.setState(next); - } + }; get toasts() { const { model, isFreshlySaved } = this.props; @@ -198,7 +198,7 @@ class ProviderShow extends Component { headingLevel='h4' /> ); - } + }; renderPackagesList = () => { const { @@ -220,7 +220,7 @@ class ProviderShow extends Component { renderItem={this.renderPackagesListItem} /> ); - } + }; toggleAllSections = (expand) => { this.setState((curState) => { diff --git a/src/components/resource/_fields/custom-embargo/custom-embargo-fields.js b/src/components/resource/_fields/custom-embargo/custom-embargo-fields.js index 75c1690cd..baf12d395 100644 --- a/src/components/resource/_fields/custom-embargo/custom-embargo-fields.js +++ b/src/components/resource/_fields/custom-embargo/custom-embargo-fields.js @@ -49,7 +49,7 @@ function validateEmbargoUnit(embargoUnit, { customEmbargoPeriod }) { export default class CustomEmbargoFields extends Component { static propTypes = { ariaLabelledBy: PropTypes.string.isRequired, - } + }; renderEmbargoUnitField({ name: fieldsName }) { const { ariaLabelledBy } = this.props; @@ -179,7 +179,7 @@ export default class CustomEmbargoFields extends Component { return fields.value?.length ? this.renderInputs(...fieldsData) : this.renderAddButton(...fieldsData); - } + }; render() { return ( diff --git a/src/components/resource/_fields/resource-coverage-fields/resource-coverage-fields.js b/src/components/resource/_fields/resource-coverage-fields/resource-coverage-fields.js index cc49c0d49..e76ca21db 100644 --- a/src/components/resource/_fields/resource-coverage-fields/resource-coverage-fields.js +++ b/src/components/resource/_fields/resource-coverage-fields/resource-coverage-fields.js @@ -47,7 +47,7 @@ class ResourceCoverageFields extends Component { } = this.props; return validateDateRange(values, locale, packageDateRange); - } + }; renderCustomCoverageFields = (formData) => { const { @@ -69,7 +69,7 @@ class ResourceCoverageFields extends Component { renderField={this.renderField} /> ); - } + }; renderManagedCoverageFields = (formData) => { const { model } = this.props; @@ -193,7 +193,7 @@ class ResourceCoverageFields extends Component { ); - } + }; renderEmptyMessage(initialValues) { const isCoverageDatesRemoved = has(initialValues, '[0].beginCoverage'); diff --git a/src/components/resource/resource-edit.js b/src/components/resource/resource-edit.js index cd9ad23cf..0b243cb15 100644 --- a/src/components/resource/resource-edit.js +++ b/src/components/resource/resource-edit.js @@ -27,7 +27,7 @@ export default class ResourceEdit extends Component { allowFormToSubmit: false, showSelectionModal: false, formValues: {}, - } + }; static getDerivedStateFromProps(nextProps) { const stateUpdates = {}; @@ -65,7 +65,7 @@ export default class ResourceEdit extends Component { handleDeleteConfirmation = () => { this.commitSelectionToggle(this.state.formValues); - } + }; renderView() { const { @@ -128,7 +128,7 @@ export default class ResourceEdit extends Component { this.setState({ showSelectionModal: false, }); - } + }; getFooter = (pristine) => { const { @@ -164,7 +164,7 @@ export default class ResourceEdit extends Component { renderEnd={saveButton} /> ); - } + }; render() { const { diff --git a/src/components/search-form/search-form.js b/src/components/search-form/search-form.js index e55356c71..30bfc06ac 100644 --- a/src/components/search-form/search-form.js +++ b/src/components/search-form/search-form.js @@ -173,7 +173,7 @@ class SearchForm extends Component { }); return sortBy(dataOptions, ['value']); - } + }; renderTagFilter() { const { diff --git a/src/components/search-modal/search-modal.js b/src/components/search-modal/search-modal.js index ddf738e32..79181971f 100644 --- a/src/components/search-modal/search-modal.js +++ b/src/components/search-modal/search-modal.js @@ -92,23 +92,23 @@ class SearchModal extends PureComponent { this.setState(({ isModalVisible }) => ({ isModalVisible: !isModalVisible, })); - } + }; close = () => { this.setState({ isModalVisible: false, }); - } + }; updateSearch = () => { this.close(); this.updateFilter(this.state.query); - } + }; resetSearch = () => { this.close(); this.updateFilter({}); - } + }; toggleFilter = filterName => () => { const filterToBeToggled = filterName === 'access-type' @@ -123,7 +123,7 @@ class SearchModal extends PureComponent { [filterToBeToggled]: !currentState[filterToBeToggled], [filterToBeDisabled]: false, })); - } + }; handleSearchFieldChange = (searchfield) => { this.setState(({ query }) => ({ @@ -132,7 +132,7 @@ class SearchModal extends PureComponent { searchfield, }), })); - } + }; handleSearchQueryChange = q => { this.setState(({ query }) => ({ @@ -141,7 +141,7 @@ class SearchModal extends PureComponent { q, }, })); - } + }; handleFilterChange = (sort, filter) => { this.setState(({ query }) => ({ @@ -152,7 +152,7 @@ class SearchModal extends PureComponent { q: query.q, }), })); - } + }; handleStandaloneFilterChange = filter => { this.setState(({ query }) => ({ @@ -164,7 +164,7 @@ class SearchModal extends PureComponent { this.updateFilter(this.state.query); this.close(); }); - } + }; render() { const { diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js index 298c12d3e..9883f4155 100644 --- a/src/components/settings/settings.js +++ b/src/components/settings/settings.js @@ -49,23 +49,23 @@ class Settings extends Component { stripes: PropTypes.shape({ hasPerm: PropTypes.func.isRequired, }).isRequired, - } + }; hasEditPermissions = () => { return this.props.stripes.hasPerm('ui-eholdings.settings.kb.edit'); - } + }; handleKnowledgeBaseHeadingClick = (id) => { this.props.history.push({ pathname: `/settings/eholdings/knowledge-base/${id}`, }); - } + }; goToCreateKnowledgeBasePage = () => { this.props.history.push({ pathname: '/settings/eholdings/knowledge-base/new', }); - } + }; renderKnowledgeBaseHeading(configuration) { const { id, attributes: { name } } = configuration; diff --git a/src/components/title/create/title-create.js b/src/components/title/create/title-create.js index fc42cbeee..6da3acadd 100644 --- a/src/components/title/create/title-create.js +++ b/src/components/title/create/title-create.js @@ -107,7 +107,7 @@ class TitleCreate extends Component { renderEnd={saveButton} /> ); - } + }; render() { const { diff --git a/src/components/title/edit/title-edit.js b/src/components/title/edit/title-edit.js index 0dad88032..724fe326c 100644 --- a/src/components/title/edit/title-edit.js +++ b/src/components/title/edit/title-edit.js @@ -70,7 +70,7 @@ export default class TitleEdit extends Component { renderEnd={saveButton} /> ); - } + }; render() { const { diff --git a/src/components/title/show/title-show.js b/src/components/title/show/title-show.js index 954f73001..b8a8e6873 100644 --- a/src/components/title/show/title-show.js +++ b/src/components/title/show/title-show.js @@ -161,7 +161,7 @@ class TitleShow extends Component { return filteredPackagesIds ? model.resources.records.filter(({ id: recordId }) => filteredPackagesIds.some(id => id === recordId)) : []; - } + }; handlePackageFilterChange = (selectedPackages, countOfAppliedPackagesFilters) => { const { @@ -185,7 +185,7 @@ class TitleShow extends Component { ...location, search: newSearch, }); - } + }; get lastMenu() { const { @@ -246,17 +246,17 @@ class TitleShow extends Component { this.setState(({ showCustomPackageModal }) => ({ showCustomPackageModal: !showCustomPackageModal })); - } + }; handleSectionToggle = ({ id }) => { const next = update(`sections.${id}`, value => !value, this.state); this.setState(next); - } + }; handleExpandAll = (sections) => { const next = set('sections', sections, this.state); this.setState(next); - } + }; toggleAllSections = (expand) => { this.setState((curState) => { diff --git a/src/components/toaster/toast.js b/src/components/toaster/toast.js index 2c387d81e..083cc4aaf 100644 --- a/src/components/toaster/toast.js +++ b/src/components/toaster/toast.js @@ -62,7 +62,7 @@ class Toast extends Component { this.setState({ isOpen: false }, () => { this.props.onClose(this.props.id); }); - } + }; getIconForType(type) { switch (type) { diff --git a/src/components/toaster/toaster.js b/src/components/toaster/toaster.js index 39d368111..1d8e33443 100644 --- a/src/components/toaster/toaster.js +++ b/src/components/toaster/toaster.js @@ -58,7 +58,7 @@ class Toaster extends Component { this.setState(({ toasts }) => ({ toasts: toasts.filter(toast => toast.id !== toastId) })); - } + }; renderToasts() { const { position } = this.props; diff --git a/src/components/toggle-switch/toggle-switch.js b/src/components/toggle-switch/toggle-switch.js index b9f9fca2f..6edfc017c 100644 --- a/src/components/toggle-switch/toggle-switch.js +++ b/src/components/toggle-switch/toggle-switch.js @@ -14,7 +14,7 @@ class ToggleSwitch extends Component { isPending: PropTypes.bool, name: PropTypes.string, onChange: PropTypes.func - } + }; constructor(props) { super(props); @@ -39,7 +39,7 @@ class ToggleSwitch extends Component { if (this.props.onChange) { this.props.onChange(e); } - } + }; render() { const { isPending, id, name, disabled, checked } = this.props; diff --git a/src/components/token/token-field.js b/src/components/token/token-field.js index db61a6f35..32d898b33 100644 --- a/src/components/token/token-field.js +++ b/src/components/token/token-field.js @@ -31,7 +31,7 @@ class TokenField extends Component { this.setState(({ showInputs }) => ({ showInputs: !showInputs })); - } + }; validate(value) { return value && value.length > 500 ? ( diff --git a/src/features/custom-labels-accordion/custom-labels-accordion.js b/src/features/custom-labels-accordion/custom-labels-accordion.js index 91ce7345c..644c2e50c 100644 --- a/src/features/custom-labels-accordion/custom-labels-accordion.js +++ b/src/features/custom-labels-accordion/custom-labels-accordion.js @@ -28,11 +28,11 @@ class CustomLabelsAccordion extends Component { onToggle: PropTypes.func.isRequired, section: PropTypes.func.isRequired, userDefinedFields: PropTypes.objectOf(PropTypes.string), - } + }; static defaultProps = { isOpen: true, - } + }; componentDidMount() { const { getCustomLabels } = this.props; @@ -59,7 +59,7 @@ class CustomLabelsAccordion extends Component { ); - } + }; render() { const { diff --git a/src/routes/application-route/application-route.js b/src/routes/application-route/application-route.js index 55070a26d..ed18a400f 100644 --- a/src/routes/application-route/application-route.js +++ b/src/routes/application-route/application-route.js @@ -34,7 +34,7 @@ class ApplicationRoute extends Component { status: PropTypes.number.isRequired, }).isRequired, }).isRequired, - } + }; constructor(props) { super(props); diff --git a/src/routes/note-edit.js b/src/routes/note-edit.js index ea7d84d72..b80034a31 100644 --- a/src/routes/note-edit.js +++ b/src/routes/note-edit.js @@ -26,7 +26,7 @@ class NoteEditRoute extends Component { goToNoteView = () => { this.props.goBack(); - } + }; render() { const { diff --git a/src/routes/package-edit-route/package-edit-route.js b/src/routes/package-edit-route/package-edit-route.js index 97a2be45b..bd37a3a3b 100644 --- a/src/routes/package-edit-route/package-edit-route.js +++ b/src/routes/package-edit-route/package-edit-route.js @@ -233,7 +233,7 @@ class PackageEditRoute extends Component { }; history.replace(viewRouteState); - } + }; render() { const { diff --git a/src/routes/package-show-route/package-show-route.js b/src/routes/package-show-route/package-show-route.js index 441d4e6dd..deeb602cb 100644 --- a/src/routes/package-show-route/package-show-route.js +++ b/src/routes/package-show-route/package-show-route.js @@ -276,7 +276,7 @@ class PackageShowRoute extends Component { const { pkgSearchParams } = this.state; this.searchTitles({ ...pkgSearchParams, page }); - } + }; searchTitles = (pkgSearchParams) => { const { @@ -318,13 +318,13 @@ class PackageShowRoute extends Component { }, queryId: (queryId + 1), })); - } + }; toggleSearchModal = (isModalVisible) => { if (isModalVisible) { this.props.getTags(undefined, { path: tagPaths.alreadyAddedToRecords }); } - } + }; fetchPackageCostPerUse = (filterData) => { const { @@ -333,7 +333,7 @@ class PackageShowRoute extends Component { } = this.props; getCostPerUse(listTypes.PACKAGES, id, filterData); - } + }; fetchCostPerUsePackageTitles = (filterData) => { const { @@ -342,11 +342,11 @@ class PackageShowRoute extends Component { } = this.props; getCostPerUsePackageTitles(id, filterData); - } + }; loadMoreCostPerUsePackageTitles = (filterData) => { this.fetchCostPerUsePackageTitles(filterData, true); - } + }; handleEdit = () => { const { @@ -364,7 +364,7 @@ class PackageShowRoute extends Component { }; history.replace(editRouteState); - } + }; toggleTitles = () => { const { @@ -379,7 +379,7 @@ class PackageShowRoute extends Component { const params = transformQueryParams('titles', pkgSearchParams); getPackageTitles({ packageId, params }); - } + }; render() { const { diff --git a/src/routes/package-show-route/package-show-route.test.js b/src/routes/package-show-route/package-show-route.test.js index 0fe98d39a..6247561ec 100644 --- a/src/routes/package-show-route/package-show-route.test.js +++ b/src/routes/package-show-route/package-show-route.test.js @@ -249,6 +249,25 @@ const resource = { attributes: { name: 'Title name 1', isSelected: false, + managedCoverages: [{ + 'beginCoverage': '2005-01-01', + 'endCoverage': '2005-12-31' + }], + customCoverages: [ + { + 'beginCoverage': '2025-01-09', + 'endCoverage': '2026-01-01' + }, + { + 'beginCoverage': '2025-01-07', + 'endCoverage': '2025-01-08' + }, + ], + managedEmbargoPeriod: { + embargoUnit: 'Days', + embargoValue: 11, + }, + publicationType: 'book', visibilityData: { isHidden: false }, tags: { tagList: [], diff --git a/src/routes/provider-edit-route/provider-edit-route.js b/src/routes/provider-edit-route/provider-edit-route.js index 0fda666b2..13325a3fd 100644 --- a/src/routes/provider-edit-route/provider-edit-route.js +++ b/src/routes/provider-edit-route/provider-edit-route.js @@ -68,7 +68,7 @@ export default class ProviderEditRoute extends Component { getSearchType = () => { const { searchType } = queryString.parse(this.props.location.search, { ignoreQueryPrefix: true }); return searchType; - } + }; handleCancel = () => { const { @@ -86,7 +86,7 @@ export default class ProviderEditRoute extends Component { }; history.replace(viewRouteState); - } + }; render() { const { diff --git a/src/routes/provider-show-route/provider-show-route.js b/src/routes/provider-show-route/provider-show-route.js index 705a78aed..1fd3ba800 100644 --- a/src/routes/provider-show-route/provider-show-route.js +++ b/src/routes/provider-show-route/provider-show-route.js @@ -152,7 +152,7 @@ class ProviderShowRoute extends Component { if (isModalVisible) { this.props.getTags(undefined, { path: tagPaths.alreadyAddedToRecords }); } - } + }; fetchPackages = (page) => { const { pkgSearchParams } = this.state; @@ -162,7 +162,7 @@ class ProviderShowRoute extends Component { getSearchType = () => { const { searchType } = queryString.parse(this.props.location.search, { ignoreQueryPrefix: true }); return searchType; - } + }; handleEdit = () => { const { @@ -180,7 +180,7 @@ class ProviderShowRoute extends Component { }; history.replace(editRouteState); - } + }; render() { const { diff --git a/src/routes/resource-edit-route/resource-edit-route.js b/src/routes/resource-edit-route/resource-edit-route.js index 92fb71b9b..c086da67e 100644 --- a/src/routes/resource-edit-route/resource-edit-route.js +++ b/src/routes/resource-edit-route/resource-edit-route.js @@ -164,7 +164,7 @@ class ResourceEditRoute extends Component { userDefinedField5, })); } - } + }; handleCancel = () => { const { @@ -182,7 +182,7 @@ class ResourceEditRoute extends Component { }; history.replace(viewRouteState); - } + }; render() { const { diff --git a/src/routes/resource-show-route/resource-show-route.js b/src/routes/resource-show-route/resource-show-route.js index 2db6ded74..4a50e8b41 100644 --- a/src/routes/resource-show-route/resource-show-route.js +++ b/src/routes/resource-show-route/resource-show-route.js @@ -148,7 +148,7 @@ class ResourceShowRoute extends Component { } else { updateResource(model); } - } + }; handleEdit = () => { const { @@ -162,7 +162,7 @@ class ResourceShowRoute extends Component { }; history.replace(editRouteState); - } + }; fetchResourceCostPerUse = (filterData) => { const { @@ -171,7 +171,7 @@ class ResourceShowRoute extends Component { } = this.props; getCostPerUse(listTypes.RESOURCES, id, filterData); - } + }; render() { const { diff --git a/src/routes/search-route/search-route.js b/src/routes/search-route/search-route.js index f056f71b6..4370cd414 100644 --- a/src/routes/search-route/search-route.js +++ b/src/routes/search-route/search-route.js @@ -184,7 +184,7 @@ class SearchRoute extends Component { [filterToBeDisabled]: false, }; }, this.handleSearch); - } + }; handleSearchChange = draftSearchString => { this.setState({ draftSearchString }); @@ -215,11 +215,11 @@ class SearchRoute extends Component { }, submittedSearchString: '', }), this.handleSearch); - } + }; handleSearchFieldChange = searchField => { this.setState({ searchField }); - } + }; updateFilters = fn => this.setState(({ hideFilters }) => ({ hideFilters: fn(hideFilters), @@ -268,7 +268,7 @@ class SearchRoute extends Component { } return collection; - } + }; /** * Build's a url for a specific search type + query diff --git a/src/routes/title-edit-route/title-edit-route.js b/src/routes/title-edit-route/title-edit-route.js index 911c7b234..b8ee1f6f4 100644 --- a/src/routes/title-edit-route/title-edit-route.js +++ b/src/routes/title-edit-route/title-edit-route.js @@ -102,7 +102,7 @@ class TitleEditRoute extends Component { }; history.replace(viewRouteState); - } + }; titleEditSubmitted = (values) => { const { @@ -116,7 +116,7 @@ class TitleEditRoute extends Component { }; updateTitle(Object.assign(model, newValues)); - } + }; renderView() { const { diff --git a/src/routes/title-show-route/title-show-route.js b/src/routes/title-show-route/title-show-route.js index dc2c7f132..70830482c 100644 --- a/src/routes/title-show-route/title-show-route.js +++ b/src/routes/title-show-route/title-show-route.js @@ -89,7 +89,7 @@ class TitleShowRoute extends Component { } = this.props; getCostPerUse(listTypes.TITLES, id, filterData); - } + }; handleEdit = () => { const { @@ -105,7 +105,7 @@ class TitleShowRoute extends Component { }; history.replace(editRouteState); - } + }; onPackageFilter = (searchParam) => { this.props.getCustomPackages(searchParam); diff --git a/translations/ui-eholdings/en.json b/translations/ui-eholdings/en.json index 2a882f81a..1c5bf4bee 100644 --- a/translations/ui-eholdings/en.json +++ b/translations/ui-eholdings/en.json @@ -638,5 +638,10 @@ "permission.settings.assignedUser": "Settings (eHoldings): Can assign/unassign a user from a KB", "actionMenu.label": "Actions", - "actionMenu.filterBadgeTooltip": "{count} applied {count, plural, one {filter} other {filters}}" - } + "actionMenu.filterBadgeTooltip": "{count} applied {count, plural, one {filter} other {filters}}", + "titlesList.title": "Title", + "titlesList.status": "Status", + "titlesList.managedCoverage": "Managed coverage dates", + "titlesList.customCoverage": "Custom coverage dates", + "titlesList.managedEmbargo": "Managed embargo period" +}