diff --git a/explorer/src/components/TopAccountsCard.tsx b/explorer/src/components/TopAccountsCard.tsx
index 2d0d713a11..3880a1204f 100644
--- a/explorer/src/components/TopAccountsCard.tsx
+++ b/explorer/src/components/TopAccountsCard.tsx
@@ -19,19 +19,15 @@ export function TopAccountsCard() {
   const [showDropdown, setDropdown] = React.useState(false);
   const filter = useQueryFilter();
 
-  // Fetch on load
-  React.useEffect(() => {
-    if (richList === Status.Idle && typeof supply === "object") fetchRichList();
-  }, [supply]); // eslint-disable-line react-hooks/exhaustive-deps
-
   if (typeof supply !== "object") return null;
 
   if (richList === Status.Disconnected) {
     return <ErrorCard text="Not connected to the cluster" />;
   }
 
-  if (richList === Status.Idle || richList === Status.Connecting)
+  if (richList === Status.Connecting) {
     return <LoadingCard />;
+  }
 
   if (typeof richList === "string") {
     return <ErrorCard text={richList} retry={fetchRichList} />;
@@ -39,25 +35,28 @@ export function TopAccountsCard() {
 
   let supplyCount: number;
   let accounts, header;
-  switch (filter) {
-    case "nonCirculating": {
-      accounts = richList.nonCirculating;
-      supplyCount = supply.nonCirculating;
-      header = "Non-Circulating";
-      break;
-    }
-    case "all": {
-      accounts = richList.total;
-      supplyCount = supply.total;
-      header = "Total";
-      break;
-    }
-    case "circulating":
-    default: {
-      accounts = richList.circulating;
-      supplyCount = supply.circulating;
-      header = "Circulating";
-      break;
+
+  if (richList !== Status.Idle) {
+    switch (filter) {
+      case "nonCirculating": {
+        accounts = richList.nonCirculating;
+        supplyCount = supply.nonCirculating;
+        header = "Non-Circulating";
+        break;
+      }
+      case "all": {
+        accounts = richList.total;
+        supplyCount = supply.total;
+        header = "Total";
+        break;
+      }
+      case "circulating":
+      default: {
+        accounts = richList.circulating;
+        supplyCount = supply.circulating;
+        header = "Circulating";
+        break;
+      }
     }
   }
 
@@ -84,23 +83,38 @@ export function TopAccountsCard() {
           </div>
         </div>
 
-        <div className="table-responsive mb-0">
-          <table className="table table-sm table-nowrap card-table">
-            <thead>
-              <tr>
-                <th className="text-muted">Rank</th>
-                <th className="text-muted">Address</th>
-                <th className="text-muted text-right">Balance (SOL)</th>
-                <th className="text-muted text-right">% of {header} Supply</th>
-              </tr>
-            </thead>
-            <tbody className="list">
-              {accounts.map((account, index) =>
-                renderAccountRow(account, index, supplyCount)
-              )}
-            </tbody>
-          </table>
-        </div>
+        {richList === Status.Idle && (
+          <div className="card-body">
+            <span
+              className="btn btn-white ml-3 d-none d-md-inline"
+              onClick={fetchRichList}
+            >
+              Load Largest Accounts
+            </span>
+          </div>
+        )}
+
+        {accounts && (
+          <div className="table-responsive mb-0">
+            <table className="table table-sm table-nowrap card-table">
+              <thead>
+                <tr>
+                  <th className="text-muted">Rank</th>
+                  <th className="text-muted">Address</th>
+                  <th className="text-muted text-right">Balance (SOL)</th>
+                  <th className="text-muted text-right">
+                    % of {header} Supply
+                  </th>
+                </tr>
+              </thead>
+              <tbody className="list">
+                {accounts.map((account, index) =>
+                  renderAccountRow(account, index, supplyCount)
+                )}
+              </tbody>
+            </table>
+          </div>
+        )}
       </div>
     </>
   );