upgrade apps & ui (external icons)

package.json

@@ -31,15 +31,15 @@
     "@emotion/styled": "^11.10.4",
     "@ethersproject/address": "^5.7.0",
     "@ethersproject/providers": "^5.7.2",
-    "@galacticcouncil/apps": "^3.9.1",
+    "@galacticcouncil/apps": "^4.1.0",
     "@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": "^3.0.1",
-    "@galacticcouncil/ui": "^3.2.3",
+    "@galacticcouncil/ui": "^4.0.3",
     "@galacticcouncil/xcm-cfg": "^2.5.0",
     "@galacticcouncil/xcm-core": "^1.4.0",
     "@galacticcouncil/xcm-sdk": "^3.3.0",

src/components/AppProviders/AppProviders.tsx

@@ -11,9 +11,9 @@ import * as Apps from "@galacticcouncil/apps"
 import { createComponent } from "@lit-labs/react"
 import { MigrationProvider } from "sections/migration/MigrationProvider"
 
-const AppsPersistenceProvider = createComponent({
-  tagName: "gc-database-provider",
-  elementClass: Apps.DatabaseProvider,
+const AppsContextProvider = createComponent({
+  tagName: "gc-context-provider",
+  elementClass: Apps.ContextProvider,
   react: React,
 })
 
@@ -29,7 +29,7 @@ export const AppProviders: FC<PropsWithChildren> = ({ children }) => {
                 highlightColor={`rgba(${theme.rgbColors.white}, 0.24)`}
                 borderRadius={4}
               >
-                <AppsPersistenceProvider>{children}</AppsPersistenceProvider>
+                <AppsContextProvider>{children}</AppsContextProvider>
                 <Transactions />
               </SkeletonTheme>
             </ToastProvider>

src/components/AssetIcon/AssetIcon.tsx

@@ -13,19 +13,7 @@ import { useRpcProvider } from "providers/rpcProvider"
 import { useTranslation } from "react-i18next"
 import { AnyParachain } from "@galacticcouncil/xcm-core"
 import { isAnyParachain } from "utils/helpers"
-
-const EXTERNAL_ASSETS_WHITELIST = [
-  // PINK
-  { id: "23", origin: 1000 },
-  // STINK
-  { id: "42069", origin: 1000 },
-  // WUD
-  { id: "31337", origin: 1000 },
-  // WIFD
-  { id: "17", origin: 1000 },
-  // BNDT
-  { id: "8889", origin: 1000 },
-]
+import { MetadataStore } from "@galacticcouncil/ui"
 
 const chains = Array.from(chainsMap.values())
 
@@ -57,6 +45,11 @@ export const AssetLogo = ({ id }: { id?: string }) => {
   const { t } = useTranslation()
   const { assets } = useRpcProvider()
 
+  const externalAssetsWhitelist = useMemo(
+    () => MetadataStore.getInstance().externalWhitelist(),
+    [],
+  )
+
   const asset = useMemo(() => {
     const assetDetails = id ? assets.getAsset(id) : undefined
 
@@ -66,11 +59,9 @@ export const AssetLogo = ({ id }: { id?: string }) => {
         chain.parachainId === Number(assetDetails?.parachainId),
     ) as AnyParachain
 
-    const isWhitelisted = EXTERNAL_ASSETS_WHITELIST.some(
-      (item) =>
-        item.id === assetDetails?.externalId &&
-        item.origin === chain?.parachainId,
-    )
+    const isWhitelisted = assetDetails
+      ? externalAssetsWhitelist.includes(assetDetails.id)
+      : false
 
     const badgeVariant: "warning" | "danger" | "" = assetDetails?.isExternal
       ? isWhitelisted

src/sections/trade/sections/swap/SwapPage.tsx

@@ -18,7 +18,6 @@ import { useRemount } from "hooks/useRemount"
 import { ExternalAssetImportModal } from "sections/trade/modal/ExternalAssetImportModal"
 import { AddTokenModal } from "sections/wallet/addToken/modal/AddTokenModal"
 import { useState } from "react"
-import { useUserExternalTokenStore } from "sections/wallet/addToken/AddToken.utils"
 
 const defaultEvmTokenId: string = import.meta.env.VITE_EVM_NATIVE_ASSET_ID
 
@@ -61,13 +60,9 @@ export function SwapPage() {
   const { stableCoinId } = useDisplayAssetStore()
   const preference = useProviderRpcUrlStore()
   const [addToken, setAddToken] = useState(false)
-  const { tokens: externalTokensStored } = useUserExternalTokenStore.getState()
 
   const isEvm = isEvmAccount(account?.address)
-  const version = useRemount([
-    isEvm,
-    externalTokensStored[preference.getDataEnv()].length,
-  ])
+  const version = useRemount([isEvm])
 
   const rpcUrl = preference.rpcUrl ?? import.meta.env.VITE_PROVIDER_URL
 

yarn.lock

@@ -2586,10 +2586,10 @@
   resolved "https://registry.yarnpkg.com/@galacticcouncil/api-augment/-/api-augment-0.0.6.tgz#fc54c04c3bb953db3f739ea2c5820153088d564d"
   integrity sha512-5Qq+dzRoyuMS6uUXjl1asRrosIQ1n0vD0dzbxK8H8f3hmIzDdpiQVqlqWBLEc7D/PA7VM/7j1scICpdjtJJELw==
 
-"@galacticcouncil/apps@^3.9.1":
-  version "3.9.1"
-  resolved "https://registry.yarnpkg.com/@galacticcouncil/apps/-/apps-3.9.1.tgz#3cafd864a8eddb8eac82bb52397d3789a1499f4e"
-  integrity sha512-t69sW8dWexThPkITIAzTJdvwGMO16UuIYCuWISFzieIUnCgBbD0Q8pnDyh2Av7ZNKK5d8NPDbjDiW29CTCpCVQ==
+"@galacticcouncil/apps@^4.1.0":
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/@galacticcouncil/apps/-/apps-4.1.0.tgz#051c81890f3e98591dd1f818535b0caa3feebebd"
+  integrity sha512-xv8BrB2bDIQ+rarPOr7TN4euHYYxy4tVgAwDb/BD8qNDHecPGF71uKrRHCQiM23UYMpYkoPb3YCGSoCkrLvSJQ==
   dependencies:
     "@cfx-kit/wallet-avatar" "0.0.5"
     "@thi.ng/atom" "^5.1.3"
@@ -2646,10 +2646,10 @@
     bignumber.js "^9.1.0"
     lodash.clonedeep "^4.5.0"
 
-"@galacticcouncil/ui@^3.2.3":
-  version "3.2.3"
-  resolved "https://registry.yarnpkg.com/@galacticcouncil/ui/-/ui-3.2.3.tgz#847da6005d09d4a1910544f6b233157f30565382"
-  integrity sha512-SLCrwNwalVwV9PCmfXgFZ8wVTDEBRsZp40G1nLXzuDNwnkjx7UhXY1L6M9N7KLi92cnswoM4baRKXHgyNVzkAQ==
+"@galacticcouncil/ui@^4.0.3":
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/@galacticcouncil/ui/-/ui-4.0.3.tgz#23f633e104e805f33f43e676f2e41b061c8c6f8c"
+  integrity sha512-BvNOkfS03p3l3kij+tOK2HAgTVDcyT3uCyY/YnYMA73mJFJIX3biG9iAaxKwhCskKA0yXlaX7c+yoPKX97KE+g==
   dependencies:
     "@floating-ui/dom" "^1.5.1"
     "@lit/reactive-element" "^1.0.0"