From 426fadff60b52283c646ed4b6395c9665e70d546 Mon Sep 17 00:00:00 2001
From: Amy Yan <ayanamydev@gmail.com>
Date: Fri, 19 Jan 2024 15:16:17 +1100
Subject: [PATCH 1/3] fix: swapped around timestamps to ascending for
 ResourceChart

---
 src/components/ResourceChart.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ResourceChart.tsx b/src/components/ResourceChart.tsx
index d4772ba..9d3fe14 100644
--- a/src/components/ResourceChart.tsx
+++ b/src/components/ResourceChart.tsx
@@ -100,8 +100,8 @@ function ResourceChart({
             },
             limits: {
               x: {
-                min: timestamps.at(-1),
-                max: timestamps.at(0),
+                min: timestamps.at(0),
+                max: timestamps.at(-1),
               },
             },
           },

From ff794a93349377e372bfc97ab69d58d932415a9d Mon Sep 17 00:00:00 2001
From: Amy Yan <ayanamydev@gmail.com>
Date: Fri, 19 Jan 2024 15:48:32 +1100
Subject: [PATCH 2/3] fix: finishedOn is now nullable

---
 src/pages/index.tsx | 51 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 51 insertions(+)

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index a7cd6bc..4970662 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -46,6 +46,20 @@ export default function Home(): JSX.Element {
       ),
     refetchInterval: 60 * 1000,
   });
+  const deploymentsQuery = useQuery<Array<{
+    id: string;
+    commitHash: string;
+    startedOn: number;
+    finishedOn?: number;
+    progress: number;
+  }>>({
+    queryKey: ['deployments'],
+    queryFn: () =>
+      fetch(`${siteConfig.url}/api/deployments`).then((response) =>
+        response.json(),
+      ),
+    refetchInterval: 60 * 1000,
+  });
 
   return (
     <Layout
@@ -75,6 +89,43 @@ export default function Home(): JSX.Element {
               <></>
             )}
           </div>
+          <div className='bg-[#E4F6F2] rounded-2xl p-3'>
+            <span className="font-semibold">Deployments:</span>
+            <table className='w-full mt-3 max-h-96'>
+              <thead>
+                <tr>
+                  <th>ID</th>
+                  <th className='w-full'>Commit Hash</th>
+                  <th>Started On</th>
+                  <th>Finished On</th>
+                  <th>Progress</th>
+                </tr>
+              </thead>
+              <tbody>
+                {deploymentsQuery.data != null && deploymentsQuery.data.length !== 0 ? (
+                  deploymentsQuery.data.map(
+                    (deployment) => (
+                      <tr>
+                        <td>{deployment.id}</td>
+                        <td>{deployment.commitHash}</td>
+                        <td>{new Date(deployment.startedOn).toISOString()}</td>
+                        <td>{deployment.finishedOn == null ? "" : new Date(deployment.finishedOn).toISOString()}</td>
+                        <td>
+                          {deployment.progress * 100}%
+                        </td>
+                      </tr>
+                    ),
+                  )
+                ) : (
+                  <tr>
+                    <td colSpan={5} align="center">
+                      No deployments have been recorded
+                    </td>
+                  </tr>
+                )}
+              </tbody>
+            </table>
+          </div>
           <div className="w-full">
             <div className="w-full md:w-1/2 inline-block aspect-[1.5]">
               {resourceCpuQuery.data != null ? (

From 7d64104f784689a7f03591e9dd50f9287c970163 Mon Sep 17 00:00:00 2001
From: Amy Yan <ayanamydev@gmail.com>
Date: Fri, 19 Jan 2024 16:11:12 +1100
Subject: [PATCH 3/3] fix: added commithash to seed nodes status

---
 src/components/NodeList.tsx     | 28 ------------------
 src/components/SeedNodeCard.tsx |  9 ++++++
 src/pages/index.tsx             | 52 ++++++++++++++++++++-------------
 3 files changed, 41 insertions(+), 48 deletions(-)
 delete mode 100644 src/components/NodeList.tsx

diff --git a/src/components/NodeList.tsx b/src/components/NodeList.tsx
deleted file mode 100644
index e962ced..0000000
--- a/src/components/NodeList.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import * as React from 'react';
-import clsx from 'clsx';
-
-const SeednodeList = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement> & { nodes: { [nodeId: string]: any } }
-  // Complains about props not being validated
-  // eslint-disable-next-line
->(({ className, nodes, ...props }, ref) => {
-  return (
-    <div className={clsx('space-y-3', className)} ref={ref} {...props}>
-      {nodes != null ? (
-        Object.keys(nodes).map((nodeId) => (
-          <div key={nodeId} className="bg-[#E4F6F2] rounded-2xl p-3 flex-1">
-            <span className="font-semibold">Node ID:</span>
-            <div className="overflow-x-auto break-normal">{nodeId}</div>
-          </div>
-        ))
-      ) : (
-        <></>
-      )}
-    </div>
-  );
-});
-
-SeednodeList.displayName = 'SeednodeList';
-
-export default SeednodeList;
diff --git a/src/components/SeedNodeCard.tsx b/src/components/SeedNodeCard.tsx
index fdc327a..ffd6d42 100644
--- a/src/components/SeedNodeCard.tsx
+++ b/src/components/SeedNodeCard.tsx
@@ -11,6 +11,9 @@ const NodeCard = React.forwardRef<
       agentPort: number;
       clientHost: string;
       clientPort: number;
+      versionMetadata: {
+        cliAgentCommitHash: string;
+      }
     };
   }
   // Complains about props not being validated
