[pdm-devel] [PATCH datacenter-manager 5/7] ui: dashboard: remotes panel: open search on click

[Dominik Csapak <d.csapak@proxmox.com>]

using the SearchProvider, insert a search term into the search box to
find and show either all remotes (when healthy) or the failed ones.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 ui/src/dashboard/remote_panel.rs | 32 +++++++++++++++++++++++++++++++-
 1 file changed, 31 insertions(+), 1 deletion(-)

diff --git a/ui/src/dashboard/remote_panel.rs b/ui/src/dashboard/remote_panel.rs
index 2c1dd75..05119db 100644
--- a/ui/src/dashboard/remote_panel.rs
+++ b/ui/src/dashboard/remote_panel.rs
@@ -1,5 +1,6 @@
 use std::rc::Rc;
 
+use pdm_search::{Search, SearchTerm};
 use proxmox_yew_comp::Status;
 use pwt::{
     css,
@@ -14,6 +15,8 @@ use yew::{
 
 use pdm_api_types::resource::ResourcesStatus;
 
+use crate::search_provider::get_search_provider;
+
 #[derive(Properties, PartialEq)]
 /// A panel for showing the overall remotes status
 pub struct RemotePanel {
@@ -38,13 +41,20 @@ impl From<RemotePanel> for VNode {
 struct PdmRemotePanel {}
 
 impl Component for PdmRemotePanel {
-    type Message = &'static str;
+    type Message = Search;
     type Properties = RemotePanel;
 
     fn create(_ctx: &yew::Context<Self>) -> Self {
         Self {}
     }
 
+    fn update(&mut self, ctx: &Context<Self>, msg: Self::Message) -> bool {
+        if let Some(search) = get_search_provider(ctx) {
+            search.search(msg);
+        }
+        false
+    }
+
     fn view(&self, ctx: &yew::Context<Self>) -> yew::Html {
         let props = ctx.props();
         if props.status.is_none() {
@@ -77,6 +87,13 @@ impl Component for PdmRemotePanel {
         };
         Column::new()
             .tabindex(if failure { 0 } else { -1 })
+            .onclick(ctx.link().callback(move |_| create_search_term(failure)))
+            .onkeydown(ctx.link().batch_callback(move |event: KeyboardEvent| {
+                match event.key().as_str() {
+                    "Enter" | " " => Some(create_search_term(failure)),
+                    _ => None,
+                }
+            }))
             .padding(4)
             .class(css::FlexFit)
             .class(css::AlignItems::Center)
@@ -88,3 +105,16 @@ impl Component for PdmRemotePanel {
             .into()
     }
 }
+
+fn create_search_term(failure: bool) -> Search {
+    if failure {
+        Search::with_terms(vec![
+            SearchTerm::new("remote").category(Some("type")),
+            SearchTerm::new("offline").category(Some("status")),
+        ])
+    } else {
+        Search::with_terms(vec![SearchTerm::new("remote")
+            .optional(true)
+            .category(Some("type"))])
+    }
+}
-- 
2.39.5



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