Merge pull request #380 from lidofinance/develop

Develop to main

features/rewards/components/addressInput/AddressInput.tsx

@@ -6,7 +6,13 @@ import { isValidAnyAddress } from 'features/rewards/utils';
 import { AddressInputProps } from './types';
 
 export const AddressInput: FC<AddressInputProps> = (props) => {
-  const { inputValue, isAddressResolving, handleInputChange, address } = props;
+  const {
+    inputValue,
+    isAddressResolving,
+    handleInputChange,
+    address,
+    addressError,
+  } = props;
 
   return (
     <Input
@@ -23,7 +29,10 @@ export const AddressInput: FC<AddressInputProps> = (props) => {
       }
       rightDecorator={address ? <CopyAddressUrl address={inputValue} /> : null}
       spellCheck="false"
-      error={inputValue.length > 0 && !isValidAnyAddress(inputValue)}
+      error={
+        (inputValue.length > 0 && !isValidAnyAddress(inputValue)) ||
+        addressError
+      }
     />
   );
 };

features/rewards/components/addressInput/types.ts

@@ -3,4 +3,5 @@ export type AddressInputProps = {
   isAddressResolving: boolean;
   handleInputChange: (value: string) => void;
   address: string;
+  addressError: string;
 };

features/rewards/components/errorBlocks/ErrorUnprocessable.tsx

@@ -0,0 +1,22 @@
+import Link from 'next/link';
+import { ErrorBlockBase } from './ErrorBlockBase';
+
+export const ErrorUnprocessable = () => (
+  <ErrorBlockBase
+    textProps={{ color: 'error' }}
+    text={
+      <>
+        This address has reached limit for parsed stETH transfers. Fetch rewards
+        directly from Lido Subgraph using{' '}
+        <Link
+          href={
+            'https://lidofinance.github.io/lido-ethereum-sdk/methods/rewards/#get-rewards-from-subgraph'
+          }
+        >
+          Rewards Module from Lido Ethereum SDK
+        </Link>
+        .
+      </>
+    }
+  />
+);

features/rewards/components/rewardsListContent/RewardsListErrorMessage.tsx

@@ -4,6 +4,7 @@ import { ErrorRateLimited } from '../errorBlocks/ErrorRateLimited';
 
 import { extractErrorMessage } from 'utils';
 import { FetcherError } from 'utils/fetcherError';
+import { ErrorUnprocessable } from '../errorBlocks/ErrorUnprocessable';
 
 type Props = {
   error: unknown;
@@ -20,5 +21,9 @@ export const RewardsListErrorMessage: React.FC<Props> = ({ error }) => {
     return <ErrorRateLimited />;
   }
 
+  if (error instanceof FetcherError && error.status === 422) {
+    return <ErrorUnprocessable />;
+  }
+
   return <ErrorBlockBase text={errorMessage} />;
 };

features/rewards/components/rewardsTable/RewardsTableCells/TypeCell.tsx

