wip

Author: 0xAlunara

apps/main/src/llamalend/hooks/mutations/useClosePosition.ts

@@ -0,0 +1,52 @@
+import apiLending from '@/lend/lib/apiLending'
+import { useLlammaMutation } from '@/llamalend/hooks/mutations/useLlammaMutation'
+import networks from '@/loan/networks'
+import type { ChainId } from '@/loan/types/loan.types'
+import type { LendMarketTemplate } from '@curvefi/llamalend-api/lib/lendMarkets'
+import type { MintMarketTemplate } from '@curvefi/llamalend-api/lib/mintMarkets'
+import { notify } from '@ui-kit/features/connect-wallet'
+import { useUserProfileStore } from '@ui-kit/features/user-profile'
+
+const handlers = {
+  pendingMessage: 'Closing position',
+  onSuccess: ({ hash }: { hash?: string }) => hash && notify('Position closed', 'success'),
+  onError: (error: Error) => notify(error.message, 'error'),
+}
+
+/**
+ * Hook for closing a mint position by liquidating the user's position
+ * @param market - The mint market template to close the position for
+ * @returns Mutation object for closing the position
+ */
+export function useClosePositionMint({ market }: { market: MintMarketTemplate | undefined }) {
+  const maxSlippage = useUserProfileStore((state) => state.maxSlippage.crypto)
+
+  return useLlammaMutation({
+    market,
+    mutationFn: async (vars: void, { provider, curve, market }) => {
+      const chainId = curve.chainId as ChainId
+      const liquidateFn = networks[chainId].api.loanLiquidate.liquidate
+
+      return liquidateFn(provider, market, maxSlippage)
+    },
+    ...handlers,
+  })
+}
+
+const { loanSelfLiquidation } = apiLending
+
+/**
+ * Hook for closing a lending position by self-liquidating the user's position
+ * @param market - The lend market template to close the position for
+ * @returns Mutation object for closing the position
+ */
+export function useClosePositionLend({ market }: { market: LendMarketTemplate | undefined }) {
+  const maxSlippage = useUserProfileStore((state) => state.maxSlippage.crypto)
+
+  return useLlammaMutation({
+    market,
+    mutationFn: async (vars: void, { provider, market }) =>
+      loanSelfLiquidation.selfLiquidate(provider, market, maxSlippage),
+    ...handlers,
+  })
+}

apps/main/src/llamalend/hooks/mutations/useLlammaMutation.ts

