public inbox for pdm-devel@lists.proxmox.com
 help / color / mirror / Atom feed
From: Dominik Csapak <d.csapak@proxmox.com>
To: pdm-devel@lists.proxmox.com
Subject: [pdm-devel] [PATCH datacenter-manager v5 06/10] ui: dashboard: guest panel: search for guest states when clicking on them
Date: Wed,  3 Sep 2025 15:09:22 +0200	[thread overview]
Message-ID: <20250903132351.841830-7-d.csapak@proxmox.com> (raw)
In-Reply-To: <20250903132351.841830-1-d.csapak@proxmox.com>

by using the SearchProvider, we create a fitting search term for the
clicked/selected type of guest.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
changes from v4:
* implement into ResourceType from GuestType, so we use the same
  type as the backend does to filter, minimizes the risk that we
  diverge with that

 ui/src/dashboard/guest_panel.rs | 87 +++++++++++++++++++++++++++++++--
 ui/src/pve/mod.rs               | 11 ++++-
 2 files changed, 92 insertions(+), 6 deletions(-)

diff --git a/ui/src/dashboard/guest_panel.rs b/ui/src/dashboard/guest_panel.rs
index 8d130c3..678e30f 100644
--- a/ui/src/dashboard/guest_panel.rs
+++ b/ui/src/dashboard/guest_panel.rs
@@ -1,19 +1,26 @@
 use std::rc::Rc;
 
-use pdm_api_types::resource::GuestStatusCount;
+use pdm_api_types::resource::{GuestStatusCount, ResourceType};
+use pdm_search::{Search, SearchTerm};
 use proxmox_yew_comp::GuestState;
 use pwt::{
     prelude::*,
     props::ExtractPrimaryKey,
     state::Store,
     widget::{
-        data_table::{DataTable, DataTableColumn, DataTableHeader},
+        data_table::{
+            DataTable, DataTableColumn, DataTableHeader, DataTableKeyboardEvent,
+            DataTableMouseEvent, DataTableRowRenderArgs,
+        },
         Fa,
     },
 };
-use yew::virtual_dom::{VComp, VNode};
+use yew::{
+    virtual_dom::{Key, VComp, VNode},
+    Properties,
+};
 
-use crate::pve::GuestType;
+use crate::{pve::GuestType, search_provider::get_search_provider};
 
 use super::loading_column;
 
