Fix cached assets

Fix key warning Deduplicate cached assets
BTS-CM · Aug 17, 2023 · 2f026ee · 2f026ee
1 parent 333f433
commit 2f026ee
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 24 deletions.
diff --git a/src/components/NFT/Media.jsx b/src/components/NFT/Media.jsx
@@ -101,7 +101,7 @@ export default function Media(properties) {
                     icon = <BsQuestion />;
                 }
 
-                return <Carousel.Slide key={`cs_${uuid}`}>
+                return <Carousel.Slide key={`cs_${uuid}_${i}`}>
                           <Center>
                             <Card shadow="sm" radius="md" withBorder>
                               <Card.Section>

diff --git a/src/lib/states.js b/src/lib/states.js
@@ -386,29 +386,27 @@ const tempStore = create(
         cachedAssets = bitshares_testnet.filter((asset) => (asset_ids.includes(asset.id) || asset_ids.includes(asset.symbol)));
       }
 
-      if (cachedAssets.length && cachedAssets.length === asset_ids.length) {
-        console.log("Responded with cached assets");
-        set({ assets: cachedAssets });
-        return;
-      }
-
       const remainingAssetIds = asset_ids.filter((id) => !cachedAssets.find((asset) => asset.id === id));
-      const node = nodes[environment][0];
-      let response;
-      try {
-        response = await window.electron.fetchAssets(node, remainingAssetIds);
-      } catch (error) {
-        console.log(error);
-        changeURL();
-      }
 
-      const finalAssets = cachedAssets.concat(response);
+      if (remainingAssetIds.length) {
+        const node = nodes[environment][0];
+        let response;
+        try {
+          response = await window.electron.fetchAssets(node, remainingAssetIds);
+        } catch (error) {
+          console.log(error);
+          changeURL();
+          return;
+        }
 
-      if (response) {
-        console.log("Fetched assets");
-        set({ assets: finalAssets });
-        changeAssets(environment, finalAssets);
+        cachedAssets = cachedAssets.concat(response);
       }
+
+      cachedAssets = cachedAssets.filter((asset, index, self) => index === self.findIndex((t) => (t.id === asset.id)));
+
+      console.log("Fetched assets");
+      set({ assets: cachedAssets });
+      changeAssets(environment, cachedAssets);
     },
     fetchIssuedAssets: async (accountID) => {
       /**
@@ -456,14 +454,18 @@ const tempStore = create(
       const nonCachedAssets = finalAssets.filter((finalAsset) => cachedAssets.find((cachedAsset) => cachedAsset.id === finalAsset.id));
       if (nonCachedAssets.length) {
           // FinalAssets has new data to cache
-          changeAssets(environment, cachedAssets.concat(nonCachedAssets)); // caching the NFT assets
+          cachedAssets = cachedAssets
+                          .concat(nonCachedAssets)
+                          .filter((asset, index, self) => index === self.findIndex((t) => (t.id === asset.id)));
+
+          changeAssets(environment, cachedAssets); // caching the NFT assets
       }
 
       const changeNonNFTs = nonNFTStore.getState().changeNonNFTs;
       changeNonNFTs(environment, nonNFTAssetIDs); // caching the non-NFT asset IDs
 
       if (finalAssets) {
-        set({ assets: await finalAssets })
+        set({ assets: await finalAssets.filter((asset, index, self) => index === self.findIndex((t) => (t.id === asset.id))) })
       }
     },
     fetchNFTBalances: async (accountID) => {
@@ -514,7 +516,12 @@ const tempStore = create(
 
       if (nonCachedAssets.length) {
           // FinalAssets has new data to cache
-          changeAssets(environment, cachedAssets.concat(nonCachedAssets)); // caching the NFT assets
+          changeAssets(
+            environment,
+            cachedAssets
+              .concat(nonCachedAssets)
+              .filter((asset, index, self) => index === self.findIndex((t) => (t.id === asset.id)))
+          ); // caching the NFT assets
       }
 
       const changeNonNFTs = nonNFTStore.getState().changeNonNFTs;
@@ -523,7 +530,7 @@ const tempStore = create(
       }
 
       if (finalAssets) {
-        set({ assets: await finalAssets })
+        set({ assets: await finalAssets.filter((asset, index, self) => index === self.findIndex((t) => (t.id === asset.id))) })
       } else {
         set({ assets: [] })
       }