feat(chat): use streams to show messages
This commit is contained in:
parent
a13a47a697
commit
af2c4e4e95
@ -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">
|
||||
|
Loading…
x
Reference in New Issue
Block a user