refactor: remove using useWeb3

features/ipfs/security-status-banner/use-version-check.ts

@@ -1,12 +1,12 @@
 import { useEffect, useState } from 'react';
-import { useLidoSWR } from '@lido-sdk/react';
-import { useWeb3 } from 'reef-knot/web3-react';
 import { useForceDisconnect } from 'reef-knot/core-react';
+import { useLidoSWR } from '@lido-sdk/react';
 
 import buildInfo from 'build-info.json';
 import { config } from 'config';
 import { useUserConfig } from 'config/user-config';
 import { STRATEGY_IMMUTABLE } from 'consts/swr-strategies';
+import { useDappStatus } from 'shared/hooks/use-dapp-status';
 import { overrideWithQAMockBoolean } from 'utils/qa';
 
 import { isVersionLess } from './utils';
@@ -19,7 +19,7 @@ const URL_CID_REGEX =
   /[/.](?<cid>Qm[1-9A-HJ-NP-Za-km-z]{44,}|b[A-Za-z2-7]{58,}|B[A-Z2-7]{58,}|z[1-9A-HJ-NP-Za-km-z]{48,}|F[0-9A-F]{50,})([./#?]|$)/;
 
 export const useVersionCheck = () => {
-  const { active } = useWeb3();
+  const { isDappActive } = useDappStatus();
   const { setIsWalletConnectionAllowed } = useUserConfig();
   const { forceDisconnect } = useForceDisconnect();
   const [areConditionsAccepted, setConditionsAccepted] = useState(false);
@@ -84,7 +84,7 @@ export const useVersionCheck = () => {
       forceDisconnect();
     }
   }, [
-    active,
+    isDappActive,
     forceDisconnect,
     isNotVerifiable,
     isVersionUnsafe,

features/stake/stake-form/stake-form-context/validation.ts

@@ -1,9 +1,9 @@
 import { useMemo } from 'react';
 import invariant from 'tiny-invariant';
-import { useWeb3 } from 'reef-knot/web3-react';
 import { Zero } from '@ethersproject/constants';
 
 import { validateEtherAmount } from 'shared/hook-form/validation/validate-ether-amount';
+import { useDappStatus } from 'shared/hooks/use-dapp-status';
 import { VALIDATION_CONTEXT_TIMEOUT } from 'features/withdrawals/withdrawals-constants';
 import { handleResolverValidationError } from 'shared/hook-form/validation/validation-error';
 import { awaitWithTimeout } from 'utils/await-with-timeout';
@@ -72,26 +72,26 @@ export const stakeFormValidationResolver: Resolver<
 export const useStakeFormValidationContext = (
   networkData: StakeFormNetworkData,
 ): Promise<StakeFormValidationContext> => {
-  const { active } = useWeb3();
+  const { isDappActive } = useDappStatus();
   const { stakingLimitInfo, etherBalance, isMultisig, gasCost } = networkData;
   const validationContextAwaited = useMemo(() => {
     if (
       stakingLimitInfo &&
       // we ether not connected or must have all account related data
-      (!active || (etherBalance && gasCost && isMultisig !== undefined))
+      (!isDappActive || (etherBalance && gasCost && isMultisig !== undefined))
     ) {
       return {
-        isWalletActive: active,
+        isWalletActive: isDappActive,
         stakingLimitLevel: stakingLimitInfo.stakeLimitLevel,
         currentStakeLimit: stakingLimitInfo.currentStakeLimit,
-        // condition above guaranties stubs will only be passed when active = false
+        // condition above guaranties stubs will only be passed when isDappActive = false
         etherBalance: etherBalance ?? Zero,
         gasCost: gasCost ?? Zero,
         isMultisig: isMultisig ?? false,
       };
     }
     return undefined;
-  }, [active, etherBalance, gasCost, isMultisig, stakingLimitInfo]);
+  }, [isDappActive, etherBalance, gasCost, isMultisig, stakingLimitInfo]);
 
   return useAwaiter(validationContextAwaited).awaiter;
 };

features/stake/stake-form/use-stake.ts

@@ -1,7 +1,7 @@
 import { BigNumber } from 'ethers';
 import { useCallback } from 'react';
-import { useWeb3 } from 'reef-knot/web3-react';
 import invariant from 'tiny-invariant';
+import { useAccount } from 'wagmi';
 
 import { useSDK, useSTETHContractWeb3 } from '@lido-sdk/react';
 
@@ -31,7 +31,7 @@ type StakeOptions = {
 
 export const useStake = ({ onConfirm, onRetry }: StakeOptions) => {
   const stethContractWeb3 = useSTETHContractWeb3();
-  const { account, chainId } = useWeb3();
+  const { address, chainId } = useAccount();
   const { staticRpcProvider } = useCurrentStaticRpcProvider();
   const { providerWeb3, providerRpc } = useSDK();
   const { txModalStages } = useTxModalStagesStake();
@@ -44,7 +44,7 @@ export const useStake = ({ onConfirm, onRetry }: StakeOptions) => {
       try {
         invariant(amount, 'amount is null');
         invariant(chainId, 'chainId is not defined');
-        invariant(account, 'account is not defined');
+        invariant(address, 'account is not defined');
         invariant(providerWeb3, 'providerWeb3 not defined');
         invariant(stethContractWeb3, 'steth is not defined');
 
@@ -58,7 +58,7 @@ export const useStake = ({ onConfirm, onRetry }: StakeOptions) => {
         txModalStages.sign(amount);
 
         const [isMultisig, referralAddress] = await Promise.all([
-          isContract(account, providerRpc),
+          isContract(address, providerRpc),
           referral
             ? getAddress(referral, providerRpc)
             : config.STAKE_FALLBACK_REFERRAL_ADDRESS,
@@ -108,7 +108,7 @@ export const useStake = ({ onConfirm, onRetry }: StakeOptions) => {
           );
         }
 
-        const stethBalance = await stethContractWeb3.balanceOf(account);
+        const stethBalance = await stethContractWeb3.balanceOf(address);
 
         await onConfirm?.();
 
@@ -123,7 +123,7 @@ export const useStake = ({ onConfirm, onRetry }: StakeOptions) => {
     },
     [
       chainId,
-      account,
+      address,
       providerWeb3,
       stethContractWeb3,
       txModalStages,

features/stake/stake.tsx

@@ -1,5 +1,5 @@
 import { FaqPlaceholder } from 'features/ipfs';
-import { useWeb3Key } from 'shared/hooks/useWeb3Key';
+import { useWagmiKey } from 'shared/hooks/use-wagmi-key';
 import NoSSRWrapper from 'shared/components/no-ssr-wrapper';
 import { OnlyInfraRender } from 'shared/components/only-infra-render';
 
@@ -8,7 +8,7 @@ import { LidoStats } from './lido-stats/lido-stats';
 import { StakeForm } from './stake-form';
 
 export const Stake = () => {
-  const key = useWeb3Key();
+  const key = useWagmiKey();
   return (
     <>
       <NoSSRWrapper>

features/withdrawals/claim/claim-form-context/claim-form-context.tsx

@@ -7,24 +7,25 @@ import {
   useMemo,
 } from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
-
 import invariant from 'tiny-invariant';
+
+import { useClaim } from 'features/withdrawals/hooks';
+import { useClaimData } from 'features/withdrawals/contexts/claim-data-context';
+import { useFormControllerRetry } from 'shared/hook-form/form-controller/use-form-controller-retry-delegate';
+import {
+  FormControllerContext,
+  FormControllerContextValueType,
+} from 'shared/hook-form/form-controller';
+import { useDappStatus } from 'shared/hooks/use-dapp-status';
+
 import { ClaimFormInputType, ClaimFormValidationContext } from './types';
 import { claimFormValidationResolver } from './validation';
-import { useClaim } from 'features/withdrawals/hooks';
 import { useMaxSelectedCount } from './use-max-selected-count';
-import { useFormControllerRetry } from 'shared/hook-form/form-controller/use-form-controller-retry-delegate';
 import {
   generateDefaultValues,
   useGetDefaultValues,
 } from './use-default-values';
 import { ClaimFormHelperState, useHelperState } from './use-helper-state';
-import {
-  FormControllerContext,
-  FormControllerContextValueType,
-} from 'shared/hook-form/form-controller';
-import { useClaimData } from 'features/withdrawals/contexts/claim-data-context';
-import { useWeb3 } from 'reef-knot/web3-react';
 
 type ClaimFormDataContextValueType = ClaimFormHelperState;
 
@@ -39,7 +40,7 @@ export const useClaimFormData = () => {
 };
 
 export const ClaimFormProvider: FC<PropsWithChildren> = ({ children }) => {
-  const { active } = useWeb3();
+  const { isDappActive } = useDappStatus();
   const { data } = useClaimData();
 
   const { maxSelectedRequestCount, defaultSelectedRequestCount } =
@@ -49,7 +50,7 @@ export const ClaimFormProvider: FC<PropsWithChildren> = ({ children }) => {
   const formObject = useForm<ClaimFormInputType, ClaimFormValidationContext>({
     defaultValues: getDefaultValues,
     resolver: claimFormValidationResolver,
-    context: { maxSelectedRequestCount, isWalletActive: active },
+    context: { maxSelectedRequestCount, isWalletActive: isDappActive },
     mode: 'onChange',
     reValidateMode: 'onChange',
   });

features/withdrawals/claim/form/requests-list/request-item.tsx

@@ -1,6 +1,6 @@
 import { forwardRef } from 'react';
-import { useWeb3 } from 'reef-knot/web3-react';
 import { useFormState, useWatch } from 'react-hook-form';
+import { useAccount } from 'wagmi';
 
 import { Checkbox, CheckboxProps, External } from '@lidofinance/lido-ui';
 import { FormatToken } from 'shared/formatters';
@@ -19,7 +19,7 @@ type RequestItemProps = {
 
 export const RequestItem = forwardRef<HTMLInputElement, RequestItemProps>(
   ({ token_id, name, disabled, index, ...props }, ref) => {
-    const { chainId } = useWeb3();
+    const { chainId } = useAccount();
     const { isSubmitting } = useFormState();
     const { canSelectMore } = useClaimFormData();
     const { checked, status } = useWatch<

features/withdrawals/claim/form/requests-list/requests-list.tsx

@@ -1,11 +1,11 @@
+import { useFieldArray, useFormContext, useFormState } from 'react-hook-form';
 import { useDappStatus } from 'shared/hooks/use-dapp-status';
 
+import { ClaimFormInputType } from '../../claim-form-context';
 import { RequestItem } from './request-item';
 import { RequestsEmpty } from './requests-empty';
 import { Wrapper } from './styles';
 import { RequestsLoader } from './requests-loader';
-import { useFieldArray, useFormContext, useFormState } from 'react-hook-form';
-import { ClaimFormInputType } from '../../claim-form-context';
 
 export const RequestsList: React.FC = () => {
   const { isWalletConnected, isDappActive } = useDappStatus();

features/withdrawals/hooks/contract/useClaim.ts

@@ -1,23 +1,24 @@
 import { useCallback } from 'react';
 import { BigNumber } from 'ethers';
+import invariant from 'tiny-invariant';
+import { useAccount } from 'wagmi';
+
+import { useSDK } from '@lido-sdk/react';
 
 import { useClaimData } from 'features/withdrawals/contexts/claim-data-context';
+import { RequestStatusClaimable } from 'features/withdrawals/types/request-status';
+import { useTxModalStagesClaim } from 'features/withdrawals/claim/transaction-modal-claim/use-tx-modal-stages-claim';
 import { runWithTransactionLogger } from 'utils';
+import { isContract } from 'utils/isContract';
 
 import { useWithdrawalsContract } from './useWithdrawalsContract';
-import { RequestStatusClaimable } from 'features/withdrawals/types/request-status';
-import invariant from 'tiny-invariant';
-import { isContract } from 'utils/isContract';
-import { useWeb3 } from 'reef-knot/web3-react';
-import { useSDK } from '@lido-sdk/react';
-import { useTxModalStagesClaim } from 'features/withdrawals/claim/transaction-modal-claim/use-tx-modal-stages-claim';
 
 type Args = {
   onRetry?: () => void;
 };
 
 export const useClaim = ({ onRetry }: Args) => {
-  const { account } = useWeb3();
+  const { address } = useAccount();
   const { providerWeb3 } = useSDK();
   const { contractWeb3 } = useWithdrawalsContract();
   const { optimisticClaimRequests } = useClaimData();
@@ -28,10 +29,10 @@ export const useClaim = ({ onRetry }: Args) => {
       try {
         invariant(contractWeb3, 'must have contract');
         invariant(sortedRequests, 'must have requests');
-        invariant(account, 'must have address');
+        invariant(address, 'must have address');
         invariant(providerWeb3, 'must have provider');
 
-        const isMultisig = await isContract(account, contractWeb3.provider);
+        const isMultisig = await isContract(address, contractWeb3.provider);
 
         const amount = sortedRequests.reduce(
           (s, r) => s.add(r.claimableEth),
@@ -98,7 +99,7 @@ export const useClaim = ({ onRetry }: Args) => {
     },
     [
       contractWeb3,
-      account,
+      address,
       providerWeb3,
       optimisticClaimRequests,
       txModalStages,