@huma-finance/widgets 0.0.48-beta.296 → 0.0.48-beta.297

package/src/components/Lend/redeemV2/4-Done.tsx

@@ -1,33 +0,0 @@
-import { formatMoney, UnderlyingTokenInfo } from '@huma-finance/shared'
-import React from 'react'
-
-import { REDEMPTION_TYPE, RedemptionActionInfo } from '.'
-import { useAppSelector } from '../../../hooks/useRedux'
-import { selectWidgetState } from '../../../store/widgets.selectors'
-import { TxDoneModal } from '../../TxDoneModal'
-
-type Props = {
-  poolUnderlyingToken: UnderlyingTokenInfo
-  redemptionType: REDEMPTION_TYPE
-  handleAction: () => void
-}
-
-export function Done({
-  poolUnderlyingToken,
-  redemptionType,
-  handleAction,
-}: Props): React.ReactElement {
-  const { symbol } = poolUnderlyingToken
-  const { redeemAmount, redeemShares } = useAppSelector(selectWidgetState)
-  const redemptionActionInfo = RedemptionActionInfo[redemptionType]
-  const isCreate = redemptionActionInfo.action === 'Create'
-
-  const content = [
-    `You successfully ${isCreate ? 'created' : 'canceled'} ${formatMoney(
-      redeemAmount,
-    )} ${symbol} (${redeemShares} shares) redemption request.`,
-    isCreate ? `Note: Exact redemption amounts may vary once processed.` : '',
-  ]
-
-  return <TxDoneModal handleAction={handleAction} content={content} />
-}

package/src/components/Lend/redeemV2/index.tsx

