[pdm-devel] [PATCH datacenter-manager/yew-comp v3 0/3] add node status panel to proxmox datacenter manager

[pdm-devel] [PATCH datacenter-manager/yew-comp v3 0/3] add node status panel to proxmox datacenter manager

[Shannon Sterz]

this series slightly adapts the previously applied node status panel and
integrates it into pdm. the first commit changes the way we display
kernel version, dropping the preempt mode and similar information to get
this more aligned with pve/pbs. the second patches removes and adapts
the tools of the NodeStatusPanel to make it less crowded. the final
commit adds a new tab to the "Administration" menu that shows the
current node status and allows for shutting down or rebotting the node.

Changelog
---------

changes since v2:

- parts of this series got applied already (thanks @ Thomas Lamprecht)
- add a patch adapting the way we render the kernel version (thanks @
  Thomas Lamprecht & Lukas Wagner)
- make the node status panel a panel in a new "Node Status" tab in der
  "Administration" menu instead of a widget

changes since v1:

- move the node status panel to its own widget type in pdm
- properly import api feature (thanks @ Dominik Csapak)
- smaller clean ups (thanks @ Dominik Csapak)



proxmox-yew-comp:

Shannon Sterz (2):
  node_info: only use build date from kernel version
  node status panel: remove power management and make fingerprint opt-in

 src/node_info.rs         |  4 ++-
 src/node_status_panel.rs | 70 ++++++++++------------------------------
 2 files changed, 20 insertions(+), 54 deletions(-)


proxmox-datacenter-manager:

Shannon Sterz (1):
  ui: add a Node Status tab to the administration panel

 ui/src/administration/mod.rs         |   9 +++
 ui/src/administration/node_status.rs | 114 +++++++++++++++++++++++++++
 2 files changed, 123 insertions(+)
 create mode 100644 ui/src/administration/node_status.rs


Summary over all repositories:
  4 files changed, 143 insertions(+), 54 deletions(-)

--
Generated by git-murpp 0.8.1


_______________________________________________
pdm-devel mailing list
pdm-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pdm-devel

[pdm-devel] [PATCH yew-comp v3 1/2] node_info: only use build date from kernel version

[Shannon Sterz]

this aligns the output with pve and pbs [1]. this reduces noise and
only displays useful information to the user.

[1]: https://git.proxmox.com/?p=pve-manager.git;h=be04f8ee8a

Signed-off-by: Shannon Sterz <s.sterz@proxmox.com>
---
 src/node_info.rs | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/node_info.rs b/src/node_info.rs
index 5604787..b7c0360 100644
--- a/src/node_info.rs
+++ b/src/node_info.rs
@@ -146,6 +146,8 @@ pub fn node_info(data: Option<NodeStatus>) -> Container {
         None => (String::new(), String::new(), String::new()),
     };
 
