Merge pull request #627 from Sifchain/staging

[release] 2.6.11

app/CHANGELOG.md

@@ -1,9 +1,11 @@
-## Release 2022.04.26
+## Release 2022.04.27
 
-- Remove mentions to old rewards programs on `Pool` page
+- Add unbonding period disclaimer to relevant components
+- Fix transaction cancellation error on Add Liquidity page
 
-## Release 2022.04.25
+## Release 2022.04.26
 
+- Remove mentions to old rewards programs on `Pool` page
 - Improved remote caching
 
 ## Release 2022.04.24

app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "app",
-  "version": "2.6.10",
+  "version": "2.6.11",
   "private": true,
   "scripts": {
     "bump": "bump patch --tag --commit 'testnet release '",

app/src/business/usecases/clp/addLiquidity.ts

@@ -1,14 +1,18 @@
+import { Services } from "@/business/services";
+import { Store } from "@/business/store";
+import { PoolStore } from "@/business/store/pools";
+import { useCore } from "@/hooks/useCore";
+import runCatching from "@/utils/runCatching";
 import {
+  createPoolKey,
+  DEFAULT_FEE,
   ErrorCode,
   getErrorMessage,
   IAssetAmount,
-  createPoolKey,
+  SifSigningStargateClient,
+  TransactionStatus,
+  transactionStatusFromDeliverTxResponse,
 } from "@sifchain/sdk";
-
-import { Services } from "@/business/services";
-import { Store } from "@/business/store";
-import { PoolStore } from "@/business/store/pools";
-
 import { ReportTransactionError } from "../utils";
 
 type PickBus = Pick<Services["bus"], "dispatch">;
@@ -45,7 +49,7 @@ export function AddLiquidity(
   return async (
     nativeAssetAmount: IAssetAmount,
     externalAssetAmount: IAssetAmount,
-  ) => {
+  ): Promise<TransactionStatus> => {
     const client = await sif.loadNativeDexClient();
     const address = await wallet.keplrProvider.connect(chains.nativeChain);
     const externalAssetEntry = await tokenRegistry.findAssetEntryOrThrow(
@@ -84,15 +88,22 @@ export function AddLiquidity(
           address,
         );
 
-    const signedTx = await wallet.keplrProvider.sign(
-      chains.nativeChain,
-      txDraft,
+    const signingClient = await SifSigningStargateClient.connectWithSigner(
+      sif.unSignedClient.rpcUrl,
+      await wallet.keplrProvider.getOfflineSignerAuto(chains.nativeChain),
     );
-    const sentTx = await wallet.keplrProvider.broadcast(
-      chains.nativeChain,
-      signedTx,
+    const [error, sentTx] = await runCatching(() =>
+      signingClient.signAndBroadcast(address, txDraft.msgs as any, DEFAULT_FEE),
     );
-    const txStatus = client.parseTxResult(sentTx);
+
+    if (error !== undefined) {
+      return {
+        state: "rejected",
+        hash: "",
+      };
+    }
+
+    const txStatus = transactionStatusFromDeliverTxResponse(sentTx);
     if (txStatus.state !== "accepted") {
       // Edge case where we have run out of native balance and need to represent that
       if (txStatus.code === ErrorCode.TX_FAILED_USER_NOT_ENOUGH_BALANCE) {

app/src/domains/clp/queries/params.ts

@@ -25,6 +25,33 @@ export const useRewardsParamsQuery = () => {
   );
 };
 
+export const useCurrentRewardPeriodStatistics = () => {
+  const { data: rewardsParams } = useRewardsParamsQuery();
+  const { data: blockTimeMs } = useBlockTimeQuery();
+
+  return useQuery(
+    "currentRewardPeriodStatistics",
+    () => {
+      const lockPeriod =
+        rewardsParams.value?.params?.liquidityRemovalLockPeriod.toNumber() ?? 0;
+      const cancelPeriod =
+        rewardsParams.value?.params?.liquidityRemovalCancelPeriod.toNumber() ??
+        0;
+
+      return {
+        estimatedLockMs: lockPeriod * (blockTimeMs.value ?? 0),
+        estimatedCancelMs: cancelPeriod * (blockTimeMs.value ?? 0),
+      };
+    },
+    {
+      enabled: computed(
+        () =>
+          rewardsParams.value !== undefined && blockTimeMs.value !== undefined,
+      ),
+    },
+  );
+};
+
 export const useCurrentRewardPeriod = () => {
   const sifchainClients = useSifchainClients();
   const { data: blockTime } = useBlockTimeQuery();

app/src/hooks/useTransactionDetails.ts

@@ -1,8 +1,10 @@
-import { computed, unref } from "vue";
-import { DeliverTxResponse, TransactionStatus } from "@sifchain/sdk";
-import { Ref, ComputedRef } from "vue";
+import {
+  DeliverTxResponse,
+  TransactionStatus,
+  transactionStatusFromDeliverTxResponse,
+} from "@sifchain/sdk";
 import { BridgeEvent } from "@sifchain/sdk/src/clients/bridges/BaseBridge";
-import { transactionStatusFromDeliverTxResponse } from "@sifchain/sdk/src/clients/native/SifClient";
+import { computed, ComputedRef, Ref, unref } from "vue";
 import { MaybeRef } from "vue-query/lib/vue/types";
 
 export function useBridgeEventDetails(props: {

app/src/utils/runCatching.ts

@@ -0,0 +1,11 @@
+const runCatching = async <TValue, TError extends Error>(
+  func: () => TValue,
+): Promise<[undefined, Awaited<TValue>] | [TError, undefined]> => {
+  try {
+    return [undefined, await func()];
+  } catch (error: any) {
+    return [error, undefined];
+  }
+};
+
+export default runCatching;

app/src/views/PoolPage/children/AddLiquidity/AddLiquidity.tsx

@@ -1,5 +1,6 @@
 import { computed, defineComponent } from "vue";
 import { useRouter } from "vue-router";
+import { formatDistance } from "date-fns";
 import { Network } from "@sifchain/sdk";
 
 import { useTransactionDetails } from "@/hooks/useTransactionDetails";
@@ -12,12 +13,15 @@ import { TokenIcon } from "@/components/TokenIcon";
 import AssetIcon from "@/components/AssetIcon";
 import TransactionDetailsModal from "@/components/TransactionDetailsModal";
 import Toggle from "@/components/Toggle";
+import { Tooltip } from "@/components/Tooltip";
 import { TokenInputGroup } from "@/views/SwapPage/components/TokenInputGroup";
+import { useCurrentRewardPeriodStatistics } from "@/domains/clp/queries/params";
 
 import { useAddLiquidityData } from "./useAddLiquidityData";
 import AssetPair from "./AssetPair";
 import RiskWarning from "./RiskWarning";
-import { Tooltip } from "@/components/Tooltip";
+
+const UNBONDING_PERIOD_DAYS = 7;
 
 export default defineComponent({
   setup(): () => JSX.Element {
@@ -78,6 +82,8 @@ export default defineComponent({
       ],
     }));
 
+    const { data: rewardsPeriod } = useCurrentRewardPeriodStatistics();
+
     return () => {
       if (data.modalStatus.value === "processing") {
         return (
@@ -104,19 +110,43 @@ export default defineComponent({
               </div>
             }
           >
-            <div class="bg-gray-base grid gap-4 rounded-lg p-4">
-              <Form.Details details={detailsRef.value} />
-              {!data.symmetricalPooling.value && (
-                <RiskWarning riskFactorStatus={data.riskFactorStatus} />
-              )}
+            <div class="grid gap-4">
+              <div class="bg-gray-base grid gap-4 rounded-lg p-4">
+                <Form.Details details={detailsRef.value} />
+                {!data.symmetricalPooling.value && (
+                  <RiskWarning riskFactorStatus={data.riskFactorStatus} />
+                )}
+              </div>
+              <div class="flex items-center justify-between overflow-hidden rounded border border-gray-500 p-4">
+                <span class="flex items-center text-slate-300">
+                  Once added, all liquidity will be subject to a{" "}
+                  {formatDistance(0, rewardsPeriod.value?.estimatedLockMs ?? 0)}{" "}
+                  unbonding period. Once your funds are ready, you will have{" "}
+                  {rewardsPeriod.value?.estimatedCancelMs === undefined
+                    ? "..."
+                    : formatDistance(
+                        0,
+                        rewardsPeriod.value?.estimatedCancelMs,
+                      )}{" "}
+                  to remove them before the request is canceled. Please check
+                  back periodically to ensure you don't miss your window!
+                </span>
+                <div>
+                  <AssetIcon
+                    icon="interactive/warning"
+                    class="text-slate-300"
+                    size={22}
+                  />
+                </div>
+              </div>
+              <Button.CallToAction
+                onClick={() => {
+                  data.handleAskConfirmClicked();
+                }}
+              >
+                Confirm
+              </Button.CallToAction>
             </div>
-            <Button.CallToAction
-              onClick={() => {
-                data.handleAskConfirmClicked();
-              }}
-            >
-              Confirm
-            </Button.CallToAction>
           </Modal>
         );
       }

app/src/views/PoolPage/children/UnbondLiquidity.tsx

@@ -4,6 +4,7 @@ import Modal from "@/components/Modal";
 import { TokenIcon } from "@/components/TokenIcon";
 import TransactionDetailsModal from "@/components/TransactionDetailsModal";
 import { useUnlockLiquidityMutation } from "@/domains/clp/mutation/liquidity";
+import { useCurrentRewardPeriodStatistics } from "@/domains/clp/queries/params";
 import { useUnlockLiquidityByPercentage } from "@/domains/clp/queries/unlockLiquidityByPercentage";
 import { useAppWalletPicker } from "@/hooks/useAppWalletPicker";
 import { useAssetBySymbol } from "@/hooks/useAssetBySymbol";
@@ -12,6 +13,7 @@ import { useDeliverTxDetails } from "@/hooks/useTransactionDetails";
 import { useWalletButton } from "@/hooks/useWalletButton";
 import { accountStore } from "@/store/modules/accounts";
 import { Network } from "@sifchain/sdk";
+import { formatDistance } from "date-fns";
 import { computed, defineComponent, ref } from "vue";
 import { useRoute, useRouter } from "vue-router";
 
@@ -39,6 +41,8 @@ const UnbondLiquidity = defineComponent({
 
     const unlockLiquidityMutation = useUnlockLiquidityMutation();
 
+    const { data: currentRewardPeriod } = useCurrentRewardPeriodStatistics();
+
     const poolStats = usePoolStats();
     const { connected } = useWalletButton();
 
@@ -217,9 +221,22 @@ const UnbondLiquidity = defineComponent({
             style="text-align-last: center"
           >
             Liquidity will be equally removed from all pooled assets. Unbonding
-            requests take 7 days to process. Once your funds are ready, you will
-            have 72 hours to remove them before the request is canceled. Please
-            check back periodically to ensure you don't miss your window!
+            requests take{" "}
+            {currentRewardPeriod.value?.estimatedLockMs === undefined
+              ? "..."
+              : formatDistance(
+                  0,
+                  currentRewardPeriod.value?.estimatedLockMs,
+                )}{" "}
+            to process. Once your funds are ready, you will have{" "}
+            {currentRewardPeriod.value?.estimatedCancelMs === undefined
+              ? "..."
+              : formatDistance(
+                  0,
+                  currentRewardPeriod.value?.estimatedCancelMs,
+                )}{" "}
+            to remove them before the request is canceled. Please check back
+            periodically to ensure you don't miss your window!
           </p>
           {!sifAccountRef.value.connected ? (
             <Button.CallToAction

core/src/clients/native/index.ts

@@ -1,3 +1,4 @@
 export * from "./NativeAminoTypes";
 export * from "./NativeDexClient";
 export * from "./NativeDexTransaction";
+export * from "./SifClient";

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sifchain-ui",
-  "version": "2.6.10",
+  "version": "2.6.11",
   "private": true,
   "license": "UNLICENSED",
   "packageManager": "[email protected]",