@@ -1,207 +0,0 @@
-import {
-  POOL_NAME,
-  useCancellableRedemptionInfoV2,
-  useLenderPositionV2,
-  usePoolInfoV2,
-  usePoolUnderlyingTokenInfoV2,
-} from '@huma-finance/shared'
-import { useWeb3React } from '@web3-react/core'
-import { BigNumber } from 'ethers'
-import React, { useCallback, useEffect, useState } from 'react'
-import { useDispatch } from 'react-redux'
-
-import { useAppSelector } from '../../../hooks/useRedux'
-import { setStep } from '../../../store/widgets.reducers'
-import { selectWidgetState } from '../../../store/widgets.selectors'
-import { WIDGET_STEP } from '../../../store/widgets.store'
-import { ErrorModal } from '../../ErrorModal'
-import { WidgetWrapper } from '../../WidgetWrapper'
-import { ChooseAction } from './1-ChooseAction'
-import { ChooseAmount } from './2-ChooseAmount'
-import { Transfer } from './3-Transfer'
-import { Done } from './4-Done'
-
-/**
- * Lend pool withdraw props
- * @typedef {Object} LendRedeemPropsV2
- * @property {POOL_NAME} poolName The name of the pool.
- * @property {function():void} handleClose Function to notify to close the widget modal when user clicks the 'x' close button.
- * @property {function((number|undefined)):void|undefined} handleSuccess Optional function to notify that the lending pool withdraw action is successful.
- */
-export type LendRedeemPropsV2 = {
-  poolName: keyof typeof POOL_NAME
-  handleClose: () => void
-  handleSuccess?: (blockNumber?: number) => void
-}
-
-export enum REDEMPTION_TYPE {
-  AddSeniorRedemption = 1,
-  CancelSeniorRedemption = 2,
-  AddJuniorRedemption = 3,
-  CancelJuniorRedemption = 4,
-}
-
-export const RedemptionActionInfo: {
-  [key in REDEMPTION_TYPE]: {
-    action: 'Create' | 'Cancel'
-    tranche: 'senior' | 'junior'
-  }
-} = {
-  [REDEMPTION_TYPE.AddSeniorRedemption]: {
-    action: 'Create',
-    tranche: 'senior',
-  },
-  [REDEMPTION_TYPE.CancelSeniorRedemption]: {
-    action: 'Cancel',
-    tranche: 'senior',
-  },
-  [REDEMPTION_TYPE.AddJuniorRedemption]: {
-    action: 'Create',
-    tranche: 'junior',
-  },
-  [REDEMPTION_TYPE.CancelJuniorRedemption]: {
-    action: 'Cancel',
-    tranche: 'junior',
-  },
-}
-
-export type RedemptionInfo = {
-  shares: BigNumber
-  amount: BigNumber
-}
-
-export function LendRedeemV2({
-  poolName: poolNameStr,
-  handleClose,
-  handleSuccess,
-}: LendRedeemPropsV2): React.ReactElement | null {
-  const dispatch = useDispatch()
-  const { account, chainId, provider } = useWeb3React()
-  const poolName = POOL_NAME[poolNameStr]
-  const poolInfo = usePoolInfoV2(poolName, chainId)
-  const { step, errorMessage, errorReason } = useAppSelector(selectWidgetState)
-  const [seniorRedemptionInfo, refreshSeniorRedemptionInfo] =
-    useCancellableRedemptionInfoV2(poolName, 'senior', account, provider)
-  const [juniorRedemptionInfo, refreshJuniorRedemptionInfo] =
-    useCancellableRedemptionInfoV2(poolName, 'junior', account, provider)
-  const poolUnderlyingToken = usePoolUnderlyingTokenInfoV2(poolName, provider)
-  const [seniorPosition, refreshSeniorPosition] = useLenderPositionV2(
-    poolName,
-    'senior',
-    account,
-    provider,
-  )
-  const [juniorPosition, refreshJuniorPosition] = useLenderPositionV2(
-    poolName,
-    'junior',
-    account,
-    provider,
-  )
-  const [redemptionType, setRedemptionType] = useState<REDEMPTION_TYPE>()
-  const redemptionActionInfo = redemptionType
-    ? RedemptionActionInfo[redemptionType]
-    : undefined
-
-  useEffect(() => {
-    if (!step) {
-      dispatch(setStep(WIDGET_STEP.ChooseTranche))
-    }
-  }, [dispatch, step])
-
-  const handleRedeemSuccess = useCallback(
-    (blockNumber: number) => {
-      refreshSeniorRedemptionInfo()
-      refreshJuniorRedemptionInfo()
-      refreshSeniorPosition()
-      refreshJuniorPosition()
-      if (handleSuccess) {
-        handleSuccess(blockNumber)
-      }
-    },
-    [
-      handleSuccess,
-      refreshJuniorPosition,
-      refreshJuniorRedemptionInfo,
-      refreshSeniorPosition,
-      refreshSeniorRedemptionInfo,
-    ],
-  )
-
-  const getMaxAmount = () => {
-    if (redemptionActionInfo?.tranche === 'senior') {
-      return redemptionActionInfo?.action === 'Create'
-        ? seniorPosition
-        : seniorRedemptionInfo?.amount
-    }
-    if (redemptionActionInfo?.tranche === 'junior') {
-      return redemptionActionInfo?.action === 'Create'
-        ? juniorPosition
-        : juniorRedemptionInfo?.amount
-    }
-    return undefined
-  }
-
-  if (!poolInfo || !poolUnderlyingToken) {
-    return (
-      <WidgetWrapper
-        isOpen
-        isLoading
-        loadingTitle='Redeem'
-        handleClose={handleClose}
-        handleSuccess={handleSuccess}
-      />
-    )
-  }
-
-  return (
-    <WidgetWrapper
-      isOpen
-      loadingTitle='Redeem'
-      handleClose={handleClose}
-      handleSuccess={handleRedeemSuccess}
-    >
-      {step === WIDGET_STEP.ChooseTranche && (
-        <ChooseAction
-          poolInfo={poolInfo}
-          poolUnderlyingToken={poolUnderlyingToken}
-          seniorRedemptionInfo={seniorRedemptionInfo}
-          juniorRedemptionInfo={juniorRedemptionInfo}
-          redemptionType={redemptionType}
-          changeRedemptionType={setRedemptionType}
-          seniorPosition={seniorPosition}
-          juniorPosition={juniorPosition}
-        />
-      )}
-      {step === WIDGET_STEP.ChooseAmount && redemptionType && (
-        <ChooseAmount
-          poolInfo={poolInfo}
-          poolUnderlyingToken={poolUnderlyingToken}
-          redemptionType={redemptionType}
-          maxAmount={getMaxAmount() ?? BigNumber.from(0)}
-        />
-      )}
-      {step === WIDGET_STEP.Transfer && redemptionType && (
-        <Transfer
-          poolInfo={poolInfo}
-          poolUnderlyingToken={poolUnderlyingToken}
-          redemptionType={redemptionType}
-        />
-      )}
-      {step === WIDGET_STEP.Done && redemptionType && (
-        <Done
-          poolUnderlyingToken={poolUnderlyingToken}
-          handleAction={handleClose}
-          redemptionType={redemptionType}
-        />
-      )}
-      {step === WIDGET_STEP.Error && (
-        <ErrorModal
-          title='Redeem'
-          errorReason={errorReason}
-          errorMessage={errorMessage}
-          handleOk={handleClose}
-        />
-      )}
-    </WidgetWrapper>
-  )
-}

