TenTakano

TenTakano

I’m currently developing an application using Phoenix LiveView and encountering an issue with handling a large amount of data fetched from the database. I’ve decided to use streams to manage this data due to its volume. To reuse the layout for displaying the data, I am utilizing LiveView Components.

I have designed the components to contain the streams internally. I use send_update/2 from outside the component to send incremental updates, which are intended to be appended within the component. Initially, everything displays as expected. However, when I send additional data later, the contents of the stream seem to reset, causing previously displayed data to disappear from the view.

I have checked socket.assign inside the update/2 of the component, and it appears empty at this point. Are there any restrictions on using streams within LiveView Components, or could there be another cause for this behavior?

Any guidance or suggestions on how to resolve this would be greatly appreciated.

Elixir: 1.17.2-otp-27
Phoenix: v1.7.14
liveview: 1.0.0-rc.6

Here is the code for the component. I’ve omitted the rendering part, but this includes all the function definitions.

defmodule MyAppWeb.DataViewerComponent do
  use MyAppWeb, :live_component

  @impl true
  def render(assigns) do
    ~H"""
    <div class="w-full">
      <%= for {_id, item} <- @streams.items do %>
        ...
      <% end %>
    </div>
    """
  end

  @impl true
  def mount(socket) do
    {:ok, stream(socket, :items, [])}
  end

  @impl true
  def update(%{msg: msg}, socket), do: {:ok, update_stream(socket, msg)}

  @impl true
  def update(assigns, socket), do: {:ok, assign(socket, assigns)}

  defp update_stream(socket, {:update, items}), do: stream(socket, :items, items)
  defp update_stream(socket, {:reset, items}), do: stream(socket, :items, items, reset: true)

Additionally, this is the code for the parent that handles the updates.

  def notify_update(msg) do
    send_update(ImagineWeb.TimelineComponent, id: "timeline", msg: msg)
  end

P.S.: I believe there are no additions, deletions, or state changes occurring in the DOM where this component is included.

Thanks!

Showing Posts 1 to 4

LostKobrakai

LostKobrakai

It might be that your whole LiveComponent is remounted instead of updated. You can check if mount/1 is called again or not.

TenTakano

TenTakano OP

Thank you for your advice. But unfortunately mount/1 is called only once. I’ve checked it with IO.inspect/2.

thiagomajesk

thiagomajesk

Hi @TenTakano! Welcome to the forums :wave:.
Quick question: where is your phx-update="stream" defined?

TenTakano

TenTakano OP

where is your phx-update="stream" defined?

Thank you so much!! I realized my misunderstanding.
Actually, I didn’t write phx-update to the markup. Now, the application works properly.

— All posts loaded —

Where Next? Top

Trending in Questions Top

water
I’m aware of 2 such projects, are there others? git: GitHub - team-alembic/realworld: A fullstack Phoenix LiveView application with back...
New
katta
I having some trouble figuring out if I have set myself too strict of standards for my production server. Currently I can handle 75% of r...
New
peck
Hi everyone. My team and I have been working on a fairly modest app based around video streaming and chat, but we’ve landed a customer t...
New
bradley
I really like the adapter patterns that ecto, nebulex, waffle, etc. use and would love find something similar for a key management servic...
New
unaware8150
Hello folks! So at work, we are seeing some situations where we have to define some “fixed” strings that are used across the codebase in...
New
Alvinkariuki
How Can I Optimise Compile Time Dependencies I have been building an elixir application for about 2 years now. Many modules and files ha...
New
leoschweizer
Hi, we run different LLM models across a cluster, with each node loading a configurable subset. Model-specific queues let nodes consume ...
New

Other Trending Topics Top

KristerV
Hey. Is there anyone here who creates agents in their apps? Not talking about using agents, but creating them. I’m finding it pretty diff...
New
mudasobwa
I fully migrated to my own harness from Anthropic/Gemini and I think it’s time to share it. Welcome DSH, the DeepSeek Harness, fully writ...
New
jimsynz
Beam Bots (or just BB for short) is a framework for building fault-tolerant robotics applications in Elixir using familiar OTP patterns. ...
New
juhalehtonen
There has been a thread to discuss the Stack Overflow Developer Survey on this forum every year since 2018, so here’s yet another one for...
New
budgie
I love Elixir. It’s one of 2 programming languages I’ve ever fallen in love with. But I don’t use it anymore. Serverless was the promis...
New
ausimian
Emily is an Elixir library that runs Nx computations on Apple’s MLX. Install it as the default Nx backend and Nx, defn, Axon, Nx.Serving,...
New

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews