From 2831a239e2cb581ed3a4e96451eae448bacfc8d9 Mon Sep 17 00:00:00 2001
From: Noah Saso <noahsaso@gmail.com>
Date: Thu, 5 Oct 2023 12:28:03 -0700
Subject: [PATCH] Synchronize fallback wallet images.

---
 packages/stateful/hooks/useEntity.ts          | 14 +++++++++++---
 packages/stateful/recoil/selectors/entity.ts  |  9 +++++++--
 packages/stateful/recoil/selectors/profile.ts |  2 +-
 3 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/packages/stateful/hooks/useEntity.ts b/packages/stateful/hooks/useEntity.ts
index 25ae35d2b..9ff792b48 100644
--- a/packages/stateful/hooks/useEntity.ts
+++ b/packages/stateful/hooks/useEntity.ts
@@ -1,13 +1,17 @@
 import { useCachedLoading, useChain } from '@dao-dao/stateless'
 import { Entity, EntityType, LoadingData } from '@dao-dao/types'
-import { getFallbackImage } from '@dao-dao/utils'
+import {
+  getFallbackImage,
+  isValidWalletAddress,
+  toBech32Hash,
+} from '@dao-dao/utils'
 
 import { entitySelector } from '../recoil'
 
 // Supports wallets from any chain and DAOs from the current chain or DAOs from
 // another chain with a polytone account on the current chain.
 export const useEntity = (address: string): LoadingData<Entity> => {
-  const { chain_id: chainId } = useChain()
+  const { chain_id: chainId, bech32_prefix: bech32Prefix } = useChain()
 
   return useCachedLoading(
     entitySelector({
@@ -20,7 +24,11 @@ export const useEntity = (address: string): LoadingData<Entity> => {
       chainId,
       address,
       name: null,
-      imageUrl: getFallbackImage(address),
+      imageUrl: getFallbackImage(
+        isValidWalletAddress(address, bech32Prefix)
+          ? toBech32Hash(address)
+          : address
+      ),
     }
   )
 }
diff --git a/packages/stateful/recoil/selectors/entity.ts b/packages/stateful/recoil/selectors/entity.ts
index b206ba62f..7a7bf3033 100644
--- a/packages/stateful/recoil/selectors/entity.ts
+++ b/packages/stateful/recoil/selectors/entity.ts
@@ -8,6 +8,7 @@ import {
   getImageUrlForChainId,
   isValidContractAddress,
   isValidWalletAddress,
+  toBech32Hash,
 } from '@dao-dao/utils'
 
 import { daoInfoFromPolytoneProxySelector, daoInfoSelector } from './dao'
@@ -43,6 +44,8 @@ export const entitySelector = selectorFamily<
         return entity
       }
 
+      const isWallet = isValidWalletAddress(address, bech32Prefix)
+
       const [
         daoInfoLoadable,
         daoInfoFromPolytoneProxyLoadable,
@@ -65,7 +68,7 @@ export const entitySelector = selectorFamily<
               })
             : constSelector(undefined),
           // try to load profile assuming the address is a wallet address.
-          address && isValidWalletAddress(address, bech32Prefix)
+          address && isWallet
             ? walletProfileDataSelector({
                 address,
                 chainId,
@@ -127,7 +130,9 @@ export const entitySelector = selectorFamily<
             : undefined) ||
           // Use actual address for fallback image, even if polytone account, so
           // the fallback image stays consistent.
-          getFallbackImage(actualAddress),
+          getFallbackImage(
+            isWallet ? toBech32Hash(actualAddress) : actualAddress
+          ),
       }
 
       return entity
diff --git a/packages/stateful/recoil/selectors/profile.ts b/packages/stateful/recoil/selectors/profile.ts
index 5053587c7..17cfa9245 100644
--- a/packages/stateful/recoil/selectors/profile.ts
+++ b/packages/stateful/recoil/selectors/profile.ts
@@ -100,7 +100,7 @@ export const makeDefaultWalletProfileData = (
   loading,
   address,
   profile: { ...EMPTY_WALLET_PROFILE },
-  backupImageUrl: getFallbackImage(),
+  backupImageUrl: getFallbackImage(toBech32Hash(address) || address),
 })
 
 // This selector returns the profile for a wallet with some helpful metadata,