diff --git a/packages/dashboard/src/components/FooterLine/index.tsx b/packages/dashboard/src/components/FooterLine/index.tsx
index b893f706881d..2dcf9bde0f83 100644
--- a/packages/dashboard/src/components/FooterLine/index.tsx
+++ b/packages/dashboard/src/components/FooterLine/index.tsx
@@ -7,6 +7,7 @@ import { About } from './About'
 import { Close } from '@mui/icons-material'
 import { Version } from './Version'
 import links from './links.json'
+import { openWindow } from '@masknet/shared-base-ui'
 
 const useStyles = makeStyles()((theme) => ({
     navRoot: {
@@ -105,9 +106,9 @@ export const FooterLine = memo(() => {
     const openVersionLink = (event: React.MouseEvent) => {
         // `MouseEvent.prototype.metaKey` on macOS (`Command` key), Windows (`Windows` key), Linux (`Super` key)
         if (process.env.channel === 'stable' && !event.metaKey) {
-            open(`${links.DOWNLOAD_LINK_STABLE_PREFIX}/v${version}`)
+            openWindow(`${links.DOWNLOAD_LINK_STABLE_PREFIX}/v${version}`)
         } else {
-            open(`${links.DOWNLOAD_LINK_UNSTABLE_PREFIX}/${process.env.COMMIT_HASH}`)
+            openWindow(`${links.DOWNLOAD_LINK_UNSTABLE_PREFIX}/${process.env.COMMIT_HASH}`)
         }
     }
     return (
diff --git a/packages/mask/src/extension/debug-page/DebugInfo.tsx b/packages/mask/src/extension/debug-page/DebugInfo.tsx
index abdc3a92b1e6..181889ba9ee1 100644
--- a/packages/mask/src/extension/debug-page/DebugInfo.tsx
+++ b/packages/mask/src/extension/debug-page/DebugInfo.tsx
@@ -1,6 +1,7 @@
 import { map } from 'lodash-unified'
 import { makeNewBugIssueURL } from './issue'
 import { useI18N } from '../../utils'
+import { openWindow } from '@masknet/shared-base-ui'
 export const DEBUG_INFO = {
     'User Agent': navigator.userAgent,
     'Mask Version': process.env.VERSION,
@@ -16,9 +17,7 @@ export const DEBUG_INFO = {
 
 export const DebugInfo = () => {
     const { t } = useI18N()
-    const onNewBugIssue = () => {
-        open(makeNewBugIssueURL())
-    }
+    const onNewBugIssue = () => openWindow(makeNewBugIssueURL())
 
     return (
         <>
diff --git a/packages/mask/src/plugins/Wallet/SNSAdaptor/WalletConnectQRCodeDialog/SafariPlatform.tsx b/packages/mask/src/plugins/Wallet/SNSAdaptor/WalletConnectQRCodeDialog/SafariPlatform.tsx
index f560d8a699b3..7076453818c2 100644
--- a/packages/mask/src/plugins/Wallet/SNSAdaptor/WalletConnectQRCodeDialog/SafariPlatform.tsx
+++ b/packages/mask/src/plugins/Wallet/SNSAdaptor/WalletConnectQRCodeDialog/SafariPlatform.tsx
@@ -5,6 +5,8 @@ import { createElement } from 'react'
 import { useI18N } from '../../../../utils'
 import { Provider } from '../Provider'
 import { IMTokenIcon, MetaMaskIcon, RainbowIcon, TrustIcon } from './Icons'
+import urlcat from 'urlcat'
+import { openWindow } from '@masknet/shared-base-ui'
 
 const useStyles = makeStyles()({
     container: { display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center' },
@@ -27,11 +29,7 @@ const providers: WalletProvider[] = [
 export const SafariPlatform: React.FC<{ uri: string }> = ({ uri }) => {
     const { t } = useI18N()
     const { classes } = useStyles()
-    const makeConnect = (link: string) => () => {
-        const url = new URL(link)
-        url.searchParams.set('uri', uri)
-        open(url.toString())
-    }
+    const makeConnect = (link: string) => () => openWindow(urlcat(link, { uri }))
     const descriptionMapping: Record<string, string> = {
         MetaMask: t('plugin_wallet_connect_safari_metamask'),
         Rainbow: t('plugin_wallet_connect_safari_rainbow'),
diff --git a/packages/plugins/FileService/src/SNSAdaptor/Preview.tsx b/packages/plugins/FileService/src/SNSAdaptor/Preview.tsx
index 808bb952cbb7..f10a66f1ed4a 100644
--- a/packages/plugins/FileService/src/SNSAdaptor/Preview.tsx
+++ b/packages/plugins/FileService/src/SNSAdaptor/Preview.tsx
@@ -7,6 +7,7 @@ import { CopyableCode } from './components/Copyable'
 import type { FileInfo } from '../types'
 import { resolveGatewayAPI } from '../helpers'
 import urlcat from 'urlcat'
+import { openWindow } from '@masknet/shared-base-ui'
 
 const useStyles = makeStyles()((theme) => ({
     root: {
@@ -64,7 +65,7 @@ export function Preview({ info }: { info: FileInfo }) {
     const onClick = (event: React.MouseEvent) => {
         event.preventDefault()
         event.stopPropagation()
-        open(info.key ? `${link}#${info.key}` : link)
+        openWindow(info.key ? `${link}#${info.key}` : link)
     }
     return (
         <Paper
diff --git a/packages/plugins/FileService/src/SNSAdaptor/components/Uploaded.tsx b/packages/plugins/FileService/src/SNSAdaptor/components/Uploaded.tsx
index 2620c3571e8e..af25c690b01a 100644
--- a/packages/plugins/FileService/src/SNSAdaptor/components/Uploaded.tsx
+++ b/packages/plugins/FileService/src/SNSAdaptor/components/Uploaded.tsx
@@ -12,6 +12,7 @@ import type { FileInfo } from '../../types'
 import { FileName } from './FileName'
 import { resolveGatewayAPI } from '../../helpers'
 import urlcat from 'urlcat'
+import { openWindow } from '@masknet/shared-base-ui'
 
 const useStyles = makeStyles()({
     container: {
@@ -82,7 +83,7 @@ export const Uploaded: React.FC = () => {
 
         const linkPrefix = resolveGatewayAPI(state.provider)
         const link = urlcat(linkPrefix, '/:txId', { txId: state.landingTxID })
-        open(state.key ? `${link}#${state.key}` : link)
+        openWindow(state.key ? `${link}#${state.key}` : link)
     }
     return (
         <Grid container className={classes.container}>
diff --git a/packages/theme/src/Components/Dialogs/Dialog.tsx b/packages/theme/src/Components/Dialogs/Dialog.tsx
index b709269a18e4..2821bf95166c 100644
--- a/packages/theme/src/Components/Dialogs/Dialog.tsx
+++ b/packages/theme/src/Components/Dialogs/Dialog.tsx
@@ -41,8 +41,8 @@ export const MaskDialog = memo((props: MaskDialogProps) => {
 })
 
 export function useMaskDialog(title: string, content: ReactNode, actions: ReactNode) {
-    const [isOpen, open] = useState(false)
-    const onClose = useCallback(() => open(false), [])
+    const [isOpen, setOpen] = useState(false)
+    const onClose = useCallback(() => setOpen(false), [])
     return (
         <MaskDialog onClose={onClose} open={isOpen} title={title}>
             <DialogContent>{content}</DialogContent>