sha256 on av upload

package.json

@@ -57,6 +57,7 @@
     "@metamask/inpage-provider": "^8.1.0",
     "@metamask/mobile-provider": "^2.1.0",
     "@metamask/post-message-stream": "^6.1.2",
+    "@noble/hashes": "^1.3.2",
     "@rainbow-me/rainbowkit": "1.0.8",
     "@sentry/nextjs": "^7.43.0",
     "@svgr/webpack": "^8.1.0",

src/components/@molecules/ProfileEditor/Avatar/AvatarUpload.tsx

@@ -1,14 +1,15 @@
 /* eslint-disable no-multi-assign */
+import { sha256 } from '@noble/hashes/sha256'
 import { useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import styled, { css } from 'styled-components'
+import { bytesToHex } from 'viem'
 import { useMutation, useQueryClient, useSignTypedData } from 'wagmi'
 
 import { Button, Dialog, mq } from '@ensdomains/thorin'
 
 import { useChainName } from '@app/hooks/chain/useChainName'
 
-import { keccak256 } from 'viem'
 import { useQueryKeys } from '../../../../utils/cacheKeyFactory'
 import { AvCancelButton, CropComponent } from './AvatarCrop'
 
@@ -52,7 +53,7 @@ const UploadComponent = ({
   const { t } = useTranslation('transactionFlow')
   const queryClient = useQueryClient()
   const queryKeys = useQueryKeys().avatar.avatar(name)
-  const urlHash = useMemo(() => keccak256(dataURLToBytes(dataURL)), [dataURL])
+  const urlHash = useMemo(() => bytesToHex(sha256(dataURLToBytes(dataURL))), [dataURL])
   const expiry = useMemo(() => `${Date.now() + 1000 * 60 * 60 * 24 * 7}`, [])
   const network = useChainName()