tomkonidas

tomkonidas

Phoenix LiveView Stream API for inserting many

After playing around with stream/4 and reading up on all the new LV features, I was tasked at work with making an infinite scroll page. I thought it was the perfect candidate to try this new functionality out.

It was really easy to implement following the docs, the only thing i feel is missing is a way to insert many items to the stream. (think when you reach the bottom of the viewport and you want to load another 20 items).

We only have stream_insert/4 which works with 1 item at a time.

I added this to the project but wanted to know if anyone has been thinking about this as I feel we should have something like this directly from the Stream API.

@type socket :: Phoenix.LiveView.Socket.t()

@doc """
Inserts items or updates existing items in the stream.
See `Phoenix.LiveView.stream_insert/4` for opts.
"""
@spec stream_insert_many(socket(), atom(), list(), keyword()) :: socket()
def stream_insert_many(socket, name, items, opts \\ []) do
  Enum.reduce(items, socket, fn item, acc ->
    Phoenix.LiveView.stream_insert(acc, name, item, opts)
  end)
end

Has anyone else needed to do something like this?
Id gladly work on a PR if this is of interest to the community

First 10 of 12 Posts Switch mode

woylie

woylie

That would make sense to me. The function could be called stream_insert_all as well.

I tried to implement regular pagination using streams, where all items are replaced when you change the page. The solution in short was:

  • use dom ID based on index, not based on the item
  • reduce over the new items the same way as you do in your stream_insert_many function
  • to clear out extra items if the new page has less items than the previous one, reduce over the unused indexes to delete those extra items

In that scenario, it would have been useful to have both stream_insert_all and stream_delete_all_by_dom_id

Even more useful would be a stream_reset to delete all items. With that, I wouldn’t have to use index-based dom IDs.

Instead of adding new *_all functions, the existing ones could also be updated to accept either a single item or a list of items.

aiwaiwa

aiwaiwa

Thank you for mentioning that. Trying to implement sorting and filtering and can’t figure it out

chrismccord

chrismccord

Creator of Phoenix

emptying a stream is on my todo list, but it didn’t make the cut for the last release :slight_smile:

27
Post #3
aiwaiwa

aiwaiwa

Thank you so for much for doing that!
I’ll make sure to point folks to your reply as this Q continues to popup.

tomkonidas

tomkonidas OP

Is there anything on the roadmap for inserting many items at a time?

barkerja

barkerja

cjbottaro

cjbottaro

I’m also here looking for a way to clear a stream. I figured just recreating it would do that, but got that “hook already defined” error.

I also want this feature, but here’s what I’m doing in the meantime…

  def live_view do
    quote do
      use Phoenix.LiveView,
        layout: {Web.Scholarship.Layouts, :app}

      import Phoenix.LiveView, except: [
        stream_insert: 3,
        stream_insert: 4
      ]

      def stream_insert(socket, name, item_or_items, opts \\ [])

      def stream_insert(socket, name, items, opts) when is_list(items) do
        Enum.reduce(items, socket, fn item, socket ->
          stream_insert(socket, name, item, opts)
        end)
      end

      def stream_insert(socket, name, item, opts) do
        Phoenix.LiveView.stream_insert(socket, name, item, opts)
      end

      unquote(html_helpers())
    end
  end
akaibukai

akaibukai

Very clever to “hijack” like that. reminds me of monkey patching stuffs in Rails, but here it’s way more under control. I like it!

I also think that if we can handle many inserts it should be with the exact same function stream_insert and not bother with extra function, after all we’re in Elixir realm where pattern matching is a thing, isn’t it?

akaibukai

akaibukai

Yes. Please, only suggest that option :smiling_face:

bkilshaw

bkilshaw

Any chance stream_reset is in the works? I’ve been using streams the last couple of days and the two big features that appear to be missing are bulk inserts (lower priority since there’s easy work arounds) and stream resets.

In my case I have a list of posts with filters. The issue is that updating a filter requires clearing out any existing results and populating with the new ones, but that doesn’t appear to be possible right now. I can’t stream_delete since I don’t have the old results, and I can’t start a new stream since that throws an error.

stream_reset(socket, :posts) would work great, or even having stream empty out existing streams first, allowing you to overwrite the stream with a new one.

Edit: Nevermind, looks like the work is done :slight_smile:

Where Next?

Trending in Discussions Top

AstonJ
As the title says, please share what you’ve been up to with Elixir. Whether that’s been learning it, looking into it, making stuff with i...
2977 91561 914
New
byu
@chrismccord : I just saw the Extract AGENTS.md from Phoenix.new into phx.new generator commit to the phoenix project. My initial shotgu...
New
arcanemachine
I was working on an Ecto migration and I needed a timestamp. So, for the nth time, I looked up the different data types for timestamps, a...
New
AstonJ
Just a general thread to post chat/news/info relating to AI/ML stuff that may be relevant for Nx now or in the future. Got anything to sh...
New
type1fool
I just stumbled on a newly redesigned elixir-lang.org. :tada: It looks like @Software_Mansion did the work, and I think it is generally a...
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
alexslade
Fly’s CEO posted this recently - Turn And Face The Strange · The Fly Blog It says that Fly is going all-in on sprites, which is a worry ...
New

Other Trending Topics Top

JesseHerrick
Hey, I’m Jesse and I’m the main contributor behind Dexter, a full-featured, lightning-fast Elixir LSP optimized for large codebases. It s...
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
Damirados
Hello everyone. After busy few months I am happy to announce v0.1.0 of Emerge & Solve. They are GUI (Emerge) and State management (S...
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
akoutmos
@hugobarauna and I (Alex Koutmos) have been hard at work on writing a book on Nerves that takes you from simply blinking LEDs to building...
New
wintermeyer
There are three potential reasons for members of this forum to have a look at https://vutuv.de You are tired or annoyed of LinkedIn. Yo...
New

We're in Beta

About us Mission Statement