refactor: merge contexts into one

packages/dashboard/src/API.tsx

@@ -4,11 +4,11 @@
 
 import type { DashboardPluginMessages, DashboardPluginServices } from '@masknet/shared'
 import type { Services as ServiceType } from '../../maskbook/dist/extension/service'
-import type { MaskMessage } from '../../maskbook/dist/utils/messages'
+import type { MaskMessages } from '../../maskbook/dist/utils/messages'
 import type { WalletMessages } from '@masknet/plugin-wallet'
 
 export let Services: typeof ServiceType = null!
-export let Messages: typeof MaskMessage = null!
+export let Messages: typeof MaskMessages = null!
 export let PluginServices: PluginServices = null!
 export let PluginMessages: PluginMessages = null!
 export interface PluginServices extends DashboardPluginServices {

packages/dashboard/src/web3/context.ts

@@ -1,75 +1,14 @@
-import { omit, noop } from 'lodash-es'
-import type { Subscription } from 'use-subscription'
-import { ChainId, PortfolioProvider, ProviderType } from '@masknet/web3-shared'
-import { ERC20TokenDetailed, EthereumTokenType, NetworkType, Web3ProviderType } from '@masknet/web3-shared'
+import { createWeb3Context } from '@masknet/web3-shared'
 import { Messages, PluginMessages, PluginServices, Services } from '../API'
 
-const Web3Provider = createExternalProvider()
+export const Web3Provider = createExternalProvider()
 
-export const Web3Context: Web3ProviderType = {
-    provider: {
-        getCurrentValue: () => Web3Provider,
-        subscribe: () => noop,
-    },
-    allowTestnet: createSubscriptionFromAsync(Services.Settings.getWalletAllowTestChain, false, () => {
-        return () => {}
-    }),
-    account: createSubscriptionFromAsync(
-        Services.Settings.getSelectedWalletAddress,
-        '',
-        Messages.events.currentAccountSettings.on,
-    ),
-    tokenPrices: createSubscriptionFromAsync(
-        Services.Settings.getTokenPrices,
-        {},
-        Messages.events.currentTokenPricesSettings.on,
-    ),
-    balance: createSubscriptionFromAsync(Services.Settings.getBalance, '0', Messages.events.currentBalanceSettings.on),
-    blockNumber: createSubscriptionFromAsync(
-        Services.Settings.getBlockNumber,
-        0,
-        Messages.events.currentBlockNumberSettings.on,
-    ),
-    chainId: createSubscriptionFromAsync(
-        Services.Settings.getChainId,
-        ChainId.Mainnet,
-        Messages.events.currentChainIdSettings.on,
-    ),
-    providerType: createSubscriptionFromAsync(
-        Services.Settings.getCurrentSelectedWalletProvider,
-        ProviderType.MaskWallet,
-        Messages.events.currentProviderSettings.on,
-    ),
-    networkType: createSubscriptionFromAsync(
-        Services.Settings.getCurrentSelectedWalletNetwork,
-        NetworkType.Ethereum,
-        Messages.events.currentNetworkSettings.on,
-    ),
-    walletPrimary: createSubscriptionFromAsync(getWalletPrimary, null, PluginMessages.Wallet.events.walletsUpdated.on),
-    wallets: createSubscriptionFromAsync(getWallets, [], PluginMessages.Wallet.events.walletsUpdated.on),
-    erc20Tokens: createSubscriptionFromAsync(getERC20Tokens, [], PluginMessages.Wallet.events.erc20TokensUpdated.on),
-    addERC20Token: PluginServices.Wallet.addERC20Token,
-    trustERC20Token: PluginServices.Wallet.trustERC20Token,
-    erc20TokensCount: createSubscriptionFromAsync(
-        PluginServices.Wallet.getERC20TokensCount,
-        0,
-        PluginMessages.Wallet.events.erc20TokensUpdated.on,
-    ),
-    getERC20TokensPaged,
-    portfolioProvider: createSubscriptionFromAsync(
-        Services.Settings.getCurrentPortfolioDataProvider,
-        PortfolioProvider.DEBANK,
-        Messages.events.currentPortfolioDataProviderSettings.on,
-    ),
-    getAssetsList: PluginServices.Wallet.getAssetsList,
-    getAssetsListNFT: PluginServices.Wallet.getAssetsListNFT,
-    getAddressNamesList: PluginServices.Wallet.getAddressNames,
-    getERC721TokensPaged,
-    getTransactionList: PluginServices.Wallet.getTransactionList,
-    fetchERC20TokensFromTokenLists: Services.Ethereum.fetchERC20TokensFromTokenLists,
-    createMnemonicWords: PluginServices.Wallet.createMnemonicWords,
-    getNonce: Services.Ethereum.getNonce,
-}
+export const Web3Context = createWeb3Context(Web3Provider, {
+    MaskMessages: Messages,
+    MaskServices: Services,
+    PluginMessages,
+    PluginServices,
+})
 
 export function createExternalProvider() {
     return {
@@ -82,95 +21,3 @@ export function createExternalProvider() {
         sendAsync: Services.Ethereum.requestSend,
     }
 }
-
-async function getWallets() {
-    const wallets = await PluginServices.Wallet.getWallets()
-    return wallets.map((x) => ({
-        ...omit(x, 'derivationPath', 'storedKeyInfo'),
-        hasStoredKeyInfo: !!x.storedKeyInfo,
-        hasDerivationPath: !!x.derivationPath,
-    }))
-}
-
-export async function getWalletPrimary() {
-    const wallet = await PluginServices.Wallet.getWalletPrimary()
-    if (!wallet) return null
-    return {
-        ...omit(wallet, 'derivationPath', 'storedKeyInfo'),
-        hasStoredKeyInfo: !!wallet.storedKeyInfo,
-        hasDerivationPath: !!wallet.derivationPath,
-    }
-}
-
-async function getERC20Tokens() {
-    const raw = await PluginServices.Wallet.getERC20Tokens()
-    return raw.map<ERC20TokenDetailed>((x) => ({
-        type: EthereumTokenType.ERC20,
-        ...x,
-    }))
-}
-
-async function getERC20TokensPaged(index: number, count: number, query?: string) {
-    const raw = await PluginServices.Wallet.getERC20TokensPaged(index, count, query)
-    return raw.map<ERC20TokenDetailed>((x) => ({
-        type: EthereumTokenType.ERC20,
-        ...x,
-    }))
-}
-
-async function getERC721TokensPaged(index: number, count: number, query?: string) {
-    return PluginServices.Wallet.getERC721TokensPaged(index, count, query)
-}
-
-// double check
-function createSubscriptionFromAsync<T>(
-    f: () => Promise<T>,
-    defaultValue: T,
-    onChange: (callback: () => void) => () => void,
-): Subscription<T> {
-    // 0 - idle, 1 - updating state, > 1 - waiting state
-    let beats = 0
-    let state = defaultValue
-    const { subscribe, trigger } = getEventTarget()
-    f()
-        .then((v) => (state = v))
-        .finally(trigger)
-    const flush = async () => {
-        state = await f()
-        beats -= 1
-        if (beats > 0) {
-            beats = 1
-            setTimeout(flush, 0)
-        } else if (beats < 0) {
-            beats = 0
-        }
-        trigger()
-    }
-    return {
-        getCurrentValue: () => state,
-        subscribe: (sub) => {
-            const a = subscribe(sub)
-            const b = onChange(async () => {
-                beats += 1
-                if (beats === 1) flush()
-            })
-            return () => void [a(), b()]
-        },
-    }
-}
-
-function getEventTarget() {
-    const event = new EventTarget()
-    const EVENT = 'event'
-    let timer: NodeJS.Timeout
-    function trigger() {
-        clearTimeout(timer)
-        // delay to update state to ensure that all settings to be synced globally
-        timer = setTimeout(() => event.dispatchEvent(new Event(EVENT)), 600)
-    }
-    function subscribe(f: () => void) {
-        event.addEventListener(EVENT, f)
-        return () => event.removeEventListener(EVENT, f)
-    }
-    return { trigger, subscribe }
-}

packages/maskbook/src/components/CompositionDialog/Composition.tsx

@@ -2,7 +2,7 @@ import { DialogContent } from '@material-ui/core'
 import { useRef } from 'react'
 import { useCallback, useEffect, useState } from 'react'
 import { activatedSocialNetworkUI, globalUIState } from '../../social-network'
-import { MaskMessage, useI18N } from '../../utils'
+import { MaskMessages, useI18N } from '../../utils'
 import { useFriendsList as useRecipientsList } from '../DataSource/useActivatedUI'
 import { InjectedDialog } from '../shared/InjectedDialog'
 import { CompositionDialogUI, CompositionRef } from './CompositionUI'
@@ -24,7 +24,7 @@ export function Composition({ type = 'timeline', requireClipboardPermission }: P
         UI.current?.reset()
     }, [])
     useEffect(() => {
-        return MaskMessage.events.requestComposition.on(({ reason, open, content, options }) => {
+        return MaskMessages.events.requestComposition.on(({ reason, open, content, options }) => {
             if (reason !== type || globalUIState.profiles.value.length <= 0) return
             setOpen(open)
             if (content) UI.current?.setMessage(content)
@@ -41,7 +41,7 @@ export function Composition({ type = 'timeline', requireClipboardPermission }: P
     }, [type])
     useEffect(() => {
         if (!open) return
-        return MaskMessage.events.replaceComposition.on((message) => {
+        return MaskMessages.events.replaceComposition.on((message) => {
             const ui = UI.current
             if (!ui) return
             UI.current.setMessage(message)

packages/maskbook/src/components/DataSource/useMyPersonas.ts

@@ -2,7 +2,7 @@ import { ValueRef } from '@dimensiondev/holoflows-kit'
 import { useValueRef } from '@masknet/shared'
 import Services from '../../extension/service'
 import { PersonaArrayComparer } from '../../utils/comparer'
-import { MaskMessage } from '../../utils/messages'
+import { MaskMessages } from '../../utils/messages'
 import type { Persona } from '../../database'
 import { debounce } from 'lodash-es'
 
@@ -29,7 +29,7 @@ const independentRef = {
     const debounceQuery = debounce(query, 500, { trailing: true })
 
     isLoading = query()
-    MaskMessage.events.ownPersonaChanged.on(debounceQuery)
+    MaskMessages.events.ownPersonaChanged.on(debounceQuery)
 }
 
 export function useMyPersonas() {

packages/maskbook/src/components/InjectedComponents/EnhancedProfile.tsx

@@ -6,7 +6,7 @@ import InfoOutlinedIcon from '@material-ui/icons/InfoOutlined'
 import { useState, useEffect } from 'react'
 import { CollectibleListAddress } from '../../extension/options-page/DashboardComponents/CollectibleList'
 import { useEthereumAddress } from '../../social-network-adaptor/twitter.com/injection/useEthereumName'
-import { MaskMessage, useI18N } from '../../utils'
+import { MaskMessages, useI18N } from '../../utils'
 import { useLocationChange } from '../../utils/hooks/useLocationChange'
 
 const RULE_TIP = [
@@ -49,11 +49,11 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
     const { t } = useI18N()
 
     useLocationChange(() => {
-        MaskMessage.events.profileNFTsTabUpdated.sendToLocal('reset')
+        MaskMessages.events.profileNFTsTabUpdated.sendToLocal('reset')
     })
 
     useEffect(() => {
-        return MaskMessage.events.profileNFTsPageUpdated.on((data) => {
+        return MaskMessages.events.profileNFTsPageUpdated.on((data) => {
             setShow(data.show)
         })
     }, [])

packages/maskbook/src/components/InjectedComponents/EnhancedProfileTab.tsx

@@ -2,7 +2,7 @@ import { Typography } from '@material-ui/core'
 import classnames from 'classnames'
 import { ReactElement, useCallback, useEffect, useState } from 'react'
 
-import { MaskMessage } from '../../utils'
+import { MaskMessages } from '../../utils'
 
 export interface EnhancedProfileTabProps extends withClasses<'tab' | 'button' | 'selected'> {
     clear(): void
@@ -18,16 +18,16 @@ export function EnhancedProfileTab(props: EnhancedProfileTabProps) {
 
     const onClose = () => {
         setActive(false)
-        MaskMessage.events.profileNFTsPageUpdated.sendToLocal({ show: false })
+        MaskMessages.events.profileNFTsPageUpdated.sendToLocal({ show: false })
         reset()
     }
     const onOpen = () => {
-        MaskMessage.events.profileNFTsPageUpdated.sendToLocal({ show: true })
+        MaskMessages.events.profileNFTsPageUpdated.sendToLocal({ show: true })
         setActive(true)
     }
 
     useEffect(() => {
-        return MaskMessage.events.profileNFTsTabUpdated.on(onClose)
+        return MaskMessages.events.profileNFTsTabUpdated.on(onClose)
     }, [])
 
     const onClick = useCallback(() => {

packages/maskbook/src/components/InjectedComponents/PageInspector.tsx

@@ -4,7 +4,7 @@ import Button from '@material-ui/core/Button'
 import Close from '@material-ui/icons/Close'
 import IconButton from '@material-ui/core/IconButton'
 import { createInjectHooksRenderer, useActivatedPluginsSNSAdaptor } from '@masknet/plugin-infra'
-import { useMatchXS, MaskMessage, useI18N } from '../../utils'
+import { useMatchXS, MaskMessages, useI18N } from '../../utils'
 import { useAutoPasteFailedDialog } from './AutoPasteFailedDialog'
 
 const PluginRender = createInjectHooksRenderer(useActivatedPluginsSNSAdaptor, (x) => x.GlobalInjection)
@@ -16,7 +16,7 @@ export function PageInspector(props: PageInspectorProps) {
     const xsMatched = useMatchXS()
     useEffect(
         () =>
-            MaskMessage.events.autoPasteFailed.on((data) => {
+            MaskMessages.events.autoPasteFailed.on((data) => {
                 const key = data.image ? Math.random() : data.text
                 const close = () => closeSnackbar(key)
                 const timeout = setTimeout(() => {

packages/maskbook/src/components/InjectedComponents/SetupGuide.tsx

@@ -23,7 +23,7 @@ import stringify from 'json-stable-stringify'
 import ActionButton, { ActionButtonPromise } from '../../extension/options-page/DashboardComponents/ActionButton'
 import { noop } from 'lodash-es'
 import { useValueRef } from '@masknet/shared'
-import { useI18N, MaskMessage, useMatchXS, extendsTheme } from '../../utils'
+import { useI18N, MaskMessages, useMatchXS, extendsTheme } from '../../utils'
 import { activatedSocialNetworkUI } from '../../social-network'
 import { currentSetupGuideStatus } from '../../settings/settings'
 import type { SetupGuideCrossContextStatus } from '../../settings/types'
@@ -611,7 +611,7 @@ function SetupGuideUI(props: SetupGuideUIProps) {
         )
         if (!persona_.hasPrivateKey) throw new Error('invalid persona')
         await Services.Identity.setupPersona(persona_.identifier)
-        MaskMessage.events.ownPersonaChanged.sendToAll(undefined)
+        MaskMessages.events.ownPersonaChanged.sendToAll(undefined)
     }
     const onCreate = async () => {
         const content = t('setup_guide_say_hello_content')

packages/maskbook/src/components/InjectedComponents/ToolboxHint.tsx

@@ -20,7 +20,7 @@ import { ToolIconURLs } from '../../resources/tool-icon'
 import { Image } from '../shared/Image'
 import { useMenu } from '../../utils/hooks/useMenu'
 import { forwardRef, useRef, useCallback } from 'react'
-import { MaskMessage } from '../../utils/messages'
+import { MaskMessages } from '../../utils/messages'
 import { PLUGIN_ID as TransakPluginID } from '../../plugins/Transak/constants'
 import { PLUGIN_IDENTIFIER as TraderPluginID } from '../../plugins/Trader/constants'
 import { useControlledDialog } from '../../utils/hooks/useControlledDialog'
@@ -153,7 +153,7 @@ export function ToolboxHint(props: ToolboxHintProps) {
     //#region Encrypted message
     const openEncryptedMessage = useCallback(
         (id?: string) =>
-            MaskMessage.events.requestComposition.sendToLocal({
+            MaskMessages.events.requestComposition.sendToLocal({
                 reason: 'timeline',
                 open: true,
                 options: {