Auto close certain toast messages based on setting

[elfjes]

No description provided.

[hmpf]

LGTM but @podliashanyk should have a say.

[podliashanyk]

I haven't run the code yet to check the rendered HTML. But I suggest that we drop the approach with opacity completely. It will make the toast transparent but it is still present and will take up space in the DOM (just check with 2 alerts, one that is "removed" and 1 that is not). But what is worse is that since it is now transparent the user can't see it to close it. So it is potentially permanently there.
I still think that using the remove me HTMX extension approach is perfect for this use case.

[elfjes]

I haven't run the code yet to check the rendered HTML. But I suggest that we drop the approach with opacity completely. It will make the toast transparent but it is still present and will take up space in the DOM (just check with 2 alerts, one that is "removed" and 1 that is not). But what is worse is that since it is now transparent the user can't see it to close it. So it is potentially permanently there. I still think that using the remove me HTMX extension approach is perfect for this use case.

the hyperscript reads:

on load wait {{ autoclose }}s then add .autoclosing to me then wait 0.3s then remove me

so it will first add the autoclosing (which transitions in 0.25s), and then will remove the element completely :)

the opacity change is just for making a nice transition

[podliashanyk]

I haven't run the code yet to check the rendered HTML. But I suggest that we drop the approach with opacity completely. It will make the toast transparent but it is still present and will take up space in the DOM (just check with 2 alerts, one that is "removed" and 1 that is not). But what is worse is that since it is now transparent the user can't see it to close it. So it is potentially permanently there. I still think that using the remove me HTMX extension approach is perfect for this use case.

the hyperscript reads:

on load wait {{ autoclose }}s then add .autoclosing to me then wait 0.3s then remove me

so it will first add the autoclosing (which transitions in 0.25s), and then will remove the element completely :)

the opacity change is just for making a nice transition

Right... didn't notice the hyperscript 🙃 OK, that promises the remove-me extension functionality then