use images directly from resolved in useENSProfile

rainbow-me · Apr 26, 2022 · b9b96a8 · b9b96a8
1 parent 70d8582
commit b9b96a8
Showing 1 changed file with 26 additions and 86 deletions.
diff --git a/src/hooks/useENSRegistration.ts b/src/hooks/useENSRegistration.ts
@@ -6,8 +6,6 @@ import { ENSRegistrationState, Records } from '@rainbow-me/entities';
 import { REGISTRATION_MODES } from '@rainbow-me/helpers/ens';
 import * as ensRedux from '@rainbow-me/redux/ensRegistration';
 import { AppState } from '@rainbow-me/redux/store';
-import { isENSNFTRecord, parseENSNFTRecord } from '@rainbow-me/utils';
-import getENSNFTAvatarUrl from '@rainbow-me/utils/getENSNFTAvatarUrl';
 
 export default function useENSRegistration({
   setInitialRecordsWhenInEditMode = false,
@@ -78,31 +76,15 @@ export default function useENSRegistration({
   const profileQuery = useENSProfile(name, {
     enabled: mode === REGISTRATION_MODES.EDIT,
   });
-  useEffect(() => {
-    if (
-      setInitialRecordsWhenInEditMode &&
-      mode === REGISTRATION_MODES.EDIT &&
-      profileQuery.isSuccess
-    ) {
-      dispatch(
-        ensRedux.setInitialRecords(
-          accountAddress,
-          profileQuery.data?.records as Records
-        )
-      );
-    }
-  }, [
-    accountAddress,
-    dispatch,
-    mode,
-    profileQuery.data?.records,
-    profileQuery.isSuccess,
-    setInitialRecordsWhenInEditMode,
-  ]);
+
+  const images = useMemo(() => {
+    return {
+      avatarUrl: profileQuery?.data?.images?.avatarUrl,
+      coverUrl: profileQuery?.data?.images?.coverUrl,
+    };
+  }, [profileQuery.data?.images.avatarUrl, profileQuery.data?.images.coverUrl]);
 
   // Derive the records that should be added or removed from the profile
-  // (these should be used for SET_TEXT txns instead of `records` to save
-  // gas).
   const changedRecords = useMemo(() => {
     const entriesToChange = differenceWith(
       Object.entries(records),
@@ -149,68 +131,26 @@ export default function useENSRegistration({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [accountAddress, JSON.stringify(changedRecords), dispatch]);
 
-  // Since `records.avatar` is not a reliable source for an avatar URL
-  // (the avatar can be an NFT), then if the avatar is an NFT, we will
-  // parse it to obtain the URL.
-  const uniqueTokens = useSelector(
-    ({ uniqueTokens }: AppState) => uniqueTokens.uniqueTokens
-  );
-  const images = useMemo(() => {
-    const getImageUrl = (
-      key: 'avatar' | 'cover',
-      defaultValue?: string | null
-    ) => {
-      const recordValue = records?.[key];
-      let imageUrl =
-        getENSNFTAvatarUrl(uniqueTokens, records?.[key]) || defaultValue;
-
-      if (changedRecords[key] === '') {
-        // If the image has been removed, update accordingly.
-        imageUrl = '';
-      } else if (recordValue) {
-        const isNFT = isENSNFTRecord(recordValue);
-        if (isNFT) {
-          const { contractAddress, tokenId } = parseENSNFTRecord(
-            records?.[key] || ''
-          );
-          const uniqueToken = uniqueTokens.find(
-            token =>
-              token.asset_contract.address === contractAddress &&
-              token.id === tokenId
-          );
-          if (uniqueToken?.image_url) {
-            imageUrl = uniqueToken?.image_url;
-          } else if (uniqueToken?.image_thumbnail_url) {
-            imageUrl = uniqueToken?.image_thumbnail_url;
-          }
-        } else if (
-          recordValue?.startsWith('http') ||
-          recordValue?.startsWith('file') ||
-          ((recordValue?.startsWith('/') || recordValue?.startsWith('~')) &&
-            !recordValue?.match(/^\/(ipfs|ipns)/))
-        ) {
-          imageUrl = recordValue;
-        }
-      }
-      return imageUrl;
-    };
-
-    const avatarUrl = getImageUrl(
-      'avatar',
-      profileQuery.data?.images.avatarUrl
-    );
-    const coverUrl = getImageUrl('cover', profileQuery.data?.images.coverUrl);
-
-    return {
-      avatarUrl,
-      coverUrl,
-    };
+  useEffect(() => {
+    if (
+      setInitialRecordsWhenInEditMode &&
+      mode === REGISTRATION_MODES.EDIT &&
+      profileQuery.isSuccess
+    ) {
+      dispatch(
+        ensRedux.setInitialRecords(
+          accountAddress,
+          profileQuery.data?.records as Records
+        )
+      );
+    }
   }, [
-    profileQuery.data?.images.avatarUrl,
-    profileQuery.data?.images.coverUrl,
-    records,
-    uniqueTokens,
-    changedRecords,
+    accountAddress,
+    dispatch,
+    mode,
+    profileQuery.data?.records,
+    profileQuery.isSuccess,
+    setInitialRecordsWhenInEditMode,
   ]);
 
   return {