[pdm-devel] [PATCH datacenter-manager 2/2] ui: configuration: add panel for viewing and editing acl entries

[Shannon Sterz <s.sterz@proxmox.com>]

using the new generic acl viewing and editing components from
proxmox-yew-comp make it possible for users to edit acl entries

note that the path selector is based on the current definition of
acceptable paths in the `AccessControlConfig`, since those are the
only valid paths. however, the convenience could be improved by, for
example, adding entries for specific resources. however, the acl paths
here don't seem fixed yet, so leave this as-is for now.

Signed-off-by: Shannon Sterz <s.sterz@proxmox.com>
---
 ui/src/configuration/mod.rs                   | 23 ++++-
 .../configuration/permission_path_selector.rs | 88 +++++++++++++++++++
 2 files changed, 110 insertions(+), 1 deletion(-)
 create mode 100644 ui/src/configuration/permission_path_selector.rs

diff --git a/ui/src/configuration/mod.rs b/ui/src/configuration/mod.rs
index ca16685..2a8b991 100644
--- a/ui/src/configuration/mod.rs
+++ b/ui/src/configuration/mod.rs
@@ -1,3 +1,4 @@
+use permission_path_selector::PermissionPathSelector;
 use pwt::prelude::*;
 use pwt::props::StorageLocation;
 use pwt::state::NavigationContainer;
@@ -6,8 +7,9 @@ use pwt::widget::{Container, MiniScrollMode, Panel, TabBarItem, TabPanel};
 use proxmox_yew_comp::configuration::TimePanel;
 use proxmox_yew_comp::configuration::{DnsPanel, NetworkView};
 use proxmox_yew_comp::tfa::TfaView;
-use proxmox_yew_comp::UserPanel;
+use proxmox_yew_comp::{AclEdit, AclView, UserPanel};
 
+mod permission_path_selector;
 mod webauthn;
 pub use webauthn::WebauthnPanel;
 
@@ -40,6 +42,8 @@ pub fn system_configuration() -> Html {
 
 #[function_component(AccessControl)]
 pub fn access_control() -> Html {
+    let acl_edit = AclEdit::new(tr!("Path"), PermissionPathSelector::new()).default_role("Auditor");
+
     let panel = TabPanel::new()
         .state_id(StorageLocation::session("AccessControlState"))
         //.title(tr!("Configuration") + ": " + &tr!("Access Control"))
@@ -71,6 +75,23 @@ pub fn access_control() -> Html {
                     .with_child(TfaView::new())
                     .into()
             },
+        )
+        .with_item_builder(
+            TabBarItem::new()
+                .key("permissions")
+                .icon_class("fa fa-unlock")
+                .label(tr!("Permissions")),
+            move |_| {
+                Container::new()
+                    .class("pwt-content-spacer")
+                    .class(pwt::css::FlexFit)
+                    .with_child(AclView::new().with_acl_edit_menu_entry(
+                        tr!("User Permission"),
+                        "fa fa-fw fa-user",
+                        acl_edit.clone().use_tokens(false),
+                    ))
+                    .into()
+            },
         );
 
     NavigationContainer::new().with_child(panel).into()
diff --git a/ui/src/configuration/permission_path_selector.rs b/ui/src/configuration/permission_path_selector.rs
new file mode 100644
index 0000000..68e38a9
--- /dev/null
+++ b/ui/src/configuration/permission_path_selector.rs
@@ -0,0 +1,88 @@
+use std::rc::Rc;
+
+use yew::html::IntoPropValue;
+
+use pwt::widget::form::Combobox;
+use pwt::{prelude::*, AsyncPool};
+
+use pwt_macros::{builder, widget};
+
+static PREDEFINED_PATHS: &[&str] = &[
+    "/",
+    "/access",
+    "/access/acl",
+    "/access/users",
+    "/access/domains",
+    "/access/openid",
+    "/resource",
+    "/system",
+    "/system/certificates",
+    "/system/disks",
+    "/system/log",
+    "/system/notifications",
+    "/system/network",
+    "/system/network/dns",
+    "/system/network/interfaces",
+    "/system/services",
+    "/system/status",
+    "/system/tasks",
+    "/system/time",
+    "/system/services",
+];
+
+#[widget(comp=PdmPermissionPathSelector, @input, @element)]
+#[derive(Clone, PartialEq, Properties)]
+#[builder]
+pub struct PermissionPathSelector {
+    /// Default value
+    #[builder(IntoPropValue, into_prop_value)]
+    #[prop_or_default]
+    default: Option<AttrValue>,
+}
+
+impl PermissionPathSelector {
+    pub(super) fn new() -> Self {
+        yew::props!(Self {})
+    }
+}
+
+enum Msg {}
+
+struct PdmPermissionPathSelector {
+    items: Rc<Vec<AttrValue>>,
+}
+
+impl PdmPermissionPathSelector {}
+
+impl Component for PdmPermissionPathSelector {
+    type Message = Msg;
+    type Properties = PermissionPathSelector;
+
+    fn create(_ctx: &Context<Self>) -> Self {
+        // TODO: fetch resources & remotes from the backend to improve the pre-defined selection of
+        // acl paths
+        Self {
+            items: Rc::new(
+                PREDEFINED_PATHS
+                    .iter()
+                    .map(|i| AttrValue::from(*i))
+                    .collect(),
+            ),
+        }
+    }
+
+    fn update(&mut self, _ctx: &Context<Self>, _msg: Self::Message) -> bool {
+        false
+    }
+
+    fn view(&self, ctx: &Context<Self>) -> Html {
+        let props = ctx.props();
+        Combobox::new()
+            .with_std_props(&props.std_props)
+            .with_input_props(&props.input_props)
+            .default(props.default.clone())
+            .items(Rc::clone(&self.items))
+            .editable(true)
+            .into()
+    }
+}
-- 
2.39.5



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