UIEH-1444 Remove shouldFocus HOC and all related code. (#1756)

* UIEH-1444 Remove `shouldFocus` HOC and all related code.

* UIEH-1444 delete shouldFocus HOC and tests

CHANGELOG.md

@@ -3,6 +3,7 @@
 ## [10.1.0] (IN PROGRESS)
 
 * Add `target="_blank"` to the `New` button of agreements accordion. (UIEH-1446)
+* Remove `shouldFocus` HOC and all related code. (UIEH-1444)
 
 ## [10.0.1] (https://github.com/folio-org/ui-eholdings/tree/v10.0.1) (2024-11-12)
 

src/components/package-search-list.js

@@ -14,7 +14,6 @@ const PackageSearchList = ({
   fetch,
   notFoundMessage,
   onUpdateOffset,
-  shouldFocusItem,
   onClickItem,
 }) => {
   const packagesCollection = extend(Object.create(collection), {
@@ -48,7 +47,6 @@ const PackageSearchList = ({
             pathname: `/eholdings/packages/${item.content.id}`,
           }}
           active={item.content && activeId && item.content.id === activeId}
-          shouldFocus={item.content && shouldFocusItem && item.content.id === shouldFocusItem}
           onClick={() => onClickItem(`/eholdings/packages/${item.content.id}`)}
           showProviderName
           showTitleCount
@@ -69,7 +67,6 @@ PackageSearchList.propTypes = {
   ]),
   onClickItem: PropTypes.func.isRequired,
   onUpdateOffset: PropTypes.func.isRequired,
-  shouldFocusItem: PropTypes.string,
 };
 
 export default PackageSearchList;

src/components/provider-list-item/provider-list-item.js

@@ -3,7 +3,6 @@ import classNames from 'classnames/bind';
 import { FormattedNumber, FormattedMessage } from 'react-intl';
 import { Headline } from '@folio/stripes/components';
 
-import shouldFocus from '../should-focus';
 import InternalLink from '../internal-link';
 import SelectedLabel from '../selected-label';
 
@@ -94,6 +93,4 @@ ProviderListItem.defaultProps = {
   headingLevel: 'h3',
 };
 
-// this HOC adds a prop, `shouldFocus` that will focus the component's
-// rendered DOM node on mount and update (when the prop is toggled)
-export default shouldFocus(ProviderListItem);
+export default ProviderListItem;

src/components/provider-search-list.js

@@ -14,7 +14,6 @@ const ProviderSearchList = ({
   fetch,
   notFoundMessage,
   onUpdateOffset,
-  shouldFocusItem,
   onClickItem,
 }) => {
   const packagesCollection = extend(Object.create(collection), {
@@ -48,7 +47,6 @@ const ProviderSearchList = ({
             pathname: `/eholdings/providers/${item.content.id}`,
           }}
           active={item.content && activeId && item.content.id === activeId}
-          shouldFocus={item.content && shouldFocusItem && item.content.id === shouldFocusItem}
           onClick={() => onClickItem(`/eholdings/providers/${item.content.id}`)}
         />
       )}
@@ -66,7 +64,6 @@ ProviderSearchList.propTypes = {
   ]),
   onClickItem: PropTypes.func.isRequired,
   onUpdateOffset: PropTypes.func.isRequired,
-  shouldFocusItem: PropTypes.string,
 };
 
 export default ProviderSearchList;

src/components/search-package-list-item/search-package-list-item.js

@@ -8,7 +8,6 @@ import {
 
 import { Headline } from '@folio/stripes/components';
 
-import shouldFocus from '../should-focus';
 import InternalLink from '../internal-link';
 import HiddenLabel from '../hidden-label';
 import SelectedLabel from '../selected-label';
@@ -128,6 +127,4 @@ SearchPackageListItem.defaultProps = {
   showTitleCount: false,
 };
 
-// this HOC adds a prop, `shouldFocus` that will focus the component's
-// rendered DOM node on mount and update (when the prop is toggled)
-export default shouldFocus(SearchPackageListItem);
+export default SearchPackageListItem;

src/components/title-list-item/title-list-item.js

@@ -4,7 +4,6 @@ import isEmpty from 'lodash/isEmpty';
 
 import { Headline } from '@folio/stripes/components';
 
-import shouldFocus from '../should-focus';
 import InternalLink from '../internal-link';
 import IdentifiersList from '../identifiers-list';
 import ContributorsList from '../contributors-list';
@@ -152,6 +151,4 @@ TitleListItem.propTypes = {
   showSelected: PropTypes.bool,
 };
 
-// this HOC adds a prop, `shouldFocus` that will focus the component's
-// rendered DOM node on mount and update (when the prop is toggled)
-export default shouldFocus(TitleListItem);
+export default TitleListItem;

src/components/title-search-list.js

@@ -15,7 +15,6 @@ const TitleSearchList = ({
   fetch,
   notFoundMessage,
   onUpdateOffset,
-  shouldFocusItem,
   onClickItem,
 }) => {
   const packagesCollection = extend(Object.create(collection), {
@@ -53,7 +52,6 @@ const TitleSearchList = ({
             pathname: `/eholdings/titles/${item.content.id}`,
           }}
           active={item.content && activeId && item.content.id === activeId}
-          shouldFocus={item.content && shouldFocusItem && item.content.id === shouldFocusItem}
           onClick={() => onClickItem(`/eholdings/titles/${item.content.id}`)}
         />
       )}
@@ -72,7 +70,6 @@ TitleSearchList.propTypes = {
   onClickItem: PropTypes.func.isRequired,
   onUpdateOffset: PropTypes.func.isRequired,
   packagesFacetCollection: PropTypes.object.isRequired,
-  shouldFocusItem: PropTypes.string,
 };
 
 export default TitleSearchList;

src/routes/search-route/search-route.js

@@ -103,11 +103,7 @@ class SearchRoute extends Component {
     const searchTypeChanged = searchType !== prevState.searchType;
     const urlContainsTagsFilter = hasIn(params, ['filter', 'tags']);
     const urlContainsAccessTypesFilter = hasIn(params, ['filter', 'access-type']);
-    let shouldFocusItem = null;
 
-    if (hideDetails && match.params.id !== (prevState.match && prevState.match.params.id)) {
-      shouldFocusItem = prevState.match.params.id || null;
-    }
     // update searchstring state only when it actually changes in the location instead of updating it each time on
     // input to text field. This eliminates re-rendering of the text field on each keyboard in and solves problem
     // stated in https://issues.folio.org/browse/UIEH-558
@@ -118,7 +114,6 @@ class SearchRoute extends Component {
         searchType,
         params,
         hideDetails,
-        shouldFocusItem,
         sort: params.sort,
         submittedSearchFilters: params.filter || {},
         draftSearchFilters: searchTypeChanged
@@ -437,13 +432,12 @@ class SearchRoute extends Component {
    * Renders the search component specific to the current search type
    */
   renderResults() {
-    const { searchType, params, shouldFocusItem } = this.state;
+    const { searchType, params } = this.state;
     const { history, location, match: { params: { id } } } = this.props;
 
     const props = {
       params,
       activeId: id,
-      shouldFocusItem,
       location: this.props.location,
       collection: this.getResults(),
       packagesFacetCollection: this.getPackagesFacetCollection(),