/ src / components / transactions / CollateralChange / CollateralChangeActions.tsx
CollateralChangeActions.tsx
 1  import { ProtocolAction } from '@aave/contract-helpers';
 2  import { Trans } from '@lingui/macro';
 3  import { useTransactionHandler } from 'src/helpers/useTransactionHandler';
 4  import { ComputedReserveData } from 'src/hooks/app-data-provider/useAppDataProvider';
 5  import { useRootStore } from 'src/store/root';
 6  
 7  import { TxActionsWrapper } from '../TxActionsWrapper';
 8  
 9  export type CollateralChangeActionsProps = {
10    poolReserve: ComputedReserveData;
11    isWrongNetwork: boolean;
12    usageAsCollateral: boolean;
13    blocked: boolean;
14    symbol: string;
15  };
16  
17  export const CollateralChangeActions = ({
18    poolReserve,
19    isWrongNetwork,
20    usageAsCollateral,
21    blocked,
22    symbol,
23  }: CollateralChangeActionsProps) => {
24    const setUsageAsCollateral = useRootStore((state) => state.setUsageAsCollateral);
25  
26    const { action, loadingTxns, mainTxState, requiresApproval } = useTransactionHandler({
27      tryPermit: false,
28      protocolAction: ProtocolAction.setUsageAsCollateral,
29      eventTxInfo: {
30        assetName: poolReserve.name,
31        asset: poolReserve.underlyingAsset,
32        previousState: (!usageAsCollateral).toString(),
33        newState: usageAsCollateral.toString(),
34      },
35  
36      handleGetTxns: async () => {
37        return setUsageAsCollateral({
38          reserve: poolReserve.underlyingAsset,
39          usageAsCollateral,
40        });
41      },
42      skip: blocked,
43    });
44  
45    return (
46      <TxActionsWrapper
47        requiresApproval={requiresApproval}
48        blocked={blocked}
49        preparingTransactions={loadingTxns}
50        mainTxState={mainTxState}
51        isWrongNetwork={isWrongNetwork}
52        actionText={
53          usageAsCollateral ? (
54            <Trans>Enable {symbol} as collateral</Trans>
55          ) : (
56            <Trans>Disable {symbol} as collateral</Trans>
57          )
58        }
59        actionInProgressText={<Trans>Pending...</Trans>}
60        handleAction={action}
61      />
62    );
63  };