From d2b1ab3310683c3b9ed81bf7d23f509eade47fd3 Mon Sep 17 00:00:00 2001 From: Karolina Przerwa Date: Mon, 30 Mar 2020 11:13:42 +0200 Subject: [PATCH] ui: backoffice patron details UX * closes #425 * closes #426 --- ui/src/api/items/item.js | 6 +- .../ResultsTable/ResultsTableFooter.js | 2 +- .../__snapshots__/ResultsTable.test.js.snap | 4 +- ui/src/components/SearchBar/SearchBar.js | 8 +- .../SearchEmptyResults/SearchEmptyResults.js | 4 +- .../__snapshots__/DocumentItems.test.js.snap | 4 +- .../DocumentPendingLoans.test.js.snap | 4 +- .../Patron/PatronDetails/PatronDetails.js | 145 +- .../__tests__/PatronDetails.test.js | 10 + .../__snapshots__/PatronDetails.test.js.snap | 182 +- .../components/ItemsCheckout/ItemsCheckout.js | 7 +- .../__snapshots__/ItemsCheckout.test.js.snap | 4 +- .../components/ItemsCheckout/state/actions.js | 28 +- .../components/ItemsSearch/ItemsSearch.js | 137 +- .../components/ItemsSearch/ItemsSearch.scss | 16 - .../ItemsSearch/__tests__/ItemsSearch.test.js | 96 +- .../__snapshots__/ItemsSearch.test.js.snap | 1238 ++-- .../ItemsResultsList/ItemsResultsList.js | 92 +- .../components/ItemsResultsList/index.js | 21 +- .../components/ItemsSearch/index.js | 20 +- .../components/ItemsSearch/state/actions.js | 15 +- .../PatronActionMenu/PatronActionMenu.js | 29 + .../components/PatronActionMenu/index.js | 1 + .../PatronCurrentLoans/PatronCurrentLoans.js | 14 +- .../__tests__/PatronCurrentLoans.test.js | 58 +- .../PatronCurrentLoans.test.js.snap | 6574 ++++------------ .../PatronDocumentRequests.js | 17 +- .../__tests__/PatronDocumentRequests.test.js | 65 +- .../PatronDocumentRequests.test.js.snap | 6327 +++------------- .../components/PatronHeader/PatronHeader.js | 33 + .../components/PatronHeader/index.js | 1 + .../PatronPastLoans/PatronPastLoans.js | 118 + .../components/PatronPastLoans/index.js | 21 + .../PatronPendingLoans/PatronLoans.scss | 18 - .../PatronPendingLoans/PatronPendingLoans.js | 45 +- .../__tests__/PatronPendingLoans.test.js | 85 +- .../PatronPendingLoans.test.js.snap | 6588 ++++------------- .../Patron/PatronDetails/components/index.js | 3 + .../backoffice/Patron/PatronDetails/index.js | 3 +- .../Series/SeriesDetails/SeriesDetails.js | 27 +- .../ViewDetailsButtons/ItemDetailsLink.js | 23 + .../ViewDetailsButtons/LoanDetailsLink.js | 23 + .../buttons/ViewDetailsButtons/index.js | 2 + .../frontsite/PatronProfile/PatronProfile.js | 41 +- .../Series/SeriesDetails/SeriesDetails.js | 29 +- .../site/collections/table.overrides | 5 + .../site/elements/segment.overrides | 9 + 47 files changed, 5704 insertions(+), 16498 deletions(-) delete mode 100644 ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/ItemsSearch.scss create mode 100644 ui/src/pages/backoffice/Patron/PatronDetails/components/PatronActionMenu/PatronActionMenu.js create mode 100644 ui/src/pages/backoffice/Patron/PatronDetails/components/PatronActionMenu/index.js create mode 100644 ui/src/pages/backoffice/Patron/PatronDetails/components/PatronHeader/PatronHeader.js create mode 100644 ui/src/pages/backoffice/Patron/PatronDetails/components/PatronHeader/index.js create mode 100644 ui/src/pages/backoffice/Patron/PatronDetails/components/PatronPastLoans/PatronPastLoans.js create mode 100644 ui/src/pages/backoffice/Patron/PatronDetails/components/PatronPastLoans/index.js delete mode 100644 ui/src/pages/backoffice/Patron/PatronDetails/components/PatronPendingLoans/PatronLoans.scss create mode 100644 ui/src/pages/backoffice/components/buttons/ViewDetailsButtons/ItemDetailsLink.js create mode 100644 ui/src/pages/backoffice/components/buttons/ViewDetailsButtons/LoanDetailsLink.js diff --git a/ui/src/api/items/item.js b/ui/src/api/items/item.js index b00e9e2db..020f79180 100644 --- a/ui/src/api/items/item.js +++ b/ui/src/api/items/item.js @@ -1,7 +1,7 @@ -import { http, apiConfig } from '../base'; -import { serializer } from './serializer'; -import { prepareSumQuery } from '../utils'; import { invenioConfig } from '@config'; +import { apiConfig, http } from '../base'; +import { prepareSumQuery } from '../utils'; +import { serializer } from './serializer'; const itemURL = '/items/'; diff --git a/ui/src/components/ResultsTable/ResultsTableFooter.js b/ui/src/components/ResultsTable/ResultsTableFooter.js index 4807945d5..6e8cc7a4f 100644 --- a/ui/src/components/ResultsTable/ResultsTableFooter.js +++ b/ui/src/components/ResultsTable/ResultsTableFooter.js @@ -21,7 +21,7 @@ export default class ResultsTableFooter extends Component { colSpan={this.props.columnsNumber + 1} textAlign="right" > - + Showing entries {start + 1}-{end} of {allRowsNumber}{' '} {this.props.seeAllComponent} diff --git a/ui/src/components/ResultsTable/__tests__/__snapshots__/ResultsTable.test.js.snap b/ui/src/components/ResultsTable/__tests__/__snapshots__/ResultsTable.test.js.snap index 17b6fe3df..302963ff4 100644 --- a/ui/src/components/ResultsTable/__tests__/__snapshots__/ResultsTable.test.js.snap +++ b/ui/src/components/ResultsTable/__tests__/__snapshots__/ResultsTable.test.js.snap @@ -643,7 +643,9 @@ exports[`ResultsTable tests should render the see all button when showing only a className="right aligned" colSpan={3} > - + Showing entries 1 - diff --git a/ui/src/components/SearchBar/SearchBar.js b/ui/src/components/SearchBar/SearchBar.js index dd4b83464..68c277f75 100644 --- a/ui/src/components/SearchBar/SearchBar.js +++ b/ui/src/components/SearchBar/SearchBar.js @@ -1,9 +1,15 @@ -import React, { Component } from 'react'; import PropTypes from 'prop-types'; +import React, { Component } from 'react'; import { Input } from 'semantic-ui-react'; import { QueryBuildHelper } from './components/QueryBuildHelper/'; export class SearchBar extends Component { + componentDidMount() { + if (this.searchInput) { + this.searchInput.focus(); + } + } + onChangeHandler = (e, { value }, onInputChange) => { onInputChange(value, e); }; diff --git a/ui/src/components/SearchControls/components/SearchEmptyResults/SearchEmptyResults.js b/ui/src/components/SearchControls/components/SearchEmptyResults/SearchEmptyResults.js index 4f0e1720e..25176c0ee 100644 --- a/ui/src/components/SearchControls/components/SearchEmptyResults/SearchEmptyResults.js +++ b/ui/src/components/SearchControls/components/SearchEmptyResults/SearchEmptyResults.js @@ -1,7 +1,7 @@ -import { Header, Icon, Segment } from 'semantic-ui-react'; -import React, { Component } from 'react'; import PropTypes from 'prop-types'; +import React, { Component } from 'react'; import { EmptyResults } from 'react-searchkit'; +import { Header, Icon, Segment } from 'semantic-ui-react'; import { ClearButton } from '../ClearButton'; export default class SearchEmptyResults extends Component { diff --git a/ui/src/pages/backoffice/Document/DocumentDetails/components/DocumentItems/__tests__/__snapshots__/DocumentItems.test.js.snap b/ui/src/pages/backoffice/Document/DocumentDetails/components/DocumentItems/__tests__/__snapshots__/DocumentItems.test.js.snap index 4134111a7..59140e712 100644 --- a/ui/src/pages/backoffice/Document/DocumentDetails/components/DocumentItems/__tests__/__snapshots__/DocumentItems.test.js.snap +++ b/ui/src/pages/backoffice/Document/DocumentDetails/components/DocumentItems/__tests__/__snapshots__/DocumentItems.test.js.snap @@ -1442,7 +1442,9 @@ exports[`DocumentItems tests should render the see all button when showing only className="right aligned" colSpan={8} > - + Showing entries 1 - diff --git a/ui/src/pages/backoffice/Document/DocumentDetails/components/DocumentPendingLoans/__tests__/__snapshots__/DocumentPendingLoans.test.js.snap b/ui/src/pages/backoffice/Document/DocumentDetails/components/DocumentPendingLoans/__tests__/__snapshots__/DocumentPendingLoans.test.js.snap index d92ddb10c..574847839 100644 --- a/ui/src/pages/backoffice/Document/DocumentDetails/components/DocumentPendingLoans/__tests__/__snapshots__/DocumentPendingLoans.test.js.snap +++ b/ui/src/pages/backoffice/Document/DocumentDetails/components/DocumentPendingLoans/__tests__/__snapshots__/DocumentPendingLoans.test.js.snap @@ -1151,7 +1151,9 @@ exports[`DocumentPendingLoans tests should render the see all button when showin className="right aligned" colSpan={5} > - + Showing entries 1 - diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/PatronDetails.js b/ui/src/pages/backoffice/Patron/PatronDetails/PatronDetails.js index 87bafaca2..572c8d98c 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/PatronDetails.js +++ b/ui/src/pages/backoffice/Patron/PatronDetails/PatronDetails.js @@ -1,65 +1,134 @@ -import React, { Component } from 'react'; +import { Error, Loader } from '@components'; import PropTypes from 'prop-types'; -import { Container, Grid, Header } from 'semantic-ui-react'; -import { Loader, Error } from '@components'; +import React, { Component } from 'react'; +import { + Container, + Divider, + Grid, + Header, + Ref, + Segment, + Sticky, +} from 'semantic-ui-react'; import { ItemsCheckout, ItemsSearch, PatronCurrentLoans, PatronDocumentRequests, - PatronMetadata, PatronPendingLoans, + PatronActionMenu, + PatronHeader, + PatronPastLoans, } from './components'; export default class PatronDetails extends Component { constructor(props) { super(props); this.fetchPatronDetails = this.props.fetchPatronDetails; + this.menuRef = React.createRef(); + this.headerRef = React.createRef(); } componentDidMount() { - this.unlisten = this.props.history.listen(location => { - if (location.state && location.state.patronPid) { - this.fetchPatronDetails(location.state.patronPid); - } - }); this.fetchPatronDetails(this.props.match.params.patronPid); } - componentWillUnmount() { - this.unlisten(); + componentDidUpdate(prevProps, prevState) { + const currentPatronPid = this.props.match.params.patronPid; + const samePatronPidFromRouter = + prevProps.match.params.patronPid === currentPatronPid; + if (!samePatronPidFromRouter) { + this.fetchPatronDetails(currentPatronPid); + } } render() { - const { isLoading, error } = this.props; + const { isLoading, error, data } = this.props; return ( - - - -
Patron's profile
- - - - - - - - - - - - +
+ + + + + + + + + + + + + + +
+ Checkout +
+ + + + - - - - - - - - - - + +
+ Patron's current loans +
+ + + +
+ Patron's loan requests +
+ + + +
+ Patron's literature requests +
+ + + +
+ Patron's loans history +
+ + + + + + + + + Navigation + + + + + + + + + +
); } } diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/__tests__/PatronDetails.test.js b/ui/src/pages/backoffice/Patron/PatronDetails/__tests__/PatronDetails.test.js index 981089f6f..7cdfc5fbe 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/__tests__/PatronDetails.test.js +++ b/ui/src/pages/backoffice/Patron/PatronDetails/__tests__/PatronDetails.test.js @@ -7,12 +7,22 @@ jest.mock('../components/', () => { ItemsCheckout: () => null, ItemsSearch: () => null, PatronCurrentLoans: () => null, + PatronPastLoans: () => null, PatronDocumentRequests: () => null, PatronMetadata: () => null, PatronPendingLoans: () => null, + PatronHeader: () => null, + PatronActionMenu: () => null, }; }); +const data = { + metadata: { + name: 'XYZ', + email: 'test@test.ch', + }, +}; + describe('PatronDetails tests', () => { let component; afterEach(() => { diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/__tests__/__snapshots__/PatronDetails.test.js.snap b/ui/src/pages/backoffice/Patron/PatronDetails/__tests__/__snapshots__/PatronDetails.test.js.snap index 07261f801..80f5d9510 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/__tests__/__snapshots__/PatronDetails.test.js.snap +++ b/ui/src/pages/backoffice/Patron/PatronDetails/__tests__/__snapshots__/PatronDetails.test.js.snap @@ -1,42 +1,152 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`PatronDetails tests should load the details component 1`] = ` - - + - -
- Patron's profile -
- - - - - - - + + - - - - - - - - - - - - - - - + + + + + + + + + + +
+ Checkout +
+ + + + + +
+ Patron's current loans +
+ + + +
+ Patron's loan requests +
+ + + +
+ Patron's literature requests +
+ + + +
+ Patron's loans history +
+ + + + + + + + + + Navigation + + + + + + + + + + + `; diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/ItemsCheckout.js b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/ItemsCheckout.js index 2f739b8b1..932942ae4 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/ItemsCheckout.js +++ b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/ItemsCheckout.js @@ -1,7 +1,7 @@ -import React, { Component } from 'react'; +import { Error, Loader } from '@components'; import PropTypes from 'prop-types'; +import React, { Component } from 'react'; import { Message } from 'semantic-ui-react'; -import { Error, Loader } from '@components'; export default class ItemsCheckout extends Component { constructor(props) { @@ -17,7 +17,8 @@ export default class ItemsCheckout extends Component { - Scan the barcode to perform a loan for this user. + Scan or type the barcode to checkout the physical copy for this + patron. diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/__tests__/__snapshots__/ItemsCheckout.test.js.snap b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/__tests__/__snapshots__/ItemsCheckout.test.js.snap index 45b00e401..42f2f1295 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/__tests__/__snapshots__/ItemsCheckout.test.js.snap +++ b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/__tests__/__snapshots__/ItemsCheckout.test.js.snap @@ -6,7 +6,7 @@ exports[`PatronLoans tests should load the ItemsCheckout component 1`] = ` - Scan the barcode to perform a loan for this user. + Scan or type the barcode to checkout the physical copy for this patron. @@ -33,7 +33,7 @@ exports[`PatronLoans tests should render show a message with added loan 1`] = `
- Scan the barcode to perform a loan for this user. + Scan or type the barcode to checkout the physical copy for this patron.
diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/state/actions.js b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/state/actions.js index e4356a0a6..e0cc5d2c9 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/state/actions.js +++ b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsCheckout/state/actions.js @@ -1,9 +1,13 @@ -import { HAS_ERROR, IS_LOADING, SUCCESS } from './types'; import { loan as loanApi } from '@api'; import { sendErrorNotification, sendSuccessNotification, } from '@components/Notifications'; +import { ES_DELAY } from '@config'; +import { fetchPatronCurrentLoans } from '@state/PatronCurrentLoans/actions'; +import { IS_LOADING as CURRENT_LOANS_IS_LOADING } from '@state/PatronCurrentLoans/types'; +import { CLEAR_SEARCH } from '../../ItemsSearch/state/types'; +import { HAS_ERROR, IS_LOADING, SUCCESS } from './types'; export const checkoutItem = ( documentPid, @@ -26,12 +30,22 @@ export const checkoutItem = ( type: SUCCESS, payload: response.data, }); - dispatch( - sendSuccessNotification( - 'Loan Created', - 'The new loan was successfully created.' - ) - ); + dispatch({ + type: CLEAR_SEARCH, + }); + // put the current loans into loading state until ES updates + dispatch({ + type: CURRENT_LOANS_IS_LOADING, + }); + setTimeout(() => { + dispatch(fetchPatronCurrentLoans(patronPid)); + dispatch( + sendSuccessNotification( + 'Loan Created', + 'The new loan was successfully created.' + ) + ); + }, ES_DELAY); } catch (error) { dispatch({ type: HAS_ERROR, diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/ItemsSearch.js b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/ItemsSearch.js index d113dff42..f709846a6 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/ItemsSearch.js +++ b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/ItemsSearch.js @@ -1,37 +1,25 @@ -import React, { Component } from 'react'; +import { recordToPidType } from '@api/utils'; +import { Error, Loader, SearchBar } from '@components'; import PropTypes from 'prop-types'; -import { - Container, - Grid, - Segment, - Icon, - Header, - Button, - Input, -} from 'semantic-ui-react'; -import { Error, Loader } from '@components'; +import React, { Component } from 'react'; +import { Container, Grid, Header, Icon, Segment } from 'semantic-ui-react'; import { ItemsResultsList } from './components'; -import isEmpty from 'lodash/isEmpty'; -import { ES_DELAY } from '@config'; -import { recordToPidType } from '@api/utils'; +import _isEmpty from 'lodash/isEmpty'; export default class ItemsSearch extends Component { constructor(props) { super(props); this.fetchItems = this.props.fetchItems; - this.updateQueryString = this.props.updateQueryString; this.clearResults = this.props.clearResults; this.checkoutItem = this.props.checkoutItem; - this.fetchUpdatedCurrentLoans = this.props.fetchUpdatedCurrentLoans; + this.updateQueryString = this.props.updateQueryString; + // this state is needed for the paste action, + // because components gets updated via input change + // but we need altered behaviour for the paste action + // and in this way the state from before update is preserved this.state = { prevSearchQuery: '' }; } - componentDidMount() { - if (this.searchInput) { - this.searchInput.focus(); - } - } - onInputChange = queryString => { this.updateQueryString(queryString); }; @@ -39,7 +27,6 @@ export default class ItemsSearch extends Component { executeSearch = queryString => { queryString = queryString || this.props.queryString; this.setState({ prevSearchQuery: queryString }); - return this.fetchItems(queryString); }; @@ -51,7 +38,7 @@ export default class ItemsSearch extends Component { const { hits } = this.props.items; const hasOneHit = - !isEmpty(hits) && + !_isEmpty(hits) && hits.length === 1 && hits[0].metadata.status === 'CAN_CIRCULATE'; if (hasOneHit) { @@ -60,18 +47,14 @@ export default class ItemsSearch extends Component { type: recordToPidType(hits[0]), value: hits[0].metadata.pid, }; - await this.checkoutItem( + this.checkoutItem( documentPid, itemPid, this.props.patronDetails.user_pid, true ); - this.clearResults(); - setTimeout(() => { - this.fetchUpdatedCurrentLoans(this.props.patronDetails.user_pid); - }, ES_DELAY); - this.setState({ prevSearchQuery: '' }); } + this.setState({ prevSearchQuery: '' }); } }; @@ -81,111 +64,81 @@ export default class ItemsSearch extends Component { } }; - renderSearchBar = () => { - return ( - { - this.executeSearch(); - }, - }} - fluid - focus - placeholder={'Search by barcode...'} - onChange={(e, { value }) => { - this.onInputChange(value); - }} - onPaste={e => { - this.onPasteHandler(e); - }} - value={this.props.queryString} - onKeyPress={event => { - this.onKeyPressHandler(event.target); - }} - ref={input => { - this.searchInput = input; - }} - /> - ); - }; + onSearchClickHandler = event => this.executeSearch(); renderResultsList = results => { return (
- {this.renderHeader(results.hits.length)}
); }; - renderEmptyResults = (queryString, resetQuery) => { + clearSearchQuery = () => { + this.setState({ prevSearchQuery: '' }); + this.clearResults(); + }; + + renderSearchPrompt = () => { return (
- Found no items matching this barcode. + No barcode provided.
- Current search phrase "{queryString}" + Type or paste the barcode to search for items
- - - ); }; - renderHeader = totalResults => { - return

Found {totalResults} item(s).

; - }; - render() { - const { items, isLoading, error } = this.props; - const { prevSearchQuery } = this.state; + const { items, isLoading, error, queryString } = this.props; return ( - -
Items
- Search items by barcode. - {this.renderSearchBar()} + <> + + { + this.onPasteHandler(e); + }} + /> + - {!isEmpty(items.hits) - ? this.renderResultsList(items) - : this.renderEmptyResults( - prevSearchQuery, - this.updateQueryString - )} + {_isEmpty(queryString) && _isEmpty(items) + ? this.renderSearchPrompt() + : this.renderResultsList(items)} - + ); } } ItemsSearch.propTypes = { - queryString: PropTypes.string, updateQueryString: PropTypes.func.isRequired, + queryString: PropTypes.string.isRequired, items: PropTypes.object, fetchItems: PropTypes.func.isRequired, - fetchUpdatedCurrentLoans: PropTypes.func.isRequired, clearResults: PropTypes.func.isRequired, checkoutItem: PropTypes.func.isRequired, patronDetails: PropTypes.object.isRequired, }; - -ItemsSearch.defaultProps = { - queryString: '', -}; diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/ItemsSearch.scss b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/ItemsSearch.scss deleted file mode 100644 index 43398d619..000000000 --- a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/ItemsSearch.scss +++ /dev/null @@ -1,16 +0,0 @@ -.patron-items { - .results-list { - margin: 0 !important; - } - - .sub.header { - line-height: 0em; - padding: 0 0 0.5em 0; - margin: 0; - color: rgba(0, 0, 0, 0.6); - } - - .search-bar { - padding: 1em 0; - } -} diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/__tests__/ItemsSearch.test.js b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/__tests__/ItemsSearch.test.js index 6b41fe6c0..268265c24 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/__tests__/ItemsSearch.test.js +++ b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/__tests__/ItemsSearch.test.js @@ -1,8 +1,15 @@ import React from 'react'; import { shallow, mount } from 'enzyme'; +import { Provider } from 'react-redux'; +import { BrowserRouter } from 'react-router-dom'; import ItemsSearch from '../ItemsSearch'; import { fromISO } from '@api/date'; import { Settings } from 'luxon'; +import configureMockStore from 'redux-mock-store'; +import thunk from 'redux-thunk'; + +const middlewares = [thunk]; +const mockStore = configureMockStore(middlewares); jest.mock('@config/invenioConfig'); @@ -10,6 +17,46 @@ Settings.defaultZoneName = 'utc'; const stringDate = fromISO('2018-01-01T11:05:00+01:00'); +const items = { + hits: [ + { + id: '1', + updated: stringDate, + created: stringDate, + pid: 'item1', + metadata: { + document_pid: 'doc1', + pid: 'item1', + internal_location: { location: { name: 'Somewhere' } }, + barcode: '44444', + shelf: 'P', + status: 'CAN_CIRCULATE', + circulation: {}, + medium: 'book', + document: { + title: 'Here is a title', + }, + }, + }, + ], + total: 1, +}; + +let store; +beforeEach(() => { + store = mockStore({ + isLoading: false, + data: items, + results: items, + hasError: false, + patronItemsCheckout: () => {}, + itemsSearchInput: { + data: items, + }, + }); + store.clearActions(); +}); + describe('PatronLoans tests', () => { let component; @@ -54,42 +101,21 @@ describe('PatronLoans tests', () => { const mockedClear = jest.fn(); const mockedCheckoutItem = jest.fn(); - const items = { - hits: [ - { - id: '1', - updated: stringDate, - created: stringDate, - pid: 'item1', - metadata: { - document_pid: 'doc1', - pid: 'item1', - internal_location: { location: { name: 'Somewhere' } }, - barcode: '44444', - shelf: 'P', - status: 'CAN_CIRCULATE', - circulation: {}, - medium: 'book', - document: { - title: 'Here is a title', - }, - }, - }, - ], - total: 1, - }; - component = mount( - + + + + + ); expect(component).toMatchSnapshot(); diff --git a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/__tests__/__snapshots__/ItemsSearch.test.js.snap b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/__tests__/__snapshots__/ItemsSearch.test.js.snap index 9c2f0ce9b..d990a4d8c 100644 --- a/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/__tests__/__snapshots__/ItemsSearch.test.js.snap +++ b/ui/src/pages/backoffice/Patron/PatronDetails/components/ItemsSearch/__tests__/__snapshots__/ItemsSearch.test.js.snap @@ -1,35 +1,22 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`PatronLoans tests should load the ItemsSearch component 1`] = ` - -
- Items -
- - Search items by barcode. - + - - -
- - Found no items matching this barcode. -
-
- Current search phrase " - " -
- - - - + + - + `; exports[`PatronLoans tests should render items in search 1`] = ` - + - -
-
-

- Items -

-
- -
- Search items by barcode. -
- - -
- -
- - , - } - } +
- - Search - , - } - } + +