diff --git a/lib/shared/avatar-utils.js b/lib/shared/avatar-utils.js
--- a/lib/shared/avatar-utils.js
+++ b/lib/shared/avatar-utils.js
@@ -1,13 +1,20 @@
 // @flow
 
 import invariant from 'invariant';
+import * as React from 'react';
 import stringHash from 'string-hash';
 
+import { userIdentifiedByETHAddress } from './account-utils.js';
 import { selectedThreadColors } from './color-utils.js';
 import { threadOtherMembers } from './thread-utils.js';
 import genesis from '../facts/genesis.js';
+import { useENSAvatar } from '../hooks/ens-cache.js';
 import { threadInfoSelector } from '../selectors/thread-selectors.js';
-import type { ClientEmojiAvatar, ClientAvatar } from '../types/avatar-types.js';
+import type {
+  ClientEmojiAvatar,
+  ClientImageAvatar,
+  ClientAvatar,
+} from '../types/avatar-types.js';
 import {
   type RawThreadInfo,
   type ThreadInfo,
@@ -117,9 +124,46 @@
   return getDefaultAvatar(thread.id, thread.color);
 }
 
+function useAvatarForUserID(
+  userID: ?string,
+  avatarInfo: ClientAvatar,
+): ClientEmojiAvatar | ClientImageAvatar {
+  const userInfos = useSelector(state => state.userStore.userInfos);
+  const userInfo = userID ? userInfos[userID] : null;
+
+  const ethAddress = React.useMemo(() => {
+    let address = null;
+    if (userInfo && avatarInfo.type === 'ens') {
+      const { username } = userInfo;
+      address =
+        username && userIdentifiedByETHAddress(userInfo) ? username : null;
+    }
+    return address;
+  }, [avatarInfo.type, userInfo]);
+
+  const ensAvatarURI = useENSAvatar(ethAddress);
+
+  const avatar = React.useMemo(() => {
+    if (avatarInfo.type !== 'ens') {
+      return avatarInfo;
+    }
+
+    if (ensAvatarURI) {
+      return {
+        type: 'image',
+        uri: ensAvatarURI,
+      };
+    }
+
+    return defaultAnonymousUserEmojiAvatar;
+  }, [ensAvatarURI, avatarInfo]);
+
+  return avatar;
+}
+
 export {
-  defaultAnonymousUserEmojiAvatar,
   getAvatarForUser,
   getUserAvatarForThread,
   useGetAvatarForThread,
+  useAvatarForUserID,
 };
diff --git a/native/components/user-avatar.react.js b/native/components/user-avatar.react.js
--- a/native/components/user-avatar.react.js
+++ b/native/components/user-avatar.react.js
@@ -2,11 +2,9 @@
 
 import * as React from 'react';
 
-import { useENSAvatar } from 'lib/hooks/ens-cache.js';
-import { userIdentifiedByETHAddress } from 'lib/shared/account-utils.js';
 import {
-  defaultAnonymousUserEmojiAvatar,
   getAvatarForUser,
+  useAvatarForUserID,
 } from 'lib/shared/avatar-utils.js';
 
 import Avatar from './avatar.react.js';
@@ -25,34 +23,9 @@
   );
   const avatarInfo = getAvatarForUser(userInfo);
 
-  const ethAddress = React.useMemo(() => {
-    let address = null;
-    if (userInfo && avatarInfo.type === 'ens') {
-      const { username } = userInfo;
-      address =
-        username && userIdentifiedByETHAddress(userInfo) ? username : null;
-    }
-    return address;
-  }, [avatarInfo.type, userInfo]);
-
-  const ensAvatarURI = useENSAvatar(ethAddress);
-
-  const userAvatarInfo = React.useMemo(() => {
-    if (avatarInfo.type !== 'ens') {
-      return avatarInfo;
-    }
-
-    if (ensAvatarURI) {
-      return {
-        type: 'image',
-        uri: ensAvatarURI,
-      };
-    }
-
-    return defaultAnonymousUserEmojiAvatar;
-  }, [ensAvatarURI, avatarInfo]);
-
-  return <Avatar size={size} avatarInfo={userAvatarInfo} />;
+  const userAvatar = useAvatarForUserID(userID, avatarInfo);
+
+  return <Avatar size={size} avatarInfo={userAvatar} />;
 }
 
 export default UserAvatar;