diff --git a/cspell.json b/cspell.json index aad883a441e1..fd922f7317f4 100644 --- a/cspell.json +++ b/cspell.json @@ -288,6 +288,7 @@ "redpackets", "renfil", "shapeclip", + "ssrb", "steth", "swaptoken", "testweb", diff --git a/package.json b/package.json index 671aa07fea2e..d1c6a2792c9a 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,7 @@ "yarn": ">=999.0.0", "npm": ">=999.0.0" }, - "version": "2.8.0", + "version": "2.8.1", "private": true, "license": "AGPL-3.0-or-later", "scripts": { diff --git a/packages/mask/background/network/gun/encryption/queryPostKey.ts b/packages/mask/background/network/gun/encryption/queryPostKey.ts index b5fecca3f820..b321a06eaf98 100644 --- a/packages/mask/background/network/gun/encryption/queryPostKey.ts +++ b/packages/mask/background/network/gun/encryption/queryPostKey.ts @@ -1,10 +1,10 @@ -import { decodeArrayBuffer, encodeArrayBuffer } from '@dimensiondev/kit' -import type { DecryptStaticECDH_PostKey, EncryptionResultE2EMap } from '@masknet/encryption' +import { decodeArrayBuffer, encodeArrayBuffer, isNonNull, unreachable } from '@dimensiondev/kit' +import { type DecryptStaticECDH_PostKey, type EncryptionResultE2EMap, SocialNetworkEnum } from '@masknet/encryption' import type { EC_Public_CryptoKey, EC_Public_JsonWebKey } from '@masknet/shared-base' import { CryptoKeyToJsonWebKey } from '../../../../utils-pure' import { getGunData, pushToGunDataArray, subscribeGunMapData } from '@masknet/gun-utils' import { EventIterator } from 'event-iterator' -import { noop } from 'lodash-unified' +import { isObject, noop, uniq } from 'lodash-unified' import { queryPublicKey } from '../../../database/persona/helper' // !!! Change how this file access Gun will break the compatibility of v40 payload decryption. @@ -36,31 +36,47 @@ namespace Version38Or39 { version: -38 | -39, iv: Uint8Array, minePublicKey: EC_Public_CryptoKey, - networkHint: string, + network: SocialNetworkEnum, abortSignal: AbortSignal, ): AsyncGenerator { const minePublicKeyJWK = await CryptoKeyToJsonWebKey(minePublicKey) - const { keyHash, postHash } = await calculatePostKeyPartition(version, networkHint, iv, minePublicKeyJWK) + const { keyHash, postHash } = await calculatePostKeyPartition(version, network, iv, minePublicKeyJWK) /* cspell:disable-next-line */ // ? In this step we get something like ["jzarhbyjtexiE7aB1DvQ", "jzarhuse6xlTAtblKRx9"] - console.log(`[@masknet/encryption] Reading key partition [${postHash}][${keyHash}]`) - const internalNodeNames = Object.keys((await getGunData(postHash, keyHash)) || {}).filter((x) => x !== '_') + console.log( + `[@masknet/encryption] Reading key partition [${postHash[0]}][${keyHash}] and [${postHash[1]}][${keyHash}]`, + ) + const internalNodeNames = uniq( + ( + await Promise.all([ + // + getGunData(postHash[0], keyHash), + getGunData(postHash[1], keyHash), + ]) + ) + .filter(isNonNull) + .filter(isObject) + .map(Object.keys) + .flat() + .filter((x) => x !== '_'), + ) // ? In this step we get all keys in this category (gun2[postHash][keyHash]) const resultPromise = internalNodeNames.map((key) => getGunData(key)) const iter = new EventIterator((queue) => { + // immediate results for (const result of resultPromise) result.then(emit, noop) - - async function main() { - const iter = subscribeGunMapData([postHash], isValidData, abortSignal) - for await (const data of iter) emit(data) - queue.stop() + // future results + Promise.all([ + main(subscribeGunMapData([postHash[1]], isValidData, abortSignal)), + main(subscribeGunMapData([postHash[0]], isValidData, abortSignal)), + ]).then(() => queue.stop()) + + async function main(keyProvider: AsyncGenerator) { + for await (const data of keyProvider) emit(data) } - - main() - - function emit(result: any) { + function emit(result: unknown) { if (abortSignal.aborted) return if (!isValidData(result)) return queue.push({ @@ -86,10 +102,10 @@ namespace Version38Or39 { export async function publishPostAESKey_version39Or38( version: -39 | -38, postIV: Uint8Array, - networkHint: string, + network: SocialNetworkEnum, receiversKeys: PublishedAESKeyRecord[] | EncryptionResultE2EMap, ) { - const postHash = await hashIV(networkHint, postIV) + const [postHash] = await hashIV(network, postIV) if (Array.isArray(receiversKeys)) { // Store AES key to gun receiversKeys.forEach(async ({ aesKey, receiverKey }) => { @@ -137,23 +153,34 @@ namespace Version38Or39 { async function calculatePostKeyPartition( version: -38 | -39, - networkHint: string, + network: SocialNetworkEnum, iv: Uint8Array, key: EC_Public_JsonWebKey, ) { - const postHash = await hashIV(networkHint, iv) + const postHash = await hashIV(network, iv) // In version > -39, we will use stable hash to prevent unstable result for key hashing const keyHash = version === -39 ? await hashKey39(key) : await hashKey38(key) return { postHash, keyHash } } - async function hashIV(networkHint: string, iv: Uint8Array) { + async function hashIV(network: SocialNetworkEnum, iv: Uint8Array): Promise<[string, string]> { const hashPair = '9283464d-ee4e-4e8d-a7f3-cf392a88133f' const N = 2 - const hash = await work(encodeArrayBuffer(iv), hashPair) - return networkHint + '-' + hash.slice(0, N) + const hash = (await work(encodeArrayBuffer(iv), hashPair)).slice(0, N) + const networkHint = getNetworkHint(network) + return [`${networkHint}${hash}`, `${networkHint}-${hash}`] + } + + function getNetworkHint(x: SocialNetworkEnum) { + if (x === SocialNetworkEnum.Facebook) return '' + if (x === SocialNetworkEnum.Twitter) return 'twitter-' + if (x === SocialNetworkEnum.Minds) return 'minds-' + if (x === SocialNetworkEnum.Instagram) return 'instagram-' + if (x === SocialNetworkEnum.Unknown) + throw new TypeError('[@masknet/encryption] Current SNS network is not correctly configured.') + unreachable(x) } // The difference between V38 and V39 is: V39 is not stable (JSON.stringify) diff --git a/packages/mask/background/services/crypto/appendEncryption.ts b/packages/mask/background/services/crypto/appendEncryption.ts index 9eacc2f45ed2..85913162c69b 100644 --- a/packages/mask/background/services/crypto/appendEncryption.ts +++ b/packages/mask/background/services/crypto/appendEncryption.ts @@ -1,4 +1,10 @@ -import { appendEncryptionTarget, EC_Key, EC_KeyCurveEnum, SupportedPayloadVersions } from '@masknet/encryption' +import { + appendEncryptionTarget, + EC_Key, + EC_KeyCurveEnum, + SocialNetworkEnum, + SupportedPayloadVersions, +} from '@masknet/encryption' import type { EC_Public_CryptoKey, PostIVIdentifier, ProfileIdentifier } from '@masknet/shared-base' import { deriveAESByECDH, queryPublicKey } from '../../database/persona/helper' import { updatePostDB, queryPostDB } from '../../database/post' @@ -10,6 +16,7 @@ export async function appendShareTarget( post: PostIVIdentifier, target: ProfileIdentifier[], whoAmI: ProfileIdentifier, + network: SocialNetworkEnum, ): Promise { if (version === -39 || version === -40) throw new TypeError('invalid version') const key = await getPostKeyCache(post) @@ -38,7 +45,7 @@ export async function appendShareTarget( }, ) - publishPostAESKey_version39Or38(-38, post.toIV(), whoAmI.network, e2e) + publishPostAESKey_version39Or38(-38, post.toIV(), network, e2e) updatePostDB( { diff --git a/packages/mask/background/services/crypto/decryption.ts b/packages/mask/background/services/crypto/decryption.ts index 22d2640a2238..d38f57442e67 100644 --- a/packages/mask/background/services/crypto/decryption.ts +++ b/packages/mask/background/services/crypto/decryption.ts @@ -1,4 +1,4 @@ -import { encodeArrayBuffer, unreachable } from '@dimensiondev/kit' +import { encodeArrayBuffer } from '@dimensiondev/kit' import { decrypt, parsePayload, @@ -158,7 +158,7 @@ async function* decryption(payload: string | Uint8Array, context: DecryptionCont -38, iv, author, - getNetworkHint(context.currentSocialNetwork), + context.currentSocialNetwork, signal || new AbortController().signal, ) }, @@ -170,7 +170,7 @@ async function* decryption(payload: string | Uint8Array, context: DecryptionCont -39, iv, author, - getNetworkHint(context.currentSocialNetwork), + context.currentSocialNetwork, signal || new AbortController().signal, ) }, @@ -185,16 +185,6 @@ async function* decryption(payload: string | Uint8Array, context: DecryptionCont return null } -function getNetworkHint(x: SocialNetworkEnum) { - if (x === SocialNetworkEnum.Facebook) return '' - if (x === SocialNetworkEnum.Twitter) return 'twitter-' - if (x === SocialNetworkEnum.Minds) return 'minds-' - if (x === SocialNetworkEnum.Instagram) return 'instagram-' - if (x === SocialNetworkEnum.Unknown) - throw new TypeError('[@masknet/encryption] Current SNS network is not correctly configured.') - unreachable(x) -} - /** @internal */ export async function getPostKeyCache(id: PostIVIdentifier) { const post = await queryPostDB(id) diff --git a/packages/mask/background/services/crypto/encryption.ts b/packages/mask/background/services/crypto/encryption.ts index 6f3a30844055..17f3d8774732 100644 --- a/packages/mask/background/services/crypto/encryption.ts +++ b/packages/mask/background/services/crypto/encryption.ts @@ -7,6 +7,8 @@ import { EncryptionResultE2EMap, EncryptTargetE2E, EncryptTargetPublic, + SocialNetworkEnum, + SocialNetworkEnumToProfileDomain, } from '@masknet/encryption' import { encryptByLocalKey, deriveAESByECDH, queryPublicKey } from '../../database/persona/helper' import { savePostKeyToDB } from '../../database/post/helper' @@ -18,13 +20,11 @@ export async function encryptTo( content: SerializableTypedMessages, target: EncryptTargetPublic | EncryptTargetE2E, whoAmI: ProfileIdentifier | undefined, - IdentifierNetwork: string, + network: SocialNetworkEnum, ): Promise { - // always use identifier network from ProfileIdentifier if possible. - if (whoAmI) IdentifierNetwork = whoAmI.network const { identifier, output, postKey, e2e } = await encrypt( { - network: IdentifierNetwork, + network: whoAmI?.network || SocialNetworkEnumToProfileDomain(network), author: whoAmI, message: content, target, @@ -59,7 +59,7 @@ export async function encryptTo( })().catch((error) => console.error('[@masknet/encryption] Failed to save post key to DB', error)) if (target.type === 'E2E') { - publishPostAESKey_version39Or38(-38, identifier.toIV(), IdentifierNetwork, e2e!) + publishPostAESKey_version39Or38(-38, identifier.toIV(), network, e2e!) } if (typeof output !== 'string') throw new Error('version -37 is not enabled yet!') return output diff --git a/packages/mask/shared-ui/locales/en-US.json b/packages/mask/shared-ui/locales/en-US.json index 8c6ba2e77bdf..a23d1f59150e 100644 --- a/packages/mask/shared-ui/locales/en-US.json +++ b/packages/mask/shared-ui/locales/en-US.json @@ -337,14 +337,14 @@ "plugin_wallet_name_placeholder": "Enter 1-12 characters", "plugin_wallet_fail_to_sign": "Failed to sign password.", "plugin_wallet_cancel_sign": "Signature canceled.", - "plugin_nft_avatar_recommend_feature_description": "Set your NFT as profile picture with exclusive aura", + "plugin_nft_avatar_recommend_feature_description": "Set your NFT as profile picture with exclusive aura.", "plugin_red_packet_display_name": "Plugin: Lucky Drop", "application_hint": "Socialize and show off your NFTs. People can bid,buy, view your valuable NFTs without leaving Twitter.", "plugin_red_packet_claimed": "Claimed", "plugin_red_packet_erc20_tab_title": "Token", "plugin_red_packet_erc721_tab_title": "Collectibles", "plugin_red_packet_name": "Lucky Drop", - "plugin_red_packet_recommend_feature_description": "Astonish your friends with a surprise gift", + "plugin_red_packet_recommend_feature_description": "Astonish your friends with a surprise gift.", "plugin_red_packet_description": "Gift crypto or NFTs to any users, first come, first served.", "plugin_red_packet_erc721_insufficient_balance": "Insufficient Balance", "plugin_red_packet_details": "Lucky Drop Details", diff --git a/packages/mask/src/components/CompositionDialog/EncryptionMethodSelector.tsx b/packages/mask/src/components/CompositionDialog/EncryptionMethodSelector.tsx index 66628247b110..27c34a0ba7d7 100644 --- a/packages/mask/src/components/CompositionDialog/EncryptionMethodSelector.tsx +++ b/packages/mask/src/components/CompositionDialog/EncryptionMethodSelector.tsx @@ -13,6 +13,12 @@ const useStyles = makeStyles()((theme) => ({ color: theme.palette.text.secondary, marginRight: 12, }, + divider: { + width: '100%', + height: 1, + background: theme.palette.divider, + margin: '8px 0', + }, rightIcon: { marginLeft: 'auto', }, @@ -48,8 +54,8 @@ export function EncryptionMethodSelector(props: EncryptionMethodSelectorProps) { value={EncryptionMethodType.Text} title={t('compose_encrypt_method_text')} subTitle={t('compose_encrypt_method_text_sub_title')} - showDivider /> +
(null) - const e2eDisabledMessage = props.e2eDisabled ? ( -
- {t('persona_required')} - { - if (props.e2eDisabled === E2EUnavailableReason.NoLocalKey) return - props.e2eDisabled === E2EUnavailableReason.NoPersona - ? props.onCreatePersona() - : props.onConnectPersona() - }}> - {props.e2eDisabled === E2EUnavailableReason.NoPersona ? t('create') : t('connect')} - -
- ) : null + const e2eDisabledMessage = + props.e2eDisabled && props.e2eDisabled !== E2EUnavailableReason.NoLocalKey ? ( +
+ {t('persona_required')} + { + if (props.e2eDisabled === E2EUnavailableReason.NoLocalKey) return + props.e2eDisabled === E2EUnavailableReason.NoPersona + ? props.onCreatePersona() + : props.onConnectPersona() + }}> + {props.e2eDisabled === E2EUnavailableReason.NoPersona ? t('create') : t('connect')} + +
+ ) : null const noLocalKeyMessage = props.e2eDisabled === E2EUnavailableReason.NoLocalKey && (
{t('compose_no_local_key')} @@ -137,18 +138,18 @@ export function EncryptionTargetSelector(props: EncryptionTargetSelectorProps) { value={EncryptionTargetType.Public} title={t('compose_encrypt_visible_to_all')} subTitle={t('compose_encrypt_visible_to_all_sub')} - showDivider /> +
props.onChange(EncryptionTargetType.Self)} disabled={!!props.e2eDisabled} value={EncryptionTargetType.Self} title={t('compose_encrypt_visible_to_private')} subTitle={t('compose_encrypt_visible_to_private_sub')} - showDivider /> {e2eDisabledMessage} {noLocalKeyMessage} +
{ props.onChange(EncryptionTargetType.E2E) diff --git a/packages/mask/src/components/CompositionDialog/PopoverListItem.tsx b/packages/mask/src/components/CompositionDialog/PopoverListItem.tsx index 3024a9274cf9..b69206b74ce4 100644 --- a/packages/mask/src/components/CompositionDialog/PopoverListItem.tsx +++ b/packages/mask/src/components/CompositionDialog/PopoverListItem.tsx @@ -8,12 +8,6 @@ const useStyles = makeStyles()((theme) => ({ display: 'flex', alignItems: 'center', }, - divider: { - width: '100%', - height: 1, - background: theme.palette.divider, - margin: '8px 0', - }, mainTitle: { fontSize: 14, color: theme.palette.text.primary, @@ -34,11 +28,10 @@ interface PopoverListItemProps { title: string subTitle?: string disabled?: boolean - showDivider?: boolean onItemClick?(): void } export function PopoverListItem(props: PopoverListItemProps) { - const { title, subTitle, value, itemTail, disabled, showDivider, onItemClick } = props + const { title, subTitle, value, itemTail, disabled, onItemClick } = props const { classes, cx } = useStyles() return ( <> @@ -53,7 +46,6 @@ export function PopoverListItem(props: PopoverListItemProps) { {itemTail}
- {showDivider &&
} ) } diff --git a/packages/mask/src/components/CompositionDialog/useSubmit.ts b/packages/mask/src/components/CompositionDialog/useSubmit.ts index c58b539f13b9..632718d60c6e 100644 --- a/packages/mask/src/components/CompositionDialog/useSubmit.ts +++ b/packages/mask/src/components/CompositionDialog/useSubmit.ts @@ -25,7 +25,7 @@ export function useSubmit(onClose: () => void, reason: 'timeline' | 'popup' | 'r content, target, lastRecognizedIdentity?.identifier ?? fallbackProfile, - activatedSocialNetworkUI.networkIdentifier, + activatedSocialNetworkUI.encryptionNetwork, ) const encrypted = socialNetworkEncoder(activatedSocialNetworkUI.encryptionNetwork, _encrypted) diff --git a/packages/mask/src/components/InjectedComponents/DecryptedPost/DecryptedPostSuccess.tsx b/packages/mask/src/components/InjectedComponents/DecryptedPost/DecryptedPostSuccess.tsx index 1d3575ceaebd..10fa0f051c6a 100644 --- a/packages/mask/src/components/InjectedComponents/DecryptedPost/DecryptedPostSuccess.tsx +++ b/packages/mask/src/components/InjectedComponents/DecryptedPost/DecryptedPostSuccess.tsx @@ -14,6 +14,7 @@ import { useAsyncRetry } from 'react-use' import Services from '../../../extension/service' import type { LazyRecipients } from '../../CompositionDialog/CompositionUI' import { delay } from '@dimensiondev/kit' +import { activatedSocialNetworkUI } from '../../../social-network' export interface DecryptPostSuccessProps { message: TypedMessage @@ -109,6 +110,7 @@ function AppendShareDetail(props: { onClose(): void; recipients: LazyRecipients; iv, profiles.map((x) => x.identifier), props.whoAmI, + activatedSocialNetworkUI.encryptionNetwork, ) await delay(1500) retry() diff --git a/packages/mask/src/components/InjectedComponents/ToolboxUnstyled.tsx b/packages/mask/src/components/InjectedComponents/ToolboxUnstyled.tsx index 106098381aeb..6a2593c93cca 100644 --- a/packages/mask/src/components/InjectedComponents/ToolboxUnstyled.tsx +++ b/packages/mask/src/components/InjectedComponents/ToolboxUnstyled.tsx @@ -91,6 +91,7 @@ export function ToolboxHintUnstyled(props: ToolboxHintProps) { function ToolboxHintForApplication(props: ToolboxHintProps) { const { ListItemButton = MuiListItemButton, + ListItemIcon = MuiListItemIcon, Container = 'div', Typography = MuiTypography, iconSize = 24, @@ -104,7 +105,9 @@ function ToolboxHintForApplication(props: ToolboxHintProps) { - + + + {mini ? null : ( ('init') + const completeClass = classNames(classes.success, b.className) const failClass = classNames(classes.failed, b.className) diff --git a/packages/mask/src/manifest.json b/packages/mask/src/manifest.json index 9f1dfefa71f5..11ca601842b0 100644 --- a/packages/mask/src/manifest.json +++ b/packages/mask/src/manifest.json @@ -1,6 +1,6 @@ { "name": "Mask Network", - "version": "2.8.0", + "version": "2.8.1", "manifest_version": 2, "permissions": ["storage", "downloads", "webNavigation", "activeTab"], "optional_permissions": ["", "notifications", "clipboardRead"], diff --git a/packages/mask/src/plugins/Collectible/SNSAdaptor/OrderRow.tsx b/packages/mask/src/plugins/Collectible/SNSAdaptor/OrderRow.tsx index f0b8f0a75305..b7e6d9c1f330 100644 --- a/packages/mask/src/plugins/Collectible/SNSAdaptor/OrderRow.tsx +++ b/packages/mask/src/plugins/Collectible/SNSAdaptor/OrderRow.tsx @@ -108,7 +108,7 @@ export function OrderRow({ order, isDifferenceToken }: IRowProps) { order.current_price, order.payment_token_contract?.decimals, order.quantity, - )}{' '} + )?.toFixed()}{' '} {order.payment_token_contract?.symbol} diff --git a/packages/mask/src/plugins/Collectible/constants.ts b/packages/mask/src/plugins/Collectible/constants.ts index 65e2309325f2..15e3bab7f736 100644 --- a/packages/mask/src/plugins/Collectible/constants.ts +++ b/packages/mask/src/plugins/Collectible/constants.ts @@ -6,8 +6,7 @@ export const PLUGIN_ID = PluginId.Collectible export const PLUGIN_META_KEY = `${PluginId.Collectible}:1` export const openseaHostnames = ['opensea.io', 'testnets.opensea.io'] -export const openseaPathnameRegexMatcher = /^\/assets\/(0x[\dA-Fa-f]{40})\/(\d+)/ - +export const openseaPathnameRegexMatcher = /^\/assets\/(?:ethereum\/)?(0x[\dA-Fa-f]{40})\/(\d+)/ export const raribleHostnames = ['rarible.com', 'app.rarible.com', 'ropsten.rarible.com'] export const rariblePathnameRegexMatcher = /^\/token\/(0x[\dA-Fa-f]{40}):(\d+)/ diff --git a/packages/mask/src/plugins/NextID/components/NextIdPage.tsx b/packages/mask/src/plugins/NextID/components/NextIdPage.tsx index cba3c8cc5b66..9ffbed296835 100644 --- a/packages/mask/src/plugins/NextID/components/NextIdPage.tsx +++ b/packages/mask/src/plugins/NextID/components/NextIdPage.tsx @@ -109,7 +109,7 @@ export function NextIdPage({ personaList }: NextIdPageProps) { firstTab.click() } - if (personaActionButton) { + if (personaActionButton && isOwn) { return ( {personaActionButton} diff --git a/packages/mask/src/social-network-adaptor/facebook.com/injection/Toolbar.tsx b/packages/mask/src/social-network-adaptor/facebook.com/injection/Toolbar.tsx index 0271d175348d..7dd832f3934f 100644 --- a/packages/mask/src/social-network-adaptor/facebook.com/injection/Toolbar.tsx +++ b/packages/mask/src/social-network-adaptor/facebook.com/injection/Toolbar.tsx @@ -6,7 +6,8 @@ import { ToolboxAtFacebook } from './ToolbarUI' export function injectToolboxHintAtFacebook(signal: AbortSignal, category: 'wallet' | 'application') { const watcher = new MutationObserverWatcher(toolBoxInSideBarSelector()) startWatch(watcher, signal) + const hasTopNavBar = Boolean(document.querySelector('#ssrb_top_nav_start ~ [role="banner"]')) createReactRootShadowed(watcher.firstDOMProxy.afterShadow, { signal }).render( - , + , ) } diff --git a/packages/mask/src/social-network-adaptor/facebook.com/injection/ToolbarUI.tsx b/packages/mask/src/social-network-adaptor/facebook.com/injection/ToolbarUI.tsx index da7d3003887c..bb5605084996 100644 --- a/packages/mask/src/social-network-adaptor/facebook.com/injection/ToolbarUI.tsx +++ b/packages/mask/src/social-network-adaptor/facebook.com/injection/ToolbarUI.tsx @@ -3,8 +3,8 @@ import { ToolboxHintUnstyled } from '../../../components/InjectedComponents/Tool const fbBreakPoint = 700 /** px */ -const Container = styled('div')` - padding: 0 8px; +const Container = styled('div')<{ hasTopNavBar: boolean }>` + padding: 0 ${(props) => (props.hasTopNavBar ? '8px' : '4px')}; ` const Item = styled(ListItemButton)` border-radius: 8px; @@ -16,22 +16,23 @@ const Text = styled(Typography)` color: var(--primary-text); font-weight: 500; ` -const Icon = styled(ListItemIcon)` - min-width: 46px; +const Icon = styled(ListItemIcon)<{ hasTopNavBar: boolean }>` + min-width: ${(props) => (props.hasTopNavBar ? '46px' : 'auto')}; + margin-right: ${(props) => (props.hasTopNavBar ? '0px' : '12px')}; @media screen and (max-height: ${fbBreakPoint}px) { - min-width: 36px; + min-width: ${(props) => (props.hasTopNavBar ? '36px' : 'auto')}; } ` -export function ToolboxAtFacebook(props: { category: 'wallet' | 'application' }) { +export function ToolboxAtFacebook(props: { category: 'wallet' | 'application'; hasTopNavBar: boolean }) { const isSmall = useMediaQuery(`(max-height: ${fbBreakPoint}px)`) return ( {children}} ListItemButton={Item} Typography={Text} - ListItemIcon={Icon} + ListItemIcon={({ children }) => {children}} category={props.category} /> ) diff --git a/packages/mask/src/social-network-adaptor/minds.com/customization/custom.ts b/packages/mask/src/social-network-adaptor/minds.com/customization/custom.ts index 46f2e15ef256..977325171b2f 100644 --- a/packages/mask/src/social-network-adaptor/minds.com/customization/custom.ts +++ b/packages/mask/src/social-network-adaptor/minds.com/customization/custom.ts @@ -28,14 +28,15 @@ export function startWatchThemeColor(signal: AbortSignal) { if (backgroundColor) backgroundColorRef.value = currentTheme.value === 'light' ? 'rgb(244, 244 ,245)' : 'rgb(26, 32, 37)' } + // init + currentTheme.value = getBackgroundColor(document.body) === 'rgb(255,255,255)' ? 'light' : 'dark' const watcher = new MutationObserverWatcher(themeListItemSelector()) - .addListener('onAdd', updateThemeColor) - .addListener('onChange', updateThemeColor) - .startWatch({ - childList: true, - subtree: true, - }) + // update + watcher.addListener('onAdd', updateThemeColor).addListener('onChange', updateThemeColor).startWatch({ + childList: true, + subtree: true, + }) signal.addEventListener('abort', () => watcher.stopWatch()) } diff --git a/packages/mask/src/social-network-adaptor/minds.com/injection/ToolboxHint_UI.tsx b/packages/mask/src/social-network-adaptor/minds.com/injection/ToolboxHint_UI.tsx index de15d87e68eb..77b4a151d92c 100644 --- a/packages/mask/src/social-network-adaptor/minds.com/injection/ToolboxHint_UI.tsx +++ b/packages/mask/src/social-network-adaptor/minds.com/injection/ToolboxHint_UI.tsx @@ -1,5 +1,5 @@ import { ToolboxHintUnstyled } from '../../../components/InjectedComponents/ToolboxUnstyled' -import { styled, ListItemButton, Typography, ListItemIcon, useMediaQuery } from '@mui/material' +import { styled, ListItemButton, Typography, ListItemIcon, useMediaQuery, useTheme } from '@mui/material' const mindsBreakPoint = 1221 /** px */ @@ -42,7 +42,7 @@ const Icon = styled(ListItemIcon)` export function ToolboxHintAtMinds(props: { category: 'wallet' | 'application' }) { const mini = useMediaQuery(`(max-width: ${mindsBreakPoint}px)`) - + const mode = useTheme().palette.mode return ( (selector: export const rootSelector: () => LiveSelector = () => querySelector('m-app') export const themeListItemSelector: () => LiveSelector = () => - querySelector( - 'm-usermenu__v3 > div.m-user-menu.m-dropdown > ul > li:nth-child(5) .ng-star-inserted', - ) + querySelector('.m-sidebarMore__dropdown > li:nth-child(7)') export const composerModalSelector: () => LiveSelector = () => querySelector('m-composer__modal') diff --git a/packages/shared/src/UI/components/AssetPlayer/index.tsx b/packages/shared/src/UI/components/AssetPlayer/index.tsx index ed4b076351a1..daf41f78b39d 100644 --- a/packages/shared/src/UI/components/AssetPlayer/index.tsx +++ b/packages/shared/src/UI/components/AssetPlayer/index.tsx @@ -202,7 +202,7 @@ export const AssetPlayer = memo((props) => { )) : props.loadingIcon ?? } - {IframeResizerMemo} + {AssetPlayerState.LOADING !== playerState && IframeResizerMemo} ) })