Show event timestamps with local TZ from web web browser

https://package.elm-lang.org/packages/justinmimbs/timezone-data/latest/ https://github.com/elm/time References: #1723
RailsEventStore · Jan 25, 2024 · 9176c24 · 9176c24
1 parent 726771f
commit 9176c24
Show file tree

Hide file tree

Showing 4 changed files with 72 additions and 53 deletions.
diff --git a/ruby_event_store-browser/elm/elm.json b/ruby_event_store-browser/elm/elm.json
@@ -1,38 +1,41 @@
 {
-  "type": "application",
-  "source-directories": ["./src"],
-  "elm-version": "0.19.1",
-  "dependencies": {
-    "direct": {
-      "NoRedInk/elm-json-decode-pipeline": "1.0.1",
-      "damienklinnert/elm-spinner": "3.0.2",
-      "elm/browser": "1.0.2",
-      "elm/core": "1.0.5",
-      "elm/html": "1.0.0",
-      "elm/http": "2.0.0",
-      "elm/json": "1.1.3",
-      "elm/time": "1.0.0",
-      "elm/url": "1.0.0",
-      "elm-community/maybe-extra": "5.3.0",
-      "klazuka/elm-json-tree-view": "2.1.0",
-      "rtfeldman/elm-iso8601-date-strings": "1.1.4",
-      "ryannhg/date-format": "2.3.0"
+    "type": "application",
+    "source-directories": [
+        "./src"
+    ],
+    "elm-version": "0.19.1",
+    "dependencies": {
+        "direct": {
+            "NoRedInk/elm-json-decode-pipeline": "1.0.1",
+            "damienklinnert/elm-spinner": "3.0.2",
+            "elm/browser": "1.0.2",
+            "elm/core": "1.0.5",
+            "elm/html": "1.0.0",
+            "elm/http": "2.0.0",
+            "elm/json": "1.1.3",
+            "elm/time": "1.0.0",
+            "elm/url": "1.0.0",
+            "elm-community/maybe-extra": "5.3.0",
+            "justinmimbs/timezone-data": "10.1.0",
+            "klazuka/elm-json-tree-view": "2.1.0",
+            "rtfeldman/elm-iso8601-date-strings": "1.1.4",
+            "ryannhg/date-format": "2.3.0"
+        },
+        "indirect": {
+            "avh4/elm-color": "1.0.0",
+            "elm/bytes": "1.0.8",
+            "elm/file": "1.0.5",
+            "elm/parser": "1.1.0",
+            "elm/virtual-dom": "1.0.2"
+        }
     },
-    "indirect": {
-      "avh4/elm-color": "1.0.0",
-      "elm/bytes": "1.0.8",
-      "elm/file": "1.0.5",
-      "elm/parser": "1.1.0",
-      "elm/virtual-dom": "1.0.2",
-      "robinheghan/murmur3": "1.0.0"
+    "test-dependencies": {
+        "direct": {
+            "elm-explorations/test": "2.1.2"
+        },
+        "indirect": {
+            "elm/random": "1.0.0",
+            "robinheghan/murmur3": "1.0.0"
+        }
     }
-  },
-  "test-dependencies": {
-    "direct": {
-      "elm-explorations/test": "2.1.2"
-    },
-    "indirect": {
-      "elm/random": "1.0.0"
-    }
-  }
 }
diff --git a/ruby_event_store-browser/elm/src/Page/ShowEvent.elm b/ruby_event_store-browser/elm/src/Page/ShowEvent.elm
@@ -213,8 +213,8 @@ showEvent baseUrl event maybeCausedEvents =
                 [ class "w-full text-left grid md:grid-cols-3 gap-8 overflow-hidden"
                 ]
                 [ section [ class "space-y-4" ]
-                    [ h2 [ class "border-gray-400 border-b text-gray-500 uppercase font-bold text-xs pb-2" ] [ text "Event ID"]
-                     , div [ class "text-sm font-medium font-mono"] [ text event.eventId ]
+                    [ h2 [ class "border-gray-400 border-b text-gray-500 uppercase font-bold text-xs pb-2" ] [ text "Event ID" ]
+                    , div [ class "text-sm font-medium font-mono" ] [ text event.eventId ]
                     ]
                 , section [ class "space-y-4" ]
                     [ h2 [ class "border-gray-400 border-b text-gray-500 uppercase font-bold text-xs pb-2" ] [ text "Raw Data" ]

diff --git a/ruby_event_store-browser/elm/src/Page/ShowStream.elm b/ruby_event_store-browser/elm/src/Page/ShowStream.elm
@@ -7,9 +7,11 @@ import Html.Attributes exposing (class, disabled, href)
 import Html.Events exposing (onClick)
 import Http
 import Route
+import Task exposing (Task)
+import Time
 import TimeHelpers exposing (formatTimestamp)
+import TimeZone
 import Url
-import Time
 
 
 
@@ -22,6 +24,8 @@ type alias Model =
     , flags : Flags
     , relatedStreams : Maybe (List String)
     , problems : List Problem
+    , zone : Time.Zone
+    , zoneName : String
     }
 
 
@@ -36,6 +40,8 @@ initModel flags streamName =
     , relatedStreams = Nothing
     , flags = flags
     , problems = []
+    , zone = Time.utc
+    , zoneName = "UTC"
     }
 
 
@@ -47,11 +53,15 @@ type Msg
     = GoToPage Api.PaginationLink
     | EventsFetched (Result Http.Error (Api.PaginatedList Api.Event))
     | StreamFetched (Result Http.Error Api.Stream)
+    | ReceiveTimeZone (Result TimeZone.Error ( String, Time.Zone ))
 
 
 initCmd : Flags -> String -> Cmd Msg
 initCmd flags streamId =
-    Api.getStream StreamFetched flags streamId
+    Cmd.batch
+        [ Api.getStream StreamFetched flags streamId
+        , TimeZone.getZone |> Task.attempt ReceiveTimeZone
+        ]
 
 
 update : Msg -> Model -> ( Model, Cmd Msg )
@@ -80,9 +90,15 @@ update msg model =
             in
             ( { model | problems = serverErrors }, Cmd.none )
 
+        ReceiveTimeZone (Ok ( zoneName, zone )) ->
+            ( { model | zone = zone, zoneName = zoneName }, Cmd.none )
+
+        ReceiveTimeZone (Err error) ->
+            ( model, Cmd.none )
+
 
 view : Model -> ( String, Html Msg )
-view { streamName, events, relatedStreams, problems, flags } =
+view { streamName, events, relatedStreams, problems, flags, zone, zoneName } =
     let
         title =
             "Stream " ++ streamName
@@ -93,7 +109,7 @@ view { streamName, events, relatedStreams, problems, flags } =
     case problems of
         [] ->
             ( title
-            , browseEvents flags.rootUrl header events relatedStreams
+            , browseEvents flags.rootUrl header events relatedStreams zone zoneName
             )
 
         _ ->
@@ -109,8 +125,8 @@ view { streamName, events, relatedStreams, problems, flags } =
             )
 
 
-browseEvents : Url.Url -> String -> Api.PaginatedList Api.Event -> Maybe (List String) -> Html Msg
-browseEvents baseUrl title { links, events } relatedStreams =
+browseEvents : Url.Url -> String -> Api.PaginatedList Api.Event -> Maybe (List String) -> Time.Zone -> String -> Html Msg
+browseEvents baseUrl title { links, events } relatedStreams zone zoneName =
     div [ class "py-8" ]
         [ div
             [ class "flex px-8 justify-between" ]
@@ -119,7 +135,7 @@ browseEvents baseUrl title { links, events } relatedStreams =
                 [ text title ]
             , div [] [ displayPagination links ]
             ]
-        , div [ class "px-8" ] [ renderResults baseUrl events ]
+        , div [ class "px-8" ] [ renderResults baseUrl events zone zoneName ]
         , div [] [ renderRelatedStreams baseUrl relatedStreams ]
         ]
 
@@ -224,8 +240,8 @@ firstPageButton link =
         [ text "first" ]
 
 
-renderResults : Url.Url -> List Api.Event -> Html Msg
-renderResults baseUrl events =
+renderResults : Url.Url -> List Api.Event -> Time.Zone -> String -> Html Msg
+renderResults baseUrl events zone zoneName =
     case events of
         [] ->
             p
@@ -253,13 +269,13 @@ renderResults baseUrl events =
                     ]
                 , tbody
                     [ class "align-top" ]
