diff --git a/package.json b/package.json
index 971e1b443977..7f75f89e55ea 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
"yarn": ">=999.0.0",
"npm": ">=999.0.0"
},
- "version": "2.6.0",
+ "version": "2.7.0",
"private": true,
"license": "AGPL-3.0-or-later",
"scripts": {
diff --git a/packages/dashboard/src/pages/CreateMaskWallet/components/Welcome/index.tsx b/packages/dashboard/src/pages/CreateMaskWallet/components/Welcome/index.tsx
index bb1065d382b4..b6f2a4d25c0f 100644
--- a/packages/dashboard/src/pages/CreateMaskWallet/components/Welcome/index.tsx
+++ b/packages/dashboard/src/pages/CreateMaskWallet/components/Welcome/index.tsx
@@ -83,7 +83,6 @@ const Welcome = memo(() => {
}
body::-webkit-scrollbar-thumb {
border-radius: 4px;
-
}
`
iframeDocument.head?.appendChild(style)
diff --git a/packages/icons/general/Swap.tsx b/packages/icons/general/Swap.tsx
index 97fb772fc770..701a709ff660 100644
--- a/packages/icons/general/Swap.tsx
+++ b/packages/icons/general/Swap.tsx
@@ -4,11 +4,18 @@ import type { SvgIcon } from '@mui/material'
export const SwapIcon: typeof SvgIcon = createIcon(
'SwapIcon',
-
+
,
- '0 0 37 36',
+ '0 0 16 16',
)
diff --git a/packages/icons/general/SwapColorfulIcon.tsx b/packages/icons/general/SwapColorfulIcon.tsx
new file mode 100644
index 000000000000..eda80c5f5f95
--- /dev/null
+++ b/packages/icons/general/SwapColorfulIcon.tsx
@@ -0,0 +1,14 @@
+import { createIcon } from '../utils'
+import type { SvgIcon } from '@mui/material'
+
+export const SwapColorfulIcon: typeof SvgIcon = createIcon(
+ 'SwapColorfulIcon',
+
+
+
+ ,
+ '0 0 37 36',
+)
diff --git a/packages/icons/general/index.ts b/packages/icons/general/index.ts
index 95fe8869375e..fba52bae1e3a 100644
--- a/packages/icons/general/index.ts
+++ b/packages/icons/general/index.ts
@@ -7,6 +7,7 @@ export * from './Airdrop'
export * from './Send'
export * from './Card'
export * from './Swap'
+export * from './SwapColorfulIcon'
export * from './Download'
export * from './Link'
export * from './Author'
diff --git a/packages/mask/src/components/InjectedComponents/ProfileTabContent.tsx b/packages/mask/src/components/InjectedComponents/ProfileTabContent.tsx
index 26cb570738fa..f99b8354c404 100644
--- a/packages/mask/src/components/InjectedComponents/ProfileTabContent.tsx
+++ b/packages/mask/src/components/InjectedComponents/ProfileTabContent.tsx
@@ -103,19 +103,19 @@ export function ProfileTabContent(props: ProfileTabContentProps) {
useUpdateEffect(() => {
setSelectedTab(undefined)
- }, [identity.identifier])
+ }, [identity.identifier?.userId])
useEffect(() => {
return MaskMessages.events.profileTabHidden.on((data) => {
if (data.hidden) setHidden(data.hidden)
})
- }, [identity.identifier])
+ }, [identity.identifier?.userId])
useEffect(() => {
return MaskMessages.events.profileTabUpdated.on((data) => {
setHidden(!data.show)
})
- }, [identity.identifier])
+ }, [identity.identifier?.userId])
const ContentComponent = useMemo(() => {
const tabId =
@@ -123,7 +123,7 @@ export function ProfileTabContent(props: ProfileTabContentProps) {
? displayPlugins?.find((tab) => tab?.pluginID === PluginId.NextID)?.ID
: selectedTabId
return getTabContent(tabId ?? '')
- }, [selectedTabId, identity.identifier])
+ }, [selectedTabId, identity.identifier?.userId])
if (hidden) return null
diff --git a/packages/mask/src/components/shared/ApplicationBoard.tsx b/packages/mask/src/components/shared/ApplicationBoard.tsx
index e036652555d8..7b36878723dc 100644
--- a/packages/mask/src/components/shared/ApplicationBoard.tsx
+++ b/packages/mask/src/components/shared/ApplicationBoard.tsx
@@ -27,20 +27,30 @@ import { useMyPersonas } from '../DataSource/useMyPersonas'
import { WalletMessages } from '../../plugins/Wallet/messages'
import { PersonaContext } from '../../extension/popups/pages/Personas/hooks/usePersonaContext'
-const useStyles = makeStyles()((theme) => {
+const useStyles = makeStyles<{ shouldScroll: boolean }>()((theme, props) => {
const smallQuery = `@media (max-width: ${theme.breakpoints.values.sm}px)`
return {
applicationWrapper: {
padding: theme.spacing(1, 0.25),
- overflowY: 'scroll',
display: 'grid',
gridTemplateColumns: 'repeat(4, 1fr)',
+ overflowY: 'auto',
+ overflowX: 'hidden',
gridTemplateRows: '100px',
gridGap: theme.spacing(2),
justifyContent: 'space-between',
height: 340,
- '&::-webkit-scrollbar': {
- display: 'none',
+ width: props.shouldScroll ? 575 : 560,
+ '::-webkit-scrollbar': {
+ backgroundColor: 'transparent',
+ width: 20,
+ },
+ '::-webkit-scrollbar-thumb': {
+ borderRadius: '20px',
+ width: 5,
+ border: '7px solid rgba(0, 0, 0, 0)',
+ backgroundColor: theme.palette.mode === 'dark' ? 'rgba(250, 250, 250, 0.2)' : 'rgba(0, 0, 0, 0.2)',
+ backgroundClip: 'padding-box',
},
[smallQuery]: {
overflow: 'auto',
@@ -92,7 +102,6 @@ export function ApplicationBoard() {
)
}
function ApplicationBoardContent() {
- const { classes } = useStyles()
const theme = useTheme()
const { t } = useI18N()
const [openSettings, setOpenSettings] = useState(false)
@@ -135,6 +144,7 @@ function ApplicationBoardContent() {
[snsAdaptorPlugins, currentWeb3Network, chainId, account],
)
const listedAppList = applicationList.filter((x) => !getUnlistedApp(x))
+ const { classes } = useStyles({ shouldScroll: listedAppList.length > 12 })
return (
<>
diff --git a/packages/mask/src/components/shared/WalletStatusBox/TransactionList.tsx b/packages/mask/src/components/shared/WalletStatusBox/TransactionList.tsx
index 9b82106b994d..cd328e98de8d 100644
--- a/packages/mask/src/components/shared/WalletStatusBox/TransactionList.tsx
+++ b/packages/mask/src/components/shared/WalletStatusBox/TransactionList.tsx
@@ -46,6 +46,9 @@ const useStyles = makeStyles()((theme) => ({
overflow: 'hidden',
whiteSpace: 'nowrap',
},
+ timestamp: {
+ fontSize: 12,
+ },
cell: {
fontSize: 14,
display: 'flex',
@@ -63,6 +66,9 @@ const useStyles = makeStyles()((theme) => ({
height: 12,
marginLeft: theme.spacing(0.5),
},
+ clear: {
+ fontSize: 14,
+ },
}))
const statusTextColorMap: Record
= {
@@ -141,7 +147,7 @@ const Transaction: FC = ({ chainId, transaction: tx, onClear =
component="strong">
{functionName}
-
+
{format(tx.at, 'yyyy.MM.dd hh:mm')}
@@ -167,7 +173,7 @@ const Transaction: FC = ({ chainId, transaction: tx, onClear =
{txStatus === TransactionStatusType.NOT_DEPEND ? (
-