@@ -17,7 +17,7 @@ export const TypeCell: FC<RewardsTableCellProps> = (props) => {
       </OnlyMobileCellValueWrapper>
       <TypeCellValueWrapper>
         {capitalize(String(value))}{' '}
-        {data.direction && capitalize(data.direction)}{' '}
+        {value === 'transfer' && data.direction && capitalize(data.direction)}
         <IndexerLink transactionHash={data.transactionHash} />
       </TypeCellValueWrapper>
     </Td>

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

@@ -11,15 +11,21 @@ const INPUT_DESC_TEXT =
   'Current balance may differ from last balance in the table due to rounding.';
 
 export const TopCard: FC = () => {
-  const { address, isAddressResolving, inputValue, setInputValue } =
-    useRewardsHistory();
+  const {
+    address,
+    addressError,
+    isAddressResolving,
+    inputValue,
+    setInputValue,
+  } = useRewardsHistory();
 
   return (
     <Block color="accent" style={{ padding: 0 }}>
       <InputWrapper data-testid="inputSection" color="accent">
         <ThemeProvider theme={themeDark}>
           <AddressInput
             address={address}
+            addressError={addressError}
             inputValue={inputValue}
             handleInputChange={setInputValue}
             isAddressResolving={isAddressResolving}

features/rewards/hooks/useGetCurrentAddress.ts

@@ -9,6 +9,7 @@ import { useCurrentStaticRpcProvider } from 'shared/hooks/use-current-static-rpc
 
 type UseGetCurrentAddress = () => {
   address: string;
+  addressError: string;
   inputValue: string;
   isAddressResolving: boolean;
   setInputValue: (value: string) => void;
@@ -21,6 +22,7 @@ export const useGetCurrentAddress: UseGetCurrentAddress = () => {
   }, []);
   const [isAddressResolving, setIsAddressResolving] = useState(false);
   const [address, setAddress] = useState('');
+  const [addressError, setAddressError] = useState('');
 
   const { account } = useSDK();
   const { staticRpcProvider } = useCurrentStaticRpcProvider();
@@ -29,12 +31,26 @@ export const useGetCurrentAddress: UseGetCurrentAddress = () => {
   const getEnsAddress = useCallback(
     async (value: string) => {
       setAddress('');
+      let result: string | null = null;
+      let error: string | null = null;
 
       setIsAddressResolving(true);
-      const result = await resolveEns(value, staticRpcProvider);
-      setIsAddressResolving(false);
+      try {
+        result = await resolveEns(value, staticRpcProvider);
+      } catch (e) {
+        console.error(e);
+        error = 'An error happened during ENS name resolving';
+      } finally {
+        setIsAddressResolving(false);
+      }
 
-      if (result) setAddress(result);
+      if (result) {
+        setAddress(result);
+      } else if (error) {
+        setAddressError(error);
+      } else {
+        setAddressError("The ENS name entered couldn't be found");
+      }
     },
     [staticRpcProvider],
   );
@@ -76,6 +92,7 @@ export const useGetCurrentAddress: UseGetCurrentAddress = () => {
 
   return {
     address,
+    addressError,
     inputValue,
     isAddressResolving,
     setInputValue,

features/stake/stake-page.tsx

@@ -9,7 +9,7 @@ export const StakePage: FC = () => {
   return (
     <Layout
       title="Stake Ether"
-      subtitle="Stake ETH and receive stETH while staking."
+      subtitle="Stake ETH and receive stETH while staking"
     >
       <Head>
         <title>Stake with Lido | Lido</title>

features/stake/swap-discount-banner/integrations.tsx

@@ -53,7 +53,7 @@ const STAKE_SWAP_INTEGRATION_CONFIG: StakeSwapDiscountIntegrationMap = {
       );
     },
     Icon: OneInchIcon,
-    linkHref: `https://app.1inch.io/#/1/simple/swap/ETH/stETH`,
+    linkHref: `https://app.1inch.io/#/1/advanced/swap/ETH/stETH`,
     matomoEvent: MATOMO_CLICK_EVENTS.oneInchDiscount,
     CustomLink({ children, ...props }) {
       const customProps = use1inchDeepLinkProps();

features/withdrawals/request/wallet/wallet-steth-balance.tsx

@@ -16,7 +16,7 @@ export const WalletStethBalance = () => {
   return (
     <CardBalance
       small
-      title="stETH Balance"
+      title="stETH balance"
       loading={loading.isStethBalanceLoading}
       value={stethBalanceValue}
     />

features/withdrawals/request/wallet/wallet-wsteth-balance.tsx

@@ -31,7 +31,7 @@ export const WalletWstethBalance = () => {
   return (
     <CardBalance
       small
-      title="wstETH Balance"
+      title="wstETH balance"
       loading={loading.isStethBalanceLoading || isStethByWstethLoading}
       value={stethBalanceValue}
     />

features/wsteth/shared/wallet/wallet.tsx

@@ -33,7 +33,7 @@ const WalletComponent: WalletComponentType = (props) => {
     <StyledCard data-testid="wrapCardSection" {...props}>
       <CardRow>
         <CardBalance
-          title="ETH Balance"
+          title="ETH balance"
           loading={ethBalance.initialLoading}
           value={
             <FormatToken
@@ -49,7 +49,7 @@ const WalletComponent: WalletComponentType = (props) => {
       <CardRow>
         <CardBalance
           small
-          title="stETH Balance"
+          title="stETH balance"
           loading={stethBalance.initialLoading || wstethBySteth.initialLoading}
           value={
             <>
@@ -75,7 +75,7 @@ const WalletComponent: WalletComponentType = (props) => {
         />
         <CardBalance
           small
-          title="wstETH Balance"
+          title="wstETH balance"
           loading={wstethBalance.initialLoading || stethByWsteth.initialLoading}
           value={
             <>

features/wsteth/wrap/hooks/use-wrap-form-validation-context.ts

@@ -24,37 +24,42 @@ export const useWrapFormValidationContext = ({
     wrapEthGasCost,
   } = networkData;
 
-  const isDataReady =
-    stethBalance &&
-    ethBalance &&
-    isMultisig !== undefined &&
+  const waitForAccountData = active
+    ? stethBalance && ethBalance && isMultisig !== undefined
+    : true;
+
+  const isDataReady = !!(
+    waitForAccountData &&
     wrapEthGasCost &&
-    stakeLimitInfo;
+    stakeLimitInfo
+  );
 
   const asyncContextValue: WrapFormAsyncValidationContext | undefined =
     useMemo(() => {
       return isDataReady
-        ? {
+        ? ({
+            isWalletActive: active,
             stethBalance,
             etherBalance: ethBalance,
             isMultisig,
             gasCost: wrapEthGasCost,
-            stakingLimitLevel: stakeLimitInfo.stakeLimitLevel,
-            currentStakeLimit: stakeLimitInfo.currentStakeLimit,
-          }
+            stakingLimitLevel: stakeLimitInfo?.stakeLimitLevel,
+            currentStakeLimit: stakeLimitInfo?.currentStakeLimit,
+          } as WrapFormAsyncValidationContext)
         : undefined;
     }, [
       isDataReady,
+      active,
+      stethBalance,
       ethBalance,
       isMultisig,
-      stakeLimitInfo,
-      stethBalance,
       wrapEthGasCost,
+      stakeLimitInfo?.stakeLimitLevel,
+      stakeLimitInfo?.currentStakeLimit,
     ]);
 
   const asyncContext = useAwaiter(asyncContextValue).awaiter;
   return {
-    isWalletActive: active,
     asyncContext,
   };
 };

features/wsteth/wrap/wrap-form-context/types.ts

@@ -16,18 +16,24 @@ export type WrapFormNetworkData = ReturnType<typeof useWrapFormNetworkData>;
 export type WrapFormApprovalData = ReturnType<typeof useWrapTxApprove>;
 
 export type WrapFormValidationContext = {
-  isWalletActive: boolean;
   asyncContext: Promise<WrapFormAsyncValidationContext>;
 };
 
 export type WrapFormAsyncValidationContext = {
-  stethBalance: BigNumber;
-  etherBalance: BigNumber;
   stakingLimitLevel: LIMIT_LEVEL;
   currentStakeLimit: BigNumber;
   gasCost: BigNumber;
-  isMultisig: boolean;
-};
+} & (
+  | {
+      isWalletActive: true;
+      stethBalance: BigNumber;
+      etherBalance: BigNumber;
+      isMultisig: boolean;
+    }
+  | {
+      isWalletActive: false;
+    }
+);
 
 export type WrapFormDataContextValueType = WrapFormNetworkData &
   WrapFormApprovalData & {