-                    (List.map (itemRow baseUrl) events)
+                    (List.map (itemRow baseUrl zone zoneName) events)
                 ]
 
 
-itemRow : Url.Url -> Api.Event -> Html Msg
-itemRow baseUrl { eventType, createdAt, eventId } =
-    tr [ class "border-gray-50 border-b hover:bg-gray-100"]
+itemRow : Url.Url -> Time.Zone -> String -> Api.Event -> Html Msg
+itemRow baseUrl zone zoneName { eventType, createdAt, eventId } =
+    tr [ class "border-gray-50 border-b hover:bg-gray-100" ]
         [ td
             [ class "py-2 px-4 align-middle" ]
             [ a
@@ -273,5 +289,5 @@ itemRow baseUrl { eventType, createdAt, eventId } =
             [ text eventId ]
         , td
             [ class "py-2  pr-4 font-mono text-sm leading-none font-medium text-right align-middle" ]
-            [ text (formatTimestamp createdAt Time.utc) ]
+            [ text (formatTimestamp createdAt zone zoneName) ]
         ]
diff --git a/ruby_event_store-browser/elm/src/TimeHelpers.elm b/ruby_event_store-browser/elm/src/TimeHelpers.elm
@@ -4,8 +4,8 @@ import DateFormat exposing (..)
 import Time
 
 
-formatTimestamp : Time.Posix -> Time.Zone -> String
-formatTimestamp time zone =
+formatTimestamp : Time.Posix -> Time.Zone -> String -> String
+formatTimestamp time zone zoneName =
     format
         [ dayOfMonthFixed
         , text "."
@@ -21,7 +21,7 @@ formatTimestamp time zone =
         , text "."
         , millisecondFixed
         , text " "
-        , text "UTC"
+        , text zoneName
         ]
         zone
         time