[PATCH pmg-yew-quarantine-gui/yew-widget-toolkit 0/2] pmg mobile quarantine: work around weird chrome behavior in slidable

[PATCH pmg-yew-quarantine-gui/yew-widget-toolkit 0/2] pmg mobile quarantine: work around weird chrome behavior in slidable

[Dominik Csapak]

In the current version of the pmg mobile quarantine, chrome behaves weridly
with the slidable actions (not rendering text when it should).

Probably a browser issue since it works in firefox, but sending two
patches that fix the problem.

Either of the patches should be fine, so for now the pmg quarantine patch
is the easier way. But fixing it directly in pwt avoids having this issue
in the future (potentially).


proxmox-yew-widget-toolkit:

Dominik Csapak (1):
  slidable: revert markup with old `x_actions` interface

 src/touch/slidable/mod.rs | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)


pmg-yew-quarantine-gui:

Dominik Csapak (1):
  spam list: use new slidable interface

 Cargo.toml       |  2 +-
 src/spam_list.rs | 54 ++++++++++++++++++++----------------------------
 2 files changed, 23 insertions(+), 33 deletions(-)


Summary over all repositories:
  3 files changed, 35 insertions(+), 35 deletions(-)

-- 
Generated by murpp 0.11.0

[PATCH yew-widget-toolkit 1/2] slidable: revert markup with old `x_actions` interface

[Dominik Csapak]

Curently the slidable is used with `left_actions` where a `Row` gets
used when adding multiple actions. Since
 ae9c35e (touch: slidable: improve action interface)

This results in two nested Rows with flex layout, which triggers what is
seemingly a browser bug in Chrome/Chromium where none of the text is
rendered until some layout changes. (The exact cause/reason is yet to be
determined).

To restore the original behavior, check the lenght of th action list and
use a normal container when it's a single item, and setting flex
display and direction when there are multiple.

