[pdm-devel] [PATCH datacenter-manager 03/15] ui: dashboard: refactor remote panel creation into its own module

[Dominik Csapak]

so we can more easily reuse them outside the dashboard struct.

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 ui/src/dashboard/mod.rs          | 39 ++++++++-------------------
 ui/src/dashboard/remote_panel.rs | 46 ++++++++++++++++++++++++--------
 2 files changed, 46 insertions(+), 39 deletions(-)

diff --git a/ui/src/dashboard/mod.rs b/ui/src/dashboard/mod.rs
index 2e170443..2fe4d7fa 100644
--- a/ui/src/dashboard/mod.rs
+++ b/ui/src/dashboard/mod.rs
@@ -19,7 +19,6 @@ use pwt::{
     widget::{
         error_message,
         form::{DisplayField, FormContext, Number},
-        menu::{Menu, MenuButton, MenuItem},
         Column, Container, Fa, InputPanel, Panel, Row,
     },
     AsyncPool,
@@ -41,7 +40,7 @@ mod node_panel;
 pub use node_panel::create_node_panel;
 
 mod remote_panel;
-use remote_panel::RemotePanel;
+pub use remote_panel::create_remote_panel;
 
 mod guest_panel;
 pub use guest_panel::create_guest_panel;
@@ -422,32 +421,16 @@ impl Component for PdmDashboard {
                     .class(FlexWrap::Wrap)
                     .padding_top(0)
                     .with_child(
-                        Panel::new()
-                            .title(create_title_with_icon("server", tr!("Remotes")))
-                            .flex(1.0)
-                            //.border(true)
-                            .width(300)
-                            .min_height(175)
-                            .with_tool(
-                                MenuButton::new(tr!("Add")).show_arrow(true).menu(
-                                    Menu::new()
-                                        .with_item(
-                                            MenuItem::new("Proxmox VE")
-                                                .icon_class("fa fa-building")
-                                                .on_select(ctx.link().callback(|_| {
-                                                    Msg::CreateWizard(Some(RemoteType::Pve))
-                                                })),
-                                        )
-                                        .with_item(
-                                            MenuItem::new("Proxmox Backup Server")
-                                                .icon_class("fa fa-floppy-o")
-                                                .on_select(ctx.link().callback(|_| {
-                                                    Msg::CreateWizard(Some(RemoteType::Pbs))
-                                                })),
-                                        ),
-                                ),
-                            )
-                            .with_child(RemotePanel::new(self.status.clone())),
+                        create_remote_panel(
+                            self.status.clone(),
+                            ctx.link()
+                                .callback(|_| Msg::CreateWizard(Some(RemoteType::Pve))),
+                            ctx.link()
+                                .callback(|_| Msg::CreateWizard(Some(RemoteType::Pbs))),
+                        )
+                        .flex(1.0)
+                        .width(300)
+                        .min_height(175),
                     )
                     .with_child(
                         create_node_panel(Some(RemoteType::Pve), self.status.clone())
diff --git a/ui/src/dashboard/remote_panel.rs b/ui/src/dashboard/remote_panel.rs
index 75f772fb..27eebac2 100644
--- a/ui/src/dashboard/remote_panel.rs
+++ b/ui/src/dashboard/remote_panel.rs
@@ -1,21 +1,19 @@
 use std::rc::Rc;
 
+use yew::html::IntoEventCallback;
+use yew::virtual_dom::{VComp, VNode};
+
 use pdm_search::{Search, SearchTerm};
 use proxmox_yew_comp::Status;
-use pwt::{
-    css,
-    prelude::*,
-    props::{ContainerBuilder, WidgetBuilder},
-    widget::{Column, Container, Fa},
-};
-use yew::{
-    virtual_dom::{VComp, VNode},
-    Component, Properties,
-};
+use pwt::css;
+use pwt::prelude::*;
+use pwt::props::{ContainerBuilder, WidgetBuilder};
+use pwt::widget::menu::{Menu, MenuButton, MenuEvent, MenuItem};
+use pwt::widget::{Column, Container, Fa, Panel};
 
 use pdm_api_types::resource::ResourcesStatus;
 
-use crate::search_provider::get_search_provider;
+use crate::{dashboard::create_title_with_icon, search_provider::get_search_provider};
 
 #[derive(Properties, PartialEq)]
 /// A panel for showing the overall remotes status
@@ -116,3 +114,29 @@ fn create_search_term(failure: bool) -> Search {
         Search::with_terms(vec![SearchTerm::new("remote").category(Some("type"))])
     }
 }
+
+pub fn create_remote_panel(
+    status: Option<ResourcesStatus>,
+    on_pve_wizard: impl IntoEventCallback<MenuEvent>,
+    on_pbs_wizard: impl IntoEventCallback<MenuEvent>,
+) -> Panel {
+    Panel::new()
+        .title(create_title_with_icon("server", tr!("Remotes")))
+        .border(true)
+        .with_tool(
+            MenuButton::new(tr!("Add")).show_arrow(true).menu(
+                Menu::new()
+                    .with_item(
+                        MenuItem::new("Proxmox VE")
+                            .icon_class("fa fa-building")
+                            .on_select(on_pve_wizard),
+                    )
+                    .with_item(
+                        MenuItem::new("Proxmox Backup Server")
+                            .icon_class("fa fa-floppy-o")
+                            .on_select(on_pbs_wizard),
+                    ),
+            ),
+        )
+        .with_child(RemotePanel::new(status))
+}
-- 
2.47.3