feat(chat): use streams to show messages

This commit is contained in:
João Paulo Dubas 2024-10-30 23:39:56 +00:00
parent a13a47a697
commit af2c4e4e95
Signed by: joao.dubas
SSH Key Fingerprint: SHA256:V1mixgOGRc/YMhGx/DNkOSmJxgA2vHNrDZEk3wt/kOA

View File

@ -86,8 +86,8 @@ defmodule SlaxWeb.ChatRoomLive do
<% end %>
</ul>
</div>
<div class="flex flex-col flex-grow overflow-auto">
<.message :for={message <- @messages} message={message} />
<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} />
</div>
<div class="h-12 bg-white px-4 pb-4">
<.form
@ -137,7 +137,8 @@ defmodule SlaxWeb.ChatRoomLive do
{:noreply,
socket
|> assign(hide_topic?: false, messages: messages, page_title: "# #{room.name}", room: room)
|> assign(hide_topic?: false, page_title: "# #{room.name}", room: room)
|> stream(:messages, messages, reset: true)
|> assign_message_form(Chat.change_message(%Message{}))}
end
@ -160,7 +161,7 @@ defmodule SlaxWeb.ChatRoomLive do
case Chat.create_message(room, user, message_params) do
{:ok, message} ->
socket
|> update(:messages, &(&1 ++ [message]))
|> stream_insert(:messages, message)
|> assign_message_form(Chat.change_message(%Message{}))
{:error, changeset} ->
@ -191,11 +192,12 @@ defmodule SlaxWeb.ChatRoomLive do
"""
end
attr :dom_id, :string, required: true
attr :message, Message, required: true
defp message(assigns) do
~H"""
<div class="relative flex px-4 py-3">
<div id={@dom_id} class="relative flex px-4 py-3">
<div class="h-10 w-10 rounded flex-shrink-0 bg-slate-300"></div>
<div class="ml-2">
<div class="-mt-1">