diff --git a/src/app/components/Staking/FinalityProviders/FinalityProviderSearch.tsx b/src/app/components/Staking/FinalityProviders/FinalityProviderSearch.tsx
index 9ee2e998..15c99b95 100644
--- a/src/app/components/Staking/FinalityProviders/FinalityProviderSearch.tsx
+++ b/src/app/components/Staking/FinalityProviders/FinalityProviderSearch.tsx
@@ -1,29 +1,27 @@
import { useDebounce } from "@uidotdev/usehooks";
+import { useSearchParams } from "next/navigation";
import React, { useEffect, useState } from "react";
import { FiSearch } from "react-icons/fi";
interface FinalityProviderSearchProps {
- initialSearchValue: string | null;
onSearch: (searchTerm: string) => void;
}
export const FinalityProviderSearch: React.FC = ({
- initialSearchValue,
onSearch,
}) => {
- const [searchTerm, setSearchTerm] = useState("");
- const debouncedSearchTerm = useDebounce(searchTerm, 300);
+ // Get the finality provider from the search params
+ const searchParams = useSearchParams();
+ const initialSearchFp = searchParams.get("fp");
- useEffect(() => {
- onSearch(debouncedSearchTerm);
- }, [debouncedSearchTerm, onSearch]);
+ const [searchTerm, setSearchTerm] = useState(initialSearchFp);
+ const debouncedSearchTerm = useDebounce(searchTerm, 300);
useEffect(() => {
- if (initialSearchValue) {
- setSearchTerm(initialSearchValue);
- onSearch(initialSearchValue);
+ if (debouncedSearchTerm) {
+ onSearch(debouncedSearchTerm);
}
- }, [initialSearchValue, onSearch]);
+ }, [debouncedSearchTerm, onSearch]);
const handleSearch = (e: React.ChangeEvent) => {
setSearchTerm(e.target.value);
@@ -38,7 +36,7 @@ export const FinalityProviderSearch: React.FC = ({
diff --git a/src/app/components/Staking/FinalityProviders/FinalityProviders.tsx b/src/app/components/Staking/FinalityProviders/FinalityProviders.tsx
index 53188d8d..aac6009a 100644
--- a/src/app/components/Staking/FinalityProviders/FinalityProviders.tsx
+++ b/src/app/components/Staking/FinalityProviders/FinalityProviders.tsx
@@ -19,7 +19,6 @@ import { FinalityProvider } from "./FinalityProvider";
import { FinalityProviderSearch } from "./FinalityProviderSearch";
export const FinalityProviders: React.FC = ({
- initialSearchValue,
selectedFinalityProvider,
onFinalityProviderChange,
onFinalityProvidersLoad,
@@ -107,10 +106,7 @@ export const FinalityProviders: React.FC = ({
Step-1: Select a finality provider
-
+
Finality Provider
diff --git a/src/app/components/Staking/Staking.tsx b/src/app/components/Staking/Staking.tsx
index 2754de8f..9ff1df24 100644
--- a/src/app/components/Staking/Staking.tsx
+++ b/src/app/components/Staking/Staking.tsx
@@ -2,7 +2,6 @@
import { useQuery, useQueryClient } from "@tanstack/react-query";
import { networks, Transaction } from "bitcoinjs-lib";
-import { useSearchParams } from "next/navigation";
import { Dispatch, SetStateAction, useEffect, useMemo, useState } from "react";
import { Tooltip } from "react-tooltip";
import { useLocalStorage } from "usehooks-ts";
@@ -85,10 +84,6 @@ export const Staking: React.FC
= ({
btcWalletBalanceSat,
availableUTXOs,
}) => {
- // Get the finality provider from the search params
- const searchParams = useSearchParams();
- const initialSearchFp = searchParams.get("fp");
-
// Staking form state
const [stakingAmountSat, setStakingAmountSat] = useState(0);
const [stakingTimeBlocks, setStakingTimeBlocks] = useState(0);
@@ -688,7 +683,6 @@ export const Staking: React.FC = ({
onFinalityProvidersLoad={setFinalityProviders}
selectedFinalityProvider={finalityProvider}
onFinalityProviderChange={handleChooseFinalityProvider}
- initialSearchValue={initialSearchFp}
/>
diff --git a/src/app/types/finalityProviders.ts b/src/app/types/finalityProviders.ts
index 87306fdc..c1bb1b3a 100644
--- a/src/app/types/finalityProviders.ts
+++ b/src/app/types/finalityProviders.ts
@@ -19,7 +19,6 @@ export interface Description {
}
export interface FinalityProvidersProps {
- initialSearchValue: string | null;
onFinalityProvidersLoad: Dispatch<
SetStateAction
>;