Refactoring single source of truth for dapp state

consts/chains.ts

@@ -21,13 +21,6 @@ export enum LIDO_MULTICHAIN_CHAINS {
   'Mode Chain' = 34443,
 }
 
-// TODO: move to legacy lido-js-sdk package
-export const SDK_LEGACY_SUPPORTED_CHAINS = [
-  CHAINS.Mainnet,
-  CHAINS.Holesky,
-  CHAINS.Sepolia,
-];
-
 // TODO: move to @lidofinance/lido-ethereum-sdk package
 export const isSDKSupportedL2Chain = (chainId?: CHAINS) => {
   return chainId && !!LIDO_L2_CONTRACT_ADDRESSES[chainId];

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

@@ -6,7 +6,7 @@ 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 { useDappStatus } from 'modules/web3';
 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 { isDappActive } = useDappStatus();
+  const { isWalletConnected } = useDappStatus();
   const { setIsWalletConnectionAllowed } = useUserConfig();
   const { forceDisconnect } = useForceDisconnect();
   const [areConditionsAccepted, setConditionsAccepted] = useState(false);
@@ -80,14 +80,17 @@ export const useVersionCheck = () => {
     if (isVersionUnsafe) {
       setIsWalletConnectionAllowed(false);
     }
-    if (isVersionUnsafe || (config.ipfsMode && isNotVerifiable)) {
+    if (
+      isVersionUnsafe ||
+      (config.ipfsMode && isNotVerifiable && isWalletConnected)
+    ) {
       forceDisconnect();
     }
   }, [
-    isDappActive,
     forceDisconnect,
     isNotVerifiable,
     isVersionUnsafe,
+    isWalletConnected,
     setIsWalletConnectionAllowed,
   ]);
 

features/rewards/components/rewardsListContent/RewardsListContent.tsx

@@ -5,8 +5,7 @@ import { Zero } from '@ethersproject/constants';
 import { useRewardsHistory } from 'features/rewards/hooks';
 import { ErrorBlockNoSteth } from 'features/rewards/components/errorBlocks/ErrorBlockNoSteth';
 import { RewardsTable } from 'features/rewards/components/rewardsTable';
-import { useStethBalance } from 'shared/hooks/use-balance';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useStethBalance, useDappStatus } from 'modules/web3';
 
 import { RewardsListsEmpty } from './RewardsListsEmpty';
 import { RewardsListErrorMessage } from './RewardsListErrorMessage';