Fixes: ae9c35e (touch: slidable: improve action interface)
Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 src/touch/slidable/mod.rs | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/touch/slidable/mod.rs b/src/touch/slidable/mod.rs
index 44c034e..e570529 100644
--- a/src/touch/slidable/mod.rs
+++ b/src/touch/slidable/mod.rs
@@ -218,8 +218,13 @@ impl PwtSlidable {
         Row::new()
             .class("pwt-w-100 pwt-h-100")
             .with_child(
-                Row::new()
+                Container::new()
                     .height(CssLength::Fraction(1.0))
+                    .class(if actions.len() > 1 {
+                        Some(classes!(css::FlexDirection::Row, css::Display::Flex))
+                    } else {
+                        None
+                    })
                     .min_width(0)
                     .style("flex", "0 1 auto")
                     .children(actions)
@@ -244,7 +249,12 @@ impl PwtSlidable {
             .class("pwt-w-100 pwt-h-100")
             .with_child(html! {<div style="flex: 1 1 auto;"></div>})
             .with_child(
-                Row::new()
+                Container::new()
+                    .class(if actions.len() > 1 {
+                        Some(classes!(css::FlexDirection::Row, css::Display::Flex))
+                    } else {
+                        None
+                    })
                     .height(CssLength::Fraction(1.0))
                     .min_width(0)
                     .style("flex", "0 1 auto")
-- 
2.47.3

[PATCH pmg-yew-quarantine-gui 2/2] spam list: use new slidable interface

[Dominik Csapak]

the slidable widget has a new 'with_x_action' interface which makes it
obsolete to create an inline row here.

In addition to be a better interface and having less code here, it works
around a browser bug with nested Rows in pwt 0.8.8.

Since this new interface is only available in 0.8.8, bump the version in
Cargo.toml too.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 Cargo.toml       |  2 +-
 src/spam_list.rs | 54 ++++++++++++++++++++----------------------------
 2 files changed, 23 insertions(+), 33 deletions(-)

diff --git a/Cargo.toml b/Cargo.toml
index 4ded122..7f62243 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -25,7 +25,7 @@ proxmox-schema = "5"
 proxmox-uuid = "1"
 proxmox-subscription = { version = "1", features = ["api-types"], default-features = false }
 
-pwt = "0.8"
+pwt = "0.8.8"
 pwt-macros = "0.5"
 
 proxmox-login = "1"
diff --git a/src/spam_list.rs b/src/spam_list.rs
index 7a34df8..95a0611 100644
--- a/src/spam_list.rs
+++ b/src/spam_list.rs
@@ -319,39 +319,29 @@ fn render_list_item(
                         }
                     }
                 })
-                .left_actions(
-                    Row::new()
-                        .style("height", "100%") // FIXME better solved in scss of slidable?
-                        .class(AlignItems::Center)
-                        .with_child(
-                            SlidableAction::new(tr!("Deliver"))
-                                .class(ColorScheme::SuccessContainer)
-                                .icon_class("fa fa-paper-plane")
-                                .on_activate(make_cb(MailAction::Deliver)),
-                        )
-                        .with_child(
-                            SlidableAction::new(tr!("Welcomelist"))
-                                .icon_class("fa fa-check")
-                                .on_activate(make_cb(MailAction::Welcomelist)),
-                        )
-                        .with_child(seen_action),
+                .with_left_action(
+                    SlidableAction::new(tr!("Deliver"))
+                        .class(ColorScheme::SuccessContainer)
+                        .icon_class("fa fa-paper-plane")
+                        .on_activate(make_cb(MailAction::Deliver)),
                 )
-                .right_actions(
-                    Row::new()
-                        .style("height", "100%") // FIXME better solved in scss of slidable?
-                        .class(AlignItems::Center)
-                        .with_child(
-                            SlidableAction::new(tr!("Blocklist"))
-                                .class(ColorScheme::WarningContainer)
-                                .icon_class("fa fa-times")
-                                .on_activate(make_cb(MailAction::Blocklist)),
-                        )
-                        .with_child(
-                            SlidableAction::new(tr!("Delete"))
-                                .class(ColorScheme::ErrorContainer)
-                                .icon_class("fa fa-trash")
-                                .on_activate(make_cb(MailAction::Delete)),
-                        ),
+                .with_left_action(
+                    SlidableAction::new(tr!("Welcomelist"))
+                        .icon_class("fa fa-check")
+                        .on_activate(make_cb(MailAction::Welcomelist)),
+                )
+                .with_left_action(seen_action)
+                .with_right_action(
+                    SlidableAction::new(tr!("Blocklist"))
+                        .class(ColorScheme::WarningContainer)
+                        .icon_class("fa fa-times")
+                        .on_activate(make_cb(MailAction::Blocklist)),
+                )
+                .with_right_action(
+                    SlidableAction::new(tr!("Delete"))
+                        .class(ColorScheme::ErrorContainer)
+                        .icon_class("fa fa-trash")
+                        .on_activate(make_cb(MailAction::Delete)),
                 )
                 .into()
         }
-- 
2.47.3

applied: [PATCH pmg-yew-quarantine-gui/yew-widget-toolkit 0/2] pmg mobile quarantine: work around weird chrome behavior in slidable

[Thomas Lamprecht]

On Wed, 10 Jun 2026 14:39:08 +0200, Dominik Csapak wrote:
> In the current version of the pmg mobile quarantine, chrome behaves weridly
> with the slidable actions (not rendering text when it should).
> 
> Probably a browser issue since it works in firefox, but sending two
> patches that fix the problem.
> 
> Either of the patches should be fine, so for now the pmg quarantine patch
> is the easier way. But fixing it directly in pwt avoids having this issue
> in the future (potentially).
> 
> [...]

Applied, split out the cargo.toml dependency update for pwt 0.8.8 to an upfront
commit as the last bump already was build for that, so this here and the commit
message was a bit confusing, thanks!

Did also apply pwt, but not bump that one yet, as this isn't really used
anywhere else (in our production UIs) yet.

[1/1] spam list: use new slidable interface
      commit: cd12fab871a8028e216e9ae1d1c77606bc62ed2b

[pwt]:

[1/1] slidable: revert markup with old `x_actions` interface
      commit: 06d858f455dbc1993d622f96a7a5cdc8c40bd4d1