From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) by lore.proxmox.com (Postfix) with ESMTPS id 3B4F51FF165 for ; Thu, 28 Aug 2025 09:50:11 +0200 (CEST) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id 23BE49F02; Thu, 28 Aug 2025 09:50:20 +0200 (CEST) Message-ID: <3f930ae9-e22c-4146-9303-9821b85c30bd@proxmox.com> Date: Thu, 28 Aug 2025 09:49:46 +0200 MIME-Version: 1.0 User-Agent: Mozilla Thunderbird Beta To: Proxmox Datacenter Manager development discussion , Stefan Hanreich References: <20250827113427.199253-1-s.hanreich@proxmox.com> <20250827113427.199253-29-s.hanreich@proxmox.com> Content-Language: en-US From: Dominik Csapak In-Reply-To: <20250827113427.199253-29-s.hanreich@proxmox.com> X-Bm-Milter-Handled: 55990f41-d878-4baa-be0a-ee34c49e34d2 X-Bm-Transport-Timestamp: 1756367379745 X-SPAM-LEVEL: Spam detection results: 0 AWL 0.021 Adjusted score from AWL reputation of From: address BAYES_00 -1.9 Bayes spam probability is 0 to 1% DMARC_MISSING 0.1 Missing DMARC policy KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment RCVD_IN_VALIDITY_CERTIFIED_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to Validity was blocked. See https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more information. RCVD_IN_VALIDITY_RPBL_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to Validity was blocked. See https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more information. RCVD_IN_VALIDITY_SAFE_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to Validity was blocked. See https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more information. SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Subject: Re: [pdm-devel] [PATCH proxmox-datacenter-manager 12/16] ui: sdn: add AddVnetWindow component X-BeenThere: pdm-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox Datacenter Manager development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , Reply-To: Proxmox Datacenter Manager development discussion Content-Transfer-Encoding: 7bit Content-Type: text/plain; charset="us-ascii"; Format="flowed" Errors-To: pdm-devel-bounces@lists.proxmox.com Sender: "pdm-devel" some comments inline On 8/27/25 1:35 PM, Stefan Hanreich wrote: > Adds an edit window for creating a new VNet across multiple remotes. > Currently it > seems like there is either info missing, or this sentence fragment is leftover > This windows shows a form > containing all fields required to create new VNet via the create_vnet > API endpoint. > > Signed-off-by: Stefan Hanreich > --- > lib/pdm-client/src/lib.rs | 2 +- > ui/src/sdn/evpn/add_vnet.rs | 310 ++++++++++++++++++++++++++++++++++++ > ui/src/sdn/evpn/mod.rs | 3 + > 3 files changed, 314 insertions(+), 1 deletion(-) > create mode 100644 ui/src/sdn/evpn/add_vnet.rs > > diff --git a/lib/pdm-client/src/lib.rs b/lib/pdm-client/src/lib.rs > index be53a9a..ff65aaa 100644 > --- a/lib/pdm-client/src/lib.rs > +++ b/lib/pdm-client/src/lib.rs > @@ -60,7 +60,7 @@ pub mod types { > pub use pve_api_types::PveUpid; > > pub use pdm_api_types::sdn::{ > - CreateVnetParams, CreateZoneParams, ListController, ListVnet, ListZone, > + CreateVnetParams, CreateZoneParams, ListController, ListVnet, ListZone, SDN_ID_SCHEMA, > }; > pub use pve_api_types::{ListControllersType, ListZonesType, SdnObjectState}; > } > diff --git a/ui/src/sdn/evpn/add_vnet.rs b/ui/src/sdn/evpn/add_vnet.rs > new file mode 100644 > index 0000000..1540961 > --- /dev/null > +++ b/ui/src/sdn/evpn/add_vnet.rs > @@ -0,0 +1,310 @@ > +use std::{collections::HashSet, rc::Rc}; > + > +use anyhow::{bail, format_err, Error}; > +use serde::{Deserialize, Serialize}; > +use serde_json::Value; > +use yew::{virtual_dom::Key, Callback, Component, Html, Properties}; > + > +use pdm_client::types::{CreateVnetParams, ListZone, SDN_ID_SCHEMA}; > +use proxmox_yew_comp::{EditWindow, SchemaValidation}; > +use pwt::{ > + css, > + props::{ > + ContainerBuilder, CssBorderBuilder, CssPaddingBuilder, ExtractPrimaryKey, FieldBuilder, > + WidgetBuilder, WidgetStyleBuilder, > + }, > + state::{Selection, Store}, > + tr, > + widget::{ > + data_table::{DataTable, DataTableColumn, DataTableHeader, MultiSelectMode}, > + error_message, > + form::{ > + Field, FormContext, ManagedField, ManagedFieldContext, ManagedFieldMaster, > + ManagedFieldState, Number, > + }, > + Column, Container, GridPicker, InputPanel, > + }, > +}; > +use pwt_macros::widget; > + > +use crate::pdm_client; > + > +#[widget(comp=AddVnetWindowComp)] > +#[derive(Properties, PartialEq, Clone)] > +pub struct AddVnetWindow { > + pub zones: Rc>, > + pub on_success: Option>, > + pub on_close: Option>, > +} > + > +impl AddVnetWindow { > + pub fn new( > + zones: Rc>, > + on_success: impl Into>>, > + on_close: impl Into>>, > + ) -> Self { > + yew::props!(Self { > + zones, > + on_success: on_success.into(), > + on_close: on_close.into(), > + }) > + } > +} > + > +pub struct AddVnetWindowComp {} > + > +impl Component for AddVnetWindowComp { > + type Message = (); > + > + type Properties = AddVnetWindow; > + > + fn create(_ctx: &yew::Context) -> Self { > + Self {} > + } > + > + fn view(&self, ctx: &yew::Context) -> Html { > + let props = ctx.props().clone(); > + > + EditWindow::new(tr!("Add VNet")) > + .renderer(move |form_ctx: &FormContext| { > + InputPanel::new() > + .class(css::FlexFit) > + .padding(4) > + .width("auto") > + .with_field( > + tr!("VNet ID"), > + Field::new() > + .name("vnet") > + .schema(&SDN_ID_SCHEMA) > + .required(true), > + ) > + .with_field( > + tr!("VXLAN VNI"), > + Number::::new() > + .min(1) > + .max(16777215) > + .name("tag") > + .required(true), > + ) > + .with_custom_child( > + Column::new() > + .with_child(ZoneTable::new(props.zones.clone()).name("remotes")) > + .with_optional_child( > + form_ctx > + .read() > + .get_field_valid("remotes") > + .and_then(|result| result.err().as_deref().map(error_message)), > + ), > + ) > + .into() > + }) > + .on_close(ctx.props().on_close.clone()) > + .on_submit({ > + let on_success = props.on_success.clone(); > + > + move |form_ctx: FormContext| { > + let on_success = on_success.clone(); > + > + async move { > + let client = pdm_client(); > + > + let params: CreateVnetParams = > + serde_json::from_value(form_ctx.get_submit_data()).unwrap(); > + > + let upid = client.pve_sdn_create_vnet(params).await?; > + > + if let Some(cb) = on_success { > + cb.emit(upid) > + } > + > + Ok(()) > + } > + } > + }) > + .into() > + } > +} > + > +#[widget(comp=ManagedFieldMaster, @input)] > +#[derive(Clone, PartialEq, Properties)] > +pub struct ZoneTable { > + zones: Rc>, > +} > + > +impl ZoneTable { > + pub fn new(zones: Rc>) -> Self { > + yew::props!(Self { zones }) > + } > +} > + > +#[derive(Clone, PartialEq, Debug, Serialize, Deserialize)] > +pub struct ZoneTableEntry { > + remote: String, > + zone: String, > + vni: u32, > +} > + > +impl ExtractPrimaryKey for ZoneTableEntry { > + fn extract_key(&self) -> Key { > + Key::from(format!("{}/{}", self.remote, self.zone)) > + } > +} > + > +pub struct ZoneTableComponent { > + store: Store, > + selection: Selection, > + error_msg: Option, > +} > + > +pub enum ZoneTableMsg { > + SelectionChange, > +} > + > +#[derive(PartialEq)] > +pub struct ValidationContext { > + zone_count: usize, > +} > + > +impl ManagedField for ZoneTableComponent { > + type Properties = ZoneTable; > + type Message = ZoneTableMsg; > + type ValidateClosure = ValidationContext; > + > + fn validation_args(props: &Self::Properties) -> Self::ValidateClosure { > + ValidationContext { > + zone_count: props.zones.len(), > + } > + } > + > + fn validator(props: &Self::ValidateClosure, value: &Value) -> Result { > + let selected_entries: Vec = serde_json::from_value(value.clone())?; > + > + if selected_entries.is_empty() { > + if props.zone_count == 0 { > + bail!("At least one zone needs to be configured on a remote"); > + } else { > + bail!("At least one zone needs to be selected"); > + } > + } not sure if i missed them in the other patches, but i think we should wrap these natural language error messages with tr!() so that we can translate them > + > + let mut unique = HashSet::new(); > + > + if !selected_entries > + .iter() > + .all(|entry| unique.insert(entry.remote.as_str())) > + { > + bail!("Can only create the VNet once per remote!") > + } > + > + Ok(value.clone()) > + } > + > + fn setup(_props: &Self::Properties) -> ManagedFieldState { > + ManagedFieldState { > + value: Value::Array(Vec::new()), > + valid: Ok(()), > + default: Value::Array(Vec::new()), > + radio_group: false, > + unique: false, > + } > + } > + > + fn create(ctx: &ManagedFieldContext) -> Self { > + let link = ctx.link().clone(); > + let selection = Selection::new().multiselect(true).on_select(move |_| { > + link.send_message(Self::Message::SelectionChange); > + }); > + > + let store = Store::new(); > + > + let zones: Result, Error> = ctx > + .props() > + .zones > + .iter() > + .map(|zone| { > + Ok(ZoneTableEntry { > + remote: zone.remote.clone(), > + zone: zone.zone.zone.clone(), > + vni: zone > + .zone > + .vrf_vxlan > + .ok_or_else(|| format_err!("EVPN Zone has no VRF VNI configured!"))?, here too > + }) > + }) > + .collect(); > + > + let mut error_msg = None; > + > + match zones { > + Ok(zones) => { > + store.set_data(zones); > + } > + Err(error) => error_msg = Some(error.to_string()), > + }; > + > + Self { > + store, > + selection, > + error_msg, > + } > + } > + > + fn update(&mut self, ctx: &ManagedFieldContext, msg: Self::Message) -> bool { > + match msg { > + Self::Message::SelectionChange => { > + let read_guard = self.store.read(); > + > + ctx.link().update_value( > + serde_json::to_value( > + self.selection > + .selected_keys() > + .iter() > + .filter_map(|key| read_guard.lookup_record(key)) > + .collect::>(), > + ) > + .unwrap(), > + ); > + } > + } > + > + false > + } > + > + fn view(&self, _ctx: &ManagedFieldContext) -> Html { > + let table = DataTable::new(COLUMNS.with(Rc::clone), self.store.clone()) > + .multiselect_mode(MultiSelectMode::Simple) > + .border(true) > + .class(css::FlexFit); > + > + let mut container = > + Container::new().with_child(GridPicker::new(table).selection(self.selection.clone())); > + > + if let Some(error_msg) = &self.error_msg { > + container.add_child(error_message(error_msg)); > + } > + > + container.into() as mentioned off-list, i think it would be good to show an explanation, in case the grid is empty. something like: no remotes with evpn controllers found or something similar > + } > +} > + > +thread_local! { nit: we actually currently trying to avoid thread_local, since it's most often not worth it. (upfront cost, vs on component load) i'd just do the same as in the other componens with having a 'column()' method and call that on creation > + static COLUMNS: Rc>> = > + Rc::new(vec![ > + DataTableColumn::selection_indicator().into(), > + DataTableColumn::new(tr!("Remote")) > + .flex(1) > + .render(move |item: &ZoneTableEntry| item.remote.as_str().into()) > + .sorter(|a: &ZoneTableEntry, b: &ZoneTableEntry| a.remote.cmp(&b.remote)) > + .into(), > + DataTableColumn::new(tr!("Zone")) > + .flex(1) > + .render(move |item: &ZoneTableEntry| item.zone.as_str().into()) > + .sorter(|a: &ZoneTableEntry, b: &ZoneTableEntry| a.zone.cmp(&b.zone)) > + .into(), > + DataTableColumn::new(tr!("VRF VNI")) > + .flex(1) > + .render(move |item: &ZoneTableEntry| item.vni.to_string().into()) > + .sorter(|a: &ZoneTableEntry, b: &ZoneTableEntry| a.vni.cmp(&b.vni)) > + .into(), > + ]); > +} > diff --git a/ui/src/sdn/evpn/mod.rs b/ui/src/sdn/evpn/mod.rs > index da020a9..9fda8a1 100644 > --- a/ui/src/sdn/evpn/mod.rs > +++ b/ui/src/sdn/evpn/mod.rs > @@ -4,6 +4,9 @@ pub use remote_tree::RemoteTree; > mod vrf_tree; > pub use vrf_tree::VrfTree; > > +mod add_vnet; > +pub use add_vnet::AddVnetWindow; > + > #[derive(Clone, Copy, Debug, PartialEq, Eq, Ord, PartialOrd, Hash)] > pub struct EvpnRouteTarget { > asn: u32, _______________________________________________ pdm-devel mailing list pdm-devel@lists.proxmox.com https://lists.proxmox.com/cgi-bin/mailman/listinfo/pdm-devel