From 6f56fdf44556afd478b432f3e3248e3406e1782b Mon Sep 17 00:00:00 2001
From: Dannon Baker <dannon.baker@gmail.com>
Date: Mon, 9 Dec 2024 12:51:19 -0500
Subject: [PATCH] Refactor UtcDate.vue to use galaxyTimeToDate and
 localizeUTCPretty for improved date handling and formatting

---
 client/src/components/UtcDate.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/client/src/components/UtcDate.vue b/client/src/components/UtcDate.vue
index 9bd9f547c777..3ddef27b7c6d 100644
--- a/client/src/components/UtcDate.vue
+++ b/client/src/components/UtcDate.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import { format, formatDistanceToNow, parseISO } from "date-fns";
+import { formatDistanceToNow } from "date-fns";
 import { computed } from "vue";
 
+import { galaxyTimeToDate, localizeUTCPretty } from "@/utils/dates";
+
 interface UtcDateProps {
     date: string;
     mode?: "date" | "elapsed" | "pretty";
@@ -11,10 +13,10 @@ const props = withDefaults(defineProps<UtcDateProps>(), {
     mode: "date",
 });
 
-const parsedDate = computed(() => parseISO(`${props.date}Z`));
+const parsedDate = computed(() => galaxyTimeToDate(props.date));
 const elapsedTime = computed(() => formatDistanceToNow(parsedDate.value, { addSuffix: true }));
 const fullISO = computed(() => parsedDate.value.toISOString());
-const pretty = computed(() => format(parsedDate.value, "eeee MMM do H:mm:ss yyyy zz"));
+const pretty = computed(() => localizeUTCPretty(parsedDate.value));
 </script>
 
 <template>