diff --git a/src/common/hooks/useLoadSearchResults.ts b/src/common/hooks/useLoadSearchResults.ts index 0acd00a18..396e1d09c 100644 --- a/src/common/hooks/useLoadSearchResults.ts +++ b/src/common/hooks/useLoadSearchResults.ts @@ -1,5 +1,4 @@ import { useEffect, useRef } from 'react'; -import { useSearchParams } from 'react-router-dom'; import { SearchQueryParams } from '@common/constants/routes.constants'; import { SEARCH_RESULTS_LIMIT, SearchIdentifiers } from '@common/constants/search.constants'; import { useLoadingState, useSearchState } from '@src/store'; @@ -12,7 +11,7 @@ export const useLoadSearchResults = ( useSearchContext(); const { setIsLoading } = useLoadingState(); const { setQuery, setData, setSearchBy, forceRefresh, setForceRefresh, resetFacetsData } = useSearchState(); - const [searchParams] = useSearchParams(); + const searchParams = new URLSearchParams(window.location.search); const queryParam = searchParams.get(SearchQueryParams.Query); const searchByParam = searchParams.get(SearchQueryParams.SearchBy); const offsetParam = searchParams.get(SearchQueryParams.Offset); @@ -68,7 +67,7 @@ export const useLoadSearchResults = ( await getSearchFacetsData?.(); if (defaultSearchBy && defaultQuery) { - await fetchData({ query: defaultQuery as string, searchBy: defaultSearchBy, offset: 0 }); + await fetchData({ query: defaultQuery, searchBy: defaultSearchBy, offset: 0 }); } setIsLoading(false); diff --git a/src/test/__tests__/common/hooks/useLoadSearchResults.test.ts b/src/test/__tests__/common/hooks/useLoadSearchResults.test.ts index c9b13b9e0..622b71c15 100644 --- a/src/test/__tests__/common/hooks/useLoadSearchResults.test.ts +++ b/src/test/__tests__/common/hooks/useLoadSearchResults.test.ts @@ -1,14 +1,8 @@ import { act, renderHook } from '@testing-library/react'; -import { useSearchParams } from 'react-router-dom'; -import { SearchQueryParams } from '@common/constants/routes.constants'; import { useLoadSearchResults } from '@common/hooks/useLoadSearchResults'; import { useLoadingStateStore, useSearchStore } from '@src/store'; import { setInitialGlobalState, setUpdatedGlobalState } from '@src/test/__mocks__/store'; -jest.mock('react-router-dom', () => ({ - useSearchParams: jest.fn(), -})); - describe('useLoadSearchResults', () => { const setData = jest.fn(); const fetchData = jest.fn(); @@ -38,13 +32,14 @@ describe('useLoadSearchResults', () => { }); it('fetches data and updates state with query and searchBy', async () => { - const searchParams = new URLSearchParams({ - [SearchQueryParams.Query]: 'test query', - [SearchQueryParams.SearchBy]: 'title', + Object.defineProperty(window, 'location', { + value: { + search: '?query=test%20query&searchBy=title', + }, + writable: true, }); fetchData.mockResolvedValue([{ test: ['test value'] }]); - (useSearchParams as jest.Mock).mockReturnValue([searchParams]); act(() => setUpdatedGlobalState([ { @@ -62,9 +57,12 @@ describe('useLoadSearchResults', () => { }); it('clears data when no query param', () => { - const searchParams = new URLSearchParams({}); - - (useSearchParams as jest.Mock).mockReturnValue([searchParams]); + Object.defineProperty(window, 'location', { + value: { + search: '', + }, + writable: true, + }); renderHook(() => useLoadSearchResults(fetchData)); diff --git a/src/views/Edit/Edit.tsx b/src/views/Edit/Edit.tsx index bbfa20125..87f366a7e 100644 --- a/src/views/Edit/Edit.tsx +++ b/src/views/Edit/Edit.tsx @@ -1,5 +1,5 @@ import { useEffect } from 'react'; -import { useParams, useSearchParams } from 'react-router-dom'; +import { useParams } from 'react-router-dom'; import { EditSection } from '@components/EditSection'; import { BibframeEntities, PROFILE_BFIDS } from '@common/constants/bibframe.constants'; import { scrollEntity } from '@common/helpers/pageScrolling.helper'; @@ -26,7 +26,10 @@ export const Edit = () => { const recordStatusType = recordStatus?.type; const { setIsLoading } = useLoadingState(); const { setCurrentlyEditedEntityBfid, setCurrentlyPreviewedEntityBfid } = useUIState(); - const [queryParams] = useSearchParams(); + const queryParams = new URLSearchParams(window.location.search); + const cloneOfParam = queryParams.get(QueryParams.CloneOf); + const typeParam = queryParams.get(QueryParams.Type); + const refParam = queryParams.get(QueryParams.Ref); useResetRecordStatus(); @@ -42,8 +45,7 @@ export const Edit = () => { setIsLoading(true); - const cloneId = queryParams.get(QueryParams.CloneOf); - const fetchableId = resourceId ?? cloneId; + const fetchableId = resourceId ?? cloneOfParam; try { if (fetchableId) { @@ -52,8 +54,8 @@ export const Edit = () => { return; } - const resourceDecriptionType = (queryParams.get(QueryParams.Type) as ResourceType) || ResourceType.instance; - const resourceReference = queryParams.get(QueryParams.Ref); + const resourceDecriptionType = (typeParam as ResourceType) || ResourceType.instance; + const resourceReference = refParam; const isInstancePageType = resourceDecriptionType === ResourceType.instance; const editedEntityBfId = isInstancePageType ? PROFILE_BFIDS.INSTANCE : PROFILE_BFIDS.WORK; const previewedEntityBfId = isInstancePageType ? PROFILE_BFIDS.WORK : PROFILE_BFIDS.INSTANCE; @@ -85,7 +87,7 @@ export const Edit = () => { } loadRecord(); - }, [resourceId, recordStatusType, queryParams]); + }, [resourceId, recordStatusType, cloneOfParam, typeParam, refParam]); return (