@@ -46,6 +49,12 @@ const NodeCard = React.forwardRef<
           <div className="overflow-x-auto break-normal">
             {data.clientHost}:{data.clientPort}
           </div>
+          <span className="font-semibold">Commit Hash:</span>
+          <div className="overflow-x-auto break-normal">
+              <a href={`https://github.com/MatrixAI/Polykey-CLI/commit/${data.versionMetadata.cliAgentCommitHash}`}>
+                {data.versionMetadata.cliAgentCommitHash}
+              </a>
+          </div>
         </>
       ) : (
         <></>
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 4970662..e88286b 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -61,6 +61,10 @@ export default function Home(): JSX.Element {
     refetchInterval: 60 * 1000,
   });
 
+  const seedNodesCommitHashes = seedNodesQuery.data == null ? undefined : Object.values(seedNodesQuery.data).map((seedNode) =>
+    seedNode.versionMetadata.cliAgentCommitHash
+  );
+
   return (
     <Layout
       title={`${siteConfig.title}`}
@@ -89,6 +93,25 @@ export default function Home(): JSX.Element {
               <></>
             )}
           </div>
+          <div className="bg-[#E4F6F2] rounded-2xl p-3">
+            <div className="w-full md:w-1/2 inline-block aspect-[1.5]">
+              {resourceCpuQuery.data != null ? (
+                <ResourceChart title="CPU Usage" data={resourceCpuQuery.data} />
+              ) : (
+                <></>
+              )}
+            </div>
+            <div className="w-full md:w-1/2 inline-block aspect-[1.5]">
+              {resourceMemoryQuery.data != null ? (
+                <ResourceChart
+                  title="Memory Usage"
+                  data={resourceMemoryQuery.data}
+                />
+              ) : (
+                <></>
+              )}
+            </div>
+          </div>
           <div className='bg-[#E4F6F2] rounded-2xl p-3'>
             <span className="font-semibold">Deployments:</span>
             <table className='w-full mt-3 max-h-96'>
@@ -98,6 +121,7 @@ export default function Home(): JSX.Element {
                   <th className='w-full'>Commit Hash</th>
                   <th>Started On</th>
                   <th>Finished On</th>
+                  <th>Nodes</th>
                   <th>Progress</th>
                 </tr>
               </thead>
@@ -107,9 +131,16 @@ export default function Home(): JSX.Element {
                     (deployment) => (
                       <tr>
                         <td>{deployment.id}</td>
-                        <td>{deployment.commitHash}</td>
+                        <td>
+                          <a href={`https://github.com/MatrixAI/Polykey-CLI/commit/${deployment.commitHash}`}>
+                            {deployment.commitHash}
+                          </a>
+                        </td>
                         <td>{new Date(deployment.startedOn).toISOString()}</td>
                         <td>{deployment.finishedOn == null ? "" : new Date(deployment.finishedOn).toISOString()}</td>
+                        <td>
+                          {seedNodesCommitHashes?.filter((commitHash) => commitHash === deployment.commitHash).length ?? 0}
+                        </td>
                         <td>
                           {deployment.progress * 100}%
                         </td>
@@ -126,25 +157,6 @@ export default function Home(): JSX.Element {
               </tbody>
             </table>
           </div>
-          <div className="w-full">
-            <div className="w-full md:w-1/2 inline-block aspect-[1.5]">
-              {resourceCpuQuery.data != null ? (
-                <ResourceChart title="CPU Usage" data={resourceCpuQuery.data} />
-              ) : (
-                <></>
-              )}
-            </div>
-            <div className="w-full md:w-1/2 inline-block aspect-[1.5]">
-              {resourceMemoryQuery.data != null ? (
-                <ResourceChart
-                  title="Memory Usage"
-                  data={resourceMemoryQuery.data}
-                />
-              ) : (
-                <></>
-              )}
-            </div>
-          </div>
         </div>
       </div>
     </Layout>