Merge pull request #75 from lidofinance/feature/post-testnet

Tesnet v1.2

Author: Jeday

features/adjustment/mint/form/submit-button/submit-button.tsx

@@ -1,15 +1,13 @@
 import { useVaultInfo, type VAULT_OWNER_ROLES } from 'modules/vaults';
 import { MultiplePermissionedSubmitButton } from 'modules/vaults/components';
 import { useMemo } from 'react';
-import { useFormContext, useWatch } from 'react-hook-form';
+import { useFormState, useWatch } from 'react-hook-form';
 
 const NON_INCREASE_LOCK_ROLES = ['minter'] as VAULT_OWNER_ROLES[];
 const INCREASE_LOCK_ROLES = ['minter', 'locker'] as VAULT_OWNER_ROLES[];
 
 export const SubmitButton = () => {
-  const {
-    formState: { isSubmitting, isValid },
-  } = useFormContext();
+  const { isSubmitting, isValid, disabled } = useFormState();
 
   const { activeVault } = useVaultInfo();
 
@@ -35,13 +33,13 @@ export const SubmitButton = () => {
     return NON_INCREASE_LOCK_ROLES;
   }, [activeVault, amount, token]);
 
-  const disabled = isSubmitting && !isValid;
+  const isDisabled = isSubmitting && !isValid && disabled;
 
   return (
     <MultiplePermissionedSubmitButton
       dashboardRoles={roles}
       type="submit"
-      disabled={disabled}
+      disabled={isDisabled}
     >
       Mint
     </MultiplePermissionedSubmitButton>

features/adjustment/mint/hooks/use-mint.ts

@@ -6,25 +6,25 @@ import { type Address, encodeFunctionData } from 'viem';
 import { useSendTransaction, withSuccess } from 'modules/web3';
 
 import { dashboardAbi } from 'abi/dashboard-abi';
-import { useVaultInfo, useVaultPermission } from 'modules/vaults';
+import { useVaultInfo, useVaultPermission, vaultTexts } from 'modules/vaults';
 
 import { fallbackedAddress } from 'utils/fallbacked-address';
 
 import { useReportStatus } from 'features/report';
 import { GoToVault } from 'modules/vaults/components/go-to-vault';
 
 export const useMint = () => {
-  const { activeVault } = useVaultInfo();
+  const { activeVault, refetchVaultInfo } = useVaultInfo();
   const { isReportAvailable, prepareReportCall } = useReportStatus();
   const { sendTX, ...rest } = useSendTransaction();
 
   return {
     mint: useCallback(
-      async (recipient: Address, amount: bigint, token: string) => {
+      async (recipient: Address, amount: bigint, token: 'stETH' | 'wstETH') => {
         invariant(activeVault?.owner, '[useMint] owner is undefined');
 
-        const loadingActionText = `Minting ${token} backed by vault`;
-        const mainActionCompleteText = `Minted ${token} backed by vault`;
+        const loadingActionText = vaultTexts.actions.mint.loading(token);
+        const mainActionCompleteText = vaultTexts.actions.mint.completed(token);
 
         const mintCall = {
           to: activeVault.owner,
@@ -53,9 +53,19 @@ export const useMint = () => {
           }),
         );
 
+        if (success) {
+          await refetchVaultInfo();
+        }
+
         return success;
       },
-      [activeVault?.owner, prepareReportCall, sendTX, isReportAvailable],
+      [
+        activeVault?.owner,
+        refetchVaultInfo,
+        prepareReportCall,
+        sendTX,
+        isReportAvailable,
+      ],
     ),
     ...rest,
   };

features/adjustment/mint/mint-form-context/mint-form-provider.tsx

@@ -6,15 +6,16 @@ import {
   createContext,
   useContext,
 } from 'react';
+import type { Address } from 'viem';
 import { FormProvider, useForm } from 'react-hook-form';
 import invariant from 'tiny-invariant';
 
 import { useVaultInfo } from 'modules/vaults';
-import { useMint } from 'features/adjustment/mint/hooks';
+import { useDappStatus } from 'modules/web3';
 
 import { FormController } from 'shared/hook-form/form-controller';
+import { useMint } from 'features/adjustment/mint/hooks';
 import { MintFormSchema } from 'features/adjustment/mint/types';
-import { Address } from 'viem';
 
 type MintDataContextValue = {
   mintableStETH: bigint;
@@ -36,12 +37,14 @@ export const useMintFormData = () => {
 };
 
 export const MintFormProvider: FC<{ children: ReactNode }> = ({ children }) => {
+  const { isDappActive } = useDappStatus();
   const formObject = useForm<MintFormSchema>({
     defaultValues: {
       amount: undefined,
       token: 'stETH',
       recipient: '' as Address,
     },
+    disabled: !isDappActive,
     mode: 'all',
     // TODO: validation
     reValidateMode: 'onChange',
@@ -68,6 +71,10 @@ export const MintFormProvider: FC<{ children: ReactNode }> = ({ children }) => {
       invariant(recipient, '[MintFormProvider] recipient is undefined');
       invariant(amount, '[MintFormProvider] amount is undefined');
       invariant(token, '[MintFormProvider] token is undefined');
+      invariant(
+        token === 'stETH' || token === 'wstETH',
+        '[MintFormProvider] token is invalid',
+      );
 
       return await mint(recipient, amount, token);
     },

features/adjustment/repay/form/submit-button/submit-button.tsx

@@ -1,17 +1,15 @@
 import { PermissionedSubmitButton } from 'modules/vaults/components';
-import { useFormContext } from 'react-hook-form';
+import { useFormState } from 'react-hook-form';
 
 export const SubmitButton = () => {
-  const {
-    formState: { isSubmitting, isValid },
-  } = useFormContext();
-  const disabled = isSubmitting || !isValid;
+  const { isSubmitting, isValid, disabled } = useFormState();
+  const isDisabled = isSubmitting || !isValid || disabled;
 
   return (
     <PermissionedSubmitButton
       dashboardRole="repayer"
       type="submit"
-      disabled={disabled}
+      disabled={isDisabled}
     >
       Repay
     </PermissionedSubmitButton>

features/adjustment/repay/hooks/use-burn.ts

@@ -4,7 +4,7 @@ import { useEstimateGas, useAccount } from 'wagmi';
 import { encodeFunctionData } from 'viem';
 
 import { dashboardAbi } from 'abi/dashboard-abi';
-import { useVaultInfo, useVaultPermission } from 'modules/vaults';
+import { useVaultInfo, useVaultPermission, vaultTexts } from 'modules/vaults';
 
 import {
   TransactionEntry,
@@ -15,19 +15,20 @@ import {
 import { GoToVault } from 'modules/vaults/components/go-to-vault';
 
 export const useBurn = () => {
-  const { activeVault } = useVaultInfo();
+  const { activeVault, refetchVaultInfo } = useVaultInfo();
   const { stETH, wstETH } = useLidoSDK();
   const { sendTX, ...rest } = useSendTransaction();
 
   return {
     burn: useCallback(
-      async (amount: bigint, token: string) => {
+      async (amount: bigint, token: 'stETH' | 'wstETH') => {
         invariant(activeVault?.owner, '[useMint] owner is undefined');
 
-        const loadingActionText = `Repaying ${token}`;
-        const mainActionCompleteText = `Repaid ${token}`;
+        const loadingActionText = vaultTexts.actions.repay.loading(token);
+        const mainActionCompleteText =
+          vaultTexts.actions.repay.completed(token);
 
-        const transactions = async () => {
+        const prepareTransactions = async () => {
           const calls: TransactionEntry[] = [];
 
           const isSteth = token === 'stETH';
@@ -43,7 +44,7 @@ export const useBurn = () => {
                 amount,
                 to: activeVault.owner,
               })),
-              loadingActionText: `Approving ${token}`,
+              loadingActionText: vaultTexts.actions.approve.loading(token),
             };
             calls.push(approveCall);
           }
@@ -61,17 +62,21 @@ export const useBurn = () => {
 
         const { success } = await withSuccess(
           sendTX({
-            transactions,
+            transactions: prepareTransactions,
             forceAtomic: true,
             mainActionLoadingText: loadingActionText,
             mainActionCompleteText,
             renderSuccessContent: GoToVault,
           }),
         );
 
+        if (success) {
+          await refetchVaultInfo();
+        }
+
         return success;
       },
-      [activeVault?.owner, sendTX, stETH, wstETH],
+      [activeVault?.owner, refetchVaultInfo, sendTX, stETH, wstETH],
     ),
     ...rest,
   };

features/adjustment/repay/repay-form-context/repay-form-provider.tsx

@@ -8,11 +8,10 @@ import {
 import { FormProvider, useForm } from 'react-hook-form';
 import invariant from 'tiny-invariant';
 
-import { useBurn } from 'features/adjustment/repay/hooks';
 import { useDappStatus, useStethBalance, useWstethBalance } from 'modules/web3';
-
 import { FormController } from 'shared/hook-form/form-controller';
 
+import { useBurn } from 'features/adjustment/repay/hooks';
 import { RepayFormSchema } from 'features/adjustment/repay/types';
 
 type RepayDataContextValue = {
@@ -40,12 +39,14 @@ export const useRepayFormData = () => {
 };
 
 export const RepayFormProvider = ({ children }: { children: ReactNode }) => {
+  const { isDappActive } = useDappStatus();
   const formObject = useForm<RepayFormSchema>({
     defaultValues: {
       amount: undefined,
       token: 'stETH',
     },
     mode: 'all',
+    disabled: !isDappActive,
     // TODO: validation
     reValidateMode: 'onChange',
   });
@@ -93,7 +94,10 @@ export const RepayFormProvider = ({ children }: { children: ReactNode }) => {
       if (!amount || !token) return false;
 
       invariant(amount, '[RepayFormProvider] amount is undefined');
-      invariant(token, '[RepayFormProvider] token is undefined');
+      invariant(
+        token === 'stETH' || token === 'wstETH',
+        '[RepayFormProvider] token is invalid',
+      );
 
       return await burn(amount, token);
     },

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

@@ -6,18 +6,18 @@ import {
   createContext,
   useContext,
 } from 'react';
+import invariant from 'tiny-invariant';
 import { isAddress, ReadContractErrorType } from 'viem';
 import { useReadContract } from 'wagmi';
 import { FormProvider, useForm } from 'react-hook-form';
 
-import { useClaim } from 'features/claim/claim-form/hooks';
+import { useDappStatus } from 'modules/web3';
 import { useVaultInfo } from 'modules/vaults';
-
+import { dashboardAbi } from 'abi/dashboard-abi';
 import { FormController } from 'shared/hook-form/form-controller';
 
-import { dashboardAbi } from 'abi/dashboard-abi';
+import { useClaim } from 'features/claim/claim-form/hooks';
 import { ClaimFormSchema } from 'features/claim/claim-form/types';
-import invariant from 'tiny-invariant';
 
 type ClaimDataContextValue = {
   availableToClaim: bigint | undefined;
@@ -43,11 +43,12 @@ export const ClaimFormProvider: FC<{ children: ReactNode }> = ({
   children,
 }) => {
   const { activeVault } = useVaultInfo();
-
+  const { isDappActive } = useDappStatus();
   const formObject = useForm<ClaimFormSchema>({
     defaultValues: {
       recipient: '',
     },
+    disabled: !isDappActive,
     mode: 'all',
     // TODO: validation
     reValidateMode: 'onChange',

features/claim/claim-form/form/submit-button/submit-button.tsx

@@ -1,23 +1,23 @@
-import { useFormContext } from 'react-hook-form';
+import { useFormState } from 'react-hook-form';
 import { useClaimFormData } from 'features/claim/claim-form/claim-form-context';
 import { formatBalance } from 'utils';
 import { PermissionedSubmitButton } from 'modules/vaults/components';
 
 export const SubmitButton = () => {
-  const {
-    formState: { isValid, isSubmitting },
-  } = useFormContext();
+  const { isValid, isSubmitting, disabled } = useFormState();
   const { isLoadingClaimInfo, availableToClaim, isErrorClaimInfo } =
     useClaimFormData();
 
   const isLoading =
     (!isErrorClaimInfo && !availableToClaim) || isLoadingClaimInfo;
 
+  const isDisabled = isSubmitting || !isValid || disabled || isLoading;
+
   return (
     <PermissionedSubmitButton
       dashboardRole="nodeOperatorFeeClaimer"
       type="submit"
-      disabled={isSubmitting || !isValid || isLoading}
+      disabled={isDisabled}
     >
       {isLoading && <>Wait for claim information</>}
       {!!availableToClaim && <>{formatBalance(availableToClaim).trimmed} ETH</>}

features/claim/claim-form/hooks/use-claim.ts

@@ -3,14 +3,14 @@ import { useEstimateGas, useAccount } from 'wagmi';
 import { Address, encodeFunctionData } from 'viem';
 
 import { dashboardAbi } from 'abi/dashboard-abi';
-import { useVaultInfo, useVaultPermission } from 'modules/vaults';
+import { useVaultInfo, useVaultPermission, vaultTexts } from 'modules/vaults';
 import invariant from 'tiny-invariant';
 import { fallbackedAddress } from 'utils/fallbacked-address';
 import { useSendTransaction, withSuccess } from 'modules/web3';
 import { GoToVault } from 'modules/vaults/components/go-to-vault';
 
 export const useClaim = () => {
-  const { activeVault } = useVaultInfo();
+  const { activeVault, refetchVaultInfo } = useVaultInfo();
   const owner = activeVault?.owner;
   const { sendTX, ...rest } = useSendTransaction();
 
@@ -19,8 +19,8 @@ export const useClaim = () => {
       async (recipient: Address) => {
         invariant(owner, '[useClaim] owner is undefined');
 
-        const loadingActionText = `Claiming node operator fee`;
-        const mainActionCompleteText = `Claimed node operator fee`;
+        const loadingActionText = vaultTexts.actions.claim.loading;
+        const mainActionCompleteText = vaultTexts.actions.claim.completed;
 
         const claimCall = {
           to: owner,
@@ -41,9 +41,13 @@ export const useClaim = () => {
           }),
         );
 
+        if (success) {
+          await refetchVaultInfo();
+        }
+
         return success;
       },
-      [owner, sendTX],
+      [owner, refetchVaultInfo, sendTX],
     ),
     ...rest,
   };