* [pmg-devel] [PATCH pmg-gui 1/1] quarantine view: add option to switch to mobile view
2025-09-23 13:20 [pmg-devel] [PATCH pmg-gui/pmg-yew-quarantine-gui 0/2] quarantine: allow switching between mobile and desktop ui Dominik Csapak
@ 2025-09-23 13:20 ` Dominik Csapak
2025-09-23 15:21 ` Thomas Lamprecht
2025-09-23 13:20 ` [pmg-devel] [PATCH pmg-yew-quarantine-gui 1/1] spam list: add option menu Dominik Csapak
1 sibling, 1 reply; 5+ messages in thread
From: Dominik Csapak @ 2025-09-23 13:20 UTC (permalink / raw)
To: pmg-devel
by appending '?mobile=1' to the url
Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
js/QuarantineView.js | 14 ++++++++++++++
1 file changed, 14 insertions(+)
diff --git a/js/QuarantineView.js b/js/QuarantineView.js
index 496ed38..6a740b0 100644
--- a/js/QuarantineView.js
+++ b/js/QuarantineView.js
@@ -161,6 +161,12 @@ Ext.define('PMG.QuarantineView', {
PMG.Utils.doQuarantineAction(qa.action, qa.cselect);
},
+ switchToMobile: function () {
+ let params = new URLSearchParams(document.location.search);
+ params.set('mobile', '1');
+ document.location.search = params.toString();
+ },
+
control: {
'[reference=logoutButton]': {
click: 'logout',
@@ -171,6 +177,9 @@ Ext.define('PMG.QuarantineView', {
'[reference=themeButton]': {
click: 'changeTheme',
},
+ '[reference=mobileButton]': {
+ click: 'switchToMobile',
+ },
},
init: function (view) {
@@ -263,6 +272,11 @@ Ext.define('PMG.QuarantineView', {
text: gettext('Language'),
reference: 'languageButton',
},
+ {
+ iconCls: 'fa fa-mobile',
+ text: gettext('Switch to Mobile View'),
+ reference: 'mobileButton',
+ },
'-',
{
reference: 'logoutButton',
--
2.47.3
_______________________________________________
pmg-devel mailing list
pmg-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pmg-devel
^ permalink raw reply [flat|nested] 5+ messages in thread* [pmg-devel] [PATCH pmg-yew-quarantine-gui 1/1] spam list: add option menu
2025-09-23 13:20 [pmg-devel] [PATCH pmg-gui/pmg-yew-quarantine-gui 0/2] quarantine: allow switching between mobile and desktop ui Dominik Csapak
2025-09-23 13:20 ` [pmg-devel] [PATCH pmg-gui 1/1] quarantine view: add option to switch to mobile view Dominik Csapak
@ 2025-09-23 13:20 ` Dominik Csapak
2025-09-23 14:46 ` [pmg-devel] applied: " Thomas Lamprecht
1 sibling, 1 reply; 5+ messages in thread
From: Dominik Csapak @ 2025-09-23 13:20 UTC (permalink / raw)
To: pmg-devel
this contains options to
* change the language
* switch to the desktop view (by appending mobile=0 to the url)
* logout
Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
src/page_spam_list.rs | 81 +++++++++++++++++++++++++++++++++++++++++--
1 file changed, 78 insertions(+), 3 deletions(-)
diff --git a/src/page_spam_list.rs b/src/page_spam_list.rs
index bdea7a8..58d2541 100644
--- a/src/page_spam_list.rs
+++ b/src/page_spam_list.rs
@@ -1,6 +1,7 @@
use std::rc::Rc;
use anyhow::Error;
+use gloo_utils::document;
use js_sys::Date;
use wasm_bindgen::JsValue;
@@ -9,11 +10,12 @@ use yew::prelude::*;
use yew::virtual_dom::{VComp, VNode};
use yew_router::scope_ext::RouterScopeExt;
-use pwt::css::{ColorScheme, FlexFit, JustifyContent};
+use pwt::css::{AlignItems, ColorScheme, FlexFit, JustifyContent};
use pwt::prelude::*;
use pwt::touch::{ApplicationBar, Fab, Scaffold};
use pwt::widget::form::{Field, Form, FormContext, InputType};
-use pwt::widget::{Button, Column, Dialog, Image, Row, ThemeModeSelector};
+use pwt::widget::menu::{Menu, MenuButton, MenuItem};
+use pwt::widget::{Button, Column, Dialog, Image, LanguageSelector, Row, ThemeModeSelector};
use proxmox_subscription::{SubscriptionInfo, SubscriptionStatus};
use proxmox_yew_comp::http_get;
@@ -40,6 +42,7 @@ pub enum ViewState {
Normal,
ShowDialog,
ShowSubscriptionNotice,
+ ShowLanguageSelect,
}
pub struct PmgPageSpamList {
state: ViewState,
@@ -56,6 +59,9 @@ pub enum Msg {
CloseDialog,
ApplyDate,
SubscriptionResult(Result<SubscriptionInfo, Error>),
+ SwitchToDesktop,
+ ShowLanguageSelect,
+ Logout,
}
fn epoch_to_date_string(epoch: f64) -> String {
@@ -177,6 +183,27 @@ impl Component for PmgPageSpamList {
self.subscription_result = Some(valid);
true
}
+ Msg::SwitchToDesktop => {
+ let location = document().location().unwrap();
+ let param = match location.search() {
+ Ok(search) => web_sys::UrlSearchParams::new_with_str(&search).unwrap(),
+ Err(_) => web_sys::UrlSearchParams::new().unwrap(),
+ };
+ param.set("mobile", "0");
+ let search: String = param.to_string().into();
+ if let Err(err) = location.set_search(&search) {
+ log::error!("could not set location parameter: {err:?}");
+ }
+ false
+ }
+ Msg::ShowLanguageSelect => {
+ self.state = ViewState::ShowLanguageSelect;
+ true
+ }
+ Msg::Logout => {
+ proxmox_yew_comp::http_clear_auth();
+ true
+ }
}
}
@@ -209,6 +236,18 @@ impl Component for PmgPageSpamList {
)
.on_close(ctx.link().callback(|_| Msg::CloseDialog)),
),
+ ViewState::ShowLanguageSelect => Some(
+ Dialog::new(tr!("Select Language"))
+ .with_child(
+ Row::new()
+ .class(AlignItems::Center)
+ .padding(4)
+ .gap(2)
+ .with_child(tr!("Language"))
+ .with_child(LanguageSelector::new()),
+ )
+ .on_close(ctx.link().callback(|_| Msg::CloseDialog)),
+ ),
};
let fab = Fab::new("fa fa-calendar").on_activate(ctx.link().callback(|_| Msg::ShowDialog));
@@ -240,7 +279,43 @@ impl Component for PmgPageSpamList {
.class("pwt-navbar-brand"),
)
.title("Mail")
- .with_action(ThemeModeSelector::new()),
+ .with_action(
+ Row::new()
+ .gap(1)
+ .with_child(ThemeModeSelector::new())
+ .with_child(
+ MenuButton::new("")
+ .class("circle")
+ .icon_class("fa fa-bars")
+ .menu(
+ Menu::new()
+ .with_item(
+ MenuItem::new(tr!("Language"))
+ .icon_class("fa fa-language")
+ .on_select(
+ ctx.link()
+ .callback(|_| Msg::ShowLanguageSelect),
+ ),
+ )
+ .with_item(
+ MenuItem::new(tr!("Switch to Desktop View"))
+ .icon_class("fa fa-desktop")
+ .on_select(
+ ctx.link()
+ .callback(|_| Msg::SwitchToDesktop),
+ ),
+ )
+ .with_separator()
+ .with_item(
+ MenuItem::new(tr!("Logout"))
+ .icon_class("fa fa-sign-out")
+ .on_select(
+ ctx.link().callback(|_| Msg::Logout),
+ ),
+ ),
+ ),
+ ),
+ ),
)
.body(
Column::new()
--
2.47.3
_______________________________________________
pmg-devel mailing list
pmg-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pmg-devel
^ permalink raw reply [flat|nested] 5+ messages in thread