feat(chat): shot timestamp in correct timezone

This commit is contained in:
João Paulo Dubas 2024-10-31 00:08:29 +00:00
parent e37ad5b0c9
commit e342814550
Signed by: joao.dubas
SSH Key Fingerprint: SHA256:V1mixgOGRc/YMhGx/DNkOSmJxgA2vHNrDZEk3wt/kOA
2 changed files with 21 additions and 6 deletions

View File

@ -25,7 +25,10 @@ import topbar from "../vendor/topbar"
let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content") let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content")
let liveSocket = new LiveSocket("/live", Socket, { let liveSocket = new LiveSocket("/live", Socket, {
longPollFallbackMs: 2500, longPollFallbackMs: 2500,
params: {_csrf_token: csrfToken} params: {
_csrf_token: csrfToken,
timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
}
}) })
// Show progress bar on live navigation and form submits // Show progress bar on live navigation and form submits

View File

@ -87,7 +87,12 @@ defmodule SlaxWeb.ChatRoomLive do
</ul> </ul>
</div> </div>
<div id="room-messages" class="flex flex-col flex-grow overflow-auto" phx-update="stream"> <div id="room-messages" class="flex flex-col flex-grow overflow-auto" phx-update="stream">
<.message :for={{dom_id, message} <- @streams.messages} dom_id={dom_id} message={message} /> <.message
:for={{dom_id, message} <- @streams.messages}
dom_id={dom_id}
message={message}
timezone={@timezone}
/>
</div> </div>
<div class="h-12 bg-white px-4 pb-4"> <div class="h-12 bg-white px-4 pb-4">
<.form <.form
@ -119,7 +124,9 @@ defmodule SlaxWeb.ChatRoomLive do
def mount(_params, _session, socket) do def mount(_params, _session, socket) do
rooms = Chat.list_rooms() rooms = Chat.list_rooms()
{:ok, assign(socket, hide_topic?: false, rooms: rooms)} timezone = get_connect_params(socket)["timezone"]
{:ok, assign(socket, hide_topic?: false, rooms: rooms, timezone: timezone)}
end end
@impl Phoenix.LiveView @impl Phoenix.LiveView
@ -194,6 +201,7 @@ defmodule SlaxWeb.ChatRoomLive do
attr :dom_id, :string, required: true attr :dom_id, :string, required: true
attr :message, Message, required: true attr :message, Message, required: true
attr :timezone, :string, required: true
defp message(assigns) do defp message(assigns) do
~H""" ~H"""
@ -204,7 +212,9 @@ defmodule SlaxWeb.ChatRoomLive do
<.link class="text-sm font-semibold hover:underline"> <.link class="text-sm font-semibold hover:underline">
<span><%= username(@message.user) %></span> <span><%= username(@message.user) %></span>
</.link> </.link>
<span class="ml-1 text-xs text-gray-500"><%= message_timestamp(@message) %></span> <span :if={@timezone} class="ml-1 text-xs text-gray-500">
<%= message_timestamp(@message, @timezone) %>
</span>
<p class="text-sm"><%= @message.body %></p> <p class="text-sm"><%= @message.body %></p>
</div> </div>
</div> </div>
@ -216,8 +226,10 @@ defmodule SlaxWeb.ChatRoomLive do
user.email |> String.split("@") |> List.first() |> String.capitalize() user.email |> String.split("@") |> List.first() |> String.capitalize()
end end
defp message_timestamp(message) do defp message_timestamp(message, timezone) do
Timex.format!(message.inserted_at, "%-l:%M %p", :strftime) message.inserted_at
|> Timex.Timezone.convert(timezone)
|> Timex.format!("%-l:%M %p", :strftime)
end end
defp assign_message_form(socket, changeset) do defp assign_message_form(socket, changeset) do