feat: v3 migration prototype continue

Author: satanworker

pages/_app.page.tsx

@@ -16,6 +16,7 @@ import { CollateralChangeModal } from 'src/components/transactions/CollateralCha
 import { EmodeModal } from 'src/components/transactions/Emode/EmodeModal';
 import { FaucetModal } from 'src/components/transactions/Faucet/FaucetModal';
 import { GasStationProvider } from 'src/components/transactions/GasStation/GasStationProvider';
+import { MigrateV3Modal } from 'src/components/transactions/MigrateV3/MigrateV3Modal';
 import { RateSwitchModal } from 'src/components/transactions/RateSwitch/RateSwitchModal';
 import { RepayModal } from 'src/components/transactions/Repay/RepayModal';
 import { SupplyModal } from 'src/components/transactions/Supply/SupplyModal';
@@ -85,6 +86,7 @@ export default function MyApp(props: MyAppProps) {
                           <EmodeModal />
                           <SwapModal />
                           <FaucetModal />
+                          <MigrateV3Modal />
                         </GasStationProvider>
                       </AppDataProvider>
                     </BackgroundDataProvider>

pages/v3-migration.page.tsx

@@ -1,16 +1,21 @@
+import { MigrateV3Modal } from 'src/components/transactions/MigrateV3/MigrateV3Modal';
 import { StakeModal } from 'src/components/transactions/Stake/StakeModal';
 import { StakeCooldownModal } from 'src/components/transactions/StakeCooldown/StakeCooldownModal';
 import { StakeRewardClaimModal } from 'src/components/transactions/StakeRewardClaim/StakeRewardClaimModal';
 import { UnStakeModal } from 'src/components/transactions/UnStake/UnStakeModal';
+import { useModalContext } from 'src/hooks/useModal';
 import { useUserReserves } from 'src/hooks/useUserReserves';
 import { MainLayout } from 'src/layouts/MainLayout';
 import { useRootStore } from 'src/store/root';
 
 export default function V3Migration() {
   const { user, borrowPositions } = useUserReserves();
+  const { openV3Migration } = useModalContext();
+
   const toggleSelectedSupplyPosition = useRootStore((state) => state.toggleMigrationSelectedAsset);
   const testMigration = useRootStore((state) => state._testMigration);
-  // const migrate = useRootStore((state) => state.migrateSelectedPositions);
+  const selectedAssets = useRootStore((state) => state.selectedMigrationAssets);
+
   return (
     <div>
       <button onClick={() => testMigration()}>test migration</button>
@@ -19,6 +24,7 @@ export default function V3Migration() {
         <div
           key={reserve.underlyingAsset}
           onClick={() => toggleSelectedSupplyPosition(reserve.underlyingAsset)}
+          style={{ color: selectedAssets[reserve.underlyingAsset] ? 'red' : 'black' }}
         >
           {reserve.underlyingAsset}:<b>{reserve.underlyingBalanceUSD}</b>
         </div>
@@ -27,7 +33,7 @@ export default function V3Migration() {
       {borrowPositions.map((reserve) => (
         <div key={reserve.underlyingAsset}>{reserve.variableBorrowsUSD}</div>
       ))}
-      {/* <button onClick={migrate}>Migrate positions</button> */}
+      <button onClick={openV3Migration}>Migrate</button>
     </div>
   );
 }
@@ -37,10 +43,7 @@ V3Migration.getLayout = function getLayout(page: React.ReactElement) {
     <MainLayout>
       {page}
       {/** Modals */}
-      <StakeModal />
-      <StakeCooldownModal />
-      <UnStakeModal />
-      <StakeRewardClaimModal />
+      <MigrateV3Modal />
       {/** End of modals */}
     </MainLayout>
   );

src/components/transactions/MigrateV3/MigrateV3Actions.tsx

@@ -2,23 +2,26 @@ import { useTransactionHandler } from 'src/helpers/useTransactionHandler';
 import { useRootStore } from 'src/store/root';
 
 export const MigrateV3Actions = () => {
-  const migrate = useRootStore((store) => store.migrate);
+  // const selectedAssets = useRootStore((store) => )
+  const migrateWithPermits = useRootStore((store) => store.migrateWithPermits);
+  const migrateWithoutPermits = useRootStore((store) => store.migrateWithoutPermits);
   const getApprovePermitsForSelectedAssets = useRootStore(
     (store) => store.getApprovePermitsForSelectedAssets
   );
   const { approval, action } = useTransactionHandler({
-    handleGetTxns: async () => {
-      return [];
-    },
-    handleGetPermitTxns: async (signatures, deadline) => migrate(signatures, deadline),
-    tryPermit: true,
+    handleGetTxns: async () => migrateWithoutPermits(),
+    handleGetPermitTxns: async (signatures, deadline) => migrateWithPermits(signatures, deadline),
+    tryPermit: false,
   });
 
+  const handleApproval = () => {
+    const approvePermitsForSelectedAssets = getApprovePermitsForSelectedAssets();
+    approval(approvePermitsForSelectedAssets);
+  };
+
   return (
     <div>
-      <button onClick={() => approval(getApprovePermitsForSelectedAssets())}>
-        Approve with permits
-      </button>
+      <button onClick={handleApproval}>Approve</button>
       {/* <button onClick={() => }></button> */}
       <button onClick={action}>Migrate</button>
     </div>

src/components/transactions/MigrateV3/MigrateV3Modal.tsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import { ModalType, useModalContext } from 'src/hooks/useModal';
+
+import { BasicModal } from '../../primitives/BasicModal';
+import { MigrateV3Actions } from './MigrateV3Actions';
+
+export const MigrateV3Modal = () => {
+  const { type, close } = useModalContext();
+  return (
+    <BasicModal open={type === ModalType.V3Migration} setOpen={close}>
+      <MigrateV3Actions />
+    </BasicModal>
+  );
+};

src/helpers/useTransactionHandler.tsx

@@ -113,8 +113,10 @@ export const useTransactionHandler = ({
 
   const approval = async (approvals?: Approval[]) => {
     if (approvalTxes) {
+      console.log(approvalTxes, 'approvalTxes');
       if (usePermit && approvals && approvals?.length > 0) {
         setApprovalTxState({ ...approvalTxState, loading: true });
+        console.log('loading true', usePermit, approvals, approvalTxes);
         try {
           // deadline is an hour after signature
           const deadline = Math.floor(Date.now() / 1000 + 3600).toString();
@@ -179,11 +181,15 @@ export const useTransactionHandler = ({
       } else {
         try {
           setApprovalTxState({ ...approvalTxState, loading: true });
+          console.log('no permit should call approval', approvalTxes);
           const params = await Promise.all(approvalTxes.map((approvalTx) => approvalTx.tx()));
+          console.log(params, 'params');
           const approvalResponses = await Promise.all(
             params.map(
               (param) =>
-                new Promise<TransactionResponse>((resolve, reject) => {
+                new Promise<TransactionResponse>(async (resolve, reject) => {
+                  delete param.gasPrice;
+                  console.log;
                   processTx({
                     tx: () => sendTx(param),
                     successCallback: (txnResponse: TransactionResponse) => {
@@ -210,29 +216,6 @@ export const useTransactionHandler = ({
             loading: false,
             success: true,
           });
-
-          // const params = await approvalTx.tx();
-          // delete params.gasPrice;
-          // await processTx({
-          //   tx: () => sendTx(params),
-          //   successCallback: (txnResponse: TransactionResponse) => {
-          //     setApprovalTxState({
-          //       txHash: txnResponse.hash,
-          //       loading: false,
-          //       success: true,
-          //     });
-          //     setTxError(undefined);
-          //   },
-          //   errorCallback: (error, hash) => {
-          //     const parsedError = getErrorTextFromError(error, TxAction.APPROVAL, false);
-          //     setTxError(parsedError);
-          //     setApprovalTxState({
-          //       txHash: hash,
-          //       loading: false,
-          //     });
-          //   },
-          //   action: TxAction.APPROVAL,
-          // });
         } catch (error) {
           if (!mounted.current) return;
           const parsedError = getErrorTextFromError(error, TxAction.GAS_ESTIMATION, false);
@@ -343,6 +326,7 @@ export const useTransactionHandler = ({
                   'STAKE_ACTION',
                   'GOV_DELEGATION_ACTION',
                   'GOVERNANCE_ACTION',
+                  'V3_MIGRATION_ACTION',
                 ].includes(tx.txType)
               )
             );

src/hooks/useModal.tsx

@@ -21,6 +21,7 @@ export enum ModalType {
   Swap,
   GovDelegation,
   GovVote,
+  V3Migration,
 }
 
 export interface ModalArgsType {
@@ -57,6 +58,7 @@ export interface ModalContextType<T extends ModalArgsType> {
   openFaucet: (underlyingAsset: string) => void;
   openSwap: (underlyingAsset: string) => void;
   openGovDelegation: () => void;
+  openV3Migration: () => void;
   openGovVote: (proposalId: number, support: boolean, power: string) => void;
   close: () => void;
   type?: ModalType;
@@ -157,6 +159,9 @@ export const ModalContextProvider: React.FC = ({ children }) => {
           setType(ModalType.GovVote);
           setArgs({ proposalId, support, power });
         },
+        openV3Migration: () => {
+          setType(ModalType.V3Migration);
+        },
         close: () => {
           setType(undefined);
           setArgs({});

src/store/poolSelectors.ts

@@ -76,6 +76,7 @@ export const selectUserSummaryAndIncentives = (state: RootStore, currentTimestam
   const reserveIncentiveData = state.reserveIncentiveData;
   const userIncentiveData = state.userIncentiveData;
 
+  // TODO: why <any>
   return formatUserSummaryAndIncentives({
     currentTimestamp,
     marketReferencePriceInUsd: baseCurrencyData.marketReferenceCurrencyPriceInUsd,

src/store/v3MigrationSlice.ts

@@ -7,7 +7,7 @@ import {
 } from '@aave/contract-helpers';
 import { SignatureLike } from '@ethersproject/bytes';
 import dayjs from 'dayjs';
-import { BigNumberish } from 'ethers';
+import { BigNumberish, constants } from 'ethers';
 import { produce } from 'immer';
 import { Approval } from 'src/helpers/useTransactionHandler';
 import { StateCreator } from 'zustand';
@@ -30,10 +30,11 @@ export type V3MigrationSlice = {
   toggleMigrationSelectedAsset: (assetName: string) => void;
   getMigratorAddress: () => string;
   getMigrationServiceInstance: () => V3MigrationHelperService;
-  migrate: (
+  migrateWithPermits: (
     signature: SignatureLike[],
     deadline: BigNumberish
   ) => EthereumTransactionTypeExtended[];
+  migrateWithoutPermits: () => EthereumTransactionTypeExtended[];
   _testMigration: () => void;
   // migrateSelectedPositions: () => void;
 };
@@ -110,7 +111,6 @@ export const createV3MigrationSlice: StateCreator<
       const timestamp = dayjs().unix();
       set({ timestamp });
       return selectedUserReservesForMigration(get(), timestamp).map(({ reserve }): Approval => {
-        reserve.name;
         return {
           // TODO: should we allow spending of exact ammount of the reserver?
           amount: reserve.totalLiquidity,
@@ -119,11 +119,31 @@ export const createV3MigrationSlice: StateCreator<
         };
       });
     },
-    migrate: (signatures: SignatureLike[], deadline: BigNumberish) => {
+    migrateWithoutPermits: () => {
+      const timestamp = dayjs().unix();
+      set({ timestamp });
+      const assets: {
+        aToken: string;
+        deadline: number;
+        amount: string;
+      }[] = selectedUserReservesForMigration(get(), timestamp).map(({ reserve }) => {
+        const deadline = Math.floor(Date.now() / 1000 + 3600);
+        return {
+          amount: reserve.totalLiquidity,
+          aToken: reserve.aTokenAddress,
+          // TODO: fow how long to approve?
+          deadline,
+        };
+      });
+      const user = get().account;
+      console.log(assets, user);
+      return get().getMigrationServiceInstance().migrateNoBorrow({ assets, user });
+    },
+    migrateWithPermits: (signatures: SignatureLike[], deadline: BigNumberish) => {
       const selectedReservers = selectedUserReservesForMigration(get(), get().timestamp);
       const permits = selectedReservers.map(({ reserve }, index) => ({
         aToken: reserve.aTokenAddress,
-        value: reserve.totalLiquidity + 1000,
+        value: constants.MaxUint256.toString(),
         deadline,
         signedPermit: signatures[index],
       }));
@@ -132,6 +152,7 @@ export const createV3MigrationSlice: StateCreator<
       const migratorHelperInstance = get().getMigrationServiceInstance();
       const user = get().account;
       const assets = permits.map((permit) => permit.aToken);
+      console.log('migrateNoBorrowWith permits');
       return migratorHelperInstance.migrateNoBorrowWithPermits({
         user,
         assets,