@@ -0,0 +1,117 @@
+import { useMutation } from '@tanstack/react-query'
+import { useConnection, useWallet } from '@ui-kit/features/connect-wallet'
+import { notify } from '@ui-kit/features/connect-wallet'
+import type { Market } from '../../llamalend.types'
+
+/**
+ * Throws an error if the data contains an error string object.
+ *
+ * This function checks if the contract execution result contains an error object, which typically
+ * indicates that the transaction failed even though the preceding operations succeeded
+ * (a "failed successfully" scenario).
+ *
+ * @param data - The mutation result data to check for errors
+ * @throws {Error} Throws an error if data contains an error string that is not a user rejection
+ *
+ * @remarks
+ * - The error string content is not standardized and does not have a guaranteed form
+ * - Making errors prettier is considered out of scope
+ * - Successfully determining if an error was simply a user cancelling a transaction is out of scope
+ * - User rejection errors (containing "User rejected the request") are ignored and do not throw
+ */
+function throwIfError(data: unknown) {
+  // If the data contains an error object, it probably means the transaction failed even though nothing
+  // before that was going wrong. In other words, 'failed successfully'.
+  if (data != null && typeof data === 'object' && 'error' in data) {
+    // Not fail proof, as the content of the error string is not standardized
+    // and does not have a guaranteed form. Making errors prettier is out of scope and succesfully
+    // determined if it was simple a user cancelling a transaction is out of scope as well.
+    if (typeof data.error === 'string' && !data.error.includes('User rejected the request')) {
+      throw new Error(data.error)
+    }
+  }
+}
+
+/**
+ * Custom context specially for the mutation function.
+ * Usually mutations don't have a context, but they do
+ * when you use our specialized llamma mutation.
+ */
+type MutationFnContext<TMarket extends Market> = {
+  provider: NonNullable<ReturnType<typeof useWallet>['provider']>
+  curve: NonNullable<ReturnType<typeof useConnection>['llamaApi']>
+  market: TMarket
+}
+
+/** Normal mutation context outside of the special context for mutation functions (MutationFnContext) */
+type Context = {
+  pendingNotification: ReturnType<typeof notify>
+}
+
+type LlammaMutationOptions<TMarket extends Market, TVariables, TData, TContext extends Context> = {
+  /** The llamma market instance */
+  market: TMarket | undefined
+  /** Function that performs the mutation operation */
+  mutationFn: (variables: TVariables, context: MutationFnContext<TMarket>) => Promise<TData>
+  /** Message to display during pending state */
+  pendingMessage: string | ((variables: TVariables) => string)
+  /** Callback executed on successful mutation */
+  onSuccess?: (data: TData, variables: TVariables, context: TContext) => void
+  /** Callback executed on mutation error */
+  onError?: (error: Error, variables: TVariables, context: TContext) => void
+  /** Callback executed before mutation starts */
+  onMutate?: (variables: TVariables) => TContext
+  /** Callback executed after mutation settles (success or error) */
+  onSettled?: (data: TData | undefined, error: Error | null, variables: TVariables, context: TContext) => void
+}
+
+/**
+ * Custom hook for handling llamma-related mutations with automatic wallet and API validation
+ * Could argue for a refactor to validate with vest like we do for queries, but I'd rather keep
+ * it simple for now. Maybe another time, for now we're just doing a quick llamma specialization
+ * with simple throwing errors.
+ */
+export function useLlammaMutation<TMarket extends Market, TVariables, TData, TContext extends Context>({
+  market,
+  mutationFn,
+  pendingMessage,
+  onSuccess,
+  onError,
+  onMutate,
+  onSettled,
+}: LlammaMutationOptions<TMarket, TVariables, TData, TContext>) {
+  const { provider } = useWallet()
+  const { llamaApi: curve } = useConnection()
+
+  return useMutation({
+    mutationFn: (variables: TVariables) => {
+      if (!provider) throw new Error('Missing provider')
+      if (!curve) throw new Error('Missing lending api')
+      if (!market) throw new Error('Missing llamma market')
+
+      return mutationFn(variables, { provider, curve, market })
+    },
+    onMutate: (variables) => {
+      const pendingNotification = notify(
+        typeof pendingMessage === 'function' ? pendingMessage(variables) : pendingMessage,
+        'pending',
+      )
+
+      const userContext = onMutate?.(variables)
+      return { pendingNotification, ...userContext } as TContext
+    },
+    onSuccess: (data, variables, context) => {
+      throwIfError(data)
+      onSuccess?.(data, variables, context)
+    },
+    onError: (error, variables, context) => {
+      // Log the full error, otherwise we lose the original stack trace
+      console.error('Llamma mutation error:', error)
+      onError?.(error, variables, context!)
+    },
+    onSettled: (data, error, variables, context) => {
+      context?.pendingNotification?.dismiss()
+      onSettled?.(data, error, variables, context!)
+    },
+  })
+}

apps/main/src/llamalend/hooks/mutations/useRepay.ts

