You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Note: this is not a bug, but AFAIK a lack of means to properly address this very common use case by using strictly LiveView JS commands.
The UC:
We have a container component, say a stream, with items. We need to transition away the items when deleted individually, but we also need no transition taking place when navigating to another page or when having the container component/element itself removed for any reason.
AFAIK, the current options at hand are as follows (and I hope I am missing something):
a) We can set the phx-remove with a JS.hide transition for the items and another phx-remove for the container with its own JS.hide transition set to duration and time of 1 or 0ms to suppress the transition effect of the children; OR
b) We can try having no phx-remove on items and use stream_delete instead of stream_delete_by_dom_id and thus supply the item transition phx-remove (haven't tried this one yet, but it should work judging by the docs); OR
c) We can have the items have a phx-remove with the deletion transition that is contingent on a flag (an assign).
The issue is that:
a) only suppresses the transition effect of the items but it still preserves the delay resulting from their transitions thus making it look as if LiveView is doing something, while it's only waiting for the suppressed transition to be over;
b) is a problem because we usually don't maintain the state of each streamed item as a whole (for the sole purpose to use it with the stream_delete function) and this approach would force us to do so - thus defying the very stateless intent of the streams;
c) is just a hack that can only work with on-page controls and will not work with the back button or page refresh, as it can only be done so that the individual items' phx-remove is set to the deletion transition by default, while the flag is there to remove this prior to a navigation (and this phx-remove switching need be done in javascript, e.g. AlpineJS).
In my view, the issue can be solved by either introducing a JS-side state mechanism (that can be set at the container level and acted upon at the item level) OR by simply adding an option with a one-off phx-remove definition to the stream_delete_by_dom_id.
Again, I hope I'm being wrong in assessing the possibilities at hand.
The text was updated successfully, but these errors were encountered:
Note: this is not a bug, but AFAIK a lack of means to properly address this very common use case by using strictly LiveView
JS
commands.The UC:
We have a container component, say a stream, with items. We need to transition away the items when deleted individually, but we also need no transition taking place when navigating to another page or when having the container component/element itself removed for any reason.
AFAIK, the current options at hand are as follows (and I hope I am missing something):
a) We can set the
phx-remove
with aJS.hide
transition for the items and anotherphx-remove
for the container with its ownJS.hide
transition set to duration and time of 1 or 0ms to suppress the transition effect of the children; ORb) We can try having no
phx-remove
on items and usestream_delete
instead ofstream_delete_by_dom_id
and thus supply the item transitionphx-remove
(haven't tried this one yet, but it should work judging by the docs); ORc) We can have the items have a
phx-remove
with the deletion transition that is contingent on a flag (an assign).The issue is that:
a) only suppresses the transition effect of the items but it still preserves the delay resulting from their transitions thus making it look as if LiveView is doing something, while it's only waiting for the suppressed transition to be over;
b) is a problem because we usually don't maintain the state of each streamed item as a whole (for the sole purpose to use it with the
stream_delete
function) and this approach would force us to do so - thus defying the very stateless intent of the streams;c) is just a hack that can only work with on-page controls and will not work with the back button or page refresh, as it can only be done so that the individual items'
phx-remove
is set to the deletion transition by default, while the flag is there to remove this prior to a navigation (and thisphx-remove
switching need be done in javascript, e.g. AlpineJS).In my view, the issue can be solved by either introducing a JS-side state mechanism (that can be set at the container level and acted upon at the item level) OR by simply adding an option with a one-off
phx-remove
definition to thestream_delete_by_dom_id
.Again, I hope I'm being wrong in assessing the possibilities at hand.
The text was updated successfully, but these errors were encountered: