Merge remote-tracking branch 'origin/master' into coinbase-wallet

package.json

@@ -20,7 +20,7 @@
     "@polkadot/util": "^13.1.1",
     "@polkadot/util-crypto": "^13.1.1",
     "@polkadot/ui-shared": "^3.1.4",
-    "@galacticcouncil/xcm-core": "^5.3.1",
+    "@galacticcouncil/xcm-core": "^5.4.0",
     "strip-ansi": "6.0.1",
     "string-width": "4.2.2",
     "wrap-ansi": "7.0.0",
@@ -38,18 +38,18 @@
     "@emotion/styled": "^11.10.4",
     "@ethersproject/address": "^5.7.0",
     "@ethersproject/providers": "^5.7.2",
-    "@galacticcouncil/apps": "8.3.0",
+    "@galacticcouncil/apps": "^9.0.2",
     "@galacticcouncil/math-lbp": "^1.0.0",
     "@galacticcouncil/math-liquidity-mining": "^1.0.0",
     "@galacticcouncil/math-omnipool": "^1.0.0",
     "@galacticcouncil/math-stableswap": "^1.0.0",
     "@galacticcouncil/math-staking": "^1.0.0",
     "@galacticcouncil/math-xyk": "^1.0.0",
-    "@galacticcouncil/sdk": "^4.6.1",
+    "@galacticcouncil/sdk": "^5.0.1",
     "@galacticcouncil/ui": "^5.2.3",
-    "@galacticcouncil/xcm-cfg": "5.4.3",
-    "@galacticcouncil/xcm-core": "^5.3.1",
-    "@galacticcouncil/xcm-sdk": "^6.3.2",
+    "@galacticcouncil/xcm-cfg": "^5.6.0",
+    "@galacticcouncil/xcm-core": "^5.4.0",
+    "@galacticcouncil/xcm-sdk": "^7.0.0",
     "@hookform/resolvers": "^3.3.4",
     "@lit-labs/react": "^1.1.0",
     "@polkadot/api": "14.0.1",

src/api/payments.ts

