diff --git a/CHANGELOG.md b/CHANGELOG.md index 2898dc86..bfccaeaa 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -16,6 +16,7 @@ * Add validation for `Day` field in `Monthly` scheduler for export method. Refs UIORGS-417. * Support `data-export-spring` interface `v2.0`. Refs UXPROD-3903. * Accurately handle user permissions for banking information operations. Refs UIORGS-424. +* UX Consistency > Search results > Update HTML page title with search term entered. Refs UIORGS-421. ## [5.0.0](https://github.com/folio-org/ui-organizations/tree/v5.0.0) (2023-10-12) [Full Changelog](https://github.com/folio-org/ui-organizations/compare/v4.0.0...v5.0.0) diff --git a/src/Organizations/OrganizationsList/OrganizationsList.js b/src/Organizations/OrganizationsList/OrganizationsList.js index da5a063b..d054d860 100644 --- a/src/Organizations/OrganizationsList/OrganizationsList.js +++ b/src/Organizations/OrganizationsList/OrganizationsList.js @@ -6,7 +6,10 @@ import { useHistory, useLocation, } from 'react-router-dom'; -import { FormattedMessage } from 'react-intl'; +import { + FormattedMessage, + useIntl, +} from 'react-intl'; import { checkScope, @@ -14,7 +17,10 @@ import { MultiColumnList, TextLink, } from '@folio/stripes/components'; -import { useStripes } from '@folio/stripes/core'; +import { + TitleManager, + useStripes, +} from '@folio/stripes/core'; import { PersistedPaneset } from '@folio/stripes/smart-components'; import { RESULT_COUNT_INCREMENT, @@ -23,6 +29,7 @@ import { NoResultsMessage, ResetButton, ResultsPane, + SEARCH_PARAMETER, SingleSearchForm, PrevNextPagination, useFiltersReset, @@ -81,6 +88,7 @@ const OrganizationsList = ({ resultsPaneTitleRef, pagination, }) => { + const intl = useIntl(); const stripes = useStripes(); const history = useHistory(); const location = useLocation(); @@ -147,12 +155,16 @@ const OrganizationsList = ({ const { itemToView, setItemToView, deleteItemToView } = useItemToView('organizations-list'); + const queryFilter = filters?.[SEARCH_PARAMETER]; + const pageTitle = queryFilter ? intl.formatMessage({ id: 'ui-organizations.document.title.search' }, { query: queryFilter }) : null; + return ( +