Re: [PATCH datacenter-manager v3 5/6] fix: ui: add remove confirmation dialog with optional token deletion

["Lukas Wagner" <l.wagner@proxmox.com>]

Hi Shan,

thanks for the patch.

In general, make sure to include the reference to the bugzilla entry in
the commit subject as well, as this is the source of truth that will be
used to assemble the changelog later. As far as I can tell, the "fix
#6914" should probably included in the UI commits as well as the ones
adding it to the CLI and API.

Some further notes inside.

On Wed Feb 11, 2026 at 4:20 PM CET, Shan Shaji wrote:
> diff --git a/ui/src/remotes/remove_remote.rs b/ui/src/remotes/remove_remote.rs
> new file mode 100644
> index 0000000..63b55ee
> --- /dev/null
> +++ b/ui/src/remotes/remove_remote.rs
> @@ -0,0 +1,117 @@
> +use std::rc::Rc;
> +
> +use yew::html::IntoEventCallback;
> +use yew::prelude::*;
> +use yew::virtual_dom::{VComp, VNode};
> +
> +use pwt::css::{AlignItems, FontColor, JustifyContent};
> +use pwt::prelude::*;
> +use pwt::widget::form::Checkbox;
> +use pwt::widget::{Button, Column, Container, Dialog, Fa, Row};
> +
> +use pwt_macros::builder;
> +
> +#[derive(PartialEq, Properties)]
> +#[builder]
> +pub struct RemoveRemote {
> +    /// A callback for an action that needs to be confirmed by the user.
> +    #[prop_or_default]
> +    #[builder_cb(IntoEventCallback, into_event_callback, bool)]
> +    pub on_confirm: Option<Callback<bool>>,
> +
> +    /// A callback that will trigger if the user dismisses the dialog.
> +    #[prop_or_default]
> +    #[builder_cb(IntoEventCallback, into_event_callback, ())]
> +    pub on_dismiss: Option<Callback<()>>,
> +}
> +
> +impl RemoveRemote {
> +    pub fn new() -> Self {
> +        yew::props!(Self {})
> +    }
> +}
> +
> +pub enum Msg {
> +    SelectCheckBox(bool),
> +}
> +
> +pub struct PdmRemoveRemote {
> +    delete_token: bool,
> +}

as far as I can tell, neither Msg nor PdmRemoveRemote need to be `pub`

> +
> +impl Component for PdmRemoveRemote {
> +    type Message = Msg;
> +
> +    type Properties = RemoveRemote;
> +
> +    fn create(_ctx: &Context<Self>) -> Self {
> +        Self {
> +            delete_token: false,
> +        }
> +    }
> +
> +    fn update(&mut self, _ctx: &Context<Self>, msg: Self::Message) -> bool {
> +        match msg {
> +            Msg::SelectCheckBox(v) => {
> +                self.delete_token = v;
> +                true
> +            }
> +        }
> +    }
> +
> +    fn view(&self, ctx: &Context<Self>) -> Html {
> +        let props = ctx.props();
> +        let delete_token = self.delete_token;
> +
> +        let on_confirm = props.on_confirm.clone();
> +        let on_dismiss = props.on_dismiss.clone();
> +
> +        Dialog::new(tr!("Confirm"))
> +            .on_close(on_dismiss.clone())
> +            .min_height(100)
> +            .with_child(
> +                Column::new()
> +                    .padding(4)
> +                    .gap(2)
> +                    .with_child(
> +                        Row::new()
> +                            .gap(2)
> +                            .class(AlignItems::Center)
> +                            .with_child(Container::new().class("pwt-message-sign").with_child(
> +                                Fa::new("exclamation-triangle").class(FontColor::Error),
> +                            ))
> +                            .with_child(tr!("Are you sure you want to remove this remote?")),
> +                    )
> +                    .with_child(
> +                        Checkbox::new()
> +                            .default(false)
> +                            .box_label(tr!("Delete API token from remote"))
> +                            .checked(self.delete_token)
> +                            .on_change(ctx.link().callback(|v| Msg::SelectCheckBox(v))),

as already discussed off-list, the alignment of the checkbox/text looks
a bit off. I suggested to align it the same way as the "Remove
Datastore" confirmation in PBS, there the checkbox's left border is
aligned with the start of the text above.

> +                    )
> +                    .with_child(
> +                        Row::new()
> +                            .gap(2)
> +                            .class(JustifyContent::Center)
> +                            .with_child(Button::new(tr!("Yes")).on_activate(move |_| {
> +                                if let Some(on_confirm) = &on_confirm {
> +                                    on_confirm.emit(delete_token);
> +                                }
> +                            }))
> +                            .with_child(Button::new(tr!("No")).on_activate(move |_| {
> +                                if let Some(on_dismiss) = &on_dismiss {
> +                                    on_dismiss.emit(());
> +                                }
> +                            })),
> +                    ),
> +            )
> +            .into()
> +    }
> +}
> +
> +impl From<RemoveRemote> for VNode {
> +    fn from(val: RemoveRemote) -> Self {
> +        let comp = VComp::new::<PdmRemoveRemote>(Rc::new(val), None);
> +        VNode::from(comp)
> +    }
> +}