diff --git a/src/components/walletconnect/WcProposalForm/ProposalVerification.tsx b/src/components/walletconnect/WcProposalForm/ProposalVerification.tsx index b27dae9153..cbd0e66582 100644 --- a/src/components/walletconnect/WcProposalForm/ProposalVerification.tsx +++ b/src/components/walletconnect/WcProposalForm/ProposalVerification.tsx @@ -2,12 +2,12 @@ import type { Web3WalletTypes } from '@walletconnect/web3wallet' import { Alert, SvgIcon } from '@mui/material' import type { AlertColor } from '@mui/material' import AlertIcon from '@/public/images/notifications/alert.svg' - import type { Verify } from '@walletconnect/types' import type { ComponentType, ReactElement } from 'react' import CloseIcon from '@/public/images/common/close.svg' import InfoIcon from '@/public/images/notifications/info.svg' import CheckIcon from '@/public/images/common/check.svg' +import { getPeerName } from '@/services/walletconnect/utils' import css from './styles.module.css' const Validation: { @@ -65,8 +65,8 @@ const ProposalVerification = ({ proposal }: { proposal: Web3WalletTypes.SessionP } > {isScam - ? `We prevent connecting to ${proposer.metadata.name} as they are a known scam.` - : `${proposer.metadata.name} ${_validation.desc}`} + ? `We prevent connecting to ${getPeerName(proposer) || 'this dApp'} as they are a known scam.` + : `${getPeerName(proposer) || 'This dApp'} ${_validation.desc}`} ) } diff --git a/src/components/walletconnect/WcProposalForm/index.tsx b/src/components/walletconnect/WcProposalForm/index.tsx index 672637192b..1b05842ba2 100644 --- a/src/components/walletconnect/WcProposalForm/index.tsx +++ b/src/components/walletconnect/WcProposalForm/index.tsx @@ -8,7 +8,7 @@ import css from './styles.module.css' import ProposalVerification from './ProposalVerification' import { CompatibilityWarning } from './CompatibilityWarning' import useChains from '@/hooks/useChains' -import { getSupportedChainIds, isBlockedBridge, isWarnedBridge } from '@/services/walletconnect/utils' +import { getPeerName, getSupportedChainIds, isBlockedBridge, isWarnedBridge } from '@/services/walletconnect/utils' import useChainId from '@/hooks/useChainId' type ProposalFormProps = { @@ -29,6 +29,7 @@ const WcProposalForm = ({ proposal, onApprove, onReject }: ProposalFormProps): R const isHighRisk = proposal.verifyContext.verified.validation === 'INVALID' || isWarnedBridge(origin) const disabled = isUnsupportedChain || isScam || isBlockedBridge(origin) || (isHighRisk && !understandsRisk) + const name = getPeerName(proposer) || 'Unknown dApp' return (
@@ -38,16 +39,13 @@ const WcProposalForm = ({ proposal, onApprove, onReject }: ProposalFormProps): R {proposer.metadata.icons[0] && (
- +
)} - {proposer.metadata.name} wants to connect + + {name} wants to connect + {proposal.verifyContext.verified.origin} diff --git a/src/components/walletconnect/WcProposalForm/useCompatibilityWarning.ts b/src/components/walletconnect/WcProposalForm/useCompatibilityWarning.ts index aaf7647654..13c48f90bf 100644 --- a/src/components/walletconnect/WcProposalForm/useCompatibilityWarning.ts +++ b/src/components/walletconnect/WcProposalForm/useCompatibilityWarning.ts @@ -4,7 +4,7 @@ import type { Web3WalletTypes } from '@walletconnect/web3wallet' import useChains from '@/hooks/useChains' import useSafeInfo from '@/hooks/useSafeInfo' import { capitalize } from '@/utils/formatters' -import { isBlockedBridge, isWarnedBridge } from '@/services/walletconnect/utils' +import { getPeerName, isBlockedBridge, isWarnedBridge } from '@/services/walletconnect/utils' const NAME_FALLBACK = 'this dApp' const NAME_PLACEHOLDER = '%%name%%' @@ -54,13 +54,13 @@ export const useCompatibilityWarning = ( return useMemo(() => { const { origin } = proposal.verifyContext.verified - const { proposer } = proposal.params let { message, severity } = _getWarning(origin, isUnsupportedChain) if (message.includes(NAME_PLACEHOLDER)) { - message = message.replaceAll(NAME_PLACEHOLDER, proposer.metadata.name || NAME_FALLBACK) - if (message.includes(NAME_FALLBACK)) { + const name = getPeerName(proposal.params.proposer) || NAME_FALLBACK + message = message.replaceAll(NAME_PLACEHOLDER, name) + if (message.startsWith(NAME_FALLBACK)) { message = capitalize(message) } } diff --git a/src/components/walletconnect/WcSessionList/index.tsx b/src/components/walletconnect/WcSessionList/index.tsx index 557521fbba..92cead820b 100644 --- a/src/components/walletconnect/WcSessionList/index.tsx +++ b/src/components/walletconnect/WcSessionList/index.tsx @@ -1,5 +1,6 @@ import SafeAppIconCard from '@/components/safe-apps/SafeAppIconCard' import useSafeInfo from '@/hooks/useSafeInfo' +import { getPeerName } from '@/services/walletconnect/utils' import { Button, List, ListItem, ListItemAvatar, ListItemIcon, ListItemText, Typography } from '@mui/material' import type { SessionTypes } from '@walletconnect/types' import type { ReactElement } from 'react' @@ -19,6 +20,7 @@ const WcSessionListItem = ({ onDisconnect: () => void }): ReactElement => { const { safeLoaded } = useSafeInfo() + const name = getPeerName(session.peer) || 'Unknown dApp' return ( @@ -27,10 +29,7 @@ const WcSessionListItem = ({ )} - +