Stream-enabled view/component with filtering - how?

Over the past couple of weeks I’ve seen the same question asked a few times:

how do you go about resetting (restarting) a stream-enabled list of items in LiveView 0.18.x.

I’ll try to present it as a use case scenario.

A filtering input box lets one to filter a list of grocery items. Filtering should happen on-the-fly (phx-change with debouncing.)

In the meantime availability of each item is coming externally and visually hints every user of a “5 only left” or “none left”, etc. in real time. So the items only disappear during filtering.

I’m seeing a huge benefit in implementing it as a stream. But I really struggle with a straightforward solution.

How would I reset the stream and start fresh after a filter update while maintaining focus and the cursor position inside the filter input box?

Have you tried assigning the stream again when you want to reset it?

Oh, most certainly.

It’s resulting in ** (ArgumentError) existing hook <name of the stream atom> already attached on :after_render.

Someone else’s similar struggle:

A BIG thanks to the LiveView team for introducing managed lists (streams) - #9 by addstar

Alright the solution seems to be coming!