diff --git a/packages/snap/snap.manifest.json b/packages/snap/snap.manifest.json index 74bf28f..97a8ccb 100644 --- a/packages/snap/snap.manifest.json +++ b/packages/snap/snap.manifest.json @@ -7,7 +7,7 @@ "url": "https://github.com/polkagate/snap.git" }, "source": { - "shasum": "AtXyH37/Y1WEchpW9hS2zFKtsXxOqxZqfyoAHgcmMJM=", + "shasum": "RLbpFL70qJQgl5MUKNoO1M87+mp1UO35JBWBQkFuRCE=", "location": { "npm": { "filePath": "dist/bundle.js", diff --git a/packages/snap/src/chains.ts b/packages/snap/src/chains.ts index af42b06..7c64f1a 100644 --- a/packages/snap/src/chains.ts +++ b/packages/snap/src/chains.ts @@ -6,7 +6,8 @@ import { Chain } from '@polkadot/extension-chains/types'; import { sanitizeChainName } from './util/getChainName'; import { HexString } from '@polkadot/util/types'; -const westend = { +const testnets:Network[] = [ + { decimals: [12], displayName: 'Westend', genesisHash: [ @@ -22,27 +23,98 @@ const westend = { standardAccount: '*25519', symbols: ['WND'], website: 'https://polkadot.network', -}; - -const westendAssetHub = { +}, + { decimals: [12], - displayName: 'Westend Asset Hub', + displayName: "Paseo", genesisHash: [ - '0x67f9723393ef76214df0118c34bbbd3dbebc8ed46a10973a8c969d48fe7598c9', + "0x77afd6190f1554ad45fd0d31aee62aacc33c6db0ea801129acb813f913e0764f", ], hasLedgerSupport: false, - icon: 'polkadot', + icon: "polkadot", isIgnored: false, isTestnet: true, - network: 'westmint', + network: "paseo", prefix: 42, - slip44: 354, - standardAccount: '*25519', - symbols: ['WND'], - website: 'https://polkadot.network', -}; - -selectableNetworks.push(westend as Network, westendAssetHub as Network); + slip44: 0, + standardAccount: "*25519", + symbols: ["PAS"], + website: "https://polkadot.network", +} +] + +const assetHubs:Network[] = [ + { + decimals: [10], + displayName: "Polkadot Asset Hub", + genesisHash: [ + "0x68d56f15f85d3136970ec16946040bc1752654e906147f7e43e9d539d7c3de2f", + ], + hasLedgerSupport: true, + icon: "polkadot", + isIgnored: false, + isTestnet: false, + network: "statemint", + prefix: 0, + slip44: 354, + standardAccount: "*25519", + symbols: ["DOT"], + website: "https://polkadot.network", + }, + { + decimals: [12], + displayName: "Kusama Asset Hub", + genesisHash: [ + "0x48239ef607d7928874027a43a67689209727dfb3d3dc5e5b03a39bdc2eda771a", + ], + hasLedgerSupport: true, + icon: "polkadot", + isIgnored: false, + isTestnet: false, + network: "statemine", + prefix: 2, + slip44: 434, + standardAccount: "*25519", + symbols: ["KSM"], + website: "https://kusama.network", + }, + { + decimals: [12], + displayName: 'Westend Asset Hub', + genesisHash: [ + '0x67f9723393ef76214df0118c34bbbd3dbebc8ed46a10973a8c969d48fe7598c9', + ], + hasLedgerSupport: false, + icon: 'polkadot', + isIgnored: false, + isTestnet: true, + network: 'westmint', + prefix: 42, + slip44: 354, + standardAccount: '*25519', + symbols: ['WND'], + website: 'https://polkadot.network', + }, + { + decimals: [10], + displayName: "Paseo Asset Hub", + genesisHash: [ + "0xd6eec26135305a8ad257a20d003357284c8aa03d0bdb2b357ab0a22371e11ef2", + ], + hasLedgerSupport: false, + icon: "polkadot", + isIgnored: false, + isTestnet: false, + network: "paseo-asset-hub", + prefix: 42, // Adjust if necessary + slip44: 0, // Update as required + standardAccount: "*25519", + symbols: ["PAS"], + website: "https://polkadot.network", + }, +]; + +selectableNetworks.push(...testnets, ...assetHubs); export const DISABLED_NETWORKS = ['3DP network', 'xx network', 'Polkadex Mainnet', 'Stafi', 'Peaq Network', 'Genshiro Network']; // keyWord can be genesisHash, chainName, or even display name @@ -67,7 +139,7 @@ export const getAllChains = (): Network[] | null => { return selectableNetworks; }; -type Options = { +export type Options = { value: string; text: string; } @@ -78,7 +150,7 @@ export const getChainOptions = (): Options[] => { if (!chains) { return []; } - + return chains .filter(({ genesisHash, displayName }) => genesisHash?.length && !DISABLED_NETWORKS.includes(displayName)) .map(({ displayName, genesisHash }) => ( diff --git a/packages/snap/src/constants.ts b/packages/snap/src/constants.ts index 677918c..19fed96 100644 --- a/packages/snap/src/constants.ts +++ b/packages/snap/src/constants.ts @@ -1,3 +1,5 @@ +import { KUSAMA_GENESIS, POLKADOT_GENESIS, WESTEND_GENESIS } from "@polkadot/apps-config"; + export const DEFAULT_NETWORK_PREFIX = 42; // 42 is for substrate export const DEFAULT_COIN_TYPE = 354; // 354 is for Polkadot export const DEFAULT_CHAIN_NAME = 'polkadot'; // Since Westend shares the same address prefix as Substrate, the address format for both is identical @@ -22,3 +24,5 @@ export const NOT_LISTED_CHAINS = [ ] export const PRICE_VALIDITY_PERIOD = 2 * 60 * 1000; + + export const DEFAULT_CHAINS_GENESIS=[POLKADOT_GENESIS, KUSAMA_GENESIS]; diff --git a/packages/snap/src/listeners/onHomePage.tsx b/packages/snap/src/listeners/onHomePage.tsx index 2b6d68c..4e049a6 100644 --- a/packages/snap/src/listeners/onHomePage.tsx +++ b/packages/snap/src/listeners/onHomePage.tsx @@ -13,9 +13,9 @@ import { handleBalancesAll } from '../util/handleBalancesAll'; * @returns A static panel rendered with custom UI. */ export const onHomePage: OnHomePageHandler = async () => { - const { address, balancesAll, logos, pricesInUsd } = await handleBalancesAll() + const { balancesAll, logos, pricesInUsd } = await handleBalancesAll() return { - content: accountDemo(address, balancesAll, logos, pricesInUsd), + content: accountDemo(balancesAll, logos, pricesInUsd), }; }; diff --git a/packages/snap/src/listeners/onUserInput.tsx b/packages/snap/src/listeners/onUserInput.tsx index be528a9..fa310e5 100644 --- a/packages/snap/src/listeners/onUserInput.tsx +++ b/packages/snap/src/listeners/onUserInput.tsx @@ -6,14 +6,13 @@ import type { OnUserInputHandler } from '@metamask/snaps-sdk'; import { showSpinner, - accountInfo, + home, exportAccount, showJsonContent, staking, voting } from '../ui'; import { updateSnapState } from '../rpc/stateManagement'; -import getChainName from '../util/getChainName'; import { showMore } from '../ui/showMore'; import { receive } from '../ui/receive'; import { balanceDetails } from '../ui/balanceDetails'; @@ -23,6 +22,9 @@ import { formValidation } from '../ui/send/utils'; import { approveSend } from '../ui/send/approveSend'; import { HexString } from '@polkadot/util/types'; import { transfer } from '../ui/send/transfer'; +import { CustomizeChains } from '../ui/selectChains/CustomizeChains'; +import { SelectedChainsFormState } from '../ui/selectChains/types'; +import { DEFAULT_CHAINS_GENESIS } from '../constants'; export const onUserInput: OnUserInputHandler = async ({ id, event, context }) => { @@ -30,6 +32,7 @@ export const onUserInput: OnUserInputHandler = async ({ id, event, context }) => method: 'snap_getInterfaceState', params: { id }, }); + const sendForm = state.sendForm as SendFormState; if (event.type === UserInputEventType.ButtonClickEvent || event.type === UserInputEventType.InputChangeEvent) { @@ -37,8 +40,8 @@ export const onUserInput: OnUserInputHandler = async ({ id, event, context }) => switch (event.name) { case 'switchChain': { const genesisHash = event.value; - const destinationChainName = await getChainName(genesisHash) - await showSpinner(id, `Switching format to ${destinationChainName} ...`); + // const destinationChainName = await getChainName(genesisHash) + // await showSpinner(id, `Switching format to ${destinationChainName} ...`); await updateSnapState('currentGenesisHash', genesisHash); await receive(id, genesisHash); break; @@ -92,10 +95,25 @@ export const onUserInput: OnUserInputHandler = async ({ id, event, context }) => await balanceDetails(id, context?.show === undefined ? true : !context.show); break; + case 'refreshSelectedChains': + await showSpinner(id, 'Loading, please wait ...'); + await updateSnapState('selectedChains', DEFAULT_CHAINS_GENESIS); + case 'customizeChains': + await showSpinner(id, 'Loading, please wait ...'); + await CustomizeChains(id); + break; + case 'applySelectedChains': + await showSpinner(id, 'Loading, please wait ...'); + const selectedChains = state.selectedChains as SelectedChainsFormState; + const filtered = Object.entries(selectedChains).filter(([key, value]) => value).map(([key]) => key); + await updateSnapState('selectedChains', filtered); + await home(id); + break; + case 'backToHome': case 'cancelSend': await showSpinner(id, 'Loading, please wait ...'); - await accountInfo(id); + await home(id); break; default: diff --git a/packages/snap/src/rpc/stateManagement.ts b/packages/snap/src/rpc/stateManagement.ts index f794fd8..9afe85a 100644 --- a/packages/snap/src/rpc/stateManagement.ts +++ b/packages/snap/src/rpc/stateManagement.ts @@ -4,6 +4,7 @@ import { PricesType } from "../util/getPrices"; interface State { balancesAll?: any; + selectedChains?: string[]; currentGenesisHash?: HexString; metadata?: Record; priceInfo?: { @@ -22,12 +23,15 @@ export const setSnapState = async (newState: State) => { }); }; -export const getSnapState = async () => - await snap.request({ +export const getSnapState = async (label?: string) => { + const state = await snap.request({ method: 'snap_manageState', params: { operation: 'get' }, }) as State; + return label ? state?.[label] : state; +} + export const updateSnapState = async (field: keyof State, data: any) => { const state = (await getSnapState()) || {}; diff --git a/packages/snap/src/ui/balanceDetails.tsx b/packages/snap/src/ui/balanceDetails.tsx index 270fe9e..58949a1 100644 --- a/packages/snap/src/ui/balanceDetails.tsx +++ b/packages/snap/src/ui/balanceDetails.tsx @@ -10,13 +10,13 @@ import { accountDemo } from './partials/accountDemo'; * @param id - The id of current UI interface. */ export async function balanceDetails(id: string, show?:boolean) { - const { address, balancesAll, logos, pricesInUsd } = await handleBalancesAll() + const { balancesAll, logos, pricesInUsd } = await handleBalancesAll() await snap.request({ method: 'snap_updateInterface', params: { id, - ui: accountDemo(address, balancesAll, logos, pricesInUsd, show), + ui: accountDemo(balancesAll, logos, pricesInUsd, show), context: { show: !!show } }, }); diff --git a/packages/snap/src/ui/accountInfo.tsx b/packages/snap/src/ui/home.tsx similarity index 67% rename from packages/snap/src/ui/accountInfo.tsx rename to packages/snap/src/ui/home.tsx index 531ba3a..f69d4e3 100644 --- a/packages/snap/src/ui/accountInfo.tsx +++ b/packages/snap/src/ui/home.tsx @@ -1,6 +1,7 @@ // Copyright 2023-2024 @polkagate/snap authors & contributors // SPDX-License-Identifier: Apache-2.0 +import { getSnapState } from '../rpc/stateManagement'; import { handleBalancesAll } from '../util/handleBalancesAll'; import { accountDemo } from './partials/accountDemo'; @@ -10,14 +11,14 @@ import { accountDemo } from './partials/accountDemo'; * @param id - The id of current UI interface. * @param genesisHash - Chain genesisHash. */ -export async function accountInfo(id: string) { - const {address, balancesAll, logos, pricesInUsd} = await handleBalancesAll() +export async function home(id: string) { + const {balancesAll, logos, pricesInUsd} = await handleBalancesAll() await snap.request({ method: 'snap_updateInterface', params: { id, - ui: accountDemo(address, balancesAll, logos, pricesInUsd), + ui: accountDemo(balancesAll, logos, pricesInUsd), }, }); } diff --git a/packages/snap/src/ui/image/chains/astar.svg b/packages/snap/src/ui/image/chains/astar.svg index 9ae311f..fced906 100644 --- a/packages/snap/src/ui/image/chains/astar.svg +++ b/packages/snap/src/ui/image/chains/astar.svg @@ -1,232 +1,141 @@ - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - + + + - - - - - - - - - + + + + + + + - - - - - + + + - - - - - - - - - + + + + + + + - - - - - + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/snap/src/ui/image/chains/bittensor old.svg b/packages/snap/src/ui/image/chains/bittensor old.svg new file mode 100644 index 0000000..1a7343b --- /dev/null +++ b/packages/snap/src/ui/image/chains/bittensor old.svg @@ -0,0 +1,9 @@ + + + + + diff --git a/packages/snap/src/ui/image/chains/bittensor.svg b/packages/snap/src/ui/image/chains/bittensor.svg index 1a7343b..07d43f2 100644 --- a/packages/snap/src/ui/image/chains/bittensor.svg +++ b/packages/snap/src/ui/image/chains/bittensor.svg @@ -1,9 +1,3 @@ - - - - + + diff --git a/packages/snap/src/ui/image/chains/edgeware.svg b/packages/snap/src/ui/image/chains/edgeware.svg new file mode 100644 index 0000000..32ff6c4 --- /dev/null +++ b/packages/snap/src/ui/image/chains/edgeware.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/snap/src/ui/image/chains/equilibrium.svg b/packages/snap/src/ui/image/chains/equilibrium.svg new file mode 100644 index 0000000..734093c --- /dev/null +++ b/packages/snap/src/ui/image/chains/equilibrium.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/snap/src/ui/image/chains/frequency.svg b/packages/snap/src/ui/image/chains/frequency.svg new file mode 100644 index 0000000..481deaa --- /dev/null +++ b/packages/snap/src/ui/image/chains/frequency.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/packages/snap/src/ui/image/chains/getLogoByGenesisHash.ts b/packages/snap/src/ui/image/chains/getLogoByGenesisHash.ts index 0ef7212..b94a174 100644 --- a/packages/snap/src/ui/image/chains/getLogoByGenesisHash.ts +++ b/packages/snap/src/ui/image/chains/getLogoByGenesisHash.ts @@ -1,6 +1,6 @@ import { HexString } from "@polkadot/util/types"; import getChainName, { sanitizeChainName } from "../../../util/getChainName"; -import { assetHub, ajuna, acala, astar, bittensor, bifrost, basilisk, centrifuge, composable, darwinia, karura, kulupu, picasso, globe, hydradx, kusama, ternoa, nodle, polkadot, westend, zeitgeist } from "."; +import { assetHub, ajuna, acala, astar, bittensor, bifrost, basilisk, centrifuge, composable, darwinia, karura, kulupu, picasso, globe, hydradx, kusama, ternoa, nodle, polkadot, westend, zeitgeist, edgeware, equilibrium, frequency, integritee, parallel, pendulum, phala, polimec, polymesh, sora, vara, paseo } from "."; export const getLogoByGenesisHash = async (genesisHash: HexString): Promise => { const chainName = await getChainName(genesisHash); @@ -19,14 +19,34 @@ export const getLogoByGenesisHash = async (genesisHash: HexString): Promise + + + + diff --git a/packages/snap/src/ui/image/chains/kulupu.svg b/packages/snap/src/ui/image/chains/kulupu.svg index 432699c..e3db968 100644 --- a/packages/snap/src/ui/image/chains/kulupu.svg +++ b/packages/snap/src/ui/image/chains/kulupu.svg @@ -1,3 +1,3 @@ - + diff --git a/packages/snap/src/ui/image/chains/kusama.svg b/packages/snap/src/ui/image/chains/kusama.svg index 7dfd59e..bc66d98 100644 --- a/packages/snap/src/ui/image/chains/kusama.svg +++ b/packages/snap/src/ui/image/chains/kusama.svg @@ -1,12 +1,4 @@ - - - - - kusama-ksm-logo - - - - - - + + + diff --git a/packages/snap/src/ui/image/chains/parallel.svg b/packages/snap/src/ui/image/chains/parallel.svg new file mode 100644 index 0000000..3890164 --- /dev/null +++ b/packages/snap/src/ui/image/chains/parallel.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/packages/snap/src/ui/image/chains/paseo.svg b/packages/snap/src/ui/image/chains/paseo.svg new file mode 100644 index 0000000..67b5223 --- /dev/null +++ b/packages/snap/src/ui/image/chains/paseo.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/packages/snap/src/ui/image/chains/pendulum.svg b/packages/snap/src/ui/image/chains/pendulum.svg new file mode 100644 index 0000000..d21bea9 --- /dev/null +++ b/packages/snap/src/ui/image/chains/pendulum.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/snap/src/ui/image/chains/phala.svg b/packages/snap/src/ui/image/chains/phala.svg new file mode 100644 index 0000000..f2642e9 --- /dev/null +++ b/packages/snap/src/ui/image/chains/phala.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/snap/src/ui/image/chains/polimec.svg b/packages/snap/src/ui/image/chains/polimec.svg new file mode 100644 index 0000000..e4d16fa --- /dev/null +++ b/packages/snap/src/ui/image/chains/polimec.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/snap/src/ui/image/chains/polkadot.svg b/packages/snap/src/ui/image/chains/polkadot.svg index 188c6e6..1b576d0 100644 --- a/packages/snap/src/ui/image/chains/polkadot.svg +++ b/packages/snap/src/ui/image/chains/polkadot.svg @@ -1,12 +1,8 @@ - \ No newline at end of file + + + + + + + + diff --git a/packages/snap/src/ui/image/chains/polymesh.svg b/packages/snap/src/ui/image/chains/polymesh.svg new file mode 100644 index 0000000..acc94aa --- /dev/null +++ b/packages/snap/src/ui/image/chains/polymesh.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/packages/snap/src/ui/image/chains/sora.svg b/packages/snap/src/ui/image/chains/sora.svg new file mode 100644 index 0000000..fcd5689 --- /dev/null +++ b/packages/snap/src/ui/image/chains/sora.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/snap/src/ui/image/chains/vara.svg b/packages/snap/src/ui/image/chains/vara.svg new file mode 100644 index 0000000..eb54162 --- /dev/null +++ b/packages/snap/src/ui/image/chains/vara.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/snap/src/ui/index.ts b/packages/snap/src/ui/index.ts index 2d0872d..a733afb 100644 --- a/packages/snap/src/ui/index.ts +++ b/packages/snap/src/ui/index.ts @@ -1,7 +1,7 @@ // Copyright 2023-2024 @polkagate/snap authors & contributors // SPDX-License-Identifier: Apache-2.0 -export * from './accountInfo'; +export * from './home'; export * from './exportAccount'; export * from './partials/accountDemo'; export * from './polkagateApps'; diff --git a/packages/snap/src/ui/partials/accountDemo.tsx b/packages/snap/src/ui/partials/accountDemo.tsx index 5430c43..2720c90 100644 --- a/packages/snap/src/ui/partials/accountDemo.tsx +++ b/packages/snap/src/ui/partials/accountDemo.tsx @@ -24,7 +24,6 @@ const CTA: SnapComponent = ({ name, icon, label }) => ( ) export const accountDemo = ( - address: string, balancesAll: Balances[], logos: { genesisHash: string, logo: string }[], prices: { genesisHash: string, price: PriceValue }[], @@ -67,14 +66,16 @@ export const accountDemo = ( Tokens {!!nonZeroBalances?.length && - - + + } {nonZeroBalances?.length - ? nonZeroBalances.map((balances, index) => { + ? nonZeroBalances.map((balances) => { const logo = logos.find(({ genesisHash }) => genesisHash === balances.genesisHash)?.logo as string; const price = prices.find(({ genesisHash }) => genesisHash === balances.genesisHash)?.price.value as number; // needs that prices be token-based when supporting multi asset chains diff --git a/packages/snap/src/ui/receive.tsx b/packages/snap/src/ui/receive.tsx index eccba06..1c3bd09 100644 --- a/packages/snap/src/ui/receive.tsx +++ b/packages/snap/src/ui/receive.tsx @@ -35,7 +35,7 @@ const ui = (formatted: string, genesisHash: HexString, logo: string, qrCode: str
- Select a chain to view your address and its QR code. + Select a network to view your address and its QR code. diff --git a/packages/snap/src/ui/selectChains/CustomizeChains.tsx b/packages/snap/src/ui/selectChains/CustomizeChains.tsx new file mode 100644 index 0000000..d21973d --- /dev/null +++ b/packages/snap/src/ui/selectChains/CustomizeChains.tsx @@ -0,0 +1,63 @@ +import { Image, Box, Button, Container, Footer, Heading, Icon, Section, Text, Checkbox, Form } from "@metamask/snaps-sdk/jsx"; +import { getChainOptions, Options } from "../../chains"; +import { getLogoByGenesisHash } from "../image/chains/getLogoByGenesisHash"; +import { HexString } from "@polkadot/util/types"; +import { getSnapState } from "../../rpc/stateManagement"; +import { DEFAULT_CHAINS_GENESIS } from "../../constants"; + +export async function CustomizeChains(id: string) { + const options = getChainOptions() + const logoList = await Promise.all(options.map(({ value }) => getLogoByGenesisHash(value as HexString))); + const selectedChains = (await getSnapState('selectedChains')) || DEFAULT_CHAINS_GENESIS; + + await snap.request({ + method: 'snap_updateInterface', + params: { + id, + ui: ui(options, logoList, selectedChains) + }, + }); +} + +const ui = (options: Options[], logoList: string[], selectedChains: HexString[]) => { + + return ( + + + + Networks + + + + Reset + + + +
+ {options.map(({ text, value }, index) => { + return ( +
+ + + + + {text} + + + + +
+ ) + })} +
+ +
+ +
+ + ); +}; \ No newline at end of file diff --git a/packages/snap/src/ui/selectChains/types.tsx b/packages/snap/src/ui/selectChains/types.tsx new file mode 100644 index 0000000..c82a990 --- /dev/null +++ b/packages/snap/src/ui/selectChains/types.tsx @@ -0,0 +1,5 @@ +/** + * The state of the selected chains form. + * + */ +export type SelectedChainsFormState = Record; diff --git a/packages/snap/src/util/getChainName.ts b/packages/snap/src/util/getChainName.ts index db2ca37..7ae940b 100644 --- a/packages/snap/src/util/getChainName.ts +++ b/packages/snap/src/util/getChainName.ts @@ -31,7 +31,5 @@ export default async function getChainName(_genesisHash: HexString | undefined): chainName = (await getChainFromMetadata(_genesisHash))?.name; } - console.info('chainName is:', chainName); - return chainName; } diff --git a/packages/snap/src/util/handleBalancesAll.tsx b/packages/snap/src/util/handleBalancesAll.tsx index 72f45c7..74b261c 100644 --- a/packages/snap/src/util/handleBalancesAll.tsx +++ b/packages/snap/src/util/handleBalancesAll.tsx @@ -8,30 +8,49 @@ import { getLogoByGenesisHash } from '../ui/image/chains/getLogoByGenesisHash'; import { HexString } from '@polkadot/util/types'; import { getSnapState, updateSnapState } from '../rpc/stateManagement'; import { getNativeTokenPrice } from './getNativeTokenPrice'; -import { DEFAULT_CHAIN_NAME, NOT_LISTED_CHAINS, PRICE_VALIDITY_PERIOD } from '../constants'; +import { DEFAULT_CHAIN_NAME, DEFAULT_CHAINS_GENESIS, NOT_LISTED_CHAINS, PRICE_VALIDITY_PERIOD } from '../constants'; import { updateTokenPrices } from './getCurrentChainTokenPrice'; import { isHexToBn } from '../utils'; +export function areArraysEqual(arr1: string[], arr2: string[]): boolean { + if (arr1.length !== arr2.length) return false; // Check length + + const sortedArr1 = [...arr1].sort(); // Sort the first array + const sortedArr2 = [...arr2].sort(); // Sort the second array + + return sortedArr1.every((value, index) => value === sortedArr2[index]); // Compare values +} + export const handleBalancesAll = async (savedOnly?: boolean) => { - const options = getChainOptions() - const selectedOptions = options.filter(({ value }) => !NOT_LISTED_CHAINS.includes(value))//.slice(0, 3); + const options = getChainOptions(); + const snapState = await getSnapState(); + const selectedChains = snapState?.selectedChains || DEFAULT_CHAINS_GENESIS; + + const selectedOptions = options.filter(({ value }) => selectedChains.includes(value)); const currentChainName = DEFAULT_CHAIN_NAME; // to reset chain on each new visit + const { address } = await getKeyPair(currentChainName); let balancesAll: Balances[]; - const savedBalancesAll = await getSnapState(); - if (savedBalancesAll.balancesAll && (savedOnly || Date.now() - Number(savedBalancesAll.balancesAll.date) < PRICE_VALIDITY_PERIOD)) { - const temp = JSON.parse(savedBalancesAll.balancesAll.data); + let noChainsChange; + if (snapState.balancesAll) { + const parsedBalancesAll = JSON.parse(snapState.balancesAll.data); + const savedBalancedChains = parsedBalancesAll.map(({ genesisHash }) => genesisHash); + noChainsChange = areArraysEqual(savedBalancedChains, selectedChains); + } + + if (noChainsChange && snapState.balancesAll && (savedOnly || Date.now() - Number(snapState.balancesAll.date) < PRICE_VALIDITY_PERIOD)) { + const parsedBalancesAll = JSON.parse(snapState.balancesAll.data); - temp.forEach((item) => { + parsedBalancesAll.forEach((item) => { item.total = isHexToBn(item.total) item.transferable = isHexToBn(item.transferable) item.locked = isHexToBn(item.locked) item.soloTotal = isHexToBn(item.soloTotal) item.pooledBalance = isHexToBn(item.pooledBalance); }) - balancesAll = temp; + balancesAll = parsedBalancesAll; } else {