Merge pull request #661 from Sifchain/staging

[release] v2.6.18

app/CHANGELOG.md

@@ -1,9 +1,20 @@
+## Release 2022.05.09
+
+- Add more information about price impact on Swap's confirmation step
+- Include "pool composition" information to Add Liquidity widget
+
 ## Release 2022.05.02
+
 - Fix Terra Station integration
+
 ## Release 2022.04.30
+
 - Fix EVMOS chain display decimals
+
 ## Release 2022.04.27
+
 - Add EVMOS chain
+
 ## Release 2022.04.27
 
 - Add unbonding period disclaimer to relevant components
@@ -103,15 +114,16 @@
 ## Release 2021.11.04
 
 - Enabled E-Money
+
   - EEUR
   - NGM
 
-* Sif's Bonus Pool - EEUR:
+- Sif's Bonus Pool - EEUR:
   - Import EEUR
   - Pool EEUR
   - Earn Rowan
 
-## Release 2021.10.29
+## Release 2021.10.29\
 
 - Enabled OH token from oh.finance
 
@@ -120,7 +132,7 @@
 - Enabled Terra via Terra Station Wallet: UST, LUNA
 - Sif's Bonus Pools for UST and LUNA
 
-## Release 2021.10.18
+## Release 2021.10.20
 
 - Enabled OSMO
 - Sif's Bonus Pool - OSMO:

app/package.json

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

app/src/business/calculators/reactiveAddLiquidityCalculator.ts

@@ -188,10 +188,9 @@ export function useReactivePoolCalculator(input: {
     }
 
     if (!preExistingPool.value.contains(tokenAField.value.asset)) return null;
-    const externalBalance = preExistingPool.value.getAmount(
-      tokenAField.value.asset,
-    );
-    const nativeBalance = preExistingPool.value.getAmount("rowan");
+    const externalBalance = preExistingPool.value.externalAmount;
+
+    const nativeBalance = preExistingPool.value.nativeAmount;
 
     return [nativeBalance, externalBalance];
   });

app/src/business/calculators/swapCalculatorPMTP.ts

@@ -271,6 +271,43 @@ export function useSwapCalculator(input: {
     );
   });
 
