From 839e1d71245708ac54142e840fde803aefb6523b Mon Sep 17 00:00:00 2001
From: shibao <shibao@bubbletea.dev>
Date: Fri, 31 Jan 2025 22:07:41 -0500
Subject: [PATCH] fix dates not displaying properly

---
 CHANGELOG.md                                  | 1 +
 assets/js/date.js                             | 2 +-
 assets/js/datetime.js                         | 2 +-
 lib/cannery_web/components/table_component.ex | 3 ++-
 4 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4030170..935de82 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,4 +1,5 @@
 # v0.9.13
+- Fix dates not rendering properly in table
 - Update deps
 
 # v0.9.12
diff --git a/assets/js/date.js b/assets/js/date.js
index 3c6922f..7c3bfee 100644
--- a/assets/js/date.js
+++ b/assets/js/date.js
@@ -1,7 +1,7 @@
 export default {
   displayDate (el) {
     const date =
-      Intl.DateTimeFormat([], { timeZone: 'Etc/UTC', dateStyle: 'short' })
+      Intl.DateTimeFormat([], { timeZone: 'UTC', dateStyle: 'short' })
         .format(new Date(el.dateTime))
 
     el.innerText = date
diff --git a/assets/js/datetime.js b/assets/js/datetime.js
index ec19d48..fe874f0 100644
--- a/assets/js/datetime.js
+++ b/assets/js/datetime.js
@@ -1,7 +1,7 @@
 export default {
   displayDateTime (el) {
     const date =
-      Intl.DateTimeFormat([], { dateStyle: 'short', timeStyle: 'long' })
+      Intl.DateTimeFormat([], { timeZone: 'UTC', dateStyle: 'short', timeStyle: 'long' })
         .format(new Date(el.dateTime))
 
     el.innerText = date
diff --git a/lib/cannery_web/components/table_component.ex b/lib/cannery_web/components/table_component.ex
index facb98e..970e742 100644
--- a/lib/cannery_web/components/table_component.ex
+++ b/lib/cannery_web/components/table_component.ex
@@ -20,6 +20,7 @@ defmodule CanneryWeb.Components.TableComponent do
   """
 
   use CanneryWeb, :live_component
+  alias Cannery.{ComparableDate, ComparableDateTime}
   alias Phoenix.LiveView.Socket
   require Integer
 
@@ -110,7 +111,7 @@ defmodule CanneryWeb.Components.TableComponent do
   end
 
   defp sort_by_custom_sort_value_or_value(rows, key, sort_mode, type)
-       when type in [Date, DateTime] do
+       when type in [ComparableDate, ComparableDateTime, Date, DateTime] do
     rows
     |> Enum.sort_by(
       fn row ->