diff --git a/packages/maskbook/src/locales/en-US.json b/packages/maskbook/src/locales/en-US.json
index 23d58a55ea01..f5e547456dec 100644
--- a/packages/maskbook/src/locales/en-US.json
+++ b/packages/maskbook/src/locales/en-US.json
@@ -301,8 +301,6 @@
"wallet_status_button_change": "Change",
"wallet_status_button_disconnect": "Disconnect",
"wallet_status_button_copy_address": "Copy Address",
- "wallet_status_tip_error": "Failed to load the most recent transactions.",
- "wallet_status_tip_empty": "Your transactions will appear here…",
"wallet_transfer_to_address": "To Address",
"wallet_transfer_memo": "Memo",
"wallet_transfer_memo_placeholder": "Optional message",
@@ -364,8 +362,6 @@
"plugin_wallet_view_on_explorer": "View on Explorer",
"plugin_ito_placeholder_when_token_unselected": "Please Select a Token first",
"plugin_wallet_wrong_network_tip": "Please connect to an appropriate network.",
- "plugin_wallet_recent_transaction": "Recent Transactions",
- "plugin_wallet_clear_all": "Clear All",
"plugin_wallet_on_create": "Create Wallet",
"plugin_wallet_on_connect": "Connect Wallet",
"plugin_wallet_wrong_network": "Wrong Network",
@@ -454,9 +450,6 @@
"plugin_red_packet_expired": "Expired",
"plugin_nft_red_packet_data_broken": "The Lucky Drop can’t be sent due to data damage.",
"plugin_red_packet_create_title": "Create a Lucky Drop",
- "plugin_red_packet_transaction_submitted": "Transaction submitted!",
- "plugin_red_packet_transaction_rejected": "Transaction rejected!",
- "plugin_red_packet_success": "Sent {{value}}{{symbol}}.",
"plugin_gitcoin_readme": "By using this service, you will also be contributing 5% of your contribution to the Gitcoin grants development fund.",
"plugin_gitcoin_readme_fund_link": "https://gitcoin.co/grants/86/gitcoin-sustainability-fund",
"plugin_gitcoin_select_a_token": "Select a token",
diff --git a/packages/maskbook/src/locales/ko-KR.json b/packages/maskbook/src/locales/ko-KR.json
index 4f76e1196525..806c081ae5c4 100644
--- a/packages/maskbook/src/locales/ko-KR.json
+++ b/packages/maskbook/src/locales/ko-KR.json
@@ -296,8 +296,6 @@
"wallet_status_button_change": "바꾸기",
"wallet_status_button_disconnect": "연결 끊기",
"wallet_status_button_copy_address": "주소 복사",
- "wallet_status_tip_error": "최근 거래 로드 실패",
- "wallet_status_tip_empty": "거래 내역이 여기에 보일 것입니다.",
"wallet_transfer_to_address": "주소",
"wallet_transfer_memo": "메모",
"wallet_transfer_memo_placeholder": "옵셔널 메시지",
@@ -359,8 +357,6 @@
"plugin_wallet_view_on_explorer": "Explorer에서 보기",
"plugin_ito_placeholder_when_token_unselected": "토큰을 선택하세요",
"plugin_wallet_wrong_network_tip": "정확한 이더리움 네트워크를 연결하세요.",
- "plugin_wallet_recent_transaction": "최근 거래",
- "plugin_wallet_clear_all": "모두 지우기",
"plugin_wallet_on_create": "월렛 만들기",
"plugin_wallet_on_connect": "월렛 연결하기",
"plugin_wallet_wrong_network": "잘못된 네트워크",
@@ -449,9 +445,6 @@
"plugin_red_packet_expired": "만료됨",
"plugin_nft_red_packet_data_broken": "테이터 훼손때문에 해당 레드 패킷을 보낼 수 없습니다.",
"plugin_red_packet_create_title": "행운 드랍 만들기",
- "plugin_red_packet_transaction_submitted": "거래 제출 완료",
- "plugin_red_packet_transaction_rejected": "거래가 거부됨",
- "plugin_red_packet_success": "{{value}} {{symbol}} 발송하기.",
"plugin_gitcoin_readme": "이 서비스를 이용하면 Gitcoin 개발 기금에 당신의 기여금의 5%를 기부할 것이다.",
"plugin_gitcoin_readme_fund_link": "https://gitcoin.co/grants/86/gitcoin-sustainability-fund",
"plugin_gitcoin_select_a_token": "토큰 선택",
diff --git a/packages/maskbook/src/locales/qya-AA.json b/packages/maskbook/src/locales/qya-AA.json
index df0f37ad9841..3d05d10c091f 100644
--- a/packages/maskbook/src/locales/qya-AA.json
+++ b/packages/maskbook/src/locales/qya-AA.json
@@ -297,8 +297,6 @@
"wallet_status_button_change": "crwdns4519:0crwdne4519:0",
"wallet_status_button_disconnect": "crwdns4521:0crwdne4521:0",
"wallet_status_button_copy_address": "crwdns4523:0crwdne4523:0",
- "wallet_status_tip_error": "crwdns4525:0crwdne4525:0",
- "wallet_status_tip_empty": "crwdns4527:0crwdne4527:0",
"wallet_transfer_to_address": "crwdns4529:0crwdne4529:0",
"wallet_transfer_memo": "crwdns4531:0crwdne4531:0",
"wallet_transfer_memo_placeholder": "crwdns4533:0crwdne4533:0",
@@ -360,8 +358,6 @@
"plugin_wallet_view_on_explorer": "crwdns4617:0crwdne4617:0",
"plugin_ito_placeholder_when_token_unselected": "crwdns4619:0crwdne4619:0",
"plugin_wallet_wrong_network_tip": "crwdns4621:0crwdne4621:0",
- "plugin_wallet_recent_transaction": "crwdns4623:0crwdne4623:0",
- "plugin_wallet_clear_all": "crwdns4625:0crwdne4625:0",
"plugin_wallet_on_create": "crwdns4627:0crwdne4627:0",
"plugin_wallet_on_connect": "crwdns4629:0crwdne4629:0",
"plugin_wallet_wrong_network": "crwdns4631:0crwdne4631:0",
@@ -450,9 +446,6 @@
"plugin_red_packet_expired": "crwdns8167:0crwdne8167:0",
"plugin_nft_red_packet_data_broken": "crwdns8169:0crwdne8169:0",
"plugin_red_packet_create_title": "crwdns9073:0crwdne9073:0",
- "plugin_red_packet_transaction_submitted": "crwdns9075:0crwdne9075:0",
- "plugin_red_packet_transaction_rejected": "crwdns9077:0crwdne9077:0",
- "plugin_red_packet_success": "crwdns9079:0{{value}}crwdnd9079:0{{symbol}}crwdne9079:0",
"plugin_gitcoin_readme": "crwdns4789:0crwdne4789:0",
"plugin_gitcoin_readme_fund_link": "crwdns4791:0crwdne4791:0",
"plugin_gitcoin_select_a_token": "crwdns4793:0crwdne4793:0",
diff --git a/packages/maskbook/src/locales/zh-TW.json b/packages/maskbook/src/locales/zh-TW.json
index 36f780c4723d..30907b9bae07 100644
--- a/packages/maskbook/src/locales/zh-TW.json
+++ b/packages/maskbook/src/locales/zh-TW.json
@@ -337,7 +337,6 @@
"plugin_red_packet_history_split_mode": "分割模式: {{mode}}",
"plugin_red_packet_history_send": "送出",
"plugin_red_packet_create_title": "創建一個紅包",
- "plugin_red_packet_success": "送出 {{value}} {{symbol}}.",
"plugin_gitcoin_readme": "通過使用此服務，您還將向 Gitcoin grants development fund 捐款 5%",
"plugin_gitcoin_select_a_token": "選擇一個代幣",
"plugin_gitcoin_enter_an_amount": "輸入一個金額",
diff --git a/packages/maskbook/src/plugins/RedPacket/SNSAdaptor/hooks/useCreateCallback.tsx b/packages/maskbook/src/plugins/RedPacket/SNSAdaptor/hooks/useCreateCallback.tsx
index 53411738d94d..0e0e4701a74d 100644
--- a/packages/maskbook/src/plugins/RedPacket/SNSAdaptor/hooks/useCreateCallback.tsx
+++ b/packages/maskbook/src/plugins/RedPacket/SNSAdaptor/hooks/useCreateCallback.tsx
@@ -1,5 +1,3 @@
-import { ShowSnackbarOptions, SnackbarKey, SnackbarMessage, useCustomSnackbar } from '@masknet/theme'
-import { makeStyles } from '@masknet/theme'
import type { HappyRedPacketV4 } from '@masknet/web3-contracts/types/HappyRedPacketV4'
import type { PayableTx } from '@masknet/web3-contracts/types/types'
import {
@@ -7,7 +5,6 @@ import {
formatBalance,
FungibleTokenDetailed,
isLessThan,
- resolveTransactionLinkOnExplorer,
TransactionEventType,
TransactionState,
TransactionStateType,
@@ -16,24 +13,15 @@ import {
useTokenConstants,
useTransactionState,
} from '@masknet/web3-shared-evm'
-import { Link } from '@mui/material'
-import LaunchIcon from '@mui/icons-material/Launch'
import BigNumber from 'bignumber.js'
import { omit } from 'lodash-es'
-import React, { FC, memo, useCallback, useRef, useState } from 'react'
+import React, { useCallback, useRef, useState } from 'react'
import { useAsync } from 'react-use'
import type { TransactionReceipt } from 'web3-core'
import Web3Utils from 'web3-utils'
import { useI18N } from '../../../../utils/i18n-next-ui'
import { useRedPacketContract } from './useRedPacketContract'
-const useStyles = makeStyles()({
- link: {
- display: 'flex',
- alignItems: 'center',
- },
-})
-
export interface RedPacketSettings {
publicKey: string
privateKey: string
@@ -136,21 +124,6 @@ export function useCreateParams(redPacketSettings: RedPacketSettings | undefined
}, [redPacketSettings, account, redPacketContract]).value
}
-const TransactionLink: FC<{ txHash?: string }> = memo(({ children, txHash }) => {
- const { classes } = useStyles()
- const chainId = useChainId()
- if (!txHash) {
- return null
- }
- const link = resolveTransactionLinkOnExplorer(chainId, txHash)
- return (
-
- {children}
-
-
- )
-})
-
export function useCreateCallback(redPacketSettings: RedPacketSettings, version: number) {
const account = useAccount()
const chainId = useChainId()
@@ -160,19 +133,6 @@ export function useCreateCallback(redPacketSettings: RedPacketSettings, version:
const [createSettings, setCreateSettings] = useState(null)
const paramResult = useCreateParams(redPacketSettings, version)
- const { showSnackbar, closeSnackbar } = useCustomSnackbar()
- const snackbarKeyRef = useRef()
- const showSingletonSnackbar = useCallback(
- (title: SnackbarMessage, options: ShowSnackbarOptions) => {
- if (snackbarKeyRef.current !== undefined) closeSnackbar(snackbarKeyRef.current)
- snackbarKeyRef.current = showSnackbar(title, options)
- return () => {
- closeSnackbar(snackbarKeyRef.current)
- }
- },
- [showSnackbar, closeSnackbar],
- )
-
const transactionHashRef = useRef()
const createCallback = useCallback(async () => {
@@ -226,13 +186,6 @@ export function useCreateCallback(redPacketSettings: RedPacketSettings, version:
hash,
})
transactionHashRef.current = hash
- showSingletonSnackbar(snackbarTitle, {
- processing: true,
- persist: true,
- message: (
- {t('plugin_red_packet_transaction_submitted')}
- ),
- })
})
promiEvent.once(TransactionEventType.RECEIPT, (receipt: TransactionReceipt) => {
setCreateState({
@@ -241,14 +194,6 @@ export function useCreateCallback(redPacketSettings: RedPacketSettings, version:
receipt,
})
transactionHashRef.current = receipt.transactionHash
- showSingletonSnackbar(snackbarTitle, {
- variant: 'success',
- message: (
-
- {t('plugin_red_packet_transaction_submitted')}
-
- ),
- })
})
promiEvent.on(TransactionEventType.CONFIRMATION, (no: number, receipt: TransactionReceipt) => {
@@ -259,17 +204,6 @@ export function useCreateCallback(redPacketSettings: RedPacketSettings, version:
})
transactionHashRef.current = receipt.transactionHash
resolve()
- showSingletonSnackbar(snackbarTitle, {
- variant: 'success',
- message: (
-
- {t('plugin_red_packet_success', {
- value: formattedValue,
- symbol: token.symbol,
- })}
-
- ),
- })
})
promiEvent.on(TransactionEventType.ERROR, (error: Error) => {
@@ -278,17 +212,9 @@ export function useCreateCallback(redPacketSettings: RedPacketSettings, version:
error,
})
reject(error)
- showSingletonSnackbar(snackbarTitle, {
- variant: 'error',
- message: (
-
- {t('plugin_red_packet_transaction_rejected')}
-
- ),
- })
})
})
- }, [account, redPacketContract, redPacketSettings, chainId, paramResult, showSingletonSnackbar])
+ }, [account, redPacketContract, redPacketSettings, chainId, paramResult])
const resetCallback = useCallback(() => {
setCreateState({
diff --git a/packages/maskbook/src/plugins/Wallet/SNSAdaptor/TransactionSnackbar/index.tsx b/packages/maskbook/src/plugins/Wallet/SNSAdaptor/TransactionSnackbar/index.tsx
index 49ca9b382f1a..f74b73df4bb0 100644
--- a/packages/maskbook/src/plugins/Wallet/SNSAdaptor/TransactionSnackbar/index.tsx
+++ b/packages/maskbook/src/plugins/Wallet/SNSAdaptor/TransactionSnackbar/index.tsx
@@ -1,9 +1,68 @@
-import { useRef, useCallback, useEffect } from 'react'
-import { TransactionStateType } from '@masknet/web3-shared-evm'
-import { ShowSnackbarOptions, SnackbarKey, SnackbarMessage, useCustomSnackbar } from '@masknet/theme'
+import React, { ReactNode, useCallback, useEffect, useRef } from 'react'
+import {
+ createLookupTableResolver,
+ resolveTransactionLinkOnExplorer,
+ TransactionState,
+ TransactionStateType,
+ useChainId,
+} from '@masknet/web3-shared-evm'
+import { makeStyles, ShowSnackbarOptions, SnackbarKey, SnackbarMessage, useCustomSnackbar } from '@masknet/theme'
import { WalletMessages } from '../../messages'
+import { getSendTransactionComputedPayload } from '../../../../extension/background-script/EthereumService'
+import { RecentTransactionDescription } from '../WalletStatusDialog/TransactionDescription'
+import { Link } from '@mui/material'
+import LaunchIcon from '@mui/icons-material/Launch'
+import type { TransactionReceipt } from 'web3-core'
+
+export const resolveSnackbarConfig = createLookupTableResolver<
+ TransactionStateType,
+ Pick
+>(
+ {
+ [TransactionStateType.WAIT_FOR_CONFIRMING]: {
+ processing: true,
+ variant: 'success',
+ message: 'Confirm this transaction in your wallet',
+ },
+ [TransactionStateType.HASH]: {
+ processing: true,
+ variant: 'success',
+ message: 'Transaction Submitted',
+ },
+ [TransactionStateType.CONFIRMED]: {
+ processing: false,
+ variant: 'success',
+ message: 'Transaction Successfully',
+ },
+ [TransactionStateType.RECEIPT]: {
+ processing: false,
+ variant: 'error',
+ message: 'Transaction rejected',
+ },
+ [TransactionStateType.FAILED]: {
+ processing: false,
+ variant: 'error',
+ message: 'Transaction rejected',
+ },
+ [TransactionStateType.UNKNOWN]: {
+ processing: false,
+ variant: 'error',
+ message: '',
+ },
+ },
+ {},
+)
+
+const useStyles = makeStyles()({
+ link: {
+ display: 'flex',
+ alignItems: 'center',
+ },
+})
export function TransactionSnackbar() {
+ const chainId = useChainId()
+ const { classes } = useStyles()
const { showSnackbar, closeSnackbar } = useCustomSnackbar()
const snackbarKeyRef = useRef()
@@ -18,13 +77,43 @@ export function TransactionSnackbar() {
[showSnackbar, closeSnackbar],
)
+ const getTitle = useCallback((state: TransactionState, payload: any, hash?: string) => {
+ return (
+
+ )
+ }, [])
+
+ const getFullMessage = useCallback(
+ (message: ReactNode, hash?: string) => {
+ if (!hash) return message
+ const link = resolveTransactionLinkOnExplorer(chainId, hash)
+ return (
+
+ {message}
+
+ )
+ },
+ [chainId],
+ )
+
useEffect(() => {
- return WalletMessages.events.transactionProgressUpdated.on((progress) => {
- console.log('DEBUG: progress updated')
- console.log(progress)
- showSingletonSnackbar(TransactionStateType[progress.state.type], {
- variant: 'success',
- })
+ return WalletMessages.events.transactionProgressUpdated.on(async (progress) => {
+ if (progress.state.type === TransactionStateType.UNKNOWN) return
+
+ const payload = await getSendTransactionComputedPayload(progress.payload)
+ const config = resolveSnackbarConfig(progress.state.type)
+ const hash =
+ (progress.state as { hash?: string }).hash ??
+ (progress.state as { receipt?: TransactionReceipt }).receipt?.transactionHash
+
+ showSingletonSnackbar(getTitle(progress.state, payload, hash), {
+ ...config,
+ ...{ message: getFullMessage(config.message, hash) },
+ } as ShowSnackbarOptions)
})
}, [])
diff --git a/packages/maskbook/src/plugins/Wallet/SNSAdaptor/WalletStatusDialog/TransactionDescription.tsx b/packages/maskbook/src/plugins/Wallet/SNSAdaptor/WalletStatusDialog/TransactionDescription.tsx
index 070ba4bb7920..7ee3ddb2627f 100644
--- a/packages/maskbook/src/plugins/Wallet/SNSAdaptor/WalletStatusDialog/TransactionDescription.tsx
+++ b/packages/maskbook/src/plugins/Wallet/SNSAdaptor/WalletStatusDialog/TransactionDescription.tsx
@@ -12,7 +12,7 @@ import {
import type Services from '../../../../extension/service'
function getTokenAmountDescription(amount = '0', tokenDetailed?: FungibleTokenDetailed, negative?: boolean) {
- return `${negative ? '-' : ''}${
+ return `${negative ? '- ' : ''}${
pow10(9 + (tokenDetailed?.decimals ?? 18)).isGreaterThanOrEqualTo(amount)
? formatBalance(amount, tokenDetailed?.decimals ?? 0, 4)
: 'infinite'