+  const effectiveMinimumReceived = computed(() => {
+    if (
+      !input.slippage.value ||
+      !toField.value.asset ||
+      !swapResult.value ||
+      !providerFee.value ||
+      !pool.value ||
+      !fromField.value.fieldAmount
+    )
+      return null;
+
+    const slippage = Amount(input.slippage.value).divide(Amount("100"));
+
+    let minAmount = Amount("0");
+
+    if (flagsStore.state.pmtp) {
+      const priceImpact = pool.value
+        .calcPriceImpact(fromField.value.fieldAmount)
+        .divide("100");
+
+      const effectivePriceImpactRate = Amount("1").subtract(priceImpact);
+
+      minAmount = swapResult.value
+        .multiply(effectivePriceImpactRate)
+        .subtract(providerFee.value);
+    } else {
+      // default minAmount calculation:
+      // only subtracts the slippage from the swap result
+
+      const effeciveSlippageRate = Amount("1").subtract(slippage);
+
+      minAmount = effeciveSlippageRate.multiply(swapResult.value);
+    }
+
+    return AssetAmount(toField.value.asset, minAmount);
+  });
+
   // minimumReceived
   const minimumReceived = computed(() => {
     if (
@@ -383,6 +420,7 @@ export function useSwapCalculator(input: {
     priceImpact,
     providerFee: formattedProviderFee,
     minimumReceived,
+    effectiveMinimumReceived,
     swapResult,
     reverseSwapResult,
     priceRatio,

app/src/components/Modal.tsx

@@ -86,7 +86,7 @@ export default defineComponent({
         >
           <div
             class={[
-              "relative flex-col items-center justify-start md:w-[530px]",
+              "relative flex-col items-center justify-start md:w-[538px]",
               "rounded-lg bg-black p-4 text-white",
               props.class,
             ]}
@@ -102,8 +102,7 @@ export default defineComponent({
                     {props.heading}
                   </span>
                 </div>
-                <div>{props.headingAction}</div>
-
+                <div class="flex-1">{props.headingAction}</div>
                 <div class="flex items-center">
                   {props.showClose && (
                     <button onClick={() => props.onClose?.()}>

app/src/components/TokenIcon.tsx

@@ -54,7 +54,10 @@ export const TokenIcon = defineComponent({
             ? "invert(100%) hue-rotate(-180deg)"
             : "",
         }}
-        class={[`transition-all duration-100`, this.class]}
+        class={[
+          `overflow-hidden rounded-full ring-1 ring-black/90 transition-all duration-100`,
+          this.class,
+        ]}
       />
     );
   },

app/src/domains/clp/mutation/liquidity.ts

@@ -11,8 +11,12 @@ import {
 } from "@cosmjs/stargate";
 import { DEFAULT_FEE } from "@sifchain/sdk";
 import { Network } from "@sifchain/sdk/src";
-import produce from "immer";
-import { useMutation, UseMutationOptions, useQueryClient } from "vue-query";
+import {
+  QueryClient,
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "vue-query";
 import {
   LIQUIDITY_PROVIDERS_KEY,
   LIQUIDITY_PROVIDER_KEY,
@@ -21,6 +25,7 @@ import {
 } from "../queries/liquidityProvider";
 import { useRewardsParamsQuery } from "../queries/params";
 import { addDetailToLiquidityProvider } from "../utils";
+import { produce } from "immer";
 
 export type UnlockLiquidityParams = {
   units: string;
@@ -106,11 +111,13 @@ export const useUnlockLiquidityMutation = () => {
           });
         }
       },
-      onSuccess: (data) => {
+      onSuccess: async (data) => {
         if (isDeliverTxFailure(data)) return;
 
-        queryClient.invalidateQueries(LIQUIDITY_PROVIDER_KEY);
-        queryClient.invalidateQueries(LIQUIDITY_PROVIDERS_KEY);
+        await Promise.all([
+          queryClient.invalidateQueries(LIQUIDITY_PROVIDER_KEY),
+          queryClient.invalidateQueries(LIQUIDITY_PROVIDERS_KEY),
+        ]);
       },
     },
   );
@@ -177,50 +184,135 @@ export const useRemoveLiquidityMutation = (
           });
         }
       },
-      onSuccess: (data, variables, context) => {
+      onSuccess: async (data, variables, context) => {
         options?.onSuccess?.(data, variables, context);
         if (isDeliverTxFailure(data)) return;
 
-        const { requestHeight, externalAssetSymbol } = variables;
-
-        const oldLiquidityProviders = queryClient.getQueryData<
-          UseQueryDataType<typeof useLiquidityProvidersQuery>
-        >(LIQUIDITY_PROVIDERS_KEY);
-
-        if (oldLiquidityProviders !== undefined) {
-          queryClient.setQueryData(
-            LIQUIDITY_PROVIDERS_KEY,
-            produce(oldLiquidityProviders, (x) => {
-              x.liquidityProviderData.forEach((y) => {
-                if (y.liquidityProvider !== undefined) {
-                  y.liquidityProvider.unlocks =
-                    y.liquidityProvider.unlocks.filter(
-                      (x) => x.requestHeight !== requestHeight,
-                    );
-                }
-              });
-            }),
-          );
+        removeUnlockRequestFromCache(
+          queryClient,
+          variables.externalAssetSymbol,
+          variables.requestHeight,
+        );
+        await Promise.all([
+          queryClient.invalidateQueries(LIQUIDITY_PROVIDERS_KEY),
+          queryClient.invalidateQueries(LIQUIDITY_PROVIDER_KEY),
+        ]);
+      },
+    },
+  );
+};
+
+export const useCancelLiquidityUnlockMutation = () => {
+  const sifchainClients = useSifchainClients();
+  const tokenEntriesQuery = useTokenRegistryEntriesQuery({ enabled: false });
+  const queryClient = useQueryClient();
+  const { services } = useCore();
+
+  return useMutation(
+    async ({
+      units,
+      externalAssetSymbol,
+    }: UnlockLiquidityParams & { requestHeight: number }) => {
+      const client = await sifchainClients.getOrInitSigningClient();
+      const signer = await services.wallet.keplrProvider.connect(
+        services.chains.nativeChain,
+      );
+      const externalAsset = await tokenEntriesQuery.refetch
+        .value()
+        .then((x) =>
+          x.data?.registry?.entries.find(
+            (x) => x.baseDenom === externalAssetSymbol,
+          ),
+        );
+
+      return client.signAndBroadcast(
+        signer,
+        [
+          {
+            typeUrl: "/sifnode.clp.v1.MsgCancelUnlock",
+            value: {
+              signer,
+              externalAsset: { symbol: externalAsset?.denom ?? "" },
+              units,
+            },
+          },
+        ],
+        DEFAULT_FEE,
+      );
+    },
+    {
+      onSettled: (data, error) => {
+        if (!isNil(error) || (data !== undefined && isDeliverTxFailure(data))) {
+          return services.bus.dispatch({
+            type: "ErrorEvent",
+            payload: { message: "Failed to cancel liquidity unlock request" },
+          });
         }
 
-        const oldLiquidityProvider = queryClient.getQueryData<
-          UseQueryDataType<typeof useLiquidityProviderQuery>
-        >([LIQUIDITY_PROVIDER_KEY, externalAssetSymbol]);
-
-        if (oldLiquidityProvider !== undefined) {
-          queryClient.setQueriesData(
-            LIQUIDITY_PROVIDER_KEY,
-            produce(oldLiquidityProvider, (x) => {
-              if (x.liquidityProvider !== undefined) {
-                x.liquidityProvider.unlocks =
-                  x.liquidityProvider.unlocks.filter(
-                    (y) => y.requestHeight !== requestHeight,
-                  );
-              }
-            }),
-          );
+        if (data !== undefined && isDeliverTxSuccess(data)) {
+          return services.bus.dispatch({
+            type: "SuccessEvent",
+            payload: {
+              message: "Successfully cancel liquidity unlock request",
+            },
+          });
         }
       },
+      onSuccess: async (data, variables) => {
+        if (isDeliverTxFailure(data)) return;
+
+        removeUnlockRequestFromCache(
+          queryClient,
+          variables.externalAssetSymbol,
+          variables.requestHeight,
+        );
+        await Promise.all([
+          queryClient.invalidateQueries(LIQUIDITY_PROVIDER_KEY),
+          queryClient.invalidateQueries(LIQUIDITY_PROVIDERS_KEY),
+        ]);
+      },
     },
   );
 };
+
+const removeUnlockRequestFromCache = (
+  queryClient: QueryClient,
+  externalAssetSymbol: string,
+  requestHeight: number,
+) => {
+  const oldLiquidityProviders = queryClient.getQueryData<
+    UseQueryDataType<typeof useLiquidityProvidersQuery>
+  >(LIQUIDITY_PROVIDERS_KEY);
+
+  if (oldLiquidityProviders !== undefined) {
+    queryClient.setQueryData(
+      LIQUIDITY_PROVIDERS_KEY,
+      produce(oldLiquidityProviders, (x) => {
+        x.liquidityProviderData.forEach((y) => {
+          if (y.liquidityProvider !== undefined) {
+            y.liquidityProvider.unlocks = y.liquidityProvider.unlocks.filter(
+              (x) => x.requestHeight !== requestHeight,
+            );
+          }
+        });
+      }),
+    );
+  }
+
+  const oldLiquidityProvider = queryClient.getQueryData<
+    UseQueryDataType<typeof useLiquidityProviderQuery>
+  >([LIQUIDITY_PROVIDER_KEY, externalAssetSymbol]);
+
+  if (oldLiquidityProvider !== undefined) {
+    queryClient.setQueriesData(
+      LIQUIDITY_PROVIDER_KEY,
+      produce(oldLiquidityProvider, (x) => {
+        if (x.liquidityProvider !== undefined) {
+          x.liquidityProvider.unlocks = x.liquidityProvider.unlocks.filter(
+            (y) => y.requestHeight !== requestHeight,
+          );
+        }
+      }),
+    );
+  }
+};