From 8fb35febfe375f7c622fb6a41ee5a2e0dce9b281 Mon Sep 17 00:00:00 2001
From: Roshaan Siddiqui <siddiqui.roshaan@gmail.com>
Date: Fri, 15 Dec 2023 11:58:40 -0600
Subject: [PATCH] feat: add reload table button (#450)

Adds a button to refresh the logs from indexer logs page.
---
 frontend/src/components/Logs/IndexerLogs.jsx | 14 +++++++++++++-
 frontend/src/components/Logs/LogButtons.jsx  | 15 +++++++++++++++
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/Logs/IndexerLogs.jsx b/frontend/src/components/Logs/IndexerLogs.jsx
index a2b2f22d2..10e04c190 100644
--- a/frontend/src/components/Logs/IndexerLogs.jsx
+++ b/frontend/src/components/Logs/IndexerLogs.jsx
@@ -116,7 +116,7 @@ const IndexerLogsComponent = () => {
     return mergedEntries;
   };
 
-  useEffect(() => {
+  const initializeTable = () => {
     const grid = new Grid({
       columns: [
         {
@@ -204,8 +204,19 @@ const IndexerLogsComponent = () => {
     });
 
     grid.render(indexerLogsRef.current);
+  };
+
+  useEffect(() => {
+    initializeTable();
   }, []);
 
+  const reloadData = () => {
+    indexerLogsRef.current.innerHTML = "";
+    setTimeout(() => {
+      initializeTable();
+    }, 500);
+  };
+
   return (
     <>
       <div
@@ -222,6 +233,7 @@ const IndexerLogsComponent = () => {
           setHeights={setHeights}
           latestHeight={height}
           isUserIndexer={indexerDetails.accountId === currentUserAccountId}
+          reloadData={reloadData}
         />
         <Status
           functionName={functionName}
diff --git a/frontend/src/components/Logs/LogButtons.jsx b/frontend/src/components/Logs/LogButtons.jsx
index c831e118e..cab283b36 100644
--- a/frontend/src/components/Logs/LogButtons.jsx
+++ b/frontend/src/components/Logs/LogButtons.jsx
@@ -29,6 +29,7 @@ const LogButtons = ({
   setHeights,
   latestHeight,
   isUserIndexer,
+  reloadData
 }) => {
   const {
     indexerName,
@@ -93,6 +94,20 @@ const LogButtons = ({
                 aria-label="Action Button Group"
               >
                 <>
+                  <OverlayTrigger
+                    placement="bottom"
+                    overlay={<Tooltip>Reload Data</Tooltip>}
+                  >
+                    <Button
+                      size="sm"
+                      variant="secondary"
+                      className="flex align-center"
+                      onClick={() => reloadData()}
+                    >
+                      <ArrowCounterclockwise style={{ paddingRight: "2px" }} size={24} />
+                      Reload
+                    </Button>
+                  </OverlayTrigger>
                   <OverlayTrigger
                     placement="bottom"
                     overlay={<Tooltip>Open Editor</Tooltip>}