diff --git a/packages/web/components/earn/filters/filter-context.tsx b/packages/web/components/earn/filters/filter-context.tsx index 48d490e985..5fcdc351af 100644 --- a/packages/web/components/earn/filters/filter-context.tsx +++ b/packages/web/components/earn/filters/filter-context.tsx @@ -1,4 +1,11 @@ -import { createContext, PropsWithChildren, useCallback, useState } from "react"; +import { useRouter } from "next/router"; +import { + createContext, + PropsWithChildren, + useCallback, + useEffect, + useState, +} from "react"; import { ListOption, @@ -47,6 +54,14 @@ export const FilterProvider = ({ defaultFilters, }: PropsWithChildren<{ defaultFilters: Filters }>) => { const [filters, setFilters] = useState(defaultFilters); + const router = useRouter(); + const { search } = router.query; + + useEffect(() => { + if (typeof search === "string" && search !== "") { + setFilters((prev) => ({ ...prev, search })); + } + }, [search]); const setFilter = useCallback( (key, value) => { diff --git a/packages/web/pages/earn/index.tsx b/packages/web/pages/earn/index.tsx index ff7e8539eb..d023b3a0cf 100644 --- a/packages/web/pages/earn/index.tsx +++ b/packages/web/pages/earn/index.tsx @@ -38,6 +38,8 @@ function Earn() { const { earnPage, _isInitialized } = useFeatureFlags(); const { accountStore } = useStore(); const router = useRouter(); + const { search } = router.query; + /** * Control the selected table idx for external control * such as the {num} positions onClick on EarnPosition @@ -86,11 +88,11 @@ function Earn() { })) : [], lockDurationType: "all", - search: "", + search: typeof search === "string" ? search : "", specialTokens: [], rewardType: "all", }), - [holdenDenoms?.length, cmsData, isWalletConnected] + [holdenDenoms?.length, cmsData, isWalletConnected, search] ); useEffect(() => {