diff --git a/src/components/common/AddressEmoji/AddressEmoji.test.tsx b/src/components/common/AddressEmoji/AddressEmoji.test.tsx index 28214ec80c..e31f70e053 100644 --- a/src/components/common/AddressEmoji/AddressEmoji.test.tsx +++ b/src/components/common/AddressEmoji/AddressEmoji.test.tsx @@ -3,12 +3,11 @@ import { ethereumAddressToEmoji } from '.' describe('ethereumAddressToEmoji', () => { it('should return the correct emoji', () => { const emoji = ethereumAddressToEmoji('0x0000000000000000000000000000000000000000') - expect(emoji).toBe('😀') + expect(emoji).toBe('🌱') }) - it('should return an emoji for the entire range of addresses', () => { - const hexChars = 4 - for (let i = 0; i < 16 ** hexChars; i++) { + it('should return an emoji for the entire range', () => { + for (let i = 0; i < 1000; i++) { const address = `0x${i.toString(16).padStart(4, '0')}` const emoji = ethereumAddressToEmoji(address) //console.log(address, emoji) diff --git a/src/components/common/AddressEmoji/index.tsx b/src/components/common/AddressEmoji/index.tsx index 7fc25b1a4c..2ea0bee19d 100644 --- a/src/components/common/AddressEmoji/index.tsx +++ b/src/components/common/AddressEmoji/index.tsx @@ -5,13 +5,15 @@ import css from './styles.module.css' // Define the Unicode ranges for animal, fruit, and vegetable emojis const unicodeRanges = [ - [0x1f600, 0x1f60e], - [0x1f638, 0x1f63d], - [0x1f680, 0x1f683], - [0x2614, 0x2615], - [0x1f330, 0x1f393], - [0x1f3a0, 0x1f3ca], - [0x1f400, 0x1f42a], + [0x1f331, 0x1f333], // Plant + [0x1f334, 0x1f335], // Plant + [0x1f340, 0x1f341], // Plant + [0x1f34f, 0x1f37f], // Food + [0x1f950, 0x1f96b], // Food + [0x1f400, 0x1f43e], // Animal + [0x1f981, 0x1f984], // Animal + [0x1f3b0, 0x1f3bd], // Sports + [0x1f3bc, 0x1f3b7], // Music ] // Calculate the total number of emojis diff --git a/src/components/common/AddressEmoji/styles.module.css b/src/components/common/AddressEmoji/styles.module.css index 8ebcf511e3..6044213631 100644 --- a/src/components/common/AddressEmoji/styles.module.css +++ b/src/components/common/AddressEmoji/styles.module.css @@ -13,7 +13,7 @@ border-radius: 100%; border: 2px solid var(--color-secondary-light); color: #000; - background-color: rgba(255, 255, 255, 0.5); + background-color: rgba(255, 255, 255, 0.6); text-shadow: -1px 0 0 var(--color-secondary-light), 0 -1px 0 var(--color-secondary-light), 1px 0 0 var(--color-secondary-light), 0 1px 0 var(--color-secondary-light); } diff --git a/src/components/common/EthHashInfo/index.tsx b/src/components/common/EthHashInfo/index.tsx index f17a91941c..2b7f7770a2 100644 --- a/src/components/common/EthHashInfo/index.tsx +++ b/src/components/common/EthHashInfo/index.tsx @@ -8,6 +8,8 @@ import { selectChainById } from '@/store/chainsSlice' import { getBlockExplorerLink } from '@/utils/chains' import { Emoji } from '@/components/common/AddressEmoji' import SrcEthHashInfo, { type EthHashInfoProps } from './SrcEthHashInfo' +import { selectAddedSafes } from '@/store/addedSafesSlice' +import useSafeAddress from '@/hooks/useSafeAddress' const EthHashInfo = ({ showName = true, @@ -16,11 +18,18 @@ const EthHashInfo = ({ }: EthHashInfoProps & { showName?: boolean }): ReactElement => { const settings = useAppSelector(selectSettings) const currentChainId = useChainId() + const safeAddress = useSafeAddress() + const addedSafes = useAppSelector((state) => selectAddedSafes(state, currentChainId)) || {} const chain = useAppSelector((state) => selectChainById(state, props.chainId || currentChainId)) const addressBook = useAddressBook() const link = chain ? getBlockExplorerLink(chain, props.address) : undefined const name = showName ? props.name || addressBook[props.address] : undefined - const showEmoji = settings.addressEmojis && props.showAvatar !== false && !props.customAvatar && avatarSize >= 20 + const showEmoji = + settings.addressEmojis && + props.showAvatar !== false && + !props.customAvatar && + avatarSize >= 20 && + (safeAddress === props.address || props.address in addedSafes) return ( diff --git a/src/components/common/WalletInfo/styles.module.css b/src/components/common/WalletInfo/styles.module.css index 2c6432f1b3..49cb8d24b9 100644 --- a/src/components/common/WalletInfo/styles.module.css +++ b/src/components/common/WalletInfo/styles.module.css @@ -28,4 +28,8 @@ width: 22px; height: auto; } + + .walletName { + display: none; + } } diff --git a/src/store/addedSafesSlice.ts b/src/store/addedSafesSlice.ts index ca36931267..0cf79e38b1 100644 --- a/src/store/addedSafesSlice.ts +++ b/src/store/addedSafesSlice.ts @@ -133,7 +133,7 @@ export const selectTotalAdded = (state: RootState): number => { export const selectAddedSafes = createSelector( [selectAllAddedSafes, (_: RootState, chainId: string) => chainId], (allAddedSafes, chainId): AddedSafesOnChain | undefined => { - return allAddedSafes[chainId] + return allAddedSafes?.[chainId] }, )