@@ -20,8 +19,7 @@ import {
 import type { Address } from 'viem';
 
 export const RewardsListContent: FC = () => {
-  const { isWalletConnected, isSupportedChain, isAccountActiveOnL2 } =
-    useDappStatus();
+  const { isSupportedChain } = useDappStatus();
   const {
     address,
     error,
@@ -39,8 +37,7 @@ export const RewardsListContent: FC = () => {
     });
   const hasSteth = stethBalance?.gt(Zero);
 
-  if ((isWalletConnected && !isSupportedChain) || isAccountActiveOnL2)
-    return <RewardsListsUnsupportedChain />;
+  if (!isSupportedChain) return <RewardsListsUnsupportedChain />;
 
   if (!data && !initialLoading && !error) return <RewardsListsEmpty />;
 

features/rewards/components/rewardsListContent/RewardsListsEmpty.tsx

@@ -5,7 +5,7 @@ import { Button, Divider } from '@lidofinance/lido-ui';
 
 import { useUserConfig } from 'config/user-config';
 import { MATOMO_CLICK_EVENTS } from 'consts/matomo-click-events';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 import {
   RewardsListEmptyButtonWrapper,
   RewardsListEmptyWrapper,

features/rewards/components/rewardsListHeader/RewardsListHeader.tsx

@@ -1,15 +1,14 @@
 import { FC } from 'react';
 import { useRewardsHistory } from 'features/rewards/hooks';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 
 import { LeftOptions } from './LeftOptions';
 import { RightOptions } from './RightOptions';
 import { RewardsListHeaderStyle } from './styles';
 import { TitleStyle } from './styles';
 
 export const RewardsListHeader: FC = () => {
-  const { isWalletConnected, isSupportedChain, isAccountActiveOnL2 } =
-    useDappStatus();
+  const { isSupportedChain, isDappActiveOnL2 } = useDappStatus();
   const { error, data } = useRewardsHistory();
 
   return (
@@ -18,9 +17,7 @@ export const RewardsListHeader: FC = () => {
       {!error &&
         data &&
         data?.events.length > 0 &&
-        (!isWalletConnected ||
-          (isWalletConnected && isSupportedChain) ||
-          !isAccountActiveOnL2) && (
+        (isSupportedChain || !isDappActiveOnL2) && (
           <>
             <LeftOptions />
             <RightOptions />

features/rewards/features/top-card/top-card.tsx

@@ -4,16 +4,15 @@ import { CHAINS } from '@lido-sdk/constants';
 import { getConfig } from 'config';
 import { StatsWrapper } from 'features/rewards/components/statsWrapper';
 import { Stats } from 'features/rewards/components/stats';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 import { Fallback } from 'shared/wallet';
 
 import { Wallet } from './wallet';
 
 export const TopCard: FC = () => {
   const { defaultChain } = getConfig();
   const [visible, setVisible] = useState(false);
-  const { isWalletConnected, isSupportedChain, isAccountActiveOnL2 } =
-    useDappStatus();
+  const { isSupportedChain } = useDappStatus();
 
   // fix flash after reload page
   useEffect(() => {
@@ -24,7 +23,7 @@ export const TopCard: FC = () => {
 
   return (
     <>
-      {(isWalletConnected && !isSupportedChain) || isAccountActiveOnL2 ? (
+      {!isSupportedChain ? (
         <Fallback
           error={`Unsupported chain. Please switch to ${CHAINS[defaultChain]} in your wallet.`}
         />

features/rewards/hooks/useGetCurrentAddress.ts

@@ -6,7 +6,7 @@ import { useSDK } from '@lido-sdk/react';
 
 import { resolveEns, isValidEns, isValidAddress } from 'features/rewards/utils';
 import { useCurrentStaticRpcProvider } from 'shared/hooks/use-current-static-rpc-provider';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 
 type UseGetCurrentAddress = () => {
   address: string;

features/settings/settings-form/settings-form.tsx

@@ -1,7 +1,6 @@
 import { useCallback } from 'react';
 import { useForm } from 'react-hook-form';
 
-import { useSDK } from '@lido-sdk/react';
 import { Button, ToastSuccess, Block, Input } from '@lidofinance/lido-ui';
 
 import { useUserConfig } from 'config/user-config';
@@ -15,14 +14,15 @@ import {
   DescriptionTitle,
   SettingsFormWrap,
 } from './styles';
+import { useDappStatus } from 'modules/web3';
 
 type FormValues = {
   rpcUrl: string;
 };
 
 export const SettingsForm = () => {
   const { savedUserConfig, setSavedUserConfig } = useUserConfig();
-  const { chainId } = useSDK();
+  const { chainId } = useDappStatus();
 
   const formMethods = useForm<FormValues>({
     mode: 'onChange',

features/stake/stake-form/controls/stake-amount-input.tsx

@@ -1,20 +1,18 @@
 import { Eth } from '@lidofinance/lido-ui';
 import { TokenAmountInputHookForm } from 'shared/hook-form/controls/token-amount-input-hook-form';
 import { useStakeFormData } from '../stake-form-context';
-import { useStakingLimitWarning } from 'shared/hooks/use-staking-limit-warning';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useStakingLimitWarning, useDappStatus } from 'modules/web3';
 
 export const StakeAmountInput = () => {
-  const { isWalletConnected, isDappActive, isAccountActiveOnL2 } =
-    useDappStatus();
+  const { isWalletConnected, isDappActive, isDappActiveOnL2 } = useDappStatus();
   const { maxAmount, stakingLimitInfo } = useStakeFormData();
   const { limitWarning, limitError } = useStakingLimitWarning(
     stakingLimitInfo?.stakeLimitLevel,
   );
 
   return (
     <TokenAmountInputHookForm
-      disabled={(isWalletConnected && !isDappActive) || isAccountActiveOnL2}
+      disabled={(isWalletConnected && !isDappActive) || isDappActiveOnL2}
       fieldName="amount"
       token={'ETH'}
       data-testid="stakeInput"

features/stake/stake-form/controls/stake-submit-button.tsx

@@ -1,18 +1,18 @@
 import { LIMIT_LEVEL } from 'types';
 import { SubmitButtonHookForm } from 'shared/hook-form/controls/submit-button-hook-form';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 
 import { useStakeFormData } from '../stake-form-context';
 
 export const StakeSubmitButton = () => {
-  const { isDappActive, isAccountActiveOnL2 } = useDappStatus();
+  const { isDappActive, isDappActiveOnL2 } = useDappStatus();
   const { stakingLimitInfo } = useStakeFormData();
 
   return (
     <SubmitButtonHookForm
       disabled={
         !isDappActive ||
-        isAccountActiveOnL2 ||
+        isDappActiveOnL2 ||
         stakingLimitInfo?.stakeLimitLevel === LIMIT_LEVEL.REACHED
       }
       data-testid="stakeSubmitBtn"

features/stake/stake-form/stake-form-context/stake-form-context.tsx

@@ -19,8 +19,7 @@ import {
 } from 'shared/hook-form/form-controller';
 import { useTokenMaxAmount } from 'shared/hooks/use-token-max-amount';
 import { useStakingLimitInfo } from 'shared/hooks/useStakingLimitInfo';
-import { useMaxGasPrice } from 'shared/hooks';
-import { useIsMultisig } from 'shared/hooks/useIsMultisig';
+import { useIsMultisig, useMaxGasPrice } from 'modules/web3';
 import { useFormControllerRetry } from 'shared/hook-form/form-controller/use-form-controller-retry-delegate';
 
 import { config } from 'config';
@@ -37,7 +36,7 @@ import {
 
 import { useStake } from '../use-stake';
 import { useStethSubmitGasLimit } from '../hooks';
-import { useEthereumBalance, useStethBalance } from 'shared/hooks/use-balance';
+import { useEthereumBalance, useStethBalance } from 'modules/web3';
 
 //
 // Data context

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

@@ -3,7 +3,7 @@ import invariant from 'tiny-invariant';
 import { Zero } from '@ethersproject/constants';
 
 import { validateEtherAmount } from 'shared/hook-form/validation/validate-ether-amount';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 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';

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

@@ -1,7 +1,6 @@
 import { BigNumber } from 'ethers';
 import { useCallback } from 'react';
 import invariant from 'tiny-invariant';
-import { useAccount } from 'wagmi';
 
 import {
   useSDK,
@@ -17,8 +16,7 @@ import { runWithTransactionLogger } from 'utils';
 import { MockLimitReachedError, getAddress } from './utils';
 import { useTxModalStagesStake } from './hooks/use-tx-modal-stages-stake';
 
-import { sendTx } from 'utils/send-tx';
-import { useTxConfirmation } from 'shared/hooks/use-tx-conformation';
+import { sendTx, useTxConfirmation, useDappStatus } from 'modules/web3';
 
 type StakeArguments = {
   amount: BigNumber | null;
@@ -32,7 +30,7 @@ type StakeOptions = {
 
 export const useStake = ({ onConfirm, onRetry }: StakeOptions) => {
   const stethContractWeb3 = useSTETHContractWeb3();
-  const { address } = useAccount();
+  const { address } = useDappStatus();
   const stethContract = useSTETHContractRPC();
   const { staticRpcProvider } = useCurrentStaticRpcProvider();
   const { providerWeb3 } = useSDK();

features/stake/stake-form/wallet/wallet.tsx

@@ -1,6 +1,4 @@
 import { memo } from 'react';
-import { useAccount } from 'wagmi';
-
 import { CHAINS, TOKENS } from '@lido-sdk/constants';
 import { Divider, Question, Tooltip } from '@lidofinance/lido-ui';
 
@@ -10,9 +8,8 @@ import { LIDO_APR_TOOLTIP_TEXT, DATA_UNAVAILABLE } from 'consts/text';
 import { TokenToWallet } from 'shared/components';
 import { FormatToken } from 'shared/formatters';
 import { useLidoApr } from 'shared/hooks';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 import { useTokenAddress } from 'shared/hooks/use-token-address';
-import { useLidoMultichainFallbackCondition } from 'shared/hooks/use-lido-multichain-fallback-condition';
 import {
   CardAccount,
   CardBalance,
@@ -28,7 +25,7 @@ import { LimitMeter } from './limit-meter';
 import { FlexCenter, LidoAprStyled, StyledCard } from './styles';
 
 const WalletComponent: WalletComponentType = (props) => {
-  const { address } = useAccount();
+  const { address } = useDappStatus();
   const { stakeableEther, stethBalance, loading } = useStakeFormData();
 
   const stethAddress = useTokenAddress(TOKENS.STETH);
@@ -101,20 +98,13 @@ const WalletComponent: WalletComponentType = (props) => {
 
 export const Wallet: WalletComponentType = memo((props) => {
   const { defaultChain } = getConfig();
-  const { isWalletConnected, isDappActive, isAccountActiveOnL2 } =
+  const { isWalletConnected, isDappActive, isLidoMultichainChain } =
     useDappStatus();
-  const { showLidoMultichainFallback } = useLidoMultichainFallbackCondition();
 
-  if (showLidoMultichainFallback) {
+  if (isLidoMultichainChain) {
     return <LidoMultichainFallback textEnding={'to stake'} {...props} />;
   }
 
-  if (isAccountActiveOnL2) {
-    return (
-      <LidoMultichainFallback chainId={10} textEnding={'to stake'} {...props} />
-    );
-  }
-
   if (isWalletConnected && !isDappActive) {
     return (
       <Fallback

features/stake/stake.tsx

@@ -1,5 +1,5 @@
 import { FaqPlaceholder } from 'features/ipfs';
-import { useWagmiKey } from 'shared/hooks/use-wagmi-key';
+import { SupportOnlyL1Chains, useWagmiKey } from 'modules/web3';
 import NoSSRWrapper from 'shared/components/no-ssr-wrapper';
 import { OnlyInfraRender } from 'shared/components/only-infra-render';
 
@@ -11,14 +11,14 @@ export const Stake = () => {
   const key = useWagmiKey();
 
   return (
-    <>
+    <SupportOnlyL1Chains>
       <NoSSRWrapper>
         <StakeForm key={key} />
       </NoSSRWrapper>
       <LidoStats />
       <OnlyInfraRender renderIPFS={<FaqPlaceholder />}>
         <StakeFaq />
       </OnlyInfraRender>
-    </>
+    </SupportOnlyL1Chains>
   );
 };

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

@@ -16,7 +16,7 @@ import {
   FormControllerContext,
   FormControllerContextValueType,
 } from 'shared/hook-form/form-controller';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 
 import { ClaimFormInputType, ClaimFormValidationContext } from './types';
 import { claimFormValidationResolver } from './validation';

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

@@ -1,6 +1,5 @@
 import { forwardRef } from 'react';
 import { useFormState, useWatch } from 'react-hook-form';
-import { useAccount } from 'wagmi';
 
 import {
   Checkbox,
@@ -15,6 +14,7 @@ import { useClaimFormData, ClaimFormInputType } from '../../claim-form-context';
 
 import { getNFTUrl } from 'utils';
 import { RequestStyled, LinkStyled } from './styles';
+import { useSDK } from '@lido-sdk/react';
 
 type RequestItemProps = {
   token_id: string;
@@ -24,7 +24,7 @@ type RequestItemProps = {
 
 export const RequestItem = forwardRef<HTMLInputElement, RequestItemProps>(
   ({ token_id, name, disabled, index, ...props }, ref) => {
-    const { chainId } = useAccount();
+    const { chainId } = useSDK();
     const { isSubmitting } = useFormState();
     const { canSelectMore, maxSelectedCountReason } = useClaimFormData();
     const { checked, status } = useWatch<

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

@@ -1,5 +1,5 @@
 import { useFieldArray, useFormContext, useFormState } from 'react-hook-form';
-import { useDappStatus } from 'shared/hooks/use-dapp-status';
+import { useDappStatus } from 'modules/web3';
 
 import { ClaimFormInputType } from '../../claim-form-context';
 import { RequestItem } from './request-item';