diff --git a/src/components/balances/AssetsTable/index.test.tsx b/src/components/balances/AssetsTable/index.test.tsx
index d22f7c1e9a..759db503d8 100644
--- a/src/components/balances/AssetsTable/index.test.tsx
+++ b/src/components/balances/AssetsTable/index.test.tsx
@@ -109,7 +109,6 @@ describe('AssetsTable', () => {
onChainSigning: false,
},
transactionExecution: true,
- addressEmojis: false,
},
},
})
@@ -216,7 +215,6 @@ describe('AssetsTable', () => {
onChainSigning: false,
},
transactionExecution: true,
- addressEmojis: false,
},
},
})
@@ -319,7 +317,6 @@ describe('AssetsTable', () => {
onChainSigning: false,
},
transactionExecution: true,
- addressEmojis: false,
},
},
})
@@ -419,7 +416,6 @@ describe('AssetsTable', () => {
onChainSigning: false,
},
transactionExecution: true,
- addressEmojis: false,
},
},
})
diff --git a/src/components/balances/HiddenTokenButton/index.test.tsx b/src/components/balances/HiddenTokenButton/index.test.tsx
index b2a907e5be..2df2e63fb0 100644
--- a/src/components/balances/HiddenTokenButton/index.test.tsx
+++ b/src/components/balances/HiddenTokenButton/index.test.tsx
@@ -87,7 +87,6 @@ describe('HiddenTokenToggle', () => {
onChainSigning: false,
},
transactionExecution: true,
- addressEmojis: false,
},
},
})
diff --git a/src/components/common/AddressEmoji/AddressEmoji.test.tsx b/src/components/common/AddressEmoji/AddressEmoji.test.tsx
deleted file mode 100644
index e31f70e053..0000000000
--- a/src/components/common/AddressEmoji/AddressEmoji.test.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { ethereumAddressToEmoji } from '.'
-
-describe('ethereumAddressToEmoji', () => {
- it('should return the correct emoji', () => {
- const emoji = ethereumAddressToEmoji('0x0000000000000000000000000000000000000000')
- expect(emoji).toBe('🌱')
- })
-
- 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)
- expect(emoji).toBeDefined()
- expect(emoji).not.toBe('')
- }
- })
-})
diff --git a/src/components/common/AddressEmoji/index.tsx b/src/components/common/AddressEmoji/index.tsx
deleted file mode 100644
index 2ea0bee19d..0000000000
--- a/src/components/common/AddressEmoji/index.tsx
+++ /dev/null
@@ -1,62 +0,0 @@
-import { type ReactElement, memo } from 'react'
-import { useAppSelector } from '@/store'
-import { selectSettings } from '@/store/settingsSlice'
-import css from './styles.module.css'
-
-// Define the Unicode ranges for animal, fruit, and vegetable emojis
-const unicodeRanges = [
- [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
-let totalEmojis = 0
-for (let range of unicodeRanges) {
- totalEmojis += range[1] - range[0] + 1
-}
-
-export function ethereumAddressToEmoji(address: string): string {
- // Convert the Ethereum address from hexadecimal to decimal
- const decimal = BigInt(address.slice(0, 6))
-
- // Calculate the index by taking the modulo of the decimal by the number of emojis
- let index = Number(decimal % BigInt(totalEmojis))
-
- // Find the corresponding emoji
- for (let range of unicodeRanges) {
- if (index < range[1] - range[0] + 1) {
- return String.fromCodePoint(range[0] + index)
- } else {
- index -= range[1] - range[0] + 1
- }
- }
-
- return ''
-}
-
-type EmojiProps = {
- address: string
- size?: number
-}
-
-export const Emoji = memo(function Emoji({ address, size = 40 }: EmojiProps): ReactElement {
- return (
-
- {ethereumAddressToEmoji(address)}
-
- )
-})
-
-const AddressEmoji = (props: EmojiProps): ReactElement | null => {
- const { addressEmojis } = useAppSelector(selectSettings)
- return addressEmojis ? : null
-}
-
-export default AddressEmoji
diff --git a/src/components/common/AddressEmoji/styles.module.css b/src/components/common/AddressEmoji/styles.module.css
deleted file mode 100644
index 6044213631..0000000000
--- a/src/components/common/AddressEmoji/styles.module.css
+++ /dev/null
@@ -1,19 +0,0 @@
-.container {
- position: relative;
-}
-
-.emojiWrapper {
- text-align: center;
- display: flex;
- flex-direction: column;
- justify-content: center;
- position: absolute;
- top: 0;
- left: 0;
- border-radius: 100%;
- border: 2px solid var(--color-secondary-light);
- color: #000;
- 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/SrcEthHashInfo/index.tsx b/src/components/common/EthHashInfo/SrcEthHashInfo/index.tsx
index 34041dbdfb..732ab2db21 100644
--- a/src/components/common/EthHashInfo/SrcEthHashInfo/index.tsx
+++ b/src/components/common/EthHashInfo/SrcEthHashInfo/index.tsx
@@ -9,14 +9,12 @@ import ExplorerButton, { type ExplorerButtonProps } from '../../ExplorerButton'
import { shortenAddress } from '@/utils/formatters'
import ImageFallback from '../../ImageFallback'
import css from './styles.module.css'
-import { Emoji } from '../../AddressEmoji'
export type EthHashInfoProps = {
address: string
chainId?: string
name?: string | null
showAvatar?: boolean
- showEmoji?: boolean
showCopyButton?: boolean
prefix?: string
showPrefix?: boolean
@@ -39,7 +37,6 @@ const SrcEthHashInfo = ({
showPrefix,
shortAddress = true,
showAvatar = true,
- showEmoji,
avatarSize,
name,
showCopyButton,
@@ -65,7 +62,6 @@ const SrcEthHashInfo = ({
) : (
identicon
)}
- {showEmoji && }
)}
diff --git a/src/components/common/EthHashInfo/index.tsx b/src/components/common/EthHashInfo/index.tsx
index a9215df96e..7d6821f2ba 100644
--- a/src/components/common/EthHashInfo/index.tsx
+++ b/src/components/common/EthHashInfo/index.tsx
@@ -6,8 +6,6 @@ import { selectSettings } from '@/store/settingsSlice'
import { selectChainById } from '@/store/chainsSlice'
import { getBlockExplorerLink } from '@/utils/chains'
import SrcEthHashInfo, { type EthHashInfoProps } from './SrcEthHashInfo'
-import { selectAddedSafes } from '@/store/addedSafesSlice'
-import useSafeAddress from '@/hooks/useSafeAddress'
const EthHashInfo = ({
showName = true,
@@ -16,18 +14,10 @@ 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 ? addressBook[props.address] || props.name : undefined
- const showEmoji =
- settings.addressEmojis &&
- props.showAvatar !== false &&
- !props.customAvatar &&
- avatarSize >= 20 &&
- (safeAddress === props.address || props.address in addedSafes)
return (
{props.children}
diff --git a/src/components/common/SafeIcon/index.tsx b/src/components/common/SafeIcon/index.tsx
index febcf64f03..4ecfdddbbb 100644
--- a/src/components/common/SafeIcon/index.tsx
+++ b/src/components/common/SafeIcon/index.tsx
@@ -3,7 +3,6 @@ import { Box } from '@mui/material'
import css from './styles.module.css'
import Identicon, { type IdenticonProps } from '../Identicon'
-import AddressEmoji from '../AddressEmoji'
interface ThresholdProps {
threshold: number | string
@@ -25,7 +24,6 @@ const SafeIcon = ({ address, threshold, owners, size }: SafeIconProps): ReactEle
{threshold && owners ?
: null}
-
)
diff --git a/src/components/settings/EmojiPreview/index.tsx b/src/components/settings/EmojiPreview/index.tsx
deleted file mode 100644
index f01cfda5a8..0000000000
--- a/src/components/settings/EmojiPreview/index.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { Alert, Box, Chip, SvgIcon, Typography } from '@mui/material'
-import { ZERO_ADDRESS } from '@safe-global/safe-core-sdk/dist/src/utils/constants'
-import InfoIcon from '@/public/images/notifications/info.svg'
-import SafeIcon from '@/components/common/SafeIcon'
-
-const EmojiPreview = () => (
- <>
-
-
- >}>
-
-
- Enable emojis for all Ethereum addresses and your Safe Accounts.
-
-
-
- {ZERO_ADDRESS}
-
-
- >
-)
-
-export default EmojiPreview
diff --git a/src/pages/settings/appearance.tsx b/src/pages/settings/appearance.tsx
index 6b5bfab4d1..cc43ad6743 100644
--- a/src/pages/settings/appearance.tsx
+++ b/src/pages/settings/appearance.tsx
@@ -4,18 +4,11 @@ import type { NextPage } from 'next'
import Head from 'next/head'
import { useAppDispatch, useAppSelector } from '@/store'
-import {
- selectSettings,
- setCopyShortName,
- setDarkMode,
- setShowShortName,
- setAddressEmojis,
-} from '@/store/settingsSlice'
+import { selectSettings, setCopyShortName, setDarkMode, setShowShortName } from '@/store/settingsSlice'
import SettingsHeader from '@/components/settings/SettingsHeader'
import { trackEvent, SETTINGS_EVENTS } from '@/services/analytics'
import { useDarkMode } from '@/hooks/useDarkMode'
import ExternalLink from '@/components/common/ExternalLink'
-import EmojiPreview from '@/components/settings/EmojiPreview'
const Appearance: NextPage = () => {
const dispatch = useAppDispatch()
@@ -23,12 +16,11 @@ const Appearance: NextPage = () => {
const isDarkMode = useDarkMode()
const handleToggle = (
- action: typeof setCopyShortName | typeof setDarkMode | typeof setShowShortName | typeof setAddressEmojis,
+ action: typeof setCopyShortName | typeof setDarkMode | typeof setShowShortName,
event:
| typeof SETTINGS_EVENTS.APPEARANCE.PREPEND_PREFIXES
| typeof SETTINGS_EVENTS.APPEARANCE.COPY_PREFIXES
- | typeof SETTINGS_EVENTS.APPEARANCE.DARK_MODE
- | typeof SETTINGS_EVENTS.APPEARANCE.ADDRESS_EMOJIS,
+ | typeof SETTINGS_EVENTS.APPEARANCE.DARK_MODE,
) => {
return (_: ChangeEvent, checked: boolean) => {
dispatch(action(checked))
@@ -105,27 +97,6 @@ const Appearance: NextPage = () => {
/>
-
-
-
-
- Experimental
-
-
-
-
-
- }
- label="Address emoji"
- />
-
-
-
>
diff --git a/src/services/analytics/events/settings.ts b/src/services/analytics/events/settings.ts
index e55d417281..485faea317 100644
--- a/src/services/analytics/events/settings.ts
+++ b/src/services/analytics/events/settings.ts
@@ -48,10 +48,6 @@ export const SETTINGS_EVENTS = {
action: 'Dark mode',
category: SETTINGS_CATEGORY,
},
- ADDRESS_EMOJIS: {
- action: 'Toggle address emojis',
- category: SETTINGS_CATEGORY,
- },
},
MODULES: {
REMOVE_MODULE: {
diff --git a/src/store/settingsSlice.ts b/src/store/settingsSlice.ts
index d31b752622..08939043be 100644
--- a/src/store/settingsSlice.ts
+++ b/src/store/settingsSlice.ts
@@ -42,7 +42,6 @@ export type SettingsState = {
onChainSigning: boolean
}
transactionExecution: boolean
- addressEmojis: boolean
}
export const initialState: SettingsState = {
@@ -69,7 +68,6 @@ export const initialState: SettingsState = {
onChainSigning: false,
},
transactionExecution: true,
- addressEmojis: false,
}
export const settingsSlice = createSlice({
@@ -94,9 +92,6 @@ export const settingsSlice = createSlice({
setDarkMode: (state, { payload }: PayloadAction) => {
state.theme.darkMode = payload
},
- setAddressEmojis: (state, { payload }: PayloadAction) => {
- state.addressEmojis = payload
- },
setHiddenTokensForChain: (state, { payload }: PayloadAction<{ chainId: string; assets: string[] }>) => {
const { chainId, assets } = payload
state.hiddenTokens[chainId] = assets
@@ -132,7 +127,6 @@ export const {
setCopyShortName,
setQrShortName,
setDarkMode,
- setAddressEmojis,
setHiddenTokensForChain,
setTokenList,
setRpc,