@@ -101,13 +108,20 @@ fn columns(guest_type: GuestType) -> Rc<Vec<DataTableHeader<StatusRow>>> {
 pub struct PdmGuestPanel {}
 
 impl yew::Component for PdmGuestPanel {
-    type Message = String;
+    type Message = Search;
     type Properties = GuestPanel;
 
     fn create(_ctx: &yew::Context<Self>) -> Self {
         Self {}
     }
 
+    fn update(&mut self, ctx: &Context<Self>, msg: Self::Message) -> bool {
+        if let Some(provider) = get_search_provider(ctx) {
+            provider.search(msg);
+        }
+        false
+    }
+
     fn view(&self, ctx: &yew::Context<Self>) -> yew::Html {
         let props = ctx.props();
         if props.status.is_none() {
@@ -137,7 +151,70 @@ impl yew::Component for PdmGuestPanel {
             .striped(false)
             .borderless(true)
             .bordered(false)
+            .row_render_callback(|renderer: &mut DataTableRowRenderArgs<StatusRow>| {
+                renderer.class.push("pwt-pointer");
+            })
+            .on_row_keydown({
+                let store = store.clone();
+                let link = ctx.link().clone();
+                move |event: &mut DataTableKeyboardEvent| match event.key().as_str() {
+                    " " | "Enter" => search_callback(&link, &store, guest_type, &event.record_key),
+                    _ => {}
+                }
+            })
+            .on_row_click({
+                let store = store.clone();
+                let link = ctx.link().clone();
+                move |event: &mut DataTableMouseEvent| {
+                    search_callback(&link, &store, guest_type, &event.record_key);
+                }
+            })
             .show_header(false)
             .into()
     }
 }
+
+fn search_callback(
+    link: &html::Scope<PdmGuestPanel>,
+    store: &Store<StatusRow>,
+    guest_type: GuestType,
+    key: &Key,
+) {
+    if let Some((_, record)) = store.filtered_data().find(|(_, rec)| rec.key() == *key) {
+        let (status, template) = match &*record.record() {
+            StatusRow::State(guest_state, _) => match guest_state {
+                GuestState::Running => (Some("running"), Some(false)),
+                GuestState::Paused => (Some("paused"), Some(false)),
+                GuestState::Stopped => (Some("stopped"), Some(false)),
+                GuestState::Template => (None, Some(true)),
+                GuestState::Unknown => (Some("unknown"), None),
+            },
+            StatusRow::All(_) => (None, None),
+        };
+
+        link.send_message(create_guest_search_term(guest_type, status, template));
+    }
+}
+
+fn create_guest_search_term(
+    guest_type: GuestType,
+    status: Option<&'static str>,
+    template: Option<bool>,
+) -> Search {
+    let resource_type: ResourceType = guest_type.into();
+    if status.is_none() && template.is_none() {
+        return Search::with_terms(vec![
+            SearchTerm::new(resource_type.as_str()).category(Some("type"))
+        ]);
+    }
+
+    let mut terms = vec![SearchTerm::new(resource_type.as_str()).category(Some("type"))];
+
+    if let Some(template) = template {
+        terms.push(SearchTerm::new(template.to_string()).category(Some("template")));
+    }
+    if let Some(status) = status {
+        terms.push(SearchTerm::new(status).category(Some("status")));
+    }
+    Search::with_terms(terms)
+}
diff --git a/ui/src/pve/mod.rs b/ui/src/pve/mod.rs
index a3cf573..dd5e04f 100644
--- a/ui/src/pve/mod.rs
+++ b/ui/src/pve/mod.rs
@@ -20,7 +20,7 @@ use pwt::{
     widget::{Column, Panel, Row},
 };
 
-use pdm_api_types::resource::PveResource;
+use pdm_api_types::resource::{PveResource, ResourceType};
 
 pub mod lxc;
 pub mod node;
@@ -81,6 +81,15 @@ impl Display for GuestType {
     }
 }
 
+impl From<GuestType> for ResourceType {
+    fn from(value: GuestType) -> Self {
+        match value {
+            GuestType::Qemu => ResourceType::PveQemu,
+            GuestType::Lxc => ResourceType::PveLxc,
+        }
+    }
+}
+
 #[derive(PartialEq, Clone, Copy)]
 pub struct GuestInfo {
     pub guest_type: GuestType,
-- 
2.47.2



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


  parent reply	other threads:[~2025-09-03 13:24 UTC|newest]

Thread overview: 12+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2025-09-03 13:09 [pdm-devel] [PATCH datacenter-manager v5 00/10] implement more complex search syntax Dominik Csapak
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 01/10] pdm-api-types: resources: add helper methods for fields Dominik Csapak
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 02/10] lib: add pdm-search crate Dominik Csapak
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 03/10] server: api: resources: add more complex filter syntax Dominik Csapak
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 04/10] ui: add possibility to insert into search box Dominik Csapak
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 05/10] ui: dashboard: remotes panel: open search on click Dominik Csapak
2025-09-03 13:09 ` Dominik Csapak [this message]
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 07/10] ui: dashboard: search for nodes when clicking on the nodes panel Dominik Csapak
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 08/10] ui: search box: add clear trigger Dominik Csapak
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 09/10] ui: dashboard: guest panel: use `List` instead of `DataTable` Dominik Csapak
2025-09-03 13:09 ` [pdm-devel] [PATCH datacenter-manager v5 10/10] ui: dashboard: guest panel: add search icon for better discoverability Dominik Csapak
2025-09-04 17:21 ` [pdm-devel] applied-series: [PATCH datacenter-manager v5 00/10] implement more complex search syntax Thomas Lamprecht

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=20250903132351.841830-7-d.csapak@proxmox.com \
    --to=d.csapak@proxmox.com \
    --cc=pdm-devel@lists.proxmox.com \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox
Service provided by Proxmox Server Solutions GmbH | Privacy | Legal