diff --git a/packages/page-settings/src/Metadata/NetworkSpecs.tsx b/packages/page-settings/src/Metadata/NetworkSpecs.tsx index 3b9a03bbd986..7fb139590a30 100644 --- a/packages/page-settings/src/Metadata/NetworkSpecs.tsx +++ b/packages/page-settings/src/Metadata/NetworkSpecs.tsx @@ -5,8 +5,9 @@ import type { NetworkSpecsStruct } from '@polkadot/ui-settings/types'; import type { ChainInfo, ChainType } from '../types.js'; import React, { useCallback, useEffect, useReducer, useRef, useState } from 'react'; +import store from 'store'; -import { ChainImg, Input, QrNetworkSpecs, Spinner, styled, Table } from '@polkadot/react-components'; +import { Button, ChainImg, Input, QrNetworkSpecs, Spinner, styled, Table } from '@polkadot/react-components'; import { useApi, useDebounce } from '@polkadot/react-hooks'; import { useTranslation } from '../translate.js'; @@ -18,7 +19,7 @@ interface Props { } // TODO-MOONBEAM: update NetworkSpecsStruct in @polkadot/ui-settings/types -interface NetworkSpecsStructWithType extends NetworkSpecsStruct{ +interface NetworkSpecsStructWithType extends NetworkSpecsStruct { chainType: ChainType } @@ -61,17 +62,21 @@ function NetworkSpecs ({ chainInfo, className }: Props): React.ReactElement(); useEffect((): void => { - chainInfo && setNetworkSpecs({ - chainType: chainInfo.chainType, - color: chainInfo.color || getRandomColor(), - decimals: chainInfo.tokenDecimals, - genesisHash: chainInfo.genesisHash, - prefix: chainInfo.ss58Format, - title: systemChain, - unit: chainInfo.tokenSymbol - }); + if (chainInfo) { + setNetworkSpecs({ + chainType: chainInfo.chainType, + color: chainInfo.color || getRandomColor(), + decimals: chainInfo.tokenDecimals, + genesisHash: chainInfo.genesisHash, + prefix: chainInfo.ss58Format, + title: systemChain, + unit: chainInfo.tokenSymbol + }); + setUserExtensions(chainInfo.userExtensions ? Object.keys(chainInfo.userExtensions) : undefined); + } }, [chainInfo, systemChain]); const _onChangeColor = useCallback( @@ -93,6 +98,14 @@ function NetworkSpecs ({ chainInfo, className }: Props): React.ReactElement { + store.clearAll(); + console.log('Store cleared'); + }, + [] + ); + const headerRef = useRef<[React.ReactNode?, string?, number?][]>([ [t('chain specifications'), 'start', 2] ]); @@ -120,7 +133,7 @@ function NetworkSpecs ({ chainInfo, className }: Props): React.ReactElement - + {qrData.genesisHash && ( + + + ('User extensions')} + value={userExtensions && userExtensions.length > 0 ? userExtensions.join(', ') : 'No signed / user extensions found'} + /> + + + + + +