@@ -0,0 +1,68 @@
+import apiLending from '@/lend/lib/apiLending'
+import { useLlammaMutation } from '@/llamalend/hooks/mutations/useLlammaMutation'
+import networks from '@/loan/networks'
+import { getLoanDecreaseActiveKey } from '@/loan/store/createLoanDecreaseSlice'
+import type { ChainId } from '@/loan/types/loan.types'
+import type { LendMarketTemplate } from '@curvefi/llamalend-api/lib/lendMarkets'
+import type { MintMarketTemplate } from '@curvefi/llamalend-api/lib/mintMarkets'
+import { notify } from '@ui-kit/features/connect-wallet'
+import { getTokens } from '@ui-kit/features/manage-soft-liquidation/helpers'
+import type { Market } from '@ui-kit/features/manage-soft-liquidation/types'
+
+const handlers = (symbol: string = '?') => ({
+  pendingMessage: ({ debt }: { debt: string }) => `Repaying debt: ${debt} ${symbol}`,
+  onSuccess: ({ hash }: { hash?: string }, { debt }: { debt: string }) =>
+    hash && notify(`Repaid debt: ${debt} ${symbol}`, 'success'),
+  onError: (error: Error) => notify(error.message, 'error'),
+})
+
+/**
+ * Extracts the stablecoin symbol from a market
+ * @param market - The market to extract the symbol from
+ * @returns The stablecoin symbol or undefined if market is not available
+ */
+const getSymbol = (market: Market | undefined) => (market && getTokens(market))?.stablecoin?.symbol
+
+export function useRepayMint({ market }: { market: MintMarketTemplate | undefined }) {
+  const symbol = getSymbol(market)
+
+  return useLlammaMutation({
+    market,
+    mutationFn: ({ debt }: { debt: string }, { provider, curve, market }) => {
+      const chainId = curve.chainId as ChainId
+      const repayFn = networks[chainId].api.loanDecrease.repay
+      const activeKey = getLoanDecreaseActiveKey(market, debt, false)
+
+      return repayFn(activeKey, provider, market, debt, false)
+    },
+    ...handlers(symbol),
+  })
+}
+
+const { loanRepay } = apiLending
+
+export function useRepayLend({ market }: { market: LendMarketTemplate | undefined }) {
+  const symbol = getSymbol(market)
+
+  return useLlammaMutation({
+    market,
+    mutationFn: ({ debt }: { debt: string }, { provider, curve, market }) => {
+      throw new Error('Not yet implemented')
+
+      // loanRepay.repay(
+      //   activeKey,
+      //   provider,
+      //   market,
+      //   stateCollateral,
+      //   userCollateral,
+      //   userBorrowed,
+      //   isFullRepay,
+      //   maxSlippage,
+      //   swapRequired,
+      // )
+
+      return Promise.resolve({ hash: '' })
+    },
+    ...handlers(symbol),
+  })
+}

apps/main/src/llamalend/llamalend.types.ts

@@ -1,5 +1,9 @@
 import type { INetworkName } from '@curvefi/llamalend-api/lib/interfaces'
+import type { LendMarketTemplate } from '@curvefi/llamalend-api/lib/lendMarkets'
+import type { MintMarketTemplate } from '@curvefi/llamalend-api/lib/mintMarkets'
 
 export type NetworkEnum = INetworkName
 
 export type NetworkUrlParams = { network: NetworkEnum }
+
+export type Market = MintMarketTemplate | LendMarketTemplate

apps/main/src/loan/components/PageLoanManage/LoanManageSoftLiq.tsx