package/src/components/Lend/withdrawV2/2-ChooseAmount.tsx

@@ -1,88 +0,0 @@
-import {
-  FirstLossCoverIndex,
-  getFirstLossCoverContractV2,
-  PoolInfoV2,
-  UnderlyingTokenInfo,
-} from '@huma-finance/shared'
-import { useWeb3React } from '@web3-react/core'
-import { ethers } from 'ethers'
-import React, { useEffect, useState } from 'react'
-
-import { WithdrawType } from '.'
-import { useAppDispatch } from '../../../hooks/useRedux'
-import { setStep, setWithdrawAmount } from '../../../store/widgets.reducers'
-import { WIDGET_STEP } from '../../../store/widgets.store'
-import { InputAmountModal } from '../../InputAmountModal'
-
-type Props = {
-  poolInfo: PoolInfoV2
-  poolUnderlyingToken: UnderlyingTokenInfo
-  selectedWithdrawType: WithdrawType
-}
-
-export function ChooseAmount({
-  poolInfo,
-  poolUnderlyingToken,
-  selectedWithdrawType,
-}: Props): React.ReactElement | null {
-  const dispatch = useAppDispatch()
-  const { provider } = useWeb3React()
-  const { symbol } = poolUnderlyingToken
-  const [sharePrice, setSharePrice] = useState(0)
-  const [currentAmount, setCurrentAmount] = useState<number>(0)
-  const [currentShares, setCurrentShares] = useState<number>(0)
-  const maxAmountFormatted = ethers.utils.formatUnits(
-    selectedWithdrawType.withdrawableAmount,
-    poolUnderlyingToken.decimals,
-  )
-
-  useEffect(() => {
-    if (selectedWithdrawType.withdrawableAmount.gt(0)) {
-      const fetchData = async () => {
-        const firstLossCoverContract = await getFirstLossCoverContractV2(
-          poolInfo.poolName,
-          Number(selectedWithdrawType.value) as FirstLossCoverIndex,
-          provider,
-        )
-        if (firstLossCoverContract) {
-          const shares = await firstLossCoverContract.convertToShares(
-            selectedWithdrawType.withdrawableAmount,
-          )
-          const price = selectedWithdrawType.withdrawableAmount.div(shares)
-          setSharePrice(price.toNumber())
-        }
-      }
-      fetchData()
-    }
-  }, [
-    poolInfo.poolName,
-    provider,
-    selectedWithdrawType.value,
-    selectedWithdrawType.withdrawableAmount,
-  ])
-
-  const handleChangeAmount = (newAmount: number) => {
-    const shares = Number(newAmount) / sharePrice
-    setCurrentShares(shares)
-    setCurrentAmount(newAmount)
-    dispatch(setWithdrawAmount(Number(newAmount)))
-  }
-
-  const handleAction = () => {
-    dispatch(setStep(WIDGET_STEP.Transfer))
-  }
-
-  return (
-    <InputAmountModal
-      title={`Withdraw ${symbol}`}
-      subTitle={selectedWithdrawType.label}
-      tokenSymbol={symbol}
-      currentAmount={currentAmount}
-      handleChangeAmount={handleChangeAmount}
-      maxAmount={maxAmountFormatted}
-      info={`${currentShares.toFixed(1)} Shares`}
-      handleAction={handleAction}
-      actionText='WITHDRAW'
-    />
-  )
-}

