[Release] New release 2.24.0 (minor) (#11228)

* chore: bump version to 2.24.0

* fix: duplicate subscription creation (#11230)

* fix: invalid chain context in swap page (#11233)

* fix: incorrect decode when create tweet (#11234)

* fix: mf-5919 reverse lens handle (#11235)

* fix: mf-5908 expand collapsed tweet in detail page (#11236)

* fix: mf-5914 color of twitter tabs (#11237)

* fix(ui): mf-5551 expand redpacket title (#11238)

* fix: decode data value might not be BigNumber (#11229)

* fix: decode data value might not be BigNumber

* fix: get redpacket password lazy

* chore: reduce size (#11240)

* fix: mf-5903 redpacket histories (#11239)

* fix(Twitter): mf-5924 post image via Twitter API (#11242)

* fix: mf-5926 decode function parameters (#11243)

* fix: mf-5929 adjust popup window if page get zoom in (#11241)

* fix: mf-5929 adjust popup window if page get zoom in

* refactor: remove logs

---------

Co-authored-by: guanbinrui <52657989+guanbinrui@users.noreply.github.com>

* fix: mf-5930 decode events return values (#11244)

* fix: mf-5930 decode events return values

* add unit test

* refactor: fetch NFTs in TrendingView (#11245)

* refactor: fetch NFTs in TrendingView

* fix: mf-5933 treat CryptoPunks as ERC721

* fix: mf-5915 mf-5680 plugin message sendToLocal (#11246)

* fix: mf-5915 mf-5680 plugin message sendToLocal

* fix: mui complains about spacing on grid that not contianer

* fix: mf-5928 publish post for popup only, and reload after publishing (#11247)

* fix: mf-5937 update collectible (#11248)

* fix: mf-5937 update collectible

* fix: mf-5936 avoid flickering in nft list

* fixup! fix: mf-5937 update collectible

* fix: mf-5671 close transaction confirm modal (#11249)

* fix(Tips): mf-5922 mf-5923 mirror dom and url gets updated (#11252)

* fix: mf-5953 friend tech in app setting (#11253)

* fix(DSearch): mf-5679 search wallet address (#11254)

* fix: mf-5940 setting avatar (#11256)

* fix: some small issues (#11257)

* chore: patch @tanstack/query-async-storage-persister to fix performance problem (#11227)

* fix: ui bugs (#11258)

* fix: mf-5212

* fix: mf-5338

* fix: revert tab color

* fix: mf-5476

* fix: mf-5434

* fix: mf-5239

* fix: asset

* fix: prettier

* chore: review

* chore: remove unused

---------

Co-authored-by: beyond009 <beyond009@users.noreply.github.com>

* fix(RedPacket): some UI issues (#11260)

* fix: mf-5551 don't break words in redpacket

* fix: mf-5631 invalid simple hash queries

* fix: mf-5941 disable outline for transaction link in snackbar

* fix: mf-5960 claimed progress

* refactor: redpacket history code style

* fix: bugfix for popup (#11255)

* fix: bugfix for popup

* fix: incorrect chainId

* chore: reply review

* refactor: replace invalidate queries to remove queries (#11262)

* chore: disable address reading from bio (#11265)

* fix: multiple webpack runtime (#11264)

* fix: type check (#11267)

* fix: mf-5422 hide lens popup (#11268)

* fix: mf-5422 hide lens popup

* fix(FileService): small ui issues

---------

Co-authored-by: guanbinrui <52657989+guanbinrui@users.noreply.github.com>

* fix: mf-5927 responsive mask icon size in toolbar (#11269)

* fix: bugfix for lens manager (#11271)

* fix(ScamSniffer): mf-5938 check url with scamsniffer's api (#11270)

* fix: fixup mf-5482

* fix: mf-5561 adjust menu padding

* fix: mf-5965 adjust nft red packet layout

* fix(ScamSniffer): mf-5938 check url with scamsniffer's api

* refactor: mv constants

---------

Co-authored-by: guanbinrui <guanbinrui@dimension.im>

* fix: bugfix for calendar (#11272)

* fix: mf-5435

* fix: mf-5645

* fix: mf-5450

* Revert "fix: bugfix for calendar" (#11274)

* refactor: MF-5950 (#11275)

* fix: mf-5450

* fix: mf-5645

* fix: mf-5435

* fix: tab color

---------

Co-authored-by: Harlan Sun <1249413181@qq.com>

* fix(Identity): mf-5973 address social account should be verified by Firefly (#11277)

* fix(Identity): mf-5973 address social account should be verified by Firefly

* fix: mf-5965 adjust nft redpacket layout

* fix: remove twitter blue (#11278)

* refactor: adjust get nft avalibility (#11279)

* fix: mf-5270 check response in interaction page (#11273)

* fix: mf-5476 calendar img loading (#11280)

* fix: bugfix for lens manage tag (#11281)

* fix: mf-5597 revert showNextId in web3 tab (#11276)

* fix: mf-5964 catch error during getting address from nextid (#11282)

* fix: mf-5964 catch error during getting address from nextid

* fixup! fix(Identity): mf-5973 address social account should be verified by Firefly (#11277)

* fix: calendar img loading (#11283)

* fix: create wallet with mnemonic (#11284)

* fix: incorrect sign (#11286)

* fix: refresh persona avatar (#11285)

* fix: cancel transaction (#11287)

* fix: cancel transaction

* chore: revert gas

---------

Co-authored-by: nuanyang233 <nuanyang233@gmail.com>
Co-authored-by: UncleBill <billbill290@gmail.com>
Co-authored-by: Jack Works <jackworks@protonmail.com>
Co-authored-by: Harlan Sun <33143119+beyond009@users.noreply.github.com>
Co-authored-by: beyond009 <beyond009@users.noreply.github.com>
Co-authored-by: Harlan Sun <1249413181@qq.com>

package.json

@@ -8,7 +8,7 @@
     "yarn": ">=999.0.0",
     "npm": ">=999.0.0"
   },
-  "version": "2.23.3",
+  "version": "2.24.0",
   "private": true,
   "license": "AGPL-3.0-or-later",
   "scripts": {
@@ -29,7 +29,7 @@
     "clean": "npx gulp clean"
   },
   "dependencies": {
-    "@dimensiondev/holoflows-kit": "0.9.0-20230307045856-46252fb",
+    "@dimensiondev/holoflows-kit": "0.9.0-20240104084316-88642f9",
     "@emotion/cache": "11.11.0",
     "@emotion/react": "11.11.1",
     "@emotion/serialize": "1.1.2",

packages/icons/icon-generated-as-jsx.js

@@ -85,7 +85,33 @@ export const Danger = /*#__PURE__*/ __createIcon('Danger', [
 ])
 export const DangerOutline = /*#__PURE__*/ __createIcon('DangerOutline', [
     {
-        u: () => new URL('./brands/DangerOutline.svg', import.meta.url).href,
+        j: () =>
+            /*#__PURE__*/ _jsxs('svg', {
+                xmlns: 'http://www.w3.org/2000/svg',
+                fill: 'none',
+                viewBox: '0 0 20 20',
+                children: [
+                    /*#__PURE__*/ _jsx('path', {
+                        fill: 'currentColor',
+                        fillRule: 'evenodd',
+                        d: 'M10 7.134c.37 0 .668.299.668.667v3.658a.667.667 0 0 1-1.334 0V7.801c0-.368.299-.667.667-.667Z',
+                        clipRule: 'evenodd',
+                    }),
+                    /*#__PURE__*/ _jsx('path', {
+                        fill: 'currentColor',
+                        fillRule: 'evenodd',
+                        d: 'M10 3.78c-.526 0-1.201.36-1.787 1.417L3.78 13.172c-.544.981-.506 1.727-.236 2.187.27.46.9.855 2.024.855H10c.033 0 .066.003.099.007h4.335c1.118 0 1.75-.395 2.02-.855.272-.461.31-1.206-.233-2.186L13.94 9.068l-2.151-3.87C11.203 4.14 10.527 3.779 10 3.779Zm-.098 13.767H5.567c-1.416 0-2.585-.511-3.174-1.513-.587-1.001-.465-2.272.22-3.508l4.434-7.975c.717-1.292 1.76-2.105 2.954-2.105 1.193 0 2.236.812 2.953 2.104m0 0 2.151 3.87 2.283 4.113c.686 1.237.805 2.508.217 3.509-.589 1-1.758 1.513-3.17 1.513H10a.675.675 0 0 1-.1-.008',
+                        clipRule: 'evenodd',
+                    }),
+                    /*#__PURE__*/ _jsx('path', {
+                        fill: 'currentColor',
+                        fillRule: 'evenodd',
+                        d: 'M9.163 13.654c0-.46.373-.833.833-.833h.006a.833.833 0 0 1 0 1.667h-.006a.833.833 0 0 1-.833-.834Z',
+                        clipRule: 'evenodd',
+                    }),
+                ],
+            }),
+        s: true,
     },
 ])
 export const Debank = /*#__PURE__*/ __createIcon('Debank', [
@@ -664,7 +690,19 @@ export const Appearance = /*#__PURE__*/ __createIcon('Appearance', [
 ])
 export const Appendices = /*#__PURE__*/ __createIcon('Appendices', [
     {
-        u: () => new URL('./general/Appendices.svg', import.meta.url).href,
+        j: () =>
+            /*#__PURE__*/ _jsx('svg', {
+                xmlns: 'http://www.w3.org/2000/svg',
+                fill: 'none',
+                viewBox: '0 0 20 20',
+                children: /*#__PURE__*/ _jsx('path', {
+                    fill: 'currentColor',
+                    fillRule: 'evenodd',
+                    d: 'M12.537 4.226c-.486 0-.953.193-1.297.537l-5.744 5.744A3.085 3.085 0 1 0 9.86 14.87l5.744-5.744a.667.667 0 0 1 .942.943l-5.743 5.744a4.42 4.42 0 0 1-6.25-6.25l5.744-5.743a3.168 3.168 0 0 1 4.48 4.48l-5.75 5.744a1.918 1.918 0 0 1-2.711-2.711l5.307-5.3a.667.667 0 0 1 .942.943l-5.306 5.3a.584.584 0 1 0 .826.825l5.75-5.743a1.835 1.835 0 0 0-1.298-3.132Z',
+                    clipRule: 'evenodd',
+                }),
+            }),
+        s: true,
     },
 ])
 export const ApplicationNFT = /*#__PURE__*/ __createIcon('ApplicationNFT', [

packages/injected-script/sdk/index.ts

@@ -34,6 +34,7 @@ const Providers = [
     injectedCoin98EVMProvider,
     injectedCoin98SolanaProvider,
     injectedPhantomProvider,
+    injectedMetaMaskProvider,
 ]
 
 export function pasteText(text: string) {

packages/mask/.webpack/config.ts

@@ -284,7 +284,7 @@ export async function createConfiguration(_inputFlags: BuildFlags): Promise<webp
             nodeEnv: false, // provided in EnvironmentPlugin
             realContentHash: false,
             removeAvailableModules: productionLike,
-            runtimeChunk: false,
+            runtimeChunk: 'single',
             splitChunks:
                 productionLike ? undefined : (
                     {

packages/mask/content-script/components/CompositionDialog/useSubmit.ts

@@ -1,12 +1,12 @@
-import { useCallback } from 'react'
+import Services from '#services'
 import { encodeByNetwork } from '@masknet/encryption'
-import { PluginID, type ProfileIdentifier, Sniffings } from '@masknet/shared-base'
+import { PluginID, Sniffings, SOCIAL_MEDIA_NAME } from '@masknet/shared-base'
 import type { Meta } from '@masknet/typed-message'
 import { Telemetry } from '@masknet/web3-telemetry'
 import { EventID, EventType } from '@masknet/web3-telemetry/types'
-import Services from '#services'
-import { activatedSiteAdaptorUI, activatedSiteAdaptor_state } from '../../site-adaptor-infra/index.js'
+import { useCallback } from 'react'
 import { useMaskSharedTrans } from '../../../shared-ui/index.js'
+import { activatedSiteAdaptorUI } from '../../site-adaptor-infra/index.js'
 import { useLastRecognizedIdentity } from '../DataSource/useActivatedUI.js'
 import type { SubmitComposition } from './CompositionUI.js'
 import { SteganographyPayload } from './SteganographyPayload.js'
@@ -18,8 +18,6 @@ export function useSubmit(onClose: () => void, reason: 'timeline' | 'popup' | 'r
     return useCallback(
         async (info: SubmitComposition) => {
             const { content, encode, target } = info
-            const fallbackProfile: ProfileIdentifier | undefined =
-                activatedSiteAdaptor_state!.profiles.value[0]?.identifier
             if (encode === 'image' && !lastRecognizedIdentity) throw new Error('No Current Profile')
 
             // rawEncrypted is either string or Uint8Array
@@ -28,7 +26,7 @@ export function useSubmit(onClose: () => void, reason: 'timeline' | 'popup' | 'r
                 info.version,
                 content,
                 target,
-                lastRecognizedIdentity?.identifier ?? fallbackProfile,
+                lastRecognizedIdentity.identifier,
                 activatedSiteAdaptorUI!.encryptPayloadNetwork,
             )
             // Since we cannot directly send binary in the composition box, we need to encode it into a string.
@@ -38,26 +36,29 @@ export function useSubmit(onClose: () => void, reason: 'timeline' | 'popup' | 'r
                 encode === 'image' ?
                     decorateEncryptedText('', t, content.meta)
                 :   decorateEncryptedText(encrypted, t, content.meta)
+
+            const options = { interpolation: { escapeValue: false } }
             const defaultText: string =
                 encode === 'image' ?
                     t.additional_post_box__encrypted_post_pre({
                         encrypted: 'https://mask.io/',
                     })
-                :   t.additional_post_box__encrypted_post_pre({ encrypted })
+                :   t.additional_post_box__encrypted_post_pre({ encrypted, ...options })
             const mediaObject =
                 encode === 'image' ?
                     // We can send raw binary through the image, but for the text we still use the old way.
                     // For text, it must send the text _after_ encodeByNetwork, otherwise it will break backward compatibility.
                     await SteganographyPayload(typeof rawEncrypted === 'string' ? encrypted : rawEncrypted)
                 :   undefined
 
-            if (activatedSiteAdaptorUI?.automation.endpoint?.publishPost) {
-                await activatedSiteAdaptorUI.automation.endpoint.publishPost(
+            if (activatedSiteAdaptorUI?.automation.endpoint?.publishPost && reason === 'timeline') {
+                const postId = await activatedSiteAdaptorUI.automation.endpoint.publishPost(
                     mediaObject ? [decoratedText || defaultText, mediaObject] : [decoratedText || defaultText],
                     {
                         reason,
                     },
                 )
+                if (postId) location.reload()
             } else {
                 if (encode === 'image') {
                     if (!mediaObject) throw new Error('Failed to create image payload.')
@@ -95,20 +96,23 @@ function decorateEncryptedText(
     t: ReturnType<typeof useMaskSharedTrans>,
     meta?: Meta,
 ): string | null {
+    if (!meta) return null
     const hasOfficialAccount = Sniffings.is_twitter_page || Sniffings.is_facebook_page
     const officialAccount = Sniffings.is_twitter_page ? t.twitter_account() : t.facebook_account()
-    const options = { interpolation: { escapeValue: false } }
+    const token = meta?.has(`${PluginID.RedPacket}:1`) ? t.redpacket_a_token() : t.redpacket_an_nft()
+    const sns = SOCIAL_MEDIA_NAME[activatedSiteAdaptorUI?.networkIdentifier!]
+    const options = { interpolation: { escapeValue: false }, token, sns }
 
     // Note: since this is in the composition stage, we can assume plugins don't insert old version of meta.
-    if (meta?.has(`${PluginID.RedPacket}:1`) || meta?.has(`${PluginID.RedPacket}_nft:1`)) {
+    if (meta.has(`${PluginID.RedPacket}:1`) || meta.has(`${PluginID.RedPacket}_nft:1`)) {
         return hasOfficialAccount ?
                 t.additional_post_box__encrypted_post_pre_red_packet_sns_official_account({
                     encrypted,
                     account: officialAccount,
                     ...options,
                 })
             :   t.additional_post_box__encrypted_post_pre_red_packet({ encrypted, ...options })
-    } else if (meta?.has(`${PluginID.FileService}:3`)) {
+    } else if (meta.has(`${PluginID.FileService}:3`)) {
         return hasOfficialAccount ?
                 t.additional_post_box__encrypted_post_pre_file_service_sns_official_account({
                     encrypted,

packages/mask/content-script/components/InjectedComponents/PostDialogHint.tsx

@@ -68,7 +68,7 @@ const EntryIconButton = memo(function EntryIconButton(props: PostDialogHintUIPro
                 size="large"
                 className={cx(classes.button, classes.iconButton)}
                 onClick={props.onHintButtonClicked}>
-                {ICON_MAP?.[props?.iconType ?? 'default']}
+                {ICON_MAP[props.iconType ?? 'default']}
             </IconButton>
         </ShadowRootTooltip>
     )
@@ -85,12 +85,17 @@ export const PostDialogHint = memo(function PostDialogHintUI(props: PostDialogHi
     const { classes } = useStyles(undefined, { props })
     const t = useMaskSharedTrans()
 
-    return isMobileFacebook ?
+    if (isMobileFacebook)
+        return (
             <div className={classes.wrapper} onClick={onHintButtonClicked}>
                 <EntryIconButton size={size} onHintButtonClicked={() => undefined} />
                 <Typography className={classes.text}>{t.post_modal_hint__button()}</Typography>
             </div>
-        :   <div className={classes.buttonTransform}>
-                <EntryIconButton size={size} onHintButtonClicked={onHintButtonClicked} {...others} />
-            </div>
+        )
+
+    return (
+        <div className={classes.buttonTransform}>
+            <EntryIconButton size={size} onHintButtonClicked={onHintButtonClicked} {...others} />
+        </div>
+    )
 })

packages/mask/content-script/components/InjectedComponents/ProfileCard/AvatarDecoration.tsx

@@ -1,5 +1,5 @@
 import { Twitter } from '@masknet/web3-providers'
-import { RSS3_KEY_SITE, NFTAvatarMiniClip, NFTBadgeTimeline } from '@masknet/plugin-avatar'
+import { RSS3_KEY_SITE, NFTBadgeTimeline } from '@masknet/plugin-avatar'
 import { useQuery } from '@tanstack/react-query'
 
 interface Props {
@@ -19,14 +19,14 @@ export function AvatarDecoration({ clipPathId, userId, className, size }: Props)
 
     if (!userId || !user) return null
 
-    return user.has_nft_avatar ?
-            <NFTAvatarMiniClip className={className} id={clipPathId} size={size} screenName={userId} />
-        :   <NFTBadgeTimeline
-                classes={{ root: className }}
-                userId={userId}
-                avatarId={Twitter.getAvatarId(user.avatarURL)}
-                height={size}
-                width={size}
-                siteKey={RSS3_KEY_SITE.TWITTER}
-            />
+    return (
+        <NFTBadgeTimeline
+            classes={{ root: className }}
+            userId={userId}
+            avatarId={Twitter.getAvatarId(user.avatarURL)}
+            height={size}
+            width={size}
+            siteKey={RSS3_KEY_SITE.TWITTER}
+        />
+    )
 }

packages/mask/content-script/components/InjectedComponents/SetupGuide/AccountConnectStatus.tsx

@@ -90,7 +90,7 @@ export const AccountConnectStatus = memo<Props>(function AccountConnectStatus({
 
     if (connected)
         return (
-            <Frame>
+            <Frame {...rest}>
                 <Typography className={classes.text}>
                     <Trans
                         i18nKey="connected_already"

packages/mask/content-script/components/InjectedComponents/SetupGuide/VerifyNextID.tsx

@@ -1,7 +1,7 @@
 import { Icons } from '@masknet/icons'
 import { delay } from '@masknet/kit'
 import { EmojiAvatar } from '@masknet/shared'
-import { currentSetupGuideStatus, formatPersonaFingerprint } from '@masknet/shared-base'
+import { MaskMessages, currentSetupGuideStatus, formatPersonaFingerprint } from '@masknet/shared-base'
 import { ActionButton, MaskColorVar, MaskTextField, makeStyles } from '@masknet/theme'
 import { NextIDProof } from '@masknet/web3-providers'
 import { Telemetry } from '@masknet/web3-telemetry'
@@ -175,12 +175,11 @@ export function VerifyNextID({ onClose }: VerifyNextIDProps) {
     const disableVerify = useMemo(() => {
         return !myIdentity?.identifier || !userId ? false : myIdentity.identifier.userId !== userId
     }, [myIdentity, userId])
-
     // Show connect result for the first time.
     const { loading: connecting } = useConnectPersona()
 
     const [, handleVerifyNextID] = useNextIDVerify()
-    const [{ loading: verifying }, onVerify] = useAsyncFn(async () => {
+    const [{ loading: verifying, value: verifiedSuccess }, onVerify] = useAsyncFn(async () => {
         if (!userId) return
         if (!personaInfo) return
         if (!nextIdPlatform) return
@@ -190,8 +189,14 @@ export function VerifyNextID({ onClose }: VerifyNextIDProps) {
             await handleVerifyNextID(personaInfo, userId)
             Telemetry.captureEvent(EventType.Access, EventID.EntryPopupSocialAccountVerifyTwitter)
         }
-        await queryClient.invalidateQueries({ queryKey: ['@@next-id', 'bindings-by-persona'] })
+        await queryClient.invalidateQueries({
+            queryKey: ['@@next-id', 'bindings-by-persona', personaInfo.identifier.publicKeyAsHex],
+        })
+
         await delay(1000)
+
+        MaskMessages.events.ownProofChanged.sendToAll()
+        return true
     }, [userId, personaInfo, queryClient])
 
     const notify = useNotifyConnected()
@@ -265,7 +270,7 @@ export function VerifyNextID({ onClose }: VerifyNextIDProps) {
                             </Box>
                         </Box>
                     </Box>
-                    {!nextIdPlatform || verified ?
+                    {!nextIdPlatform || verified || verifiedSuccess ?
                         <Typography className={classes.text}>
                             <Trans
                                 i18nKey={nextIdPlatform ? 'send_post_successfully' : 'connect_successfully'}
@@ -299,7 +304,7 @@ export function VerifyNextID({ onClose }: VerifyNextIDProps) {
                 </Box>
 
                 <Box className={classes.footer}>
-                    {!nextIdPlatform || (nextIdPlatform && verified) ?
+                    {!nextIdPlatform || (nextIdPlatform && (verified || verifiedSuccess)) ?
                         <ActionButton
                             className={classes.button}
                             fullWidth

packages/mask/content-script/components/InjectedComponents/SetupGuide/hooks/useConnectPersona.ts

@@ -31,7 +31,7 @@ export function useConnectPersona() {
         // auto-finish the setup process
         if (!personaInfo) throw new Error('invalid persona')
         await Services.Identity.setupPersona(personaInfo?.identifier)
-        queryClient.invalidateQueries({ queryKey: ['query-persona-info', persona.publicKeyAsHex] })
+        queryClient.removeQueries({ queryKey: ['query-persona-info', persona.publicKeyAsHex] })
         MaskMessages.events.ownPersonaChanged.sendToAll()
 
         Telemetry.captureEvent(EventType.Access, EventMap[activatedSiteAdaptorUI!.networkIdentifier])

packages/mask/content-script/components/InjectedComponents/SetupGuide/hooks/useConnectedVerified.ts

@@ -6,6 +6,6 @@ export function useConnectedVerified(pubkey: string | undefined, userId: string)
     const platform = activatedSiteAdaptorUI!.configuration.nextIDConfig?.platform
     const checking = isLoading
     if (!platform || !proofs?.length) return [checking, false]
-    const verified = proofs.some((x) => x.platform === platform && x.identity === userId && x.is_valid)
+    const verified = proofs.some((x) => x.platform === platform && x.identity === userId.toLowerCase() && x.is_valid)
     return [checking, verified] as const
 }