[Release] Hotfix 2.32.1 => 2.32.2 (patch) (#12175)

* chore: bump version to v2.32.2

* feat: mf-6611 redirect users to Firefly to claim firefly redpacket (#12171)

* feat: mf-6611 redirect users to Firefly to claim firefly redpacket

* Update useAvailability.ts

---------

Co-authored-by: guanbinrui <[email protected]>

* fix: profile tabs do not update (#12174)

---------

Co-authored-by: Wukong Sun <[email protected]>

Author: guanbinrui

package.json

@@ -7,7 +7,7 @@
     "yarn": ">=999.0.0",
     "npm": ">=999.0.0"
   },
-  "version": "2.32.1",
+  "version": "2.32.2",
   "private": true,
   "license": "AGPL-3.0-or-later",
   "scripts": {

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

@@ -188,9 +188,8 @@ function Content(props: ProfileTabContentProps) {
             return plugins
                 .flatMap((x) => x.ProfileTabs?.map((y) => ({ ...y, pluginID: x.ID })) || [])
                 .filter((x) => {
-                    const shouldDisplay =
-                        x.Utils?.shouldDisplay?.(currentVisitingSocialIdentity, selectedSocialAccount) ?? true
-                    return x.pluginID !== PluginID.NextID && shouldDisplay
+                    if (x.pluginID === PluginID.NextID) return false
+                    return x.Utils?.shouldDisplay?.(currentVisitingSocialIdentity, selectedSocialAccount) ?? true
                 })
                 .sort((a, z) => a.priority - z.priority)
         })
@@ -199,7 +198,7 @@ function Content(props: ProfileTabContentProps) {
             id: x.ID,
             label: typeof x.label === 'string' ? x.label : translate(x.label),
         }))
-    }, [activatedPlugins, translate])
+    }, [activatedPlugins, translate, selectedSocialAccount])
 
     const [currentTab, onChange] = useTabs(first(tabs)?.id ?? PluginID.Collectible, ...tabs.map((tab) => tab.id))
 

packages/mask/content-script/site-adaptors/twitter.com/collecting/identity.ts

