From 1baf4bca2c20f616a48f17e55dff053f811d19e3 Mon Sep 17 00:00:00 2001
From: Siarhei Karol <skarol@ebsco.com>
Date: Fri, 6 Dec 2024 13:30:46 +0300
Subject: [PATCH] migrate search store

---
 .../hooks/useComplexLookupSearchResults.ts    |  6 +-
 src/common/hooks/useFetchSearchData.ts        |  9 +-
 src/common/hooks/useLoadSearchResults.ts      | 10 +-
 src/common/hooks/useNavigateToEditPage.ts     |  5 +-
 src/common/hooks/usePagination.ts             |  5 +-
 src/common/hooks/useSearch.ts                 | 35 ++++---
 .../hooks/useSearchFilterLookupOptions.ts     |  6 +-
 src/common/hooks/useSearchFilters.ts          | 11 +--
 src/common/hooks/useSearchFiltersData.ts      | 10 +-
 src/common/hooks/useSearchNavigationState.ts  |  5 +-
 .../AdvancedSearchModal.tsx                   |  6 +-
 src/components/Announcement/index.ts          |  1 +
 .../ComplexLookupField/ModalComplexLookup.tsx |  7 +-
 .../SearchControlPane/SearchControlPane.tsx   |  5 +-
 .../SearchControls/SearchControls.tsx         | 23 +++--
 .../SearchFilters/SearchFilters.tsx           |  4 +-
 .../SearchResultEntry/SearchResultEntry.tsx   |  6 +-
 .../SearchResultList/SearchResultList.tsx     |  5 +-
 src/state/index.ts                            |  5 -
 src/state/search.ts                           | 82 -----------------
 src/store/index.ts                            |  1 +
 src/store/search.ts                           | 42 +++++++++
 src/store/selectors.ts                        |  2 +
 .../useComplesLookupSearchResults.test.ts     | 12 ++-
 .../common/hooks/useLoadSearchResults.test.ts | 44 ++++-----
 .../hooks/useNavigateToEditPage.test.ts       | 29 +++---
 .../common/hooks/usePagination.test.ts        | 87 ++++++++++++------
 .../__tests__/common/hooks/useSearch.test.ts  | 92 +++++++++----------
 .../useSearchFilterLookupOptions.test.ts      | 11 ++-
 .../common/hooks/useSearchFilters.test.tsx    | 34 ++++---
 .../common/hooks/useSearchFiltersData.test.ts | 36 +++++---
 .../hooks/useSearchNavigationState.test.ts    | 26 +++---
 .../__tests__/components/ItemSearch.test.tsx  | 17 ++--
 .../components/SearchControls.test.tsx        | 12 ++-
 .../components/SearchResultList.test.tsx      | 24 +++--
 35 files changed, 361 insertions(+), 354 deletions(-)
 create mode 100644 src/components/Announcement/index.ts
 delete mode 100644 src/state/index.ts
 delete mode 100644 src/state/search.ts

diff --git a/src/common/hooks/useComplexLookupSearchResults.ts b/src/common/hooks/useComplexLookupSearchResults.ts
index 474f839a..fb068384 100644
--- a/src/common/hooks/useComplexLookupSearchResults.ts
+++ b/src/common/hooks/useComplexLookupSearchResults.ts
@@ -1,10 +1,9 @@
 import { useCallback, useMemo } from 'react';
-import { useRecoilValue } from 'recoil';
 import { useIntl } from 'react-intl';
 import { type Row } from '@components/Table';
 import { useSearchContext } from '@common/hooks/useSearchContext';
 import { ComplexLookupSearchResultsProps } from '@components/ComplexLookupField/ComplexLookupSearchResults';