@@ -32,23 +32,46 @@ export const getAcceptedCurrency = (api: ApiPromise) => async () => {
 }
 
 export const useAcceptedCurrencies = (ids: string[]) => {
-  const { api, isLoaded } = useRpcProvider()
+  const { api, isLoaded, tradeRouter } = useRpcProvider()
   const { native } = useAssets()
 
-  return useQuery(QUERY_KEYS.acceptedCurrencies, getAcceptedCurrency(api), {
-    enabled: isLoaded && ids.length > 0,
-    select: (assets) => {
+  return useQuery(
+    QUERY_KEYS.acceptedCurrencies(ids),
+    async () => {
+      const [pools, acceptedCurrency] = await Promise.all([
+        tradeRouter.getPools(),
+        getAcceptedCurrency(api)(),
+      ])
+
       return ids.map((id) => {
-        const response = assets.find((asset) => asset.id === id)
+        const currency = acceptedCurrency.find((currency) => currency.id === id)
+
+        if (currency) {
+          return currency
+        }
+
+        if (id === native.id) {
+          return { id, accepted: true, data: undefined }
+        }
+
+        const hasPoolWithDOT = !!pools.find((pool) => {
+          return (
+            pool.tokens.find((token) => token.id === id) &&
+            pool.tokens.find((token) => token.id === "5")
+          )
+        })
 
-        return response
-          ? response
-          : id === native.id
-            ? { id, accepted: true, data: undefined }
-            : { id, accepted: false, data: undefined }
+        if (hasPoolWithDOT) {
+          return { id, accepted: true, data: undefined }
+        }
+
+        return { id, accepted: false, data: undefined }
       })
     },
-  })
+    {
+      enabled: isLoaded && ids.length > 0,
+    },
+  )
 }
 
 export const useSetAsFeePayment = () => {

src/api/provider.ts

@@ -5,7 +5,7 @@ import { persist } from "zustand/middleware"
 import { SubstrateApis } from "@galacticcouncil/xcm-core"
 import { useMemo } from "react"
 import { useShallow } from "hooks/useShallow"
-import { omit, pick } from "utils/rx"
+import { pick } from "utils/rx"
 import { ApiPromise, WsProvider } from "@polkadot/api"
 import { useRpcProvider } from "providers/rpcProvider"
 import {
@@ -19,8 +19,7 @@ import { useUserExternalTokenStore } from "sections/wallet/addToken/AddToken.uti
 import { useAssetRegistry, useSettingsStore } from "state/store"
 import { undefinedNoop } from "utils/helpers"
 import { ExternalAssetCursor } from "@galacticcouncil/apps"
-import { getPendulumAssetIdFromGeneralKey } from "utils/externalAssets"
-import { pendulum } from "./external/pendulum"
+import { getExternalId } from "utils/externalAssets"
 import { pingRpc } from "utils/rpc"
 
 export type TEnv = "testnet" | "mainnet"
@@ -180,15 +179,11 @@ export const useProviderAssets = () => {
                 (tradeAsset) => tradeAsset.id === asset.id,
               )
               return {
-                ...omit(["externalId"], asset),
+                ...asset,
                 symbol: asset.symbol ?? "",
                 decimals: asset.decimals ?? 0,
                 name: asset.name ?? "",
-                externalId:
-                  asset.origin === pendulum.parachainId &&
-                  typeof asset.externalId === "object"
-                    ? getPendulumAssetIdFromGeneralKey(asset.externalId)
-                    : asset.externalId?.toString(),
+                externalId: getExternalId(asset),
                 isTradable,
               }
             }),

src/components/AssetIcon/AssetIcon.tsx

@@ -10,7 +10,7 @@ import { assetPlaceholderCss, SATokenWrapper } from "./AssetIcon.styled"
 import { useMemo } from "react"
 import { useTranslation } from "react-i18next"
 import { useExternalAssetsWhiteList } from "api/external"
-import { HYDRADX_PARACHAIN_ID } from "@galacticcouncil/sdk"
+import { findNestedKey, HYDRADX_PARACHAIN_ID } from "@galacticcouncil/sdk"
 import { ResponsiveValue } from "utils/responsive"
 import { useAssets } from "providers/assets"
 import { Icon } from "components/Icon/Icon"
@@ -88,11 +88,45 @@ export const AssetLogo = ({ id }: { id?: string }) => {
 
   const { details, badgeVariant } = asset
 
-  const underlyingAssetId =
-    details && isErc20(details) ? details.underlyingAssetId : undefined
-
   if (details) {
+    const underlyingAssetId = isErc20(details)
+      ? details.underlyingAssetId
+      : undefined
+
+    const ethereumNetworkEntry = findNestedKey(details.location, "ethereum")
+
+    if (ethereumNetworkEntry) {
+      const { ethereum } = ethereumNetworkEntry
+      const ethereumChain = findNestedKey(ethereum, "chainId")
+      const ethereumAsset = findNestedKey(details.location, "key")
+
+      return (
+        <UigcAssetId
+          css={{ "& uigc-logo-chain": { display: "none" } }}
+          ref={(el) => {
+            el &&
+              ethereumChain.chainId &&
+              el.setAttribute("chainOrigin", ethereumChain.chainId)
+            el && el.setAttribute("fit", "")
+          }}
+          ecosystem="ethereum"
+          asset={ethereumAsset.key}
+          chain={ethereumChain.chainId}
+          chainOrigin={ethereumChain.chainId}
+        >
+          {badgeVariant && (
+            <UigcAssetBadge
+              slot="badge"
+              variant={badgeVariant}
+              text={t(`wallet.addToken.tooltip.${badgeVariant}`)}
+            />
+          )}
+        </UigcAssetId>
+      )
+    }
+
     const Wrapper = underlyingAssetId ? SATokenWrapper : React.Fragment
+
     return (
       <Wrapper>
         <UigcAssetId

src/i18n/locales/en/translations.json

@@ -844,7 +844,7 @@
   "staking.dashboard.rewards.legend.current": "Current rewards",
   "staking.dashboard.rewards.legend.future": "Rewards after voting",
   "staking.dashboard.rewards.legend.tooltip": "You have to vote max conviction with whole staking position",
-  "staking.dashboard.graph.axisY": "Paylable Percentage",
+  "staking.dashboard.graph.axisY": "Payable Percentage",
   "staking.dashboard.graph.axisX": "Days",
   "staking.dashboard.rewards.button": "Claim",
   "staking.dashboard.stats.chart.label": "Staked HDX",

src/providers/assets.tsx

@@ -6,7 +6,7 @@ import {
   useMemo,
 } from "react"
 import { TAssetStored, useAssetRegistry, useSettingsStore } from "state/store"
-import { Bond } from "@galacticcouncil/sdk"
+import { Bond, findNestedKey } from "@galacticcouncil/sdk"
 import { useProviderRpcUrlStore } from "api/provider"
 import { useUserExternalTokenStore } from "sections/wallet/addToken/AddToken.utils"
 import { HUB_ID, NATIVE_ASSET_ID } from "utils/api"
@@ -56,9 +56,11 @@ const getFullAsset = (asset: TAssetStored) => {
   const isErc20 = asset.type === "Erc20"
   const isShareToken = false
 
+  const parachainEntry = findNestedKey(asset.location, "parachain")
+
   return {
     ...asset,
-    parachainId: asset.origin?.toString(),
+    parachainId: parachainEntry?.parachain,
     existentialDeposit: asset.existentialDeposit,
     isToken,
     isBond,

src/sections/assets/AssetsModal.utils.tsx

@@ -18,6 +18,7 @@ interface useAssetsModalProps {
   allAssets?: boolean
   confirmRequired?: boolean
   defaultSelectedAsssetId?: string
+  withExternal?: boolean
 }
 
 export const useAssetsModal = ({
@@ -28,6 +29,7 @@ export const useAssetsModal = ({
   allAssets,
   confirmRequired,
   defaultSelectedAsssetId,
+  withExternal,
 }: useAssetsModalProps) => {
   const { t } = useTranslation()
   const [isOpen, setIsOpen] = useState(false)
@@ -61,6 +63,7 @@ export const useAssetsModal = ({
         allAssets={allAssets}
         confirmRequired={confirmRequired}
         defaultSelectedAsssetId={defaultSelectedAsssetId}
+        withExternal={withExternal}
       />
     </Modal>
   ) : null

src/sections/pools/modals/AddLiquidity/AddLiquidityInfoCard.tsx

@@ -13,7 +13,10 @@ export const PoolAddLiquidityInformationCard = () => {
         <Text fs={13} lh={16}>
           {t("liquidity.add.modal.information.text")}
         </Text>
-        <SLink href={`${DOC_LINK}/omnipool_impermanent_loss`} target="_blank">
+        <SLink
+          href={`${DOC_LINK}/products/trading/pools/learn_amm#impermanent-loss`}
+          target="_blank"
+        >
           {t("liquidity.add.modal.information.linkText")}
         </SLink>
       </div>

src/sections/pools/stablepool/removeLiquidity/RemoveLiquidityModal.tsx

@@ -3,7 +3,7 @@ import { useTranslation } from "react-i18next"
 import { useModalPagination } from "components/Modal/Modal.utils"
 import { useState } from "react"
 import { Modal } from "components/Modal/Modal"
-import { Stepper } from "components/Stepper/Stepper"
+import { getStepState, Stepper } from "components/Stepper/Stepper"
 import { ModalContents } from "components/Modal/contents/ModalContents"
 import { RemoveLiquidityForm } from "sections/pools/modals/RemoveLiquidity/RemoveLiquidityForm"
 import { RemoveStablepoolLiquidityForm } from "./RemoveLiquidityForm"
@@ -59,6 +59,7 @@ export const RemoveLiquidityModal = ({
   const [selectedOption, setSelectedOption] = useState<RemoveOption>("SHARES")
   const [sharesAmount, setSharesAmount] = useState<string>()
   const [removeAll, setRemoveAll] = useState(false)
+  const [currentStep, setCurrentStep] = useState(0)
 
   const handleBack = () => {
     if (page === RemoveStablepoolLiquidityPage.ASSETS) {
@@ -70,6 +71,7 @@ export const RemoveLiquidityModal = ({
     }
 
     paginateTo(page - 1)
+    setCurrentStep((step) => step - 1)
   }
 
   const steps = [
@@ -79,14 +81,6 @@ export const RemoveLiquidityModal = ({
     t("liquidity.stablepool.remove.stablepool"),
   ]
 
-  const getStepState = (stepPage: RemoveStablepoolLiquidityPage) => {
-    if (stepPage === page) {
-      return "active" as const
-    }
-
-    return page > stepPage ? ("done" as const) : ("todo" as const)
-  }
-
   const canGoBack =
     isRemovingOmnipoolPosition || page === RemoveStablepoolLiquidityPage.ASSETS
 
@@ -103,7 +97,7 @@ export const RemoveLiquidityModal = ({
             sx={{ px: [10] }}
             steps={steps.map((step, idx) => ({
               label: step,
-              state: getStepState(idx),
+              state: getStepState(idx, currentStep),
             }))}
           />
         ) : null
@@ -130,11 +124,12 @@ export const RemoveLiquidityModal = ({
                 <Button
                   variant="primary"
                   sx={{ mt: 21 }}
-                  onClick={() =>
+                  onClick={() => {
                     paginateTo(
                       RemoveStablepoolLiquidityPage.REMOVE_FROM_OMNIPOOL,
                     )
-                  }
+                    setCurrentStep((step) => step + 1)
+                  }}
                 >
                   {t("next")}
                 </Button>
@@ -165,11 +160,13 @@ export const RemoveLiquidityModal = ({
                     }
 
                     paginateTo(RemoveStablepoolLiquidityPage.WAIT)
+                    setCurrentStep((step) => step + 1)
                   }
                 }}
                 onSuccess={() => {
                   if (selectedOption === "STABLE") {
                     refetch()
+                    setCurrentStep((step) => step + 1)
                     paginateTo(
                       RemoveStablepoolLiquidityPage.REMOVE_FROM_STABLEPOOL,
                     )

src/sections/staking/StakingPage.utils.ts

@@ -543,9 +543,9 @@ export const useClaimReward = () => {
         stakePosition.accumulatedSlashPoints.toString(),
       )
 
-      const extraPaylablePercentage = wasm.sigmoid(extraPoints, a, b)
+      const extraPayablePercentage = wasm.sigmoid(extraPoints, a, b)
 
-      extraPayablePercentageHuman = scaleHuman(extraPaylablePercentage, "q")
+      extraPayablePercentageHuman = scaleHuman(extraPayablePercentage, "q")
         .multipliedBy(100)
         .toString()
     }
@@ -571,7 +571,7 @@ export const useClaimReward = () => {
         BN(payablePercentageHuman).gte(chartPoints.y) &&
         (arr[i + 1] ? BN(payablePercentageHuman).lt(arr[i + 1].y) : true)
 
-      //calculate paylable percentage if vote ongoing referendas
+      // calculate payable percentage if vote ongoing referendas
       const currentSecondary = extraPayablePercentageHuman
         ? BN(extraPayablePercentageHuman).gte(chartPoints.y) &&
           (arr[i + 1] ? BN(extraPayablePercentageHuman).lt(arr[i + 1].y) : true)

src/sections/transaction/ReviewTransactionForm.utils.tsx

@@ -266,6 +266,7 @@ export const useEditFeePaymentAsset = (
     defaultSelectedAsssetId: feePaymentAssetId,
     allowedAssets: acceptedFeePaymentAssets,
     onSelect: (asset) => feeAsPayment.mutate(asset.id),
+    withExternal: true,
   })
 
   return {

src/sections/wallet/addToken/AddToken.utils.tsx

@@ -408,9 +408,9 @@ export const useExternalTokenMeta = () => {
 
       if (meta?.isExternal && meta.externalId) {
         for (const parachain in externalRegistry) {
-          const externalAsset = externalRegistry[Number(parachain)]?.data?.get(
-            meta.externalId,
-          )
+          const registry = externalRegistry[Number(parachain)]
+          const externalAsset = registry?.data?.get(meta.externalId)
+
           if (externalAsset) {
             const meta = getExternalByExternalId(externalAsset.id)
 

src/sections/wallet/addToken/modal/AddTokenFormModal.tsx

@@ -49,7 +49,7 @@ export const AddTokenFormModal: FC<Props> = ({ asset, onClose }) => {
   const chainStored = [...external, ...externalInvalid].find(
     (chainAsset) =>
       chainAsset.externalId === asset.id &&
-      chainAsset.parachainId === asset.origin.toString(),
+      chainAsset.parachainId === asset.origin,
   )
 
   const userStored = getTokenByInternalId(chainStored?.id ?? "")