feat: Use user's timezone

assets/js/app.js

@@ -22,6 +22,8 @@ import { Socket } from "phoenix";
 import { LiveSocket } from "phoenix_live_view";
 import topbar from "../vendor/topbar";
 
+const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+
 let Hooks = {};
 /**
  * This hook is necessary because we're watching for a blur event on a `p` tag with `contenteditable`.
@@ -55,7 +57,7 @@ let csrfToken = document
   .getAttribute("content");
 let liveSocket = new LiveSocket("/live", Socket, {
   hooks: Hooks,
-  params: { _csrf_token: csrfToken },
+  params: { _csrf_token: csrfToken, timezone },
 });
 
 // Show progress bar on live navigation and form submits

config/config.exs

@@ -37,6 +37,8 @@ config :medicode, :generators,
 # at the `config/runtime.exs`.
 config :medicode, Medicode.Mailer, adapter: Swoosh.Adapters.Local
 
+config :elixir, :time_zone_database, Tzdata.TimeZoneDatabase
+
 # Configure esbuild (the version is required)
 config :esbuild,
   version: "0.17.11",

lib/medicode_web/components/components.ex

@@ -78,6 +78,13 @@ defmodule MedicodeWeb.Components do
   Shows the status and keywords for the current session.
   """
   def result_heading(assigns) do
+    assigns =
+      assign_new(assigns, :transcript_inserted_at, fn _ ->
+        assigns.transcription.inserted_at
+        |> DateTime.shift_zone!(assigns.timezone)
+        |> Calendar.strftime("%a, %b %d, %Y, %I:%M %p")
+      end)
+
     ~H"""
     <div class="flex justify-between">
       <div class="flex items-center">
@@ -117,7 +124,7 @@ defmodule MedicodeWeb.Components do
         <img src={~p"/images/calendar.svg"} width="16" />
 
         <span class="text-sm leading-normal font-bold text-type-black-tertiary uppercase">
-          <%= Calendar.strftime(DateTime.now!("Etc/UTC"), "%a, %b %d, %Y, %I:%M %p") %>
+          <%= @transcript_inserted_at %>
         </span>
       </div>
       <div class="px-4 pt-2 pb-10 flex flex-col gap-2">

lib/medicode_web/live/transcriptions_live/show.ex

@@ -10,6 +10,8 @@ defmodule MedicodeWeb.TranscriptionsLive.Show do
   def mount(params, session, socket) do
     transcription = get_transcription(params["id"])
 
+    timezone = get_connect_params(socket)["timezone"] || "Etc/UTC"
+
     if is_nil(transcription), do: raise(Medicode.Fallback)
 
     if connected?(socket) do
@@ -30,7 +32,8 @@ defmodule MedicodeWeb.TranscriptionsLive.Show do
       summary_keywords: summary_keywords,
       transcription: transcription,
       transcriptions: list_transcriptions(session["current_user"]),
-      finalized_codes: finalized_codes
+      finalized_codes: finalized_codes,
+      timezone: timezone
     }
 
     socket =
@@ -59,6 +62,7 @@ defmodule MedicodeWeb.TranscriptionsLive.Show do
             transcription={@transcription}
             summary_keywords={@summary_keywords}
             finalized_codes={@finalized_codes}
+            timezone={@timezone}
           />
 
           <img

mix.exs

@@ -72,7 +72,8 @@ defmodule Medicode.MixProject do
       {:hackney, "~> 1.8"},
       {:sentry, "~> 8.0"},
       {:ecto_psql_extras, "~> 0.6"},
-      {:circular_buffer, "~> 0.4.0"}
+      {:circular_buffer, "~> 0.4.0"},
+      {:tzdata, "~> 1.1"}
       # {:membrane_portaudio_plugin, "~> 0.18.0"}
     ]
   end

mix.lock

@@ -103,6 +103,7 @@
   "telemetry_poller": {:hex, :telemetry_poller, "1.0.0", "db91bb424e07f2bb6e73926fcafbfcbcb295f0193e0a00e825e589a0a47e8453", [:rebar3], [{:telemetry, "~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "b3a24eafd66c3f42da30fc3ca7dda1e9d546c12250a2d60d7b81d264fbec4f6e"},
   "thousand_island": {:hex, :thousand_island, "1.3.5", "6022b6338f1635b3d32406ff98d68b843ba73b3aa95cfc27154223244f3a6ca5", [:mix], [{:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "2be6954916fdfe4756af3239fb6b6d75d0b8063b5df03ba76fd8a4c87849e180"},
   "tokenizers": {:hex, :tokenizers, "0.4.0", "140283ca74a971391ddbd83cd8cbdb9bd03736f37a1b6989b82d245a95e1eb97", [:mix], [{:castore, "~> 0.1 or ~> 1.0", [hex: :castore, repo: "hexpm", optional: false]}, {:rustler, ">= 0.0.0", [hex: :rustler, repo: "hexpm", optional: true]}, {:rustler_precompiled, "~> 0.6", [hex: :rustler_precompiled, repo: "hexpm", optional: false]}], "hexpm", "ef1a9824f5a893cd3b831c0e5b3d72caa250d2ec462035cc6afef6933b13a82e"},
+  "tzdata": {:hex, :tzdata, "1.1.1", "20c8043476dfda8504952d00adac41c6eda23912278add38edc140ae0c5bcc46", [:mix], [{:hackney, "~> 1.17", [hex: :hackney, repo: "hexpm", optional: false]}], "hexpm", "a69cec8352eafcd2e198dea28a34113b60fdc6cb57eb5ad65c10292a6ba89787"},
   "unicode_util_compat": {:hex, :unicode_util_compat, "0.7.0", "bc84380c9ab48177092f43ac89e4dfa2c6d62b40b8bd132b1059ecc7232f9a78", [:rebar3], [], "hexpm", "25eee6d67df61960cf6a794239566599b09e17e668d3700247bc498638152521"},
   "unifex": {:hex, :unifex, "1.1.0", "26b1bcb6c3b3454e1ea15f85b2e570aaa5b5c609566aa9f5c2e0a8b213379d6b", [:mix], [{:bunch, "~> 1.0", [hex: :bunch, repo: "hexpm", optional: false]}, {:bundlex, "~> 1.0", [hex: :bundlex, repo: "hexpm", optional: false]}, {:shmex, "~> 0.5.0", [hex: :shmex, repo: "hexpm", optional: false]}], "hexpm", "d8f47e9e3240301f5b20eec5792d1d4341e1a3a268d94f7204703b48da4aaa06"},
   "unpickler": {:hex, :unpickler, "0.1.0", "c2262c0819e6985b761e7107546cef96a485f401816be5304a65fdd200d5bd6a", [:mix], [], "hexpm", "e2b3f61e62406187ac52afead8a63bfb4e49394028993f3c4c42712743cab79e"},