package/src/components/Lend/withdrawV2/3-Transfer.tsx

@@ -1,110 +0,0 @@
-import {
-  FirstLossCoverIndex,
-  getFirstLossCoverContractV2,
-  getTrancheVaultContractV2,
-  PoolInfoV2,
-  TrancheType,
-  UnderlyingTokenInfo,
-} from '@huma-finance/shared'
-import { useWeb3React } from '@web3-react/core'
-import { BigNumber, ethers } from 'ethers'
-import React, { useCallback, useEffect, useState } from 'react'
-
-import { WithdrawType } from '.'
-import { useAppDispatch, useAppSelector } from '../../../hooks/useRedux'
-import { setStep } from '../../../store/widgets.reducers'
-import { selectWidgetState } from '../../../store/widgets.selectors'
-import { WIDGET_STEP } from '../../../store/widgets.store'
-import { LoadingModal } from '../../LoadingModal'
-import { TxSendModalV2 } from '../../TxSendModalV2'
-
-type Props = {
-  poolInfo: PoolInfoV2
-  poolUnderlyingToken: UnderlyingTokenInfo
-  selectedWithdrawType: WithdrawType
-}
-
-export function Transfer({
-  poolInfo,
-  poolUnderlyingToken,
-  selectedWithdrawType,
-}: Props): React.ReactElement | null {
-  const dispatch = useAppDispatch()
-  const { account, provider } = useWeb3React()
-  const { withdrawAmount } = useAppSelector(selectWidgetState)
-  const [firstLossCoverShares, setFirstLossCoverShares] = React.useState<
-    BigNumber | undefined
-  >(undefined)
-  const [contract, setContract] = useState<ethers.Contract | undefined>(
-    undefined,
-  )
-
-  useEffect(() => {
-    const fetchData = async () => {
-      if (account) {
-        if (selectedWithdrawType.type === 'tranche') {
-          const trancheVaultContract = await getTrancheVaultContractV2(
-            poolInfo.poolName,
-            selectedWithdrawType.value as TrancheType,
-            provider,
-            account,
-          )
-          if (trancheVaultContract) {
-            setContract(trancheVaultContract)
-          }
-        }
-        if (selectedWithdrawType.type === 'firstLossCover') {
-          const firstLossCoverContract = await getFirstLossCoverContractV2(
-            poolInfo.poolName,
-            Number(selectedWithdrawType.value) as FirstLossCoverIndex,
-            provider,
-            account,
-          )
-          if (firstLossCoverContract) {
-            const shares = await firstLossCoverContract.convertToShares(
-              ethers.utils.parseUnits(
-                String(withdrawAmount),
-                poolUnderlyingToken.decimals,
-              ),
-            )
-            setFirstLossCoverShares(shares)
-            setContract(firstLossCoverContract)
-          }
-        }
-      }
-    }
-    fetchData()
-  }, [
-    account,
-    poolInfo.poolName,
-    poolUnderlyingToken.decimals,
-    provider,
-    selectedWithdrawType.type,
-    selectedWithdrawType.value,
-    withdrawAmount,
-  ])
-
-  const method =
-    selectedWithdrawType.type === 'tranche' ? 'disburse' : 'redeemCover'
-  const params =
-    selectedWithdrawType.type === 'tranche'
-      ? []
-      : [firstLossCoverShares, account]
-
-  const handleSuccess = useCallback(() => {
-    dispatch(setStep(WIDGET_STEP.Done))
-  }, [dispatch])
-
-  if (!account || !contract) {
-    return <LoadingModal title='Transaction Pending' />
-  }
-
-  return (
-    <TxSendModalV2
-      contract={contract}
-      method={method}
-      params={params}
-      handleSuccess={handleSuccess}
-    />
-  )
-}