@@ -119,7 +119,7 @@ function resolveCurrentVisitingIdentityInner(
         const domAvatar = document.querySelector(`a[href="/${handle}/photo"] img`)
         // DOM avatar is more accurate, avatar from api could be outdate
         const avatar = domAvatar?.getAttribute('src') || legacy.profile_image_url_https
-        const bio = legacy.profile_image_url_https
+        const bio = legacy.description
         const homepage = legacy.entities.url?.urls?.[0]?.expanded_url
 
         ref.value = {

packages/plugins/RedPacket/src/SiteAdaptor/RedPacket/index.tsx

@@ -1,5 +1,7 @@
 import { msg } from '@lingui/core/macro'
 import { useLingui } from '@lingui/react'
+import { Trans } from '@lingui/react/macro'
+import { Icons } from '@masknet/icons'
 import { usePostInfoDetails, usePostLink } from '@masknet/plugin-infra/content-script'
 import { share } from '@masknet/plugin-infra/content-script/context'
 import { LoadingStatus, TransactionConfirmModal } from '@masknet/shared'
@@ -12,16 +14,17 @@ import { EVMChainResolver } from '@masknet/web3-providers'
 import { RedPacketStatus, type RedPacketJSONPayload } from '@masknet/web3-providers/types'
 import { TokenType, formatBalance, isZero, minus } from '@masknet/web3-shared-base'
 import { ChainId } from '@masknet/web3-shared-evm'
-import { Card, Grow } from '@mui/material'
+import { Card, Grow, Link } from '@mui/material'
 import { memo, useCallback, useMemo, useState } from 'react'
 import { RedPacketEnvelope } from '../components/RedPacketEnvelope.js'
 import { Conditions } from '../Conditions/index.js'
 import { useAvailabilityComputed } from '../hooks/useAvailabilityComputed.js'
 import { useClaimCallback } from '../hooks/useClaimCallback.js'
+import { useIsFireflyRedpacket } from '../hooks/useIsFireflyRedpacket.js'
 import { useRedPacketContract } from '../hooks/useRedPacketContract.js'
+import { useRedPacketCover } from '../hooks/useRedPacketCover.js'
 import { useRefundCallback } from '../hooks/useRefundCallback.js'
 import { OperationFooter } from './OperationFooter.js'
-import { useRedPacketCover } from '../hooks/useRedPacketCover.js'
 
 const useStyles = makeStyles()((theme) => {
     return {
@@ -47,6 +50,18 @@ const useStyles = makeStyles()((theme) => {
         },
         footer: {
             margin: theme.spacing(2),
+            display: 'flex',
+            height: 40,
+            gap: theme.spacing(0.5),
+            alignItems: 'center',
+            justifyContent: 'center',
+            borderRadius: 99,
+            fontSize: 14,
+            fontWeight: 700,
+            backgroundColor: theme.palette.maskColor.dark,
+            color: 'white',
+            cursor: 'pointer',
+            textDecoration: 'none !important',
         },
         envelope: {
             height: '100%',
@@ -96,6 +111,8 @@ export const RedPacket = memo(function RedPacket({ payload, currentPluginID }: R
     const postUrl = usePostInfoDetails.url()
     const handle = usePostInfoDetails.handle()
     const link = postLink.toString() || postUrl?.toString()
+    const isFireflyRedpacket = useIsFireflyRedpacket()
+    const postId = usePostInfoDetails.postID()
 
     // TODO payload.chainId is undefined on production mode
     const network = useNetwork<NetworkPluginID.PLUGIN_EVM>(
@@ -225,6 +242,22 @@ export const RedPacket = memo(function RedPacket({ payload, currentPluginID }: R
 
     if (outdated) return card
 
+    if (isFireflyRedpacket) {
+        return (
+            <>
+                {card}
+                <Link
+                    className={classes.footer}
+                    href={`https://firefly.mask.social/post/twitter/${postId}`}
+                    target="_blank"
+                    rel="noreferrer noopener">
+                    <Icons.LinkOut size={18} />
+                    <Trans>Claim on Firefly</Trans>
+                </Link>
+            </>
+        )
+    }
+
     return (
         <>
             {card}

packages/plugins/RedPacket/src/SiteAdaptor/hooks/useAvailability.ts

@@ -21,10 +21,11 @@ export function useAvailability(
         queryKey: ['red-packet', 'check-availability', chainId, version, id, account],
         queryFn: async () => {
             if (!id || !redPacketContract) return null
-            return redPacketContract.methods.check_availability(id).call({
+            const availability = await redPacketContract.methods.check_availability(id).call({
                 // check availability is ok w/o account
                 from: account,
             })
+            return availability
         },
         refetchInterval(query) {
             const { data } = query.state

packages/plugins/RedPacket/src/SiteAdaptor/hooks/useIsFireflyRedpacket.ts

@@ -0,0 +1,7 @@
+import { usePostInfoDetails } from '@masknet/plugin-infra/content-script'
+
+export function useIsFireflyRedpacket() {
+    const raw = usePostInfoDetails.rootNode()?.textContent
+
+    return raw?.includes('#FireflyLuckyDrop') || false
+}

packages/plugins/RedPacket/src/locale/en-US.json

@@ -4,6 +4,7 @@ import { makeStyles } from '../../entry-base.js'
 
 const useStyles = makeStyles()({
     button: {
+        whiteSpace: 'nowrap',
         '&:hover': {
             background: 'transparent',
         },
@@ -15,7 +16,7 @@ export interface CountdownButtonProps extends ButtonProps {
 }
 
 export function CountdownButton(props: CountdownButtonProps) {
-    const { classes } = useStyles()
+    const { classes, cx } = useStyles()
     const { duration = 60, children, repeatContent = 'Resend', onClick, disabled, ...others } = props
     const [countdown, setCountdown] = useState<number | undefined>(undefined)
     const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
@@ -29,7 +30,7 @@ export function CountdownButton(props: CountdownButtonProps) {
             else
                 return (
                     <>
-                        {children} (${countdown})
+                        {children} ({countdown})
                     </>
                 )
         } else if (countdown === 0) {
@@ -55,7 +56,7 @@ export function CountdownButton(props: CountdownButtonProps) {
     return (
         <Button
             {...others}
-            className={classes.button}
+            className={cx(classes.button, others.className)}
             onClick={handleClick}
             disabled={!!countdown || disabled}
             disableRipple