From 660c6b40bbe0e2481db4797e61e39770ff3623af Mon Sep 17 00:00:00 2001
From: Sriman Achanta <68172138+srimanachanta@users.noreply.github.com>
Date: Wed, 9 Aug 2023 05:11:43 -0400
Subject: [PATCH] Show when metrics were last fetched

---
 .../src/components/settings/MetricsCard.vue        | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/photon-client/src/components/settings/MetricsCard.vue b/photon-client/src/components/settings/MetricsCard.vue
index f5deeb65f3..e28919b3c5 100644
--- a/photon-client/src/components/settings/MetricsCard.vue
+++ b/photon-client/src/components/settings/MetricsCard.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
-import { computed, onBeforeMount } from "vue";
+import { computed, onBeforeMount, ref } from "vue";
 import { useStateStore } from "@/stores/StateStore";
 import CvIcon from "@/components/common/cv-icon.vue";
 
@@ -57,6 +57,7 @@ const platformMetrics = computed<MetricItem[]>(() => [
   }
 ]);
 
+const metricsLastFetched = ref("Never");
 const fetchMetrics = () => {
   useSettingsStore()
       .requestMetricsUpdate()
@@ -72,6 +73,14 @@ const fetchMetrics = () => {
             message: "An error occurred while trying to fetch Metrics."
           });
         }
+      })
+      .finally(() => {
+        const pad = (num: number): string => {
+          return String(num).padStart(2, "0");
+        };
+
+        const date = new Date();
+        metricsLastFetched.value = `${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;
       });
 };
 
@@ -161,6 +170,9 @@ onBeforeMount(() => {
         </tbody>
       </v-simple-table>
     </v-row>
+    <div style="text-align: right">
+      <span>Last Fetched: {{ metricsLastFetched }}</span>
+    </div>
   </v-card>
 </template>