diff --git a/packages/common/src/types.ts b/packages/common/src/types.ts index 0f982bf1b..98b813786 100644 --- a/packages/common/src/types.ts +++ b/packages/common/src/types.ts @@ -424,6 +424,8 @@ export interface SubstrateProvider extends SimpleEventEmitter{ Promise< string >, on(event: 'connect', listener: ConnectListener): void, on(event: 'disconnect', listener: DisconnectListener): void, + on(event: 'chainChanged', listener: ChainListener): void + on(event: 'accountsChanged', listener: AccountsListener): void on(event: 'uriChanged', listener: UriListener): void, on(event: 'qrModalState', listener: QrModalListener): void, disconnect() : Promise, diff --git a/packages/core/src/constants.ts b/packages/core/src/constants.ts index 55e6c0126..9a3b47a64 100644 --- a/packages/core/src/constants.ts +++ b/packages/core/src/constants.ts @@ -33,7 +33,8 @@ export const APP_INITIAL_STATE: AppState = { export const STORAGE_KEYS = { TERMS_AGREEMENT: 'onboard.js:agreement', LAST_CONNECTED_WALLET: 'onboard.js:last_connected_wallet', - CONNECT_HD_WALLET_MODAL : 'onboard.js:connect_hd_wallet_modal' + CONNECT_HD_WALLET_MODAL : 'onboard.js:connect_hd_wallet_modal', + GET_ONLY_CHAIN_NETWORK_LEDGER : 'onboard.js:get_only_chain_network_ledger' } export const MOBILE_WINDOW_WIDTH = 768 diff --git a/packages/core/src/icons/index.ts b/packages/core/src/icons/index.ts index 97dbf4d73..4007e0866 100644 --- a/packages/core/src/icons/index.ts +++ b/packages/core/src/icons/index.ts @@ -24,9 +24,11 @@ export { default as hydraxIcon } from './hydradx.js' export { default as kusamaIcon } from './kusama.js' export { default as phalaNetworkIcon } from './phala-network.js' export { default as polkadotIcon } from './polkadot.js' -export { default as statemint } from './statemint.js' +export { default as statemintIcon } from './statemint.js' export { default as turingNetworkIcon } from './turing-network.js' export { default as westendIcon } from './westend.js' +export { default as rococoIcon } from './rococo.js' +export { default as statemineIcon } from './statemine.js' // other export { default as hourglass } from './hourglass.js' diff --git a/packages/core/src/icons/rococo.ts b/packages/core/src/icons/rococo.ts new file mode 100644 index 000000000..0a4391c42 --- /dev/null +++ b/packages/core/src/icons/rococo.ts @@ -0,0 +1,11 @@ +export default ` + + + + + + + + + +` diff --git a/packages/core/src/icons/statemine.ts b/packages/core/src/icons/statemine.ts new file mode 100644 index 000000000..1a32ca0aa --- /dev/null +++ b/packages/core/src/icons/statemine.ts @@ -0,0 +1,18 @@ +export default ` + + + + + + + + + + + + + + + + +` diff --git a/packages/core/src/icons/statemint.ts b/packages/core/src/icons/statemint.ts index f2d6e80a2..2d5bbc0a5 100644 --- a/packages/core/src/icons/statemint.ts +++ b/packages/core/src/icons/statemint.ts @@ -1,89 +1,18 @@ -export default` - - - - - +export default ` + + + + + + + + + + + + + + + ` diff --git a/packages/core/src/provider.ts b/packages/core/src/provider.ts index 100089aa7..c32f3274d 100644 --- a/packages/core/src/provider.ts +++ b/packages/core/src/provider.ts @@ -93,13 +93,11 @@ export function listenAccountsChanged(args: { const { provider, disconnected$, type } = args const addHandler = (handler: AccountsListener) => { - if( type === 'substrate' || typeof (provider as EIP1193Provider).on !== 'function') return ; - (provider as EIP1193Provider).on('accountsChanged', handler) + provider.on('accountsChanged', handler) } const removeHandler = (handler: AccountsListener) => { - if( type === 'substrate' || typeof (provider as EIP1193Provider).on !== 'function') return ; - (provider as EIP1193Provider).removeListener('accountsChanged', handler) + provider.removeListener('accountsChanged', handler) } return fromEventPattern(addHandler, removeHandler).pipe( @@ -114,17 +112,15 @@ export function listenChainChanged(args: { }): Observable { const { provider, disconnected$, type } = args const addHandler = (handler: ChainListener) => { - if( type === 'substrate' || typeof (provider as EIP1193Provider).on !== 'function') return ; - (provider as EIP1193Provider).on('chainChanged', handler) + provider.on('chainChanged', handler) } const removeHandler = (handler: ChainListener) => { - if( type === 'substrate' || typeof (provider as EIP1193Provider).on !== 'function') return ; - (provider as EIP1193Provider).removeListener('chainChanged', handler) + provider.removeListener('chainChanged', handler) } return fromEventPattern(addHandler, removeHandler).pipe( - takeUntil(disconnected$) + takeUntil(disconnected$) ) } @@ -301,6 +297,7 @@ export function trackWallet( // Update chain on wallet when chainId changed chainChanged$.subscribe(async chainId => { + console.log('123', chainId); const { wallets } = state.get() const { chains, accounts } = wallets.find(wallet => wallet.label === label && wallet.type === type) diff --git a/packages/core/src/utils.ts b/packages/core/src/utils.ts index 28cad91a4..2456be933 100644 --- a/packages/core/src/utils.ts +++ b/packages/core/src/utils.ts @@ -36,9 +36,9 @@ import { hydraxIcon, kusamaIcon, phalaNetworkIcon, - statemint, + statemintIcon, turingNetworkIcon, - westendIcon + westendIcon, statemineIcon, rococoIcon } from './icons/index.js' import type { @@ -159,7 +159,9 @@ export const chainIdToLabel: Record = { '1bb969d85965e4bb5a651abbedf21a54' : 'Phala Network', '68d56f15f85d3136970ec16946040bc1' : 'Statemint', '0f62b701fb12d02237a33b84818c11f6' : 'Turing Network', - 'e143f23803ac50e8f6f8e62695d1ce9e' : 'Westend' + 'e143f23803ac50e8f6f8e62695d1ce9e' : 'Westend', + '6408de7737c59c238890533af25896a2': 'Rococo', + '48239ef607d7928874027a43a6768920': 'Statemine' } export const networkToChainId: Record = { @@ -285,8 +287,8 @@ export const chainStyles: Record = { color: '#000000' }, '68d56f15f85d3136970ec16946040bc1' : { - icon : statemint, - color : '#000000' + icon : statemintIcon, + color : '#E6007A' }, '0f62b701fb12d02237a33b84818c11f6' : { icon : turingNetworkIcon, @@ -295,7 +297,18 @@ export const chainStyles: Record = { 'e143f23803ac50e8f6f8e62695d1ce9e' : { icon : westendIcon, color: '#ffffff' + }, + '48239ef607d7928874027a43a6768920': { + icon: statemineIcon, + color: '#000000' + }, + '6408de7737c59c238890533af25896a2': { + icon: rococoIcon, + color: '#ffffff' } + + + } export const unrecognizedChainStyle = { icon: questionIcon, color: '#33394B' } diff --git a/packages/core/src/views/connect/Index.svelte b/packages/core/src/views/connect/Index.svelte index 5756d8727..fa9a35e76 100644 --- a/packages/core/src/views/connect/Index.svelte +++ b/packages/core/src/views/connect/Index.svelte @@ -1,13 +1,13 @@