+    let build_date = k_version.split(['(', ')']).nth(1).unwrap_or("unknown");
+
     let boot_mode = if let Some(NodeStatus::Common(node_status)) = data {
         Some(&node_status.boot_info)
     } else {
@@ -247,7 +249,7 @@ pub fn node_info(data: Option<NodeStatus>) -> Container {
         .with_child(
             StatusRow::new(tr!("Kernel Version"))
                 .style("grid-column", "1/-1")
-                .status(format!("{} {} {}", k_sysname, k_release, k_version)),
+                .status(format!("{k_sysname} {k_release} ({build_date})")),
         )
         .with_optional_child(boot_mode.map(|m| {
             let mode = match m.mode {
-- 
2.47.3



_______________________________________________
pdm-devel mailing list
pdm-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pdm-devel

[pdm-devel] [PATCH yew-comp v3 2/2] node status panel: remove power management and make fingerprint opt-in

[Shannon Sterz]

the panel appeared to dense with all these tools being present. so
remove the reboot and power off button and make the fingerprint button
opt-in.

Signed-off-by: Shannon Sterz <s.sterz@proxmox.com>
---
 src/node_status_panel.rs | 70 ++++++++++------------------------------
 1 file changed, 17 insertions(+), 53 deletions(-)

diff --git a/src/node_status_panel.rs b/src/node_status_panel.rs
index 3d37d80..c73594b 100644
--- a/src/node_status_panel.rs
+++ b/src/node_status_panel.rs
@@ -12,12 +12,11 @@ use pwt::widget::{error_message, Fa, Panel, Row, Tooltip};
 use pwt::widget::{Button, Dialog};
 use pwt_macros::builder;
 
-use proxmox_node_status::{NodePowerCommand, NodeStatus};
+use proxmox_node_status::NodeStatus;
 
 use crate::utils::copy_text_to_clipboard;
 use crate::{
-    http_get, http_post, node_info, ConfirmButton, LoadableComponent, LoadableComponentContext,
-    LoadableComponentMaster,
+    http_get, node_info, LoadableComponent, LoadableComponentContext, LoadableComponentMaster,
 };
 
 #[derive(Properties, Clone, PartialEq)]
@@ -27,6 +26,10 @@ pub struct NodeStatusPanel {
     #[builder(IntoPropValue, into_prop_value)]
     #[prop_or_default]
     status_base_url: Option<AttrValue>,
+
+    #[builder(IntoPropValue, into_prop_value)]
+    #[prop_or_default]
+    fingerprint_button: bool,
 }
 
 impl NodeStatusPanel {
@@ -44,8 +47,6 @@ impl Default for NodeStatusPanel {
 enum Msg {
     Error(Error),
     Loaded(Rc<NodeStatus>),
-    RebootOrShutdown(NodePowerCommand),
-    Reload,
 }
 
 #[derive(PartialEq)]
@@ -59,24 +60,6 @@ struct ProxmoxNodeStatusPanel {
 }
 
 impl ProxmoxNodeStatusPanel {
-    fn change_power_state(&self, ctx: &LoadableComponentContext<Self>, command: NodePowerCommand) {
-        let Some(url) = ctx.props().status_base_url.clone() else {
-            return;
-        };
-        let link = ctx.link().clone();
-
-        ctx.link().spawn(async move {
-            let data = Some(serde_json::json!({
-                "command": command,
-            }));
-
-            match http_post(url.as_str(), data).await {
-                Ok(()) => link.send_message(Msg::Reload),
-                Err(err) => link.send_message(Msg::Error(err)),
-            }
-        });
-    }
-
     fn fingerprint_dialog(
         &self,
         ctx: &LoadableComponentContext<Self>,
@@ -154,7 +137,7 @@ impl LoadableComponent for ProxmoxNodeStatusPanel {
         })
     }
 
-    fn update(&mut self, ctx: &crate::LoadableComponentContext<Self>, msg: Self::Message) -> bool {
+    fn update(&mut self, _ctx: &crate::LoadableComponentContext<Self>, msg: Self::Message) -> bool {
         match msg {
             Msg::Error(err) => {
                 self.error = Some(err);
@@ -165,11 +148,6 @@ impl LoadableComponent for ProxmoxNodeStatusPanel {
                 self.error = None;
                 true
             }
-            Msg::RebootOrShutdown(command) => {
-                self.change_power_state(ctx, command);
-                false
-            }
-            Msg::Reload => true,
         }
     }
 
@@ -195,7 +173,7 @@ impl LoadableComponent for ProxmoxNodeStatusPanel {
             .as_ref()
             .map(|r| crate::NodeStatus::Common(r));
 
-        Panel::new()
+        let mut panel = Panel::new()
             .border(false)
             .class(FlexFit)
             .title(
@@ -206,25 +184,11 @@ impl LoadableComponent for ProxmoxNodeStatusPanel {
                     .with_child(tr!("Node Status"))
                     .into_html(),
             )
-            .with_tool(
-                ConfirmButton::new(tr!("Reboot"))
-                    .confirm_message(tr!("Are you sure you want to reboot the node?"))
-                    .on_activate(
-                        ctx.link()
-                            .callback(|_| Msg::RebootOrShutdown(NodePowerCommand::Reboot)),
-                    )
-                    .icon_class("fa fa-undo"),
-            )
-            .with_tool(
-                ConfirmButton::new(tr!("Shutdown"))
-                    .confirm_message(tr!("Are you sure you want to shut down the node?"))
-                    .on_activate(
-                        ctx.link()
-                            .callback(|_| Msg::RebootOrShutdown(NodePowerCommand::Shutdown)),
-                    )
-                    .icon_class("fa fa-power-off"),
-            )
-            .with_tool(
+            .with_child(node_info(status))
+            .with_optional_child(self.error.as_ref().map(|e| error_message(&e.to_string())));
+
+        if ctx.props().fingerprint_button {
+            panel.add_tool(
                 Button::new(tr!("Show Fingerprint"))
                     .icon_class("fa fa-hashtag")
                     .class(ColorScheme::Primary)
@@ -232,10 +196,10 @@ impl LoadableComponent for ProxmoxNodeStatusPanel {
                         ctx.link()
                             .change_view_callback(|_| ViewState::FingerprintDialog),
                     ),
-            )
-            .with_child(node_info(status))
-            .with_optional_child(self.error.as_ref().map(|e| error_message(&e.to_string())))
-            .into()
+            );
+        }
+
+        panel.into()
     }
 }
 
-- 
2.47.3



_______________________________________________
pdm-devel mailing list
pdm-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pdm-devel

[pdm-devel] [PATCH datacenter-manager v3 1/1] ui: add a Node Status tab to the administration panel

[Shannon Sterz]

it show the current node status via the new NodeStatPanel and has
buttons for shutting down and rebooting the node.

Signed-off-by: Shannon Sterz <s.sterz@proxmox.com>
---
the setup in NodeStatus here should make it fairly trivial to add more
panels here in the future and have the layout be similar to the current
dashboard.

 ui/src/administration/mod.rs         |   9 +++
 ui/src/administration/node_status.rs | 114 +++++++++++++++++++++++++++
 2 files changed, 123 insertions(+)
 create mode 100644 ui/src/administration/node_status.rs

diff --git a/ui/src/administration/mod.rs b/ui/src/administration/mod.rs
index a9f7ac6..e37b59c 100644
--- a/ui/src/administration/mod.rs
+++ b/ui/src/administration/mod.rs
@@ -18,6 +18,8 @@ use pwt_macros::builder;

 use proxmox_yew_comp::{AptPackageManager, AptRepositories, ExistingProduct, Syslog, Tasks};

+mod node_status;
+
 #[derive(Clone, PartialEq, Properties)]
 #[builder]
 pub struct ServerAdministration {
@@ -67,6 +69,13 @@ impl Component for PdmServerAdministration {
                 |_| Services::new().into(),
             )
             */
+            .with_item_builder(
+                TabBarItem::new()
+                    .key("status")
+                    .label(tr!("Node Status"))
+                    .icon_class("fa fa-book"),
+                move |_| node_status::NodeStatus::new().into(),
+            )
             .with_item_builder(
                 TabBarItem::new()
                     .key("updates")
diff --git a/ui/src/administration/node_status.rs b/ui/src/administration/node_status.rs
new file mode 100644
index 0000000..953a728
--- /dev/null
+++ b/ui/src/administration/node_status.rs
@@ -0,0 +1,114 @@
+use std::rc::Rc;
+
+use anyhow::Error;
+use yew::virtual_dom::{VComp, VNode};
+
+use proxmox_node_status::NodePowerCommand;
+use proxmox_yew_comp::{http_post, ConfirmButton, NodeStatusPanel};
+use pwt::prelude::*;
+use pwt::widget::{Column, Container, Row};
+
+#[derive(Properties, Clone, PartialEq)]
+pub(crate) struct NodeStatus {}
+
+impl NodeStatus {
+    pub(crate) fn new() -> Self {
+        yew::props!(Self {})
+    }
+}
+
+impl From<NodeStatus> for VNode {
+    fn from(value: NodeStatus) -> Self {
+        VComp::new::<PdmNodeStatus>(Rc::new(value), None).into()
+    }
+}
+
+enum Msg {
+    Reload,
+    Error(Error),
+    RebootOrShutdown(NodePowerCommand),
+}
+
+struct PdmNodeStatus {
+    error: Option<Error>,
+}
+
+impl PdmNodeStatus {
+    fn change_power_state(&self, ctx: &yew::Context<Self>, command: NodePowerCommand) {
+        ctx.link().send_future(async move {
+            let data = Some(serde_json::json!({"command": command}));
+
+            match http_post("/nodes/localhost/status", data).await {
+                Ok(()) => Msg::Reload,
+                Err(e) => Msg::Error(e),
+            }
+        });
+    }
+}
+
+impl Component for PdmNodeStatus {
+    type Message = Msg;
+    type Properties = NodeStatus;
+
+    fn create(_ctx: &yew::Context<Self>) -> Self {
+        Self { error: None }
+    }
+
+    fn update(&mut self, ctx: &yew::Context<Self>, msg: Self::Message) -> bool {
+        match msg {
+            Msg::RebootOrShutdown(command) => {
+                self.change_power_state(ctx, command);
+                false
+            }
+            Msg::Error(e) => {
+                self.error = Some(e);
+                true
+            }
+            Msg::Reload => true,
+        }
+    }
+
+    fn view(&self, ctx: &yew::Context<Self>) -> Html {
+        Column::new()
+            .class(pwt::css::FlexFit)
+            .with_child(
+                Container::new()
+                    .class("pwt-content-spacer-padding")
+                    .class("pwt-content-spacer-colors")
+                    .class("pwt-default-colors")
+                    .with_child(
+                        Row::new()
+                            .gap(1)
+                            .with_child(
+                                ConfirmButton::new(tr!("Reboot"))
+                                    .confirm_message(tr!(
+                                        "Are you sure you want to reboot the node?"
+                                    ))
+                                    .on_activate(ctx.link().callback(|_| {
+                                        Msg::RebootOrShutdown(NodePowerCommand::Reboot)
+                                    }))
+                                    .class(pwt::css::ColorScheme::Neutral)
+                                    .icon_class("fa fa-undo"),
+                            )
+                            .with_child(
+                                ConfirmButton::new(tr!("Shutdown"))
+                                    .confirm_message(tr!(
+                                        "Are you sure you want to shut down the node?"
+                                    ))
+                                    .on_activate(ctx.link().callback(|_| {
+                                        Msg::RebootOrShutdown(NodePowerCommand::Shutdown)
+                                    }))
+                                    .class(pwt::css::ColorScheme::Neutral)
+                                    .icon_class("fa fa-power-off"),
+                            ),
+                    ),
+            )
+            .with_child(
+                Row::new()
+                    .class("pwt-content-spacer")
+                    .class(pwt::css::FlexFit)
+                    .with_child(NodeStatusPanel::new().status_base_url("/nodes/localhost/status")),
+            )
+            .into()
+    }
+}
--
2.47.3



_______________________________________________
pdm-devel mailing list
pdm-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pdm-devel

Re: [pdm-devel] [PATCH datacenter-manager/yew-comp v3 0/3] add node status panel to proxmox datacenter manager

[Lukas Wagner]

On Mon Nov 10, 2025 at 9:58 AM CET, Shannon Sterz wrote:
> this series slightly adapts the previously applied node status panel and
> integrates it into pdm. the first commit changes the way we display
> kernel version, dropping the preempt mode and similar information to get
> this more aligned with pve/pbs. the second patches removes and adapts
> the tools of the NodeStatusPanel to make it less crowded. the final
> commit adds a new tab to the "Administration" menu that shows the
> current node status and allows for shutting down or rebotting the node.
>

Gave this a quick test on the latest master branches.

Noticed that where was a missing dependency for `proxmox-node-status` in
ui/Cargo.toml.

We discussed off-list how this new node status view should look like
once there are resource graphs. I raised the concern that the "Reboot"
and "Shutdown" buttons look a bit out-of-place in the current iteration.
We agreed to try out a 'card-like' view, similar to the new firewall
view or the global update overview, with the Shutdown and Reboot buttons
on the top right of the card.
The graphs should then later be on the same card; this makes it visually
consistent with the PVE/PBS status view cards. Whether this single card
should have borders or not is up for debate. I think it looks quite
nice, but I understand that it also wastes a bit of space.


_______________________________________________
pdm-devel mailing list
pdm-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pdm-devel

Re: [pdm-devel] [PATCH datacenter-manager/yew-comp v3 0/3] add node status panel to proxmox datacenter manager

[Shannon Sterz]

On Wed Nov 12, 2025 at 3:26 PM CET, Lukas Wagner wrote:
> On Mon Nov 10, 2025 at 9:58 AM CET, Shannon Sterz wrote:
>> this series slightly adapts the previously applied node status panel and
>> integrates it into pdm. the first commit changes the way we display
>> kernel version, dropping the preempt mode and similar information to get
>> this more aligned with pve/pbs. the second patches removes and adapts
>> the tools of the NodeStatusPanel to make it less crowded. the final
>> commit adds a new tab to the "Administration" menu that shows the
>> current node status and allows for shutting down or rebotting the node.
>>
>
> Gave this a quick test on the latest master branches.
>
> Noticed that where was a missing dependency for `proxmox-node-status` in
> ui/Cargo.toml.
>
> We discussed off-list how this new node status view should look like
> once there are resource graphs. I raised the concern that the "Reboot"
> and "Shutdown" buttons look a bit out-of-place in the current iteration.
> We agreed to try out a 'card-like' view, similar to the new firewall
> view or the global update overview, with the Shutdown and Reboot buttons
> on the top right of the card.
> The graphs should then later be on the same card; this makes it visually
> consistent with the PVE/PBS status view cards. Whether this single card
> should have borders or not is up for debate. I think it looks quite
> nice, but I understand that it also wastes a bit of space.

thanks, i'll send a v4 with the new layout in a minute.


_______________________________________________
pdm-devel mailing list
pdm-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pdm-devel