From 65d4ef275e1e1ac2409a6c2176be5663d95e3c6b Mon Sep 17 00:00:00 2001
From: Supriya Mishra <supriyamishra05992@gmail.com>
Date: Sat, 26 Feb 2022 14:33:36 +0530
Subject: [PATCH] - Explicitly caching streams data (cap, balance). - Working
 on the right way to invalidate it

---
 packages/react-app/src/views/Home.jsx | 62 +++++++++++++++++----------
 1 file changed, 39 insertions(+), 23 deletions(-)

diff --git a/packages/react-app/src/views/Home.jsx b/packages/react-app/src/views/Home.jsx
index 78965bd..47c0501 100644
--- a/packages/react-app/src/views/Home.jsx
+++ b/packages/react-app/src/views/Home.jsx
@@ -17,6 +17,41 @@ import { SimpleStreamABI } from "../contracts/external_ABI";
 import { useHistory } from "react-router";
 import { Link } from "react-router-dom";
 
+const streamsCache = {};
+
+async function resolveStreamSummary(streamAddress) {
+  if (streamsCache[streamAddress]) {
+    return streamsCache[streamAddress];
+  }
+
+  var contract = new ethers.Contract(
+    streamAddress,
+    SimpleStreamABI,
+    mainnetProvider
+  );
+
+  var data = {};
+
+  // Call it's cap function
+  await contract
+    .cap()
+    .then((result) =>
+      data.cap = Number(result._hex) * 0.000000000000000001
+    );
+
+  // Call it's Balance function, calculate the current percentage
+  await contract
+    .streamBalance()
+    .then(
+      (result) =>
+      (data.percent =
+        ((Number(result._hex) * 0.000000000000000001) / data.cap) * 100)
+    );
+
+  streamsCache[streamAddress] = data;
+  return data;
+}
+
 export default function Home({
   mainnetProvider,
   tx,
@@ -40,32 +75,13 @@ export default function Home({
   useEffect(async () => {
     // Get an instance for each Stream contract
     for (let b in streams) {
-      if (streams)
-        var contract = new ethers.Contract(
-          streams[b].stream,
-          SimpleStreamABI,
-          mainnetProvider
-        );
-
-      // Call it's cap function
-      const cap = await contract
-        .cap()
-        .then((result) =>
-          copy[b].push(Number(result._hex) * 0.000000000000000001)
-        );
-
-      // Call it's Balance function, calculate the current percentage
-      const balance = await contract
-        .streamBalance()
-        .then(
-          (result) =>
-            (copy[b].percent =
-              ((Number(result._hex) * 0.000000000000000001) / copy[b][3]) * 100)
-        );
+      const summary = resolveStreamSummary(streams[b].stream);
+      copy[b].push(summary.cap);
+      copy[b].percent = summary.percent;
     }
     setData(copy);
 
-    // Wait until list is almost fully loaded to render
+    // Wait until list is almost fully loaded to renderø
     if (copy.length >= 18) setReady(true);
   }, [streams]);