fix: remove legacy redpacket dialog

Author: swkatmask

packages/mask/shared-ui/initialization/fetch.ts

@@ -23,7 +23,7 @@ function contentFetch(input: RequestInfo | URL, init?: RequestInit) {
     const signal = init?.signal
     if (init) delete init.signal
 
-    return Services.Helper.fetchGlobal(request.clone(), init).then((response) => {
+    return Services.Helper.fetchGlobal(request, init).then((response) => {
         signal?.throwIfAborted()
         return response
     })
@@ -60,7 +60,7 @@ function canAccessAsContent(url: string) {
     if (target.origin.includes('maskbook-backup')) return true
     if (isHostName(location, 'mirror.xyz') && isHostName(target, 'mirror-api.com')) return true
     // aws s3
-    if (target.origin.includes('amazonaws.com') && url.includes('x-id=PutObject')) return true
+    if (isDomainOrSubdomainOf(url, 'amazonaws.com') && url.includes('x-id=PutObject')) return true
     if (extensionOrigin === target.origin) return true
     return target.origin === location.origin
 }

packages/plugins/RedPacket/package.json

@@ -22,6 +22,7 @@
     "@masknet/shared-base": "workspace:^",
     "@masknet/shared-base-ui": "workspace:^",
     "@masknet/theme": "workspace:^",
+    "@masknet/typed-message": "workspace:^",
     "@masknet/typed-message-react": "workspace:^",
     "@masknet/web3-contracts": "workspace:^",
     "@masknet/web3-hooks-base": "workspace:^",

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

@@ -1,3 +1,4 @@
+import { Trans } from '@lingui/macro'
 import { ElementAnchor, EmptyStatus } from '@masknet/shared'
 import { type NetworkPluginID } from '@masknet/shared-base'
 import { makeStyles } from '@masknet/theme'
@@ -7,7 +8,6 @@ import { List } from '@mui/material'
 import { memo } from 'react'
 import { FireflyRedPacketDetailsItem } from './FireflyRedPacketDetailsItem.js'
 import { useRedPacketHistory } from './hooks/useRedPacketHistory.js'
-import { Trans } from '@lingui/macro'
 
 const useStyles = makeStyles()((theme) => {
     const smallQuery = `@media (max-width: ${theme.breakpoints.values.sm}px)`

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

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react'
+import { useEffect, useMemo } from 'react'
 import { useAsync } from 'react-use'
 import { Icons } from '@masknet/icons'
 import { useChainContext, useNativeTokenPrice, useWallet } from '@masknet/web3-hooks-base'
@@ -73,7 +73,7 @@ export function RedPacketConfirmDialog(props: ConfirmRedPacketFormProps) {
         if (settings?.token?.chainId !== chainId) onClose()
     }, [chainId, onClose])
 
-    const [{ account: publicKey, privateKey = '' }] = useState(() => EVMWeb3.createAccount())
+    const { account: publicKey, privateKey = '' } = useMemo(() => EVMWeb3.createAccount(), [])
 
     const {
         isBalanceInsufficient,

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

@@ -1,51 +1,32 @@
-import { CrossIsolationMessages, type PluginID } from '@masknet/shared-base'
+import { CrossIsolationMessages } from '@masknet/shared-base'
 import { createContext, useCallback, useEffect, useState } from 'react'
 
 import type { CompositionType } from '@masknet/plugin-infra/content-script'
 import { EVMWeb3ContextProvider } from '@masknet/web3-hooks-base'
-import type { FireflyContext } from '../types.js'
-import RedPacketDialog from './RedPacketDialog.js'
 import { RedPacketMainDialog } from './MainDialog.js'
 
 export const CompositionTypeContext = createContext<CompositionType>('timeline')
 
 export function RedPacketInjection() {
     const [open, setOpen] = useState(false)
-    const [source, setSource] = useState<PluginID>()
     const [compositionType, setCompositionType] = useState<CompositionType>('timeline')
 
-    const [fireflyContext, setFireflyContext] = useState<FireflyContext>()
     useEffect(() => {
-        return CrossIsolationMessages.events.redpacketDialogEvent.on(
-            ({ open, source: pluginId, fireflyContext, compositionType = 'timeline' }) => {
-                setOpen(open)
-                setSource(pluginId)
-                setFireflyContext(fireflyContext)
-                setCompositionType(compositionType)
-            },
-        )
+        return CrossIsolationMessages.events.redpacketDialogEvent.on(({ open, compositionType = 'timeline' }) => {
+            setOpen(open)
+            setCompositionType(compositionType)
+        })
     }, [])
 
     const handleClose = useCallback(() => {
         setOpen(false)
     }, [])
 
-    const [status, setStatus] = useState(false)
-    useEffect(() => {
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        window.toggleRedPacketDialog = () => {
-            setStatus((v) => !v)
-        }
-    }, [])
-
     if (!open) return null
     return (
         <EVMWeb3ContextProvider>
             <CompositionTypeContext value={compositionType}>
-                {status ?
-                    <RedPacketDialog open onClose={handleClose} source={source} fireflyContext={fireflyContext} />
-                :   <RedPacketMainDialog open onClose={handleClose} />}
+                <RedPacketMainDialog open onClose={handleClose} />
             </CompositionTypeContext>
         </EVMWeb3ContextProvider>
     )

packages/plugins/RedPacket/src/SiteAdaptor/contexts/RedPacketContext.tsx

@@ -104,7 +104,7 @@ export const RedPacketProvider = memo(function RedPacketProvider({ children }: P
     const allThemes = useMemo(() => (customThemes ? [...themes, ...customThemes] : themes), [themes, customThemes])
 
     // Token
-    const [rawAmount, setRawAmount] = useState('1')
+    const [rawAmount, setRawAmount] = useState('')
     const [isRandom, setIsRandom] = useState<0 | 1>(1)
     const [shares, setShares] = useState<number>(RED_PACKET_DEFAULT_SHARES)
     const { chainId } = useChainContext<NetworkPluginID.PLUGIN_EVM>()

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

@@ -1,16 +1,17 @@
+import { t } from '@lingui/macro'
+import { RedPacketMetaKey } from '@masknet/plugin-redpacket'
+import { ApplicationBoardModal } from '@masknet/shared'
+import type { NetworkPluginID } from '@masknet/shared-base'
+import { useChainContext } from '@masknet/web3-hooks-base'
 import { EVMWeb3 } from '@masknet/web3-providers'
 import type { FireflyRedPacketAPI, RedPacketJSONPayload } from '@masknet/web3-providers/types'
+import { Telemetry } from '@masknet/web3-telemetry'
+import { EventID, EventType } from '@masknet/web3-telemetry/types'
 import { useCallback, useContext } from 'react'
 import * as web3_utils from /* webpackDefer: true */ 'web3-utils'
-import { CompositionTypeContext } from '../RedPacketInjection.js'
-import { useChainContext } from '@masknet/web3-hooks-base'
-import type { NetworkPluginID } from '@masknet/shared-base'
 import { openComposition } from '../openComposition.js'
-import { RedPacketMetaKey } from '@masknet/plugin-redpacket'
+import { CompositionTypeContext } from '../RedPacketInjection.js'
 import { reduceUselessPayloadInfo } from '../utils/reduceUselessPayloadInfo.js'
-import { Telemetry } from '@masknet/web3-telemetry'
-import { EventID, EventType } from '@masknet/web3-telemetry/types'
-import { ApplicationBoardModal } from '@masknet/shared'
 
 interface Options {
     isFirefly?: boolean
@@ -51,11 +52,20 @@ export function useHandleCreateOrSelect({ isFirefly, senderName, onClose }: Opti
                 payload.sender.name === senderName
             }
 
-            openComposition(RedPacketMetaKey, reduceUselessPayloadInfo(payload), compositionType, {
-                payloadImage,
-                claimRequirements,
-                publicKey,
-            })
+            const post = t`Hi friends, I just created a token Lucky Drop. Download mask.io to claim. Follow @realMaskNetwork for Web3 updates and insights.
+
+🧧🧧🧧 Try sending Lucky Drop to your friends with Mask io.`
+            openComposition(
+                RedPacketMetaKey,
+                reduceUselessPayloadInfo(payload),
+                compositionType,
+                {
+                    payloadImage,
+                    claimRequirements,
+                    publicKey,
+                },
+                post,
+            )
             Telemetry.captureEvent(EventType.Access, EventID.EntryAppLuckCreate)
             ApplicationBoardModal.close()
             onClose?.()

packages/plugins/RedPacket/src/SiteAdaptor/openComposition.ts

@@ -1,16 +1,19 @@
 import { CrossIsolationMessages } from '@masknet/shared-base'
+import { makeTypedMessageText } from '@masknet/typed-message'
 
 export function openComposition(
     metadataKey: string,
     payload: unknown,
     reason: 'popup' | 'timeline' = 'timeline',
     extraMeta?: unknown,
+    content?: string,
 ) {
     // Close the duplicated dialog if already opened by clicking the mask compose icon.
     CrossIsolationMessages.events.compositionDialogEvent.sendToLocal({ reason: 'popup', open: false })
     CrossIsolationMessages.events.compositionDialogEvent.sendToLocal({
         reason,
         open: true,
+        content: content ? makeTypedMessageText(content) : undefined,
         options: {
             initialMeta: {
                 [metadataKey]: payload,