@@ -0,0 +1,138 @@
+import { useCallback, useMemo, useState } from 'react'
+import { useChainId } from 'wagmi'
+import { useClosePositionMint } from '@/llamalend/hooks/mutations/useClosePosition'
+import { useRepayMint } from '@/llamalend/hooks/mutations/useRepay'
+import { useUserLoanDetails } from '@/loan/hooks/useUserLoanDetails'
+import useStore from '@/loan/store/useStore'
+import type { MintMarketTemplate } from '@curvefi/llamalend-api/lib/mintMarkets'
+import {
+  ManageSoftLiquidation,
+  type ActionInfosProps,
+  type ClosePositionProps,
+  type ImproveHealthProps,
+} from '@ui-kit/features/manage-soft-liquidation'
+import {
+  checkCanClose,
+  getCollateralInfo,
+  getCollateralToRecover,
+  getDebtToken,
+  getHealthInfo,
+  getLoanInfo,
+  getTokens,
+  parseFloatOptional,
+} from '@ui-kit/features/manage-soft-liquidation/helpers'
+import { useTokenUsdRate } from '@ui-kit/lib/model/entities/token-usd-rate'
+
+type Props = {
+  market: MintMarketTemplate | undefined
+}
+
+/** Main component hooking up the manage soft liquidation card. Preferably only this parent component uses loan app specific imports. */
+export const LoanManageSoftLiq = ({ market }: Props) => {
+  // Internal state
+  const [repayBalance, setRepayBalance] = useState(0)
+
+  // User data
+  const llammaId = market?.id || ''
+  const userLoanDetails = useUserLoanDetails(llammaId)
+  const userBalancesRaw = useStore((state) => state.loans.userWalletBalancesMapper[llammaId])
+  const userBalances = useMemo(() => userBalancesRaw ?? {}, [userBalancesRaw])
+  const { userState } = userLoanDetails ?? {}
+
+  // Loan data
+  const loanDetails = useStore((state) => state.loans.detailsMapper[llammaId])
+  const { parameters: loanParameters } = loanDetails ?? {}
+
+  // Tokens with usd rates
+  const chainId = useChainId()
+  const tokens = market && getTokens(market)
+  const { data: stablecoinUsdRate } = useTokenUsdRate(
+    { chainId, tokenAddress: tokens?.stablecoin?.address },
+    !!tokens?.stablecoin?.address,
+  )
+
+  const { data: collateralTokenUsdRate } = useTokenUsdRate(
+    { chainId, tokenAddress: tokens?.collateral?.address },
+    !!tokens?.collateral?.address,
+  )
+
+  const stablecoinToken = useMemo(
+    () => tokens?.stablecoin && { ...tokens.stablecoin, usdRate: stablecoinUsdRate },
+    [tokens?.stablecoin, stablecoinUsdRate],
+  )
+
+  const collateralToken = useMemo(
+    () => tokens?.collateral && { ...tokens.collateral, usdRate: collateralTokenUsdRate },
+    [tokens?.collateral, collateralTokenUsdRate],
+  )
+
+  // Properties
+  const debtToken = useMemo(() => getDebtToken({ market, userState }), [market, userState])
+  const collateralToRecover = useMemo(
+    () =>
+      getCollateralToRecover({
+        userState,
+        stablecoinToken,
+        collateralToken,
+      }),
+    [collateralToken, stablecoinToken, userState],
+  )
+  const canClose = useMemo(() => checkCanClose({ userState, userBalances }), [userBalances, userState])
+
+  // Improve health tab
+  const repay = useRepayMint({ market })
+  const onRepay = useCallback(() => {
+    repay.mutate({ debt: repayBalance.toString() })
+  }, [repay, repayBalance])
+
+  const improveHealthTab: ImproveHealthProps = {
+    debtToken,
+    userBalance: parseFloatOptional(userBalances?.stablecoin),
+    status: repay.isPending ? 'repay' : 'idle',
+    onDebtBalance: setRepayBalance,
+    onRepay,
+    onApproveLimited: () => {},
+    onApproveInfinite: () => {},
+  }
+
+  // Close position tab
+  const closePosition = useClosePositionMint({ market })
+  const onClose = useCallback(() => {
+    closePosition.mutate()
+  }, [closePosition])
+
+  const closePositionTab: ClosePositionProps = {
+    debtToken,
+    collateralToRecover,
+    canClose,
+    status: closePosition.isPending ? 'close' : 'idle',
+    onClose,
+  }
+
+  // Action infos
+  const health = getHealthInfo({ userLoanDetails })
+  const loan = getLoanInfo({
+    market,
+    loanParameters,
+    userState,
+    collateralToRecover,
+  })
+  const collateral = getCollateralInfo({ market, userState })
+
+  const actionInfos: ActionInfosProps = {
+    health,
+    loan,
+    collateral,
+    transaction: {
+      estimatedTxCost: { eth: 0.0024, gwei: 0.72, dollars: 0.48 },
+    },
+  }
+
+  return (
+    <ManageSoftLiquidation
+      actionInfos={actionInfos}
+      improveHealth={improveHealthTab}
+      closePosition={closePositionTab}
+    />
+  )
+}