Move from ethereum-blockies-base64 to blo (#2555)

package.json

@@ -66,9 +66,9 @@
     "@web3-onboard/ledger": "2.3.2",
     "@web3-onboard/trezor": "^2.4.2",
     "@web3-onboard/walletconnect": "^2.4.5",
+    "blo": "^1.1.1",
     "classnames": "^2.3.1",
     "date-fns": "^2.29.2",
-    "ethereum-blockies-base64": "^1.0.2",
     "ethers": "5.7.2",
     "exponential-backoff": "^3.1.0",
     "firebase": "^10.3.1",

src/components/common/EthHashInfo/index.test.tsx

@@ -1,4 +1,4 @@
-import makeBlockie from 'ethereum-blockies-base64'
+import { blo } from 'blo'
 import type { ChainInfo } from '@safe-global/safe-gateway-typescript-sdk'
 
 import { act, fireEvent, render, waitFor } from '@/tests/test-utils'
@@ -179,7 +179,7 @@ describe('EthHashInfo', () => {
 
       expect(container.querySelector('.icon')).toHaveAttribute(
         'style',
-        `background-image: url(${makeBlockie(MOCK_SAFE_ADDRESS)}); width: 40px; height: 40px;`,
+        `background-image: url(${blo(MOCK_SAFE_ADDRESS)}); width: 40px; height: 40px;`,
       )
     })
 
@@ -188,7 +188,7 @@ describe('EthHashInfo', () => {
 
       expect(container.querySelector('.icon')).toHaveAttribute(
         'style',
-        `background-image: url(${makeBlockie(MOCK_SAFE_ADDRESS)}); width: 100px; height: 100px;`,
+        `background-image: url(${blo(MOCK_SAFE_ADDRESS)}); width: 100px; height: 100px;`,
       )
     })
 

src/components/common/Identicon/index.tsx

@@ -1,6 +1,6 @@
 import type { ReactElement, CSSProperties } from 'react'
 import { useMemo } from 'react'
-import makeBlockie from 'ethereum-blockies-base64'
+import { blo } from 'blo'
 import Skeleton from '@mui/material/Skeleton'
 
 import css from './styles.module.css'
@@ -13,7 +13,7 @@ export interface IdenticonProps {
 const Identicon = ({ address, size = 40 }: IdenticonProps): ReactElement => {
   const style = useMemo<CSSProperties | null>(() => {
     try {
-      const blockie = makeBlockie(address)
+      const blockie = blo(address as `0x${string}`)
       return {
         backgroundImage: `url(${blockie})`,
         width: `${size}px`,

yarn.lock

@@ -7186,6 +7186,11 @@ blakejs@^1.1.0, blakejs@^1.2.1:
   resolved "https://registry.yarnpkg.com/blakejs/-/blakejs-1.2.1.tgz#5057e4206eadb4a97f7c0b6e197a505042fc3814"
   integrity sha512-QXUSXI3QVc/gJME0dBpXrag1kbzOqCjCX8/b54ntNyW6sjtoqxqRk3LTmXzaJoh71zMsDCjM+47jS7XiwN/+fQ==
 
+blo@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/blo/-/blo-1.1.1.tgz#ed781c5c516fba484ec8ec86105dc27f6c553209"
+  integrity sha512-1uGZInlRD4X1WQP2G1QjDGwGZ8HdGgFKqnzyRdA2TYYc0MOQCmCi37RTQ8oJuI0UF6DYFKXHwV/t1kZkO/fTaA==
+
 blob-util@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/blob-util/-/blob-util-2.0.2.tgz#3b4e3c281111bb7f11128518006cdc60b403a1eb"