diff --git a/CHANGELOG.md b/CHANGELOG.md index c491c44f8..ae3b0172d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,7 @@ * Make Inventory search and browse query boxes expandable. Refs UIIN-2493. * Added support for `containsAny` match option in Advanced search. Refs UIIN-2486. * Inventory search/browse: Do not retain checkbox selections when toggling search segment. Refs UIIN-2477. +* Search box/Browse box- Reset all should shift focus back to search box. Refs UIIN-2514. ## [10.0.3] IN PROGRESS diff --git a/src/components/InstancesList/InstancesList.js b/src/components/InstancesList/InstancesList.js index 83dce4f6b..0dd5d3d23 100644 --- a/src/components/InstancesList/InstancesList.js +++ b/src/components/InstancesList/InstancesList.js @@ -173,6 +173,7 @@ class InstancesList extends React.Component { }; } + componentDidMount() { const { history, @@ -185,7 +186,7 @@ class InstancesList extends React.Component { if (hasReset) { // imperative way is used because it's no option in SearchAndSort reset/focus filters from outside document.getElementById('clickable-reset-all')?.click(); - document.getElementById('input-inventory-search')?.focus(); + this.inputRef.current.focus(); history.replace({ search: 'segment=instances' }); } @@ -222,6 +223,9 @@ class InstancesList extends React.Component { parentMutator.records.reset(); } + inputRef = React.createRef(); + indexRef = React.createRef(); + extraParamsToReset = { selectedBrowseResult: false, authorityId: '', @@ -390,7 +394,7 @@ class InstancesList extends React.Component { // https://issues.folio.org/browse/UIIN-1358 storeLastSegment(segment); facetsStore.getState().resetFacetSettings(); - document.getElementById('input-inventory-search').focus(); + this.inputRef.current.focus(); } handleSearchSegmentChange = (segment) => { @@ -903,6 +907,7 @@ class InstancesList extends React.Component { }); facetsStore.getState().resetFacetSettings(); + this.inputRef.current.focus(); } handleSelectedRecordsModalSave = selectedRecords => { @@ -1184,6 +1189,8 @@ class InstancesList extends React.Component { initialResultCount={INITIAL_RESULT_COUNT} initiallySelectedRecord={getItem(`${namespace}.${segment}.lastOpenRecord`)} inputType="textarea" + inputRef={this.inputRef} + indexRef={this.indexRef} resultCountIncrement={RESULT_COUNT_INCREMENT} viewRecordComponent={ViewInstanceWrapper} editRecordComponent={InstanceForm}