diff --git a/apps/dex/src/compounds/ManageLiquidityModal/RemoveLiquidityForm.tsx b/apps/dex/src/compounds/ManageLiquidityModal/RemoveLiquidityForm.tsx index 20b2be1f..b8e0fb4b 100644 --- a/apps/dex/src/compounds/ManageLiquidityModal/RemoveLiquidityForm.tsx +++ b/apps/dex/src/compounds/ManageLiquidityModal/RemoveLiquidityForm.tsx @@ -1,15 +1,18 @@ import { Button, Fieldset, Input, RacetrackSpinnerIcon } from "@sifchain/ui"; import BigNumber from "bignumber.js"; import { clamp } from "rambda"; -import { ChangeEventHandler, FormEventHandler, useCallback, useMemo } from "react"; +import { ChangeEventHandler, FormEvent, FormEventHandler, useCallback, useMemo } from "react"; import { useLiquidityProviderQuery } from "~/domains/clp"; import useUnlockLiquidity from "~/domains/clp/formHooks/useUnlockLiquidity"; import useUnlockLiquidityMutation from "~/domains/clp/hooks/useUnlockLiquidityMutation"; import { useTokenRegistryQuery } from "~/domains/tokenRegistry"; import type { ManageLiquidityModalProps } from "./types"; +import {useRewardParams} from "~/domains/clp/hooks/useRewardParams"; +import useRemoveLiquidityMutation from "~/domains/clp/hooks/useRemoveLiquidityMutation"; const UnlockLiquidityForm = (props: ManageLiquidityModalProps) => { const liquidityProviderQuery = useLiquidityProviderQuery(props.denom); + const rewardParams = useRewardParams(); const { indexedByDenom } = useTokenRegistryQuery(); const externalToken = indexedByDenom[props.denom]; @@ -22,6 +25,8 @@ const UnlockLiquidityForm = (props: ManageLiquidityModalProps) => { externalAssetAmount, } = useUnlockLiquidity(props.denom); + const removeLiquidityMutation = useRemoveLiquidityMutation(); + const buttonMessage = useMemo(() => { if (!unlockLiquidityMutation.isReady) { return "Please connect Sifchain wallet"; @@ -29,16 +34,21 @@ const UnlockLiquidityForm = (props: ManageLiquidityModalProps) => { if (unlockLiquidityMutation.isError || unlockLiquidityMutation.isSuccess) { return "Close"; } + var msg = "Unbond liquidity" + if (rewardParams.data?.params?.liquidityRemovalLockPeriod.isZero()) { + msg = "Remove liquidity" + } - return <>{unlockLiquidityMutation.isLoading && }Unbond liquidity; + return <>{unlockLiquidityMutation.isLoading && }{msg}; }, [ unlockLiquidityMutation.isError, unlockLiquidityMutation.isLoading, unlockLiquidityMutation.isReady, unlockLiquidityMutation.isSuccess, + rewardParams, ]); - const onSubmit = useCallback>( + const onSubmitUnlock = useCallback>( (event) => { event.preventDefault(); @@ -58,6 +68,27 @@ const UnlockLiquidityForm = (props: ManageLiquidityModalProps) => { [liquidityProviderQuery.data?.liquidityProvider?.unlocks, props, units, unlockLiquidityMutation], ); + const onSubmitRemove = useCallback>( + (event) => { + event.preventDefault(); + + if (removeLiquidityMutation.isSuccess || removeLiquidityMutation.isError) { + props.onClose(false); + } else { + removeLiquidityMutation.mutate({ denom: props.denom, units }); + } + }, + [props, units, removeLiquidityMutation], + ); + + const onSubmit = (event: FormEvent) => { + if (rewardParams.data?.params?.liquidityRemovalLockPeriod.isZero()) { + return onSubmitRemove(event); + } else { + return onSubmitUnlock(event); + } + }; + const onChangePercentageInput = useCallback>( (event) => { const value = event.target.value.replace(".", "").trim(); diff --git a/apps/dex/src/domains/clp/hooks/useRewardParams.ts b/apps/dex/src/domains/clp/hooks/useRewardParams.ts new file mode 100644 index 00000000..bd39e009 --- /dev/null +++ b/apps/dex/src/domains/clp/hooks/useRewardParams.ts @@ -0,0 +1,34 @@ +import { Decimal } from "@cosmjs/math"; +import { useQuery } from "@tanstack/react-query"; +import invariant from "tiny-invariant"; + +import { useDexEnvironment } from "~/domains/core/envs"; +import { useTokenRegistryQuery } from "~/domains/tokenRegistry"; +import useSifnodeQuery from "~/hooks/useSifnodeQuery"; + +export function useRewardParams( + options: { + refetchInterval?: number; + enabled?: boolean; + } = {}, +) { + const { data: paramsRes } = useSifnodeQuery("clp.getRewardParams", [{}]); + const { data: env } = useDexEnvironment(); + + + return useQuery( + ["rewardParams"], + () => { + invariant(paramsRes !== undefined, "paramsRes is undefined"); + invariant(env !== undefined, "env is undefined"); + + return { + ...paramsRes, + }; + }, + { + enabled: paramsRes !== undefined && env !== undefined, + ...options, + }, + ); +}