all lists on lists.proxmox.com
 help / color / mirror / Atom feed
* [pmg-devel] [PATCH pmg-gui/pmg-yew-quarantine-gui 0/2] quarantine: allow switching between mobile and desktop ui
@ 2025-09-23 13:20 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 ` [pmg-devel] [PATCH pmg-yew-quarantine-gui 1/1] spam list: add option menu Dominik Csapak
  0 siblings, 2 replies; 5+ messages in thread
From: Dominik Csapak @ 2025-09-23 13:20 UTC (permalink / raw)
  To: pmg-devel

by introducing an option in the desktop gui in the drop down menu on the
top right, and adding such a menu on the mobile view too (which also
adds a logout and language selection option)

pmg-gui:

Dominik Csapak (1):
  quarantine view: add option to switch to mobile view

 js/QuarantineView.js | 14 ++++++++++++++
 1 file changed, 14 insertions(+)


pmg-yew-quarantine-gui:

Dominik Csapak (1):
  spam list: add option menu

 src/page_spam_list.rs | 81 +++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 78 insertions(+), 3 deletions(-)


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

-- 
Generated by git-murpp 0.8.1


_______________________________________________
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-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

* [pmg-devel] applied: [PATCH pmg-yew-quarantine-gui 1/1] spam list: add option menu
  2025-09-23 13:20 ` [pmg-devel] [PATCH pmg-yew-quarantine-gui 1/1] spam list: add option menu Dominik Csapak
@ 2025-09-23 14:46   ` Thomas Lamprecht
  0 siblings, 0 replies; 5+ messages in thread
From: Thomas Lamprecht @ 2025-09-23 14:46 UTC (permalink / raw)
  To: pmg-devel, Dominik Csapak

On Tue, 23 Sep 2025 15:20:08 +0200, Dominik Csapak wrote:
> this contains options to
> * change the language
> * switch to the desktop view (by appending mobile=0 to the url)
> * logout
> 
> 

Applied, thanks!

One thing to improve would be to navigate to the spam quarantine list in the
ExtJS UI if the route in the hash is empty, as otherwise one sees a blank panel
when clicking the link here. While we could also set the hash to
'#pmgSpamQuarantine' here in the Yew UI, IMO it would be a slightly better fit
to adapt the ExtJS one, to avoid coupling between them.

[1/1] spam list: add option menu
      commit: c5ce8a49c8f266df103b44dd255345fbda0fa499


_______________________________________________
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

* Re: [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 1/1] quarantine view: add option to switch to mobile view Dominik Csapak
@ 2025-09-23 15:21   ` Thomas Lamprecht
  0 siblings, 0 replies; 5+ messages in thread
From: Thomas Lamprecht @ 2025-09-23 15:21 UTC (permalink / raw)
  To: pmg-devel, Dominik Csapak

On Tue, 23 Sep 2025 15:20:07 +0200, Dominik Csapak wrote:
> by appending '?mobile=1' to the url
> 
> 

Applied, thanks!

Also made a follow-up to listen to the 'unmatchedroute' event [0] and redirect
that to the default 'pmgSpamQuarantine' route, which addresses the comment I
made on the yew patch of this series.

[0]: https://docs.sencha.com/extjs/7.0.0/classic/Ext.app.ViewController.html#cfg-routes

[1/1] quarantine view: add option to switch to mobile view
      commit: 92901e9120f79522b9d4115b49a0527df08b9531


_______________________________________________
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

end of thread, other threads:[~2025-09-23 15:24 UTC | newest]

Thread overview: 5+ messages (download: mbox.gz / follow: Atom feed)
-- links below jump to the message on this page --
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 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
2025-09-23 14:46   ` [pmg-devel] applied: " Thomas Lamprecht

This is an external index of several public inboxes,
see mirroring instructions on how to clone and mirror
all data and code used by this external index.
Service provided by Proxmox Server Solutions GmbH | Privacy | Legal