-import state from '@state';
+import { useSearchState } from '@src/store';
 
 export const useComplexLookupSearchResults = ({
   onTitleClick,
@@ -12,8 +11,7 @@ export const useComplexLookupSearchResults = ({
   searchResultsFormatter,
 }: ComplexLookupSearchResultsProps) => {
   const { onAssignRecord } = useSearchContext();
-  const data = useRecoilValue(state.search.data);
-  const sourceData = useRecoilValue(state.search.sourceData);
+  const { data, sourceData } = useSearchState();
   const { formatMessage } = useIntl();
 
   const applyActionItems = useCallback(
diff --git a/src/common/hooks/useFetchSearchData.ts b/src/common/hooks/useFetchSearchData.ts
index 7101d4ee..cc445039 100644
--- a/src/common/hooks/useFetchSearchData.ts
+++ b/src/common/hooks/useFetchSearchData.ts
@@ -1,5 +1,4 @@
 import { useCallback } from 'react';
-import { useSetRecoilState, useRecoilState, useResetRecoilState } from 'recoil';
 import { getByIdentifier } from '@common/api/search.api';
 import { SearchIdentifiers, SearchSegment } from '@common/constants/search.constants';
 import { SearchableIndexQuerySelector } from '@common/constants/complexLookup.constants';
@@ -7,8 +6,7 @@ import { StatusType } from '@common/constants/status.constants';
 import { normalizeQuery } from '@common/helpers/search.helper';
 import { normalizeLccn } from '@common/helpers/validations.helper';
 import { UserNotificationFactory } from '@common/services/userNotification';
-import { useLoadingState, useStatusState } from '@src/store';
-import state from '@state';
+import { useLoadingState, useSearchState, useStatusState } from '@src/store';
 import { useSearchContext } from './useSearchContext';
 
 export const useFetchSearchData = () => {
@@ -26,10 +24,7 @@ export const useFetchSearchData = () => {
     precedingRecordsCount,
   } = useSearchContext();
   const { setIsLoading } = useLoadingState();
-  const setMessage = useSetRecoilState(state.search.message);
-  const [data, setData] = useRecoilState(state.search.data);
-  const resetData = useResetRecoilState(state.search.data);
-  const setPageMetadata = useSetRecoilState(state.search.pageMetadata);
+  const { setMessage, data, setData, resetData, setPageMetadata } = useSearchState();
   const { addStatusMessage, resetStatusMessages } = useStatusState();
 
   const validateAndNormalizeQuery = useCallback(
diff --git a/src/common/hooks/useLoadSearchResults.ts b/src/common/hooks/useLoadSearchResults.ts
index 344baab9..0acd00a1 100644
--- a/src/common/hooks/useLoadSearchResults.ts
+++ b/src/common/hooks/useLoadSearchResults.ts
@@ -1,10 +1,8 @@
 import { useEffect, useRef } from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { useRecoilState, useResetRecoilState, useSetRecoilState } from 'recoil';
 import { SearchQueryParams } from '@common/constants/routes.constants';
 import { SEARCH_RESULTS_LIMIT, SearchIdentifiers } from '@common/constants/search.constants';
-import { useLoadingState } from '@src/store';
-import state from '@state';
+import { useLoadingState, useSearchState } from '@src/store';
 import { useSearchContext } from './useSearchContext';
 
 export const useLoadSearchResults = (
@@ -12,12 +10,8 @@ export const useLoadSearchResults = (
 ) => {
   const { hasSearchParams, defaultSearchBy, defaultQuery, getSearchSourceData, getSearchFacetsData } =
     useSearchContext();
-  const setData = useSetRecoilState(state.search.data);
-  const setSearchBy = useSetRecoilState(state.search.index);
   const { setIsLoading } = useLoadingState();
-  const setQuery = useSetRecoilState(state.search.query);
-  const [forceRefresh, setForceRefresh] = useRecoilState(state.search.forceRefresh);
-  const resetFacetsData = useResetRecoilState(state.search.facetsData);
+  const { setQuery, setData, setSearchBy, forceRefresh, setForceRefresh, resetFacetsData } = useSearchState();
   const [searchParams] = useSearchParams();
   const queryParam = searchParams.get(SearchQueryParams.Query);
   const searchByParam = searchParams.get(SearchQueryParams.SearchBy);
diff --git a/src/common/hooks/useNavigateToEditPage.ts b/src/common/hooks/useNavigateToEditPage.ts
index 79670bc9..a458e520 100644
--- a/src/common/hooks/useNavigateToEditPage.ts
+++ b/src/common/hooks/useNavigateToEditPage.ts
@@ -1,11 +1,10 @@
 import { ROUTES, QueryParams } from '@common/constants/routes.constants';
-import state from '@state';
+import { useSearchState } from '@src/store';
 import { useNavigate } from 'react-router-dom';
-import { useRecoilValue } from 'recoil';
 
 export const useNavigateToEditPage = () => {
   const navigate = useNavigate();
-  const navigationState = useRecoilValue(state.search.navigationState);
+  const { navigationState } = useSearchState();
 
   const navigateAsDuplicate = (duplicateId: string) => {
     navigate(`${ROUTES.RESOURCE_CREATE.uri}?${QueryParams.CloneOf}=${duplicateId}`, { state: navigationState });
diff --git a/src/common/hooks/usePagination.ts b/src/common/hooks/usePagination.ts
index d28b8368..134e896c 100644
--- a/src/common/hooks/usePagination.ts
+++ b/src/common/hooks/usePagination.ts
@@ -1,13 +1,12 @@
 import { useEffect, useState } from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { useRecoilValue } from 'recoil';
 import { SearchQueryParams } from '@common/constants/routes.constants';
-import state from '@state';
+import { useSearchState } from '@src/store';
 
 export const usePagination = (hasSearchParams = true, defaultPageNumber = 0, hasCycledPagination = false) => {
   const [searchParams, setSearchParams] = useSearchParams();
   const offsetSearchParam = searchParams.get(SearchQueryParams.Offset);
-  const pageMetadata = useRecoilValue<PageMetadata>(state.search.pageMetadata);
+  const { pageMetadata } = useSearchState();
   const [currentPageNumber, setCurrentPageNumber] = useState(
     offsetSearchParam ? parseInt(offsetSearchParam) : defaultPageNumber,
   );
diff --git a/src/common/hooks/useSearch.ts b/src/common/hooks/useSearch.ts
index f6334f92..5cac6d9d 100644
--- a/src/common/hooks/useSearch.ts
+++ b/src/common/hooks/useSearch.ts
@@ -1,6 +1,5 @@
 import { useCallback, useEffect } from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { useSetRecoilState, useRecoilState, useResetRecoilState } from 'recoil';
 import { SearchableIndexQuerySelector } from '@common/constants/complexLookup.constants';
 import { DEFAULT_PAGES_METADATA } from '@common/constants/api.constants';
 import { SearchIdentifiers, SearchSegment } from '@common/constants/search.constants';
@@ -8,8 +7,7 @@ import { generateSearchParamsState } from '@common/helpers/search.helper';
 import { usePagination } from '@common/hooks/usePagination';
 import { useSearchContext } from '@common/hooks/useSearchContext';
 import { useFetchSearchData } from '@common/hooks/useFetchSearchData';
-import { useInputsState, useLoadingState } from '@src/store';
-import state from '@state';
+import { useInputsState, useLoadingState, useSearchState } from '@src/store';
 
 export const useSearch = () => {
   const {
@@ -23,15 +21,24 @@ export const useSearch = () => {
   } = useSearchContext();
   const { setIsLoading } = useLoadingState();
   const { resetPreviewContent } = useInputsState();
-  const [searchBy, setSearchBy] = useRecoilState(state.search.index);
-  const [query, setQuery] = useRecoilState(state.search.query);
-  const [facets, setFacets] = useRecoilState(state.search.limiters);
-  const [message, setMessage] = useRecoilState(state.search.message);
-  const [data, setData] = useRecoilState(state.search.data);
-  const [pageMetadata, setPageMetadata] = useRecoilState(state.search.pageMetadata);
-  const setForceRefreshSearch = useSetRecoilState(state.search.forceRefresh);
-  const [facetsBySegments, setFacetsBySegments] = useRecoilState(state.search.facetsBySegments);
-  const clearFacetsBySegments = useResetRecoilState(state.search.facetsBySegments);
+  const {
+    searchBy,
+    setSearchBy,
+    query,
+    setQuery,
+    facets,
+    setFacets,
+    message,
+    setMessage,
+    data,
+    setData,
+    pageMetadata,
+    setPageMetadata,
+    setForceRefresh: setForceRefreshSearch,
+    facetsBySegments,
+    setFacetsBySegments,
+    resetFacetsBySegments,
+  } = useSearchState();
 
   const { fetchData } = useFetchSearchData();
   const {
@@ -199,8 +206,8 @@ export const useSearch = () => {
 
   // Reset Segments selection on unmount
   useEffect(() => {
-    return clearFacetsBySegments;
-  }, [clearFacetsBySegments]);
+    return resetFacetsBySegments;
+  }, [resetFacetsBySegments]);
 
   return {
     submitSearch,
diff --git a/src/common/hooks/useSearchFilterLookupOptions.ts b/src/common/hooks/useSearchFilterLookupOptions.ts
index c042725f..82e28362 100644
--- a/src/common/hooks/useSearchFilterLookupOptions.ts
+++ b/src/common/hooks/useSearchFilterLookupOptions.ts
@@ -1,6 +1,5 @@
-import { useRecoilValue } from 'recoil';
 import { useIntl } from 'react-intl';
-import state from '@state';
+import { useSearchState } from '@src/store';
 
 export const useSearchFilterLookupOptions = ({
   facet,
@@ -10,8 +9,7 @@ export const useSearchFilterLookupOptions = ({
   hasMappedSourceData?: boolean;
   excludedOptions?: string[];
 }) => {
-  const sourceData = useRecoilValue(state.search.sourceData);
-  const facetsData = useRecoilValue(state.search.facetsData);
+  const { sourceData, facetsData } = useSearchState();
   const { formatMessage } = useIntl();
 
   const facetValues = facet && facetsData ? facetsData?.[facet]?.values : undefined;
diff --git a/src/common/hooks/useSearchFilters.ts b/src/common/hooks/useSearchFilters.ts
index 626ea7c5..e560de69 100644
--- a/src/common/hooks/useSearchFilters.ts
+++ b/src/common/hooks/useSearchFilters.ts
@@ -1,20 +1,19 @@
 import { ChangeEvent } from 'react';
-import { useRecoilState } from 'recoil';
 import { SearchLimiterNames } from '@common/constants/search.constants';
-import state from '@state';
+import { useSearchState } from '@src/store';
 
 export const useSearchFilters = () => {
-  const [limiters, setLimiters] = useRecoilState(state.search.limiters);
+  const { facets, setFacets } = useSearchState();
 
   const onChangeLimiters = ({ target: { id, name } }: ChangeEvent<HTMLInputElement>) => {
-    setLimiters(prev => ({
+    setFacets(prev => ({
       ...prev,
       [name]: id,
     }));
   };
 
   const onChangeLimitersMulti = ({ target: { id, name } }: ChangeEvent<HTMLInputElement>) => {
-    setLimiters(prev => {
+    setFacets(prev => {
       const initialLimiters = (prev[name as SearchLimiterNames] as any[]) || [];
 
       return {
@@ -29,7 +28,7 @@ export const useSearchFilters = () => {
   const onChange = (_e: ChangeEvent<HTMLInputElement>) => {};
 
   return {
-    limiters,
+    facets,
     onChangeLimiters,
     onChangeLimitersMulti,
     onChange,
diff --git a/src/common/hooks/useSearchFiltersData.ts b/src/common/hooks/useSearchFiltersData.ts
index 7e0c6f22..a147b1be 100644
--- a/src/common/hooks/useSearchFiltersData.ts
+++ b/src/common/hooks/useSearchFiltersData.ts
@@ -1,19 +1,15 @@
 import { useEffect } from 'react';
-import { useRecoilState, useResetRecoilState, useSetRecoilState } from 'recoil';
 import { StatusType } from '@common/constants/status.constants';
 import { UserNotificationFactory } from '@common/services/userNotification';
 import * as SearchApi from '@common/api/search.api';
-import state from '@state';
-import { useStatusState } from '@src/store';
+import { useSearchState, useStatusState } from '@src/store';
 
 const DEFAULT_SEARCH_SOURCE_LIMIT = '50';
 const DEFAULT_SEARCH_FACETS_QUERY = 'id=*';
 
 export const useSearchFiltersData = () => {
-  const [selectedFacetsGroups, setSelectedFacetsGroups] = useRecoilState(state.search.selectedFacetsGroups);
-  const resetSelectedFacetsGroups = useResetRecoilState(state.search.selectedFacetsGroups);
-  const setFacetsData = useSetRecoilState(state.search.facetsData);
-  const setSourceData = useSetRecoilState(state.search.sourceData);
+  const { selectedFacetsGroups, setSelectedFacetsGroups, resetSelectedFacetsGroups, setFacetsData, setSourceData } =
+    useSearchState();
   const { addStatusMessage } = useStatusState();
 
   useEffect(() => {
diff --git a/src/common/hooks/useSearchNavigationState.ts b/src/common/hooks/useSearchNavigationState.ts
index c5879d05..7a083698 100644
--- a/src/common/hooks/useSearchNavigationState.ts
+++ b/src/common/hooks/useSearchNavigationState.ts
@@ -1,9 +1,8 @@
 import { useEffect } from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { useSetRecoilState } from 'recoil';
 import { SearchQueryParams } from '@common/constants/routes.constants';
 import { generateSearchParamsState } from '@common/helpers/search.helper';
-import state from '@state';
+import { useSearchState } from '@src/store';
 
 export const useSearchNavigationState = () => {
   const [searchParams] = useSearchParams();
@@ -11,7 +10,7 @@ export const useSearchNavigationState = () => {
   const searchBySearchParam = searchParams.get(SearchQueryParams.SearchBy);
   const offsetSearchParam = searchParams.get(SearchQueryParams.Offset);
 
-  const setNavigationState = useSetRecoilState(state.search.navigationState);
+  const { setNavigationState } = useSearchState();
 
   useEffect(() => {
     const generatedState = generateSearchParamsState(
diff --git a/src/components/AdvancedSearchModal/AdvancedSearchModal.tsx b/src/components/AdvancedSearchModal/AdvancedSearchModal.tsx
index 040f9c33..b20c7635 100644
--- a/src/components/AdvancedSearchModal/AdvancedSearchModal.tsx
+++ b/src/components/AdvancedSearchModal/AdvancedSearchModal.tsx
@@ -1,6 +1,5 @@
 import { FC, memo, useState } from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { useSetRecoilState } from 'recoil';
 import { FormattedMessage, useIntl } from 'react-intl';
 import { Modal } from '@components/Modal';
 import { Input } from '@components/Input';
@@ -12,8 +11,7 @@ import {
 } from '@common/constants/search.constants';
 import { formatRawQuery, generateSearchParamsState } from '@common/helpers/search.helper';
 import { Select } from '@components/Select';
-import { useUIState } from '@src/store';
-import state from '@state';
+import { useSearchState, useUIState } from '@src/store';
 import './AdvancedSearchModal.scss';
 
 enum AdvancedSearchInputs {
@@ -31,7 +29,7 @@ export const AdvancedSearchModal: FC<Props> = memo(({ clearValues }) => {
   const [, setSearchParams] = useSearchParams();
   const { formatMessage } = useIntl();
   const { isAdvancedSearchOpen: isOpen, setIsAdvancedSearchOpen: setIsOpen } = useUIState();
-  const setForceRefreshSearch = useSetRecoilState(state.search.forceRefresh);
+  const { setForceRefresh: setForceRefreshSearch } = useSearchState();
   const [rawQuery, setRawQuery] = useState(DEFAULT_ADVANCED_SEARCH_QUERY);
 
   const closeModal = () => {
diff --git a/src/components/Announcement/index.ts b/src/components/Announcement/index.ts
new file mode 100644
index 00000000..e0f8e918
--- /dev/null
+++ b/src/components/Announcement/index.ts
@@ -0,0 +1 @@
+export { Announcement } from './Announcement';
diff --git a/src/components/ComplexLookupField/ModalComplexLookup.tsx b/src/components/ComplexLookupField/ModalComplexLookup.tsx
index 7991c26c..b8090c16 100644
--- a/src/components/ComplexLookupField/ModalComplexLookup.tsx
+++ b/src/components/ComplexLookupField/ModalComplexLookup.tsx
@@ -1,5 +1,4 @@
 import { FC, memo, useCallback, useEffect } from 'react';
-import { useResetRecoilState, useSetRecoilState } from 'recoil';
 import classNames from 'classnames';
 import { FormattedMessage, FormattedNumber } from 'react-intl';
 import { getSearchResults } from '@common/api/search.api';
@@ -13,13 +12,12 @@ import { useMarcData } from '@common/hooks/useMarcData';
 import { COMPLEX_LOOKUPS_CONFIG } from '@src/configs';
 import { Modal } from '@components/Modal';
 import { Search } from '@components/Search';
+import { useMarcPreviewState, useSearchState, useUIState } from '@src/store';
 import { SearchControlPane } from '@components/SearchControlPane';
-import state from '@state';
 import { ComplexLookupSearchResults } from './ComplexLookupSearchResults';
 import { MarcPreviewComplexLookup } from './MarcPreviewComplexLookup';
 import { SEARCH_RESULTS_TABLE_CONFIG } from './configs';
 import './ModalComplexLookup.scss';
-import { useMarcPreviewState, useUIState } from '@src/store';
 
 interface ModalComplexLookupProps {
   isOpen: boolean;
@@ -51,8 +49,7 @@ export const ModalComplexLookup: FC<ModalComplexLookupProps> = memo(
     const searchResultsFormatter = SEARCH_RESULTS_FORMATTER[assignEntityName] || SEARCH_RESULTS_FORMATTER.default;
     const buildSearchQuery = SEARCH_QUERY_BUILDER[assignEntityName] || SEARCH_QUERY_BUILDER.default;
 
-    const setSearchQuery = useSetRecoilState(state.search.query);
-    const clearSearchQuery = useResetRecoilState(state.search.query);
+    const { setQuery: setSearchQuery, resetQuery: clearSearchQuery } = useSearchState();
     const { getFacetsData, getSourceData } = useComplexLookupApi(api, filters);
     const { setIsMarcPreviewOpen } = useUIState();
     const {
diff --git a/src/components/SearchControlPane/SearchControlPane.tsx b/src/components/SearchControlPane/SearchControlPane.tsx
index e1fa6063..c37d4f9e 100644
--- a/src/components/SearchControlPane/SearchControlPane.tsx
+++ b/src/components/SearchControlPane/SearchControlPane.tsx
@@ -1,10 +1,9 @@
 import { FC } from 'react';
-import { useRecoilValue } from 'recoil';
 import classNames from 'classnames';
 import { IS_EMBEDDED_MODE } from '@common/constants/build.constants';
 import { useSearchContext } from '@common/hooks/useSearchContext';
 import { SearchSegment } from '@common/constants/search.constants';
-import state from '@state';
+import { useSearchState } from '@src/store';
 import './SearchControlPane.scss';
 
 type SearchControlPaneProps = {
@@ -22,7 +21,7 @@ export const SearchControlPane: FC<SearchControlPaneProps> = ({
   renderCloseButton,
   segmentsConfig,
 }) => {
-  const searchResultsMetadata = useRecoilValue(state.search.pageMetadata);
+  const { pageMetadata: searchResultsMetadata } = useSearchState();
   const { navigationSegment } = useSearchContext();
   const selectedSegment = navigationSegment?.value;
   const isVisibleSubLabel = segmentsConfig
diff --git a/src/components/SearchControls/SearchControls.tsx b/src/components/SearchControls/SearchControls.tsx
index 273c1f2d..7e6e2140 100644
--- a/src/components/SearchControls/SearchControls.tsx
+++ b/src/components/SearchControls/SearchControls.tsx
@@ -1,6 +1,5 @@
 import { ChangeEvent, FC, FormEventHandler, useEffect, useState } from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { useRecoilState, useResetRecoilState, useSetRecoilState } from 'recoil';
 import { FormattedMessage, useIntl } from 'react-intl';
 import classNames from 'classnames';
 import { DEFAULT_FACET_BY_SEGMENT, SearchIdentifiers } from '@common/constants/search.constants';
@@ -11,13 +10,12 @@ import { Input } from '@components/Input';
 import { Select } from '@components/Select';
 import { SearchFilters } from '@components/SearchFilters';
 import { Textarea } from '@components/Textarea';
+import { Announcement } from '@components/Announcement';
+import { useSearchState, useUIState } from '@src/store';
 import SearchSegments from './SearchSegments';
-import state from '@state';
 import CaretDown from '@src/assets/caret-down.svg?react';
 import XInCircle from '@src/assets/x-in-circle.svg?react';
 import './SearchControls.scss';
-import { Announcement } from '@components/Announcement/Announcement';
-import { useUIState } from '@src/store';
 
 type Props = {
   submitSearch: VoidFunction;
@@ -38,12 +36,17 @@ export const SearchControls: FC<Props> = ({ submitSearch, changeSegment, clearVa
     defaultSearchBy,
     navigationSegment,
   } = useSearchContext();
-  const [searchBy, setSearchBy] = useRecoilState(state.search.index);
-  const [query, setQuery] = useRecoilState(state.search.query);
-  const setMessage = useSetRecoilState(state.search.message);
-  const setNavigationState = useSetRecoilState(state.search.navigationState);
-  const resetControls = useResetRecoilState(state.search.limiters);
-  const setFacetsBySegments = useSetRecoilState(state.search.facetsBySegments);
+
+  const {
+    searchBy,
+    setSearchBy,
+    query,
+    setQuery,
+    setMessage,
+    setNavigationState,
+    resetFacets: resetControls,
+    setFacetsBySegments,
+  } = useSearchState();
   const { setIsAdvancedSearchOpen } = useUIState();
   const [searchParams, setSearchParams] = useSearchParams();
   const [announcementMessage, setAnnouncementMessage] = useState('');
diff --git a/src/components/SearchFilters/SearchFilters.tsx b/src/components/SearchFilters/SearchFilters.tsx
index 1e8aa6d0..6cc9adb5 100644
--- a/src/components/SearchFilters/SearchFilters.tsx
+++ b/src/components/SearchFilters/SearchFilters.tsx
@@ -9,7 +9,7 @@ import { DateRange } from '@components/DateRange';
 
 export const SearchFilters = () => {
   const { filters, getSearchFacetsData } = useSearchContext();
-  const { limiters, onChangeLimiters, onChangeLimitersMulti, onChange } = useSearchFilters();
+  const { facets, onChangeLimiters, onChangeLimitersMulti, onChange } = useSearchFilters();
   const filtersLastGroupIndex = filters.length - 1;
 
   return (
@@ -36,7 +36,7 @@ export const SearchFilters = () => {
                     {children?.map(({ id, name, type, labelId }) => (
                       <label htmlFor={id} key={id}>
                         <input
-                          checked={isSingleGroupCheckType ? limiters[name] === id : limiters[name]?.includes(id)}
+                          checked={isSingleGroupCheckType ? facets[name] === id : facets[name]?.includes(id)}
                           name={name}
                           id={id}
                           type={type}
diff --git a/src/components/SearchResultEntry/SearchResultEntry.tsx b/src/components/SearchResultEntry/SearchResultEntry.tsx
index b4533967..fb1e60ee 100644
--- a/src/components/SearchResultEntry/SearchResultEntry.tsx
+++ b/src/components/SearchResultEntry/SearchResultEntry.tsx
@@ -1,6 +1,5 @@
 import { FC, useState } from 'react';
 import { Link } from 'react-router-dom';
-import { useRecoilValue } from 'recoil';
 import classNames from 'classnames';
 import { FormattedMessage } from 'react-intl';
 import { WorkDetailsCard } from '@components/WorkDetailsCard';
@@ -12,12 +11,11 @@ import { ROUTES } from '@common/constants/routes.constants';
 import { ResourceType } from '@common/constants/record.constants';
 import { IS_DISABLED_FOR_ALPHA } from '@common/constants/feature.constants';
 import { useNavigateToEditPage } from '@common/hooks/useNavigateToEditPage';
-import state from '@state';
 import CommentIcon from '@src/assets/comment-lines-12.svg?react';
 import { useRecordControls } from '@common/hooks/useRecordControls';
 import { UserNotificationFactory } from '@common/services/userNotification';
 import { StatusType } from '@common/constants/status.constants';
-import { useInputsState, useLoadingState, useStatusState } from '@src/store';
+import { useInputsState, useLoadingState, useSearchState, useStatusState } from '@src/store';
 import './SearchResultEntry.scss';
 
 type SearchResultEntry = {
@@ -59,7 +57,7 @@ const instancesListHeader: Row = {
 
 export const SearchResultEntry: FC<SearchResultEntry> = ({ instances, ...restOfWork }) => {
   const { navigateToEditPage } = useNavigateToEditPage();
-  const navigationState = useRecoilValue(state.search.navigationState);
+  const { navigationState } = useSearchState();
   const [isOpen, setIsOpen] = useState(true);
   const { setIsLoading } = useLoadingState();
   const { addStatusMessage } = useStatusState();
diff --git a/src/components/SearchResultList/SearchResultList.tsx b/src/components/SearchResultList/SearchResultList.tsx
index a7a2ad65..7ec09936 100644
--- a/src/components/SearchResultList/SearchResultList.tsx
+++ b/src/components/SearchResultList/SearchResultList.tsx
@@ -1,11 +1,10 @@
-import state from '@state';
-import { useRecoilValue } from 'recoil';
 import { SearchResultEntry } from '@components/SearchResultEntry';
 import { useSearchNavigationState } from '@common/hooks/useSearchNavigationState';
+import { useSearchState } from '@src/store';
 import './SearchResultList.scss';
 
 export const SearchResultList = () => {
-  const data = useRecoilValue(state.search.data);
+  const { data } = useSearchState();
   useSearchNavigationState();
 
   return (
diff --git a/src/state/index.ts b/src/state/index.ts
deleted file mode 100644
index 82f3c699..00000000
--- a/src/state/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import search from './search';
-
-export default {
-  search,
-};
diff --git a/src/state/search.ts b/src/state/search.ts
deleted file mode 100644
index 1da0f9a3..00000000
--- a/src/state/search.ts
+++ /dev/null
@@ -1,82 +0,0 @@
-import {
-  DEFAULT_FACET_BY_SEGMENT,
-  DEFAULT_SEARCH_BY,
-  DEFAULT_SEARCH_LIMITERS,
-  SearchIdentifiers,
-} from '@common/constants/search.constants';
-import { atom } from 'recoil';
-
-const query = atom<string>({
-  key: 'search.query',
-  default: '',
-});
-
-const message = atom<string>({
-  key: 'search.message',
-  default: '',
-});
-
-const index = atom<SearchIdentifiers>({
-  key: 'search.index',
-  default: DEFAULT_SEARCH_BY,
-});
-
-const data = atom<null | WorkAsSearchResultDTO[]>({
-  key: 'search.data',
-  default: null,
-});
-
-const limiters = atom<Limiters>({
-  key: 'search.limiters',
-  default: DEFAULT_SEARCH_LIMITERS as Limiters,
-});
-
-const navigationState = atom<SearchParamsState>({
-  key: 'search.navigationState',
-  default: {},
-});
-
-const forceRefresh = atom<boolean>({
-  key: 'search.forceRefresh',
-  default: false,
-});
-
-const pageMetadata = atom<PageMetadata>({
-  key: 'search.pageMetadata',
-  default: { totalElements: 0, totalPages: 0 },
-});
-
-const facetsBySegments = atom<FacetsBySegments>({
-  key: 'search.facetsBySegments',
-  default: DEFAULT_FACET_BY_SEGMENT,
-});
-
-const sourceData = atom<SourceDataDTO | null>({
-  key: 'search.sourceData',
-  default: null,
-});
-
-const selectedFacetsGroups = atom<string[]>({
-  key: 'search.selectedFacetsGroups',
-  default: [],
-});
-
-const facetsData = atom<FacetsDTO>({
-  key: 'search.facetsData',
-  default: {},
-});
-
-export default {
-  query,
-  message,
-  index,
-  data,
-  limiters,
-  navigationState,
-  forceRefresh,
-  pageMetadata,
-  facetsBySegments,
-  sourceData,
-  selectedFacetsGroups,
-  facetsData,
-};
diff --git a/src/store/index.ts b/src/store/index.ts
index ac9314b3..30f1140d 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -6,6 +6,7 @@ export * from './profile';
 export * from './inputs';
 export * from './config';
 export * from './ui';
+export * from './search';
 
 // Selector hooks
 export * from './selectors';
diff --git a/src/store/search.ts b/src/store/search.ts
index e69de29b..996f66e8 100644
--- a/src/store/search.ts
+++ b/src/store/search.ts
@@ -0,0 +1,42 @@
+import {
+  DEFAULT_FACET_BY_SEGMENT,
+  DEFAULT_SEARCH_BY,
+  DEFAULT_SEARCH_LIMITERS,
+} from '@common/constants/search.constants';
+import { createBaseSlice, SliceState } from './utils/slice';
+import { generateStore, type StateCreatorTyped } from './utils/storeCreator';
+
+type Data = null | WorkAsSearchResultDTO[];
+type SourceData = SourceDataDTO | null;
+
+export type SearchState = SliceState<'query', string> &
+  SliceState<'message', string> &
+  SliceState<'searchBy', SearchIdentifiers> &
+  SliceState<'data', Data> &
+  SliceState<'facets', Limiters> &
+  SliceState<'navigationState', SearchParamsState> &
+  SliceState<'forceRefresh', boolean> &
+  SliceState<'pageMetadata', PageMetadata> &
+  SliceState<'facetsBySegments', FacetsBySegments> &
+  SliceState<'sourceData', SourceData> &
+  SliceState<'selectedFacetsGroups', string[]> &
+  SliceState<'facetsData', FacetsDTO>;
+
+const STORE_NAME = 'Search';
+
+const searchStore: StateCreatorTyped<SearchState> = (...args) => ({
+  ...createBaseSlice({ basic: 'query' }, '')(...args),
+  ...createBaseSlice({ basic: 'message' }, '')(...args),
+  ...createBaseSlice({ basic: 'searchBy' }, DEFAULT_SEARCH_BY as SearchIdentifiers)(...args),
+  ...createBaseSlice({ basic: 'data' }, null as Data)(...args),
+  ...createBaseSlice({ basic: 'facets' }, DEFAULT_SEARCH_LIMITERS as Limiters)(...args),
+  ...createBaseSlice({ basic: 'navigationState' }, {} as SearchParamsState)(...args),
+  ...createBaseSlice({ basic: 'forceRefresh' }, false)(...args),
+  ...createBaseSlice({ basic: 'pageMetadata' }, { totalElements: 0, totalPages: 0 } as PageMetadata)(...args),
+  ...createBaseSlice({ basic: 'facetsBySegments' }, DEFAULT_FACET_BY_SEGMENT as FacetsBySegments)(...args),
+  ...createBaseSlice({ basic: 'sourceData' }, null as SourceData)(...args),
+  ...createBaseSlice({ basic: 'selectedFacetsGroups' }, [] as string[])(...args),
+  ...createBaseSlice({ basic: 'facetsData' }, {} as FacetsDTO)(...args),
+});
+
+export const useSearchStore = generateStore(searchStore, STORE_NAME);
diff --git a/src/store/selectors.ts b/src/store/selectors.ts
index bae8dac5..5cbcc879 100644
--- a/src/store/selectors.ts
+++ b/src/store/selectors.ts
@@ -6,6 +6,7 @@ import { useProfileStore } from './profile';
 import { useInputsStore } from './inputs';
 import { useConfigStore } from './config';
 import { useUIStore } from './ui';
+import { useSearchStore } from './search';
 
 export const useStatusState = () => createSelectors(useStatusStore).use;
 export const useLoadingState = () => createSelectors(useLoadingStateStore).use;
@@ -14,3 +15,4 @@ export const useProfileState = () => createSelectors(useProfileStore).use;
 export const useInputsState = () => createSelectors(useInputsStore).use;
 export const useConfigState = () => createSelectors(useConfigStore).use;
 export const useUIState = () => createSelectors(useUIStore).use;
+export const useSearchState = () => createSelectors(useSearchStore).use;
diff --git a/src/test/__tests__/common/hooks/useComplesLookupSearchResults.test.ts b/src/test/__tests__/common/hooks/useComplesLookupSearchResults.test.ts
index 9e0e9f16..7134f156 100644
--- a/src/test/__tests__/common/hooks/useComplesLookupSearchResults.test.ts
+++ b/src/test/__tests__/common/hooks/useComplesLookupSearchResults.test.ts
@@ -1,11 +1,11 @@
-import { useRecoilValue } from 'recoil';
 import { renderHook } from '@testing-library/react';
+import { setInitialGlobalState } from '@src/test/__mocks__/store';
 import { useSearchContext } from '@common/hooks/useSearchContext';
 import { useComplexLookupSearchResults } from '@common/hooks/useComplexLookupSearchResults';
 import { ComplexLookupSearchResultsProps } from '@components/ComplexLookupField/ComplexLookupSearchResults';
 import { Row } from '@components/Table';
+import { useSearchStore } from '@src/store';
 
-jest.mock('recoil');
 jest.mock('@common/hooks/useSearchContext', () => ({
   useSearchContext: jest.fn(),
 }));
@@ -44,7 +44,13 @@ describe('useComplesLookupSearchResults', () => {
     (useSearchContext as jest.Mock).mockReturnValue({
       onAssignRecord: jest.fn(),
     });
-    (useRecoilValue as jest.Mock).mockReturnValueOnce(data).mockReturnValueOnce(sourceData);
+
+    setInitialGlobalState([
+      {
+        store: useSearchStore,
+        state: { data, sourceData },
+      },
+    ]);
   });
 
   it('returns "formattedData" and "listHeader"', () => {
diff --git a/src/test/__tests__/common/hooks/useLoadSearchResults.test.ts b/src/test/__tests__/common/hooks/useLoadSearchResults.test.ts
index e991d795..6a7905e9 100644
--- a/src/test/__tests__/common/hooks/useLoadSearchResults.test.ts
+++ b/src/test/__tests__/common/hooks/useLoadSearchResults.test.ts
@@ -1,20 +1,13 @@
 import { renderHook } from '@testing-library/react';
 import { useSearchParams } from 'react-router-dom';
-import { SetterOrUpdater, useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil';
 import { SearchQueryParams } from '@common/constants/routes.constants';
 import { useLoadSearchResults } from '@common/hooks/useLoadSearchResults';
-import { useLoadingStateStore } from '@src/store';
-import { setInitialGlobalState } from '@src/test/__mocks__/store';
+import { useLoadingStateStore, useSearchStore } from '@src/store';
+import { setInitialGlobalState, setUpdatedGlobalState } from '@src/test/__mocks__/store';
 
 jest.mock('react-router-dom', () => ({
   useSearchParams: jest.fn(),
 }));
-jest.mock('recoil', () => ({
-  useSetRecoilState: jest.fn(),
-  useRecoilState: jest.fn(),
-  useRecoilValue: jest.fn(),
-  useResetRecoilState: jest.fn(),
-}));
 jest.mock('@state', () => ({
   default: {
     search: {
@@ -38,6 +31,18 @@ describe('useLoadSearchResults', () => {
         store: useLoadingStateStore,
         state: { isLoading: false, setIsLoading },
       },
+      {
+        store: useSearchStore,
+        state: {
+          data: null,
+          searchBy: '',
+          query: '',
+          setQuery,
+          setData,
+          setSearchBy,
+          forceRefresh: false,
+        },
+      },
     ]);
   });
 
@@ -49,15 +54,12 @@ describe('useLoadSearchResults', () => {
 
     fetchData.mockResolvedValue([{ test: ['test value'] }]);
     (useSearchParams as jest.Mock).mockReturnValue([searchParams]);
-    (useSetRecoilState as jest.Mock)
-      .mockReturnValueOnce(setData)
-      .mockReturnValueOnce(setSearchBy)
-      .mockReturnValueOnce(setQuery);
-    (useRecoilState as jest.Mock).mockReturnValue([false, (value: boolean) => value] as [
-      boolean,
-      SetterOrUpdater<boolean>,
+    setUpdatedGlobalState([
+      {
+        store: useSearchStore,
+        updatedState: { forceRefresh: false, searchBy: 'title' },
+      },
     ]);
-    (useRecoilValue as jest.Mock).mockReturnValue('title');
 
     renderHook(() => useLoadSearchResults(fetchData));
 
@@ -70,14 +72,6 @@ describe('useLoadSearchResults', () => {
     const searchParams = new URLSearchParams({});
 
     (useSearchParams as jest.Mock).mockReturnValue([searchParams]);
-    (useSetRecoilState as jest.Mock)
-      .mockReturnValueOnce(setData)
-      .mockReturnValueOnce(setSearchBy)
-      .mockReturnValueOnce(setQuery);
-    (useRecoilState as jest.Mock).mockReturnValue([false, (value: boolean) => value] as [
-      boolean,
-      SetterOrUpdater<boolean>,
-    ]);
 
     renderHook(() => useLoadSearchResults(fetchData));
 
diff --git a/src/test/__tests__/common/hooks/useNavigateToEditPage.test.ts b/src/test/__tests__/common/hooks/useNavigateToEditPage.test.ts
index bfcf201f..53d860c4 100644
--- a/src/test/__tests__/common/hooks/useNavigateToEditPage.test.ts
+++ b/src/test/__tests__/common/hooks/useNavigateToEditPage.test.ts
@@ -1,30 +1,35 @@
 import { renderHook } from '@testing-library/react';
-import { useRecoilValue } from 'recoil';
 import { useNavigate } from 'react-router-dom';
 import { useNavigateToEditPage } from '@common/hooks/useNavigateToEditPage';
+import { setInitialGlobalState, setUpdatedGlobalState } from '@src/test/__mocks__/store';
+import { useSearchStore } from '@src/store';
 
-jest.mock('@state', () => ({
-  default: {
-    search: {
-      navigationState: {},
-    },
-  },
-}));
 jest.mock('react-router-dom', () => ({
   useNavigate: jest.fn(),
 }));
-jest.mock('recoil', () => ({
-  useRecoilValue: jest.fn(),
-}));
 
 describe('useNavigateToEditPage', () => {
+  beforeEach(() => {
+    setInitialGlobalState([
+      {
+        store: useSearchStore,
+        state: { navigationState: {} },
+      },
+    ]);
+  });
+
   it('navigates to Edit page with navigation state', () => {
     const uri = '/edit/123';
     const navigate = jest.fn();
     const navigationState = { some: 'state' };
+    setUpdatedGlobalState([
+      {
+        store: useSearchStore,
+        updatedState: { navigationState: navigationState as SearchParamsState },
+      },
+    ]);
 
     (useNavigate as jest.Mock).mockReturnValue(navigate);
-    (useRecoilValue as jest.Mock).mockReturnValue(navigationState);
 
     const { result } = renderHook(() => useNavigateToEditPage());
     const { navigateToEditPage } = result.current;
diff --git a/src/test/__tests__/common/hooks/usePagination.test.ts b/src/test/__tests__/common/hooks/usePagination.test.ts
index 81aee566..a613f30f 100644
--- a/src/test/__tests__/common/hooks/usePagination.test.ts
+++ b/src/test/__tests__/common/hooks/usePagination.test.ts
@@ -1,6 +1,7 @@
-import { useRecoilValue } from 'recoil';
 import { renderHook, act } from '@testing-library/react';
+import { setInitialGlobalState, setUpdatedGlobalState } from '@src/test/__mocks__/store';
 import { usePagination } from '@common/hooks/usePagination';
+import { useSearchStore } from '@src/store';
 
 const setSearchParams = jest.fn();
 
@@ -11,17 +12,19 @@ jest.mock('react-router-dom', () => ({
 jest.mock('recoil', () => ({
   useRecoilValue: jest.fn(),
 }));
-jest.mock('@state', () => ({
-  default: {
-    search: {
-      pageMetadata: { totalElements: 0, totalPages: 0 },
-    },
-  },
-}));
 
 describe('usePagination', () => {
   const hasSearchParams = true;
 
+  beforeEach(() => {
+    setInitialGlobalState([
+      {
+        store: useSearchStore,
+        state: { pageMetadata: { totalElements: 0, totalPages: 0 } },
+      },
+    ]);
+  });
+
   function testOnPageClick({
     functionName,
     hasSearchParams,
@@ -44,11 +47,18 @@ describe('usePagination', () => {
 
   describe('onPrevPageClick', () => {
     test('the current page should not be changed', () => {
-      (useRecoilValue as jest.Mock).mockReturnValue({
-        number: 0,
-        totalElements: 0,
-        totalPages: 1,
-      });
+      setUpdatedGlobalState([
+        {
+          store: useSearchStore,
+          updatedState: {
+            pageMetadata: {
+              number: 0,
+              totalElements: 0,
+              totalPages: 1,
+            },
+          },
+        },
+      ]);
       const defaultPageNumber = 0;
 
       testOnPageClick({
@@ -60,11 +70,18 @@ describe('usePagination', () => {
     });
 
     test('the current page should be changed', () => {
-      (useRecoilValue as jest.Mock).mockReturnValue({
-        number: 1,
-        totalElements: 10,
-        totalPages: 2,
-      });
+      setUpdatedGlobalState([
+        {
+          store: useSearchStore,
+          updatedState: {
+            pageMetadata: {
+              number: 1,
+              totalElements: 10,
+              totalPages: 2,
+            },
+          },
+        },
+      ]);
       const defaultPageNumber = 1;
 
       testOnPageClick({
@@ -78,11 +95,18 @@ describe('usePagination', () => {
 
   describe('onNextPageClick', () => {
     test('the current page should not be changed', () => {
-      (useRecoilValue as jest.Mock).mockReturnValue({
-        number: 1,
-        totalElements: 0,
-        totalPages: 2,
-      });
+      setUpdatedGlobalState([
+        {
+          store: useSearchStore,
+          updatedState: {
+            pageMetadata: {
+              number: 1,
+              totalElements: 0,
+              totalPages: 2,
+            },
+          },
+        },
+      ]);
       const defaultPageNumber = 1;
 
       testOnPageClick({
@@ -94,11 +118,18 @@ describe('usePagination', () => {
     });
 
     test('the current page should be changed', () => {
-      (useRecoilValue as jest.Mock).mockReturnValue({
-        number: 0,
-        totalElements: 10,
-        totalPages: 2,
-      });
+      setUpdatedGlobalState([
+        {
+          store: useSearchStore,
+          updatedState: {
+            pageMetadata: {
+              number: 0,
+              totalElements: 10,
+              totalPages: 2,
+            },
+          },
+        },
+      ]);
       const defaultPageNumber = 0;
 
       testOnPageClick({
diff --git a/src/test/__tests__/common/hooks/useSearch.test.ts b/src/test/__tests__/common/hooks/useSearch.test.ts
index d1dbd748..6b6deaa6 100644
--- a/src/test/__tests__/common/hooks/useSearch.test.ts
+++ b/src/test/__tests__/common/hooks/useSearch.test.ts
@@ -1,10 +1,9 @@
 import { renderHook } from '@testing-library/react';
 import { useSearchParams } from 'react-router-dom';
-import { useRecoilState, useSetRecoilState, useResetRecoilState } from 'recoil';
+import { setInitialGlobalState, setUpdatedGlobalState } from '@src/test/__mocks__/store';
 import { useSearch } from '@common/hooks/useSearch';
 import { useSearchContext } from '@common/hooks/useSearchContext';
-import { useInputsStore, useLoadingStateStore } from '@src/store';
-import { setInitialGlobalState } from '@src/test/__mocks__/store';
+import { useInputsStore, useLoadingStateStore, useSearchStore } from '@src/store';
 
 const selectedNavigationSegment = 'defaultSegment';
 const defaultSearchBy = 'defaultSearchBy';
@@ -31,28 +30,6 @@ jest.mock('@common/hooks/useFetchSearchData', () => ({
     fetchData,
   }),
 }));
-jest.mock('@state', () => ({
-  default: {
-    search: {
-      index: '',
-      query: '',
-      limiters: {},
-      message: '',
-      data: null,
-      pageMetadata: {},
-      facetsBySegments: {
-        defaultSegment: {
-          query: 'defaultQuery',
-          searchBy: 'defaultSearchBy',
-          facets: {},
-        },
-      },
-    },
-    inputs: {
-      userValues: {},
-    },
-  },
-}));
 
 describe('useSearch hook', () => {
   const setIsLoading = jest.fn();
@@ -65,7 +42,7 @@ describe('useSearch hook', () => {
   const setFacetsBySegments = jest.fn();
   const setForceRefreshSearch = jest.fn();
   const resetPreviewContent = jest.fn();
-  const clearFacetsBySegments = jest.fn();
+  const resetFacetsBySegments = jest.fn();
   const setSearchParams = jest.fn();
 
   const mockUseSearchContext = {
@@ -88,29 +65,36 @@ describe('useSearch hook', () => {
         store: useInputsStore,
         state: { previewContent: {}, resetPreviewContent },
       },
+      {
+        store: useSearchStore,
+        state: {
+          searchBy: '',
+          setSearchBy,
+          query: '',
+          setQuery,
+          facets: {},
+          setFacets,
+          message: '',
+          setMessage,
+          data: null,
+          setData,
+          pageMetadata: {},
+          setPageMetadata,
+          setForceRefresh: setForceRefreshSearch,
+          facetsBySegments: {
+            defaultSegment: {
+              query: 'defaultQuery',
+              searchBy: 'defaultSearchBy',
+              facets: {},
+            },
+          },
+          setFacetsBySegments,
+          resetFacetsBySegments,
+        },
+      },
     ]);
     (useSearchContext as jest.Mock).mockReturnValue(mockUseSearchContext);
     (useSearchParams as jest.Mock).mockReturnValue([null, setSearchParams]);
-
-    (useRecoilState as jest.Mock)
-      .mockReturnValueOnce(['', setSearchBy])
-      .mockReturnValueOnce(['', setQuery])
-      .mockReturnValueOnce([{}, setFacets])
-      .mockReturnValueOnce(['', setMessage])
-      .mockReturnValueOnce([null, setData])
-      .mockReturnValueOnce([{}, setPageMetadata])
-      .mockReturnValueOnce([
-        {
-          newSegment: {
-            query: 'newQuery',
-            searchBy: 'newSearchBy',
-            facets: {},
-          },
-        },
-        setFacetsBySegments,
-      ]);
-    (useSetRecoilState as jest.Mock).mockReturnValueOnce(setForceRefreshSearch);
-    (useResetRecoilState as jest.Mock).mockReturnValueOnce(clearFacetsBySegments);
   });
 
   test('initializes with default values and set up effects', () => {
@@ -173,6 +157,20 @@ describe('useSearch hook', () => {
 
   test('handles onChangeSegment and update states', async () => {
     const newSegment = 'newSegment' as SearchSegmentValue;
+    setUpdatedGlobalState([
+      {
+        store: useSearchStore,
+        updatedState: {
+          facetsBySegments: {
+            [newSegment]: {
+              query: 'newQuery',
+              searchBy: 'newSearchBy',
+              facets: {},
+            },
+          } as FacetsBySegments,
+        },
+      },
+    ]);
 
     const { result } = renderHook(useSearch);
 
@@ -192,6 +190,6 @@ describe('useSearch hook', () => {
 
     unmount();
 
-    expect(clearFacetsBySegments).toHaveBeenCalled();
+    expect(resetFacetsBySegments).toHaveBeenCalled();
   });
 });
diff --git a/src/test/__tests__/common/hooks/useSearchFilterLookupOptions.test.ts b/src/test/__tests__/common/hooks/useSearchFilterLookupOptions.test.ts
index 41275448..9ca89221 100644
--- a/src/test/__tests__/common/hooks/useSearchFilterLookupOptions.test.ts
+++ b/src/test/__tests__/common/hooks/useSearchFilterLookupOptions.test.ts
@@ -1,11 +1,11 @@
-import { useRecoilValue } from 'recoil';
 import { renderHook } from '@testing-library/react';
+import { setInitialGlobalState } from '@src/test/__mocks__/store';
 import { useSearchFilterLookupOptions } from '@common/hooks/useSearchFilterLookupOptions';
+import { useSearchStore } from '@src/store';
 
 jest.mock('recoil');
 
 describe('useSearchFilterLookupOptions', () => {
-  const mockUseRecoilValue = useRecoilValue as jest.Mock;
   const facet = 'testFacet';
 
   function testUseSearchFilterLookupOptions(
@@ -13,7 +13,12 @@ describe('useSearchFilterLookupOptions', () => {
     { sourceData, facetsData }: { sourceData: SourceDataDTO | null; facetsData: FacetsDTO },
     testResult: FilterLookupOption[],
   ) {
-    mockUseRecoilValue.mockReturnValueOnce(sourceData).mockReturnValueOnce(facetsData);
+    setInitialGlobalState([
+      {
+        store: useSearchStore,
+        state: { sourceData, facetsData },
+      },
+    ]);
 
     const { result } = renderHook(() => useSearchFilterLookupOptions(options));
 
diff --git a/src/test/__tests__/common/hooks/useSearchFilters.test.tsx b/src/test/__tests__/common/hooks/useSearchFilters.test.tsx
index 4e90be63..1cdb3c8f 100644
--- a/src/test/__tests__/common/hooks/useSearchFilters.test.tsx
+++ b/src/test/__tests__/common/hooks/useSearchFilters.test.tsx
@@ -1,8 +1,9 @@
 import { act, renderHook } from '@testing-library/react';
 import { RecoilRoot } from 'recoil';
-import { useSearchFilters } from '@common/hooks/useSearchFilters';
 import { ChangeEvent, ReactNode } from 'react';
-import state from '@state';
+import { useSearchFilters } from '@common/hooks/useSearchFilters';
+import { setInitialGlobalState } from '@src/test/__mocks__/store';
+import { useSearchStore } from '@src/store';
 
 describe('useSearchFilters', () => {
   const singlelimitersMock = {
@@ -12,13 +13,18 @@ describe('useSearchFilters', () => {
 
   const getWrapper =
     (initialLookupData: Limiters = {} as Limiters) =>
-    ({ children }: { children: ReactNode }) => (
-      <RecoilRoot initializeState={snapshot => snapshot.set(state.search.limiters, initialLookupData)}>
-        {children}
-      </RecoilRoot>
-    );
+    ({ children }: { children: ReactNode }) => {
+      setInitialGlobalState([
+        {
+          store: useSearchStore,
+          state: { facets: initialLookupData },
+        },
+      ]);
+
+      return <RecoilRoot>{children}</RecoilRoot>;
+    };
 
-  test('onChangeLimiters - should update single limiter', () => {
+  test('onChangeLimiters - should update single facets', () => {
     const testResult = {
       limiter_1: 'newValue',
       limiter_2: 'value_2',
@@ -33,10 +39,10 @@ describe('useSearchFilters', () => {
     const { result } = renderHook(useSearchFilters, { wrapper: getWrapper(singlelimitersMock) });
     act(() => result.current?.onChangeLimiters(eventMock));
 
-    expect(result.current.limiters).toEqual(testResult);
+    expect(result.current.facets).toEqual(testResult);
   });
 
-  test('onChangeLimitersMulti - should update multiple limiters', () => {
+  test('onChangeLimitersMulti - should update multiple facets', () => {
     const limitersMock = {
       limiter_1: 'value_1',
       limiter_2: ['value_2'],
@@ -56,10 +62,10 @@ describe('useSearchFilters', () => {
     const { result } = renderHook(useSearchFilters, { wrapper: getWrapper(limitersMock) });
     act(() => result.current.onChangeLimitersMulti(eventMock));
 
-    expect(result.current.limiters).toEqual(testResult);
+    expect(result.current.facets).toEqual(testResult);
   });
 
-  test('onChange - should not update limiters', () => {
+  test('onChange - should not update facets', () => {
     const eventMock = {
       target: {
         id: 'newValue',
@@ -70,13 +76,13 @@ describe('useSearchFilters', () => {
     const { result } = renderHook(useSearchFilters, { wrapper: getWrapper(singlelimitersMock) });
     act(() => result.current.onChange(eventMock));
 
-    expect(result.current.limiters).toEqual(singlelimitersMock);
+    expect(result.current.facets).toEqual(singlelimitersMock);
   });
 
   test('returns limiters and onChange functions', () => {
     const { result } = renderHook(useSearchFilters, { wrapper: getWrapper(singlelimitersMock) });
 
-    expect(result.current.limiters).toBe(singlelimitersMock);
+    expect(result.current.facets).toBe(singlelimitersMock);
     expect(result.current.onChangeLimiters).toBeInstanceOf(Function);
     expect(result.current.onChangeLimitersMulti).toBeInstanceOf(Function);
     expect(result.current.onChange).toBeInstanceOf(Function);
diff --git a/src/test/__tests__/common/hooks/useSearchFiltersData.test.ts b/src/test/__tests__/common/hooks/useSearchFiltersData.test.ts
index 6ed578a3..5b54cb6b 100644
--- a/src/test/__tests__/common/hooks/useSearchFiltersData.test.ts
+++ b/src/test/__tests__/common/hooks/useSearchFiltersData.test.ts
@@ -1,7 +1,8 @@
 import { act, renderHook } from '@testing-library/react';
-import { useRecoilState, useResetRecoilState, useSetRecoilState } from 'recoil';
+import { setInitialGlobalState, setUpdatedGlobalState } from '@src/test/__mocks__/store';
 import * as SearchApi from '@common/api/search.api';
 import { useSearchFiltersData } from '@common/hooks/useSearchFiltersData';
+import { useSearchStore, useStatusStore } from '@src/store';
 
 jest.mock('recoil');
 jest.mock('@common/api/search.api');
@@ -13,18 +14,25 @@ describe('useSearchFiltersData', () => {
   const resetSelectedFacetsGroups = jest.fn();
   const setFacetsData = jest.fn();
   const setSourceData = jest.fn();
-  const setCommonStatus = jest.fn();
+  const addStatusMessage = jest.fn();
 
   const DEFAULT_SEARCH_SOURCE_LIMIT = '50';
   const DEFAULT_SEARCH_FACETS_QUERY = 'id=*';
 
   beforeEach(() => {
-    (useRecoilState as jest.Mock).mockReturnValue([selectedFacetsGroupsState, setSelectedFacetsGroups]);
-    (useResetRecoilState as jest.Mock).mockReturnValue(resetSelectedFacetsGroups);
-    (useSetRecoilState as jest.Mock)
-      .mockReturnValueOnce(setFacetsData)
-      .mockReturnValueOnce(setSourceData)
-      .mockReturnValueOnce(setCommonStatus);
+    setInitialGlobalState([
+      {
+        store: useSearchStore,
+        state: {
+          selectedFacetsGroups: selectedFacetsGroupsState,
+          setSelectedFacetsGroups,
+          resetSelectedFacetsGroups,
+          setFacetsData,
+          setSourceData,
+        },
+      },
+      { store: useStatusStore, state: { addStatusMessage } },
+    ]);
   });
 
   test('resets selectedFacetsGroups on unmount', () => {
@@ -38,10 +46,6 @@ describe('useSearchFiltersData', () => {
   test('getSearchSourceData - fetches data and sets source data', async () => {
     const searchData = { data: 'sourceData' };
     (SearchApi.getSearchData as jest.Mock).mockResolvedValue(searchData);
-    (useSetRecoilState as jest.Mock)
-      .mockReturnValueOnce(setFacetsData)
-      .mockReturnValueOnce(setSourceData)
-      .mockReturnValueOnce(setCommonStatus);
 
     const { result } = renderHook(useSearchFiltersData);
 
@@ -71,8 +75,12 @@ describe('useSearchFiltersData', () => {
   });
 
   test('onToggleFilterGroupState - updates selectedFacetsGroups', () => {
-    const setSelectedFacetsGroups = jest.fn();
-    (useRecoilState as jest.Mock).mockReturnValue([['facet_1'], setSelectedFacetsGroups]);
+    setUpdatedGlobalState([
+      {
+        store: useSearchStore,
+        updatedState: { selectedFacetsGroups: ['facet_1'] },
+      },
+    ]);
 
     const { result } = renderHook(() => useSearchFiltersData());
 
diff --git a/src/test/__tests__/common/hooks/useSearchNavigationState.test.ts b/src/test/__tests__/common/hooks/useSearchNavigationState.test.ts
index 37a7af5d..64f2361e 100644
--- a/src/test/__tests__/common/hooks/useSearchNavigationState.test.ts
+++ b/src/test/__tests__/common/hooks/useSearchNavigationState.test.ts
@@ -1,36 +1,36 @@
 import { renderHook } from '@testing-library/react';
 import { useSearchParams } from 'react-router-dom';
-import { useSetRecoilState } from 'recoil';
 import { SearchQueryParams } from '@common/constants/routes.constants';
 import * as SearchHelper from '@common/helpers/search.helper';
 import { useSearchNavigationState } from '@common/hooks/useSearchNavigationState';
+import { setInitialGlobalState } from '@src/test/__mocks__/store';
+import { useSearchStore } from '@src/store';
 
-jest.mock('@state', () => ({
-  default: {
-    search: {
-      navigationState: {},
-    },
-  },
-}));
 jest.mock('react-router-dom', () => ({
   useSearchParams: jest.fn(),
 }));
-jest.mock('recoil', () => ({
-  useSetRecoilState: jest.fn(),
-}));
+
+const setNavigationState = jest.fn();
 
 describe('useSearchNavigationState', () => {
+  beforeEach(() => {
+    setInitialGlobalState([
+      {
+        store: useSearchStore,
+        state: { navigationState: {}, setNavigationState },
+      },
+    ]);
+  });
+
   it('sets navigation state based on search params', () => {
     const searchParams = new URLSearchParams({
       [SearchQueryParams.Query]: 'test query',
       [SearchQueryParams.SearchBy]: 'title',
       [SearchQueryParams.Offset]: '1',
     });
-    const setNavigationState = jest.fn();
     const generatedState = { some: 'state' };
 
     (useSearchParams as jest.Mock).mockReturnValue([searchParams]);
-    (useSetRecoilState as jest.Mock).mockReturnValue(setNavigationState);
     const spyGenerateSearchParamsState = jest
       .spyOn(SearchHelper, 'generateSearchParamsState')
       .mockReturnValue(generatedState as SearchParamsState);
diff --git a/src/test/__tests__/components/ItemSearch.test.tsx b/src/test/__tests__/components/ItemSearch.test.tsx
index 74f8dbb2..64664991 100644
--- a/src/test/__tests__/components/ItemSearch.test.tsx
+++ b/src/test/__tests__/components/ItemSearch.test.tsx
@@ -1,15 +1,15 @@
 import '@src/test/__mocks__/common/hooks/useRecordControls.mock';
-import '@src/test/__mocks__/common/hooks/usePagination.mock';
 import '@src/test/__mocks__/common/helpers/pageScrolling.helper.mock';
+import { getCurrentPageNumber } from '@src/test/__mocks__/common/hooks/usePagination.mock';
 import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 import { BrowserRouter, Route, Routes } from 'react-router-dom';
 import { RecoilRoot } from 'recoil';
-import { getCurrentPageNumber } from '@src/test/__mocks__/common/hooks/usePagination.mock';
 import { ItemSearch } from '@components/ItemSearch';
 import { CommonStatus } from '@components/CommonStatus';
 import * as searchApi from '@common/api/search.api';
 import { Edit } from '@views';
-import state from '@state';
+import { setInitialGlobalState } from '@src/test/__mocks__/store';
+import { useSearchStore } from '@src/store';
 
 let getByIdentifierMock: jest.SpyInstance<
   Promise<any>,
@@ -120,10 +120,15 @@ describe('Item Search', () => {
 
     window.history.pushState({}, '', '/');
 
+    setInitialGlobalState([
+      {
+        store: useSearchStore,
+        state: { pageMetadata: { totalElements: 2, totalPages: 1 } },
+      },
+    ]);
+
     render(
-      <RecoilRoot
-        initializeState={snapshot => snapshot.set(state.search.pageMetadata, { totalElements: 2, totalPages: 1 })}
-      >
+      <RecoilRoot>
         <BrowserRouter basename="/">
           <Routes>
             <Route path="/" element={<ItemSearch />} />
diff --git a/src/test/__tests__/components/SearchControls.test.tsx b/src/test/__tests__/components/SearchControls.test.tsx
index 4b05bf1e..1e30fc72 100644
--- a/src/test/__tests__/components/SearchControls.test.tsx
+++ b/src/test/__tests__/components/SearchControls.test.tsx
@@ -2,10 +2,11 @@ import { render, screen } from '@testing-library/react';
 import { RecoilRoot } from 'recoil';
 import { useSearchParams } from 'react-router-dom';
 import { getMockedImportedConstant } from '@src/test/__mocks__/common/constants/constants.mock';
+import { setInitialGlobalState } from '@src/test/__mocks__/store';
 import * as FeatureConstants from '@common/constants/feature.constants';
 import { SearchControls } from '@components/SearchControls';
 import { SearchContext } from '@src/contexts';
-import state from '@state';
+import { useSearchStore } from '@src/store';
 
 const setSearchParams = jest.fn();
 const mockSearchFiltersComponent = <div data-testid="search-filters" />;
@@ -57,8 +58,15 @@ describe('SearchControls', () => {
     function renderSearchControls(searchParams: URLSearchParams, queryState: string) {
       (useSearchParams as jest.Mock).mockReturnValue([searchParams, setSearchParams]);
 
+      setInitialGlobalState([
+        {
+          store: useSearchStore,
+          state: { query: queryState },
+        },
+      ]);
+
       render(
-        <RecoilRoot initializeState={snapshot => snapshot.set(state.search.query, queryState)}>
+        <RecoilRoot>
           <SearchControls submitSearch={jest.fn} clearValues={jest.fn} changeSegment={jest.fn} />
         </RecoilRoot>,
       );
diff --git a/src/test/__tests__/components/SearchResultList.test.tsx b/src/test/__tests__/components/SearchResultList.test.tsx
index b25398fe..b50a604c 100644
--- a/src/test/__tests__/components/SearchResultList.test.tsx
+++ b/src/test/__tests__/components/SearchResultList.test.tsx
@@ -1,26 +1,30 @@
 import { render, screen } from '@testing-library/react';
 import { BrowserRouter } from 'react-router-dom';
-import { SearchResultList } from '@components/SearchResultList';
 import { RecoilRoot } from 'recoil';
-import state from '@state';
+import { SearchResultList } from '@components/SearchResultList';
+import { setInitialGlobalState } from '@src/test/__mocks__/store';
+import { useSearchStore } from '@src/store';
 import { itemSearchMockData } from './ItemSearch.test';
 
 jest.mock('@common/constants/build.constants', () => ({ IS_EMBEDDED_MODE: false }));
 
 describe('SearchResultList', () => {
-  beforeEach(() =>
+  beforeEach(() => {
+    setInitialGlobalState([
+      {
+        store: useSearchStore,
+        state: { data: itemSearchMockData.content as unknown as WorkAsSearchResultDTO[] },
+      },
+    ]);
+
     render(
       <BrowserRouter>
-        <RecoilRoot
-          initializeState={snapshot =>
-            snapshot.set(state.search.data, itemSearchMockData.content as unknown as WorkAsSearchResultDTO[])
-          }
-        >
+        <RecoilRoot>
           <SearchResultList />
         </RecoilRoot>
       </BrowserRouter>,
-    ),
-  );
+    );
+  });
 
   const { getByText } = screen;