[pve-devel] [PATCH manager 1/2] fix #5093: webui: acme: custom directory option

[Mira Limbeck]

On 1/16/24 15:33, Folke Gleumes wrote:
> This patch allows the user to set a custom ACME directory by providing
> a 'Custom' option in the directory dropdown. This in turn reveals an
> input for the url. When using a custom directory the directory has to
> be manually queried via button press to prevent from spamming the
> directory on every input.
> 
> Signed-off-by: Folke Gleumes <f.gleumes at proxmox.com>
> ---
>  www/manager6/node/ACME.js | 140 +++++++++++++++++++++++++++++---------
>  1 file changed, 107 insertions(+), 33 deletions(-)
> 
> diff --git a/www/manager6/node/ACME.js b/www/manager6/node/ACME.js
> index 21137b1a..5b71778a 100644
> --- a/www/manager6/node/ACME.js
> +++ b/www/manager6/node/ACME.js
> @@ -10,6 +10,14 @@ Ext.define('PVE.node.ACMEAccountCreate', {
>      url: '/cluster/acme/account',
>      showTaskViewer: true,
>      defaultExists: false,
> +    referenceHolder: true,
> +    onlineHelp: "sysadmin_certs_acme_account",
> +
> +    viewModel: {
> +	data: {
> +	    customDirectory: false,
> +	},
> +    },
>  
>      items: [
>  	{
> @@ -30,12 +38,17 @@ Ext.define('PVE.node.ACMEAccountCreate', {
>  	},
>  	{
>  	    xtype: 'proxmoxComboGrid',
> -	    name: 'directory',
> -	    allowBlank: false,
> +	    notFoundIsValid: true,
> +	    isFormField: false,
>  	    valueField: 'url',
>  	    displayField: 'name',
>  	    fieldLabel: gettext('ACME Directory'),
>  	    store: {
> +		listeners: {
> +		    'load': function() {
> +			this.add({ name: gettext("Custom"), url: '' });
> +		    },
> +		},
>  		autoLoad: true,
>  		fields: ['name', 'url'],
>  		idProperty: ['name'],
> @@ -43,10 +56,6 @@ Ext.define('PVE.node.ACMEAccountCreate', {
>  		    type: 'proxmox',
>  		    url: '/api2/json/cluster/acme/directories',
>  		},
> -		sorters: {
> -		    property: 'name',
> -		    direction: 'ASC',
> -		},
>  	    },
>  	    listConfig: {
>  		columns: [
> @@ -64,41 +73,93 @@ Ext.define('PVE.node.ACMEAccountCreate', {
>  	    },
>  	    listeners: {
>  		change: function(combogrid, value) {
> -		    var me = this;
> -		    if (!value) {
> -			return;
> -		    }
> +		    let me = this;
>  
> -		    var disp = me.up('window').down('#tos_url_display');
> -		    var field = me.up('window').down('#tos_url');
> -		    var checkbox = me.up('window').down('#tos_checkbox');
> +		    let vm = me.up('window').getViewModel();
> +		    let dirField = me.up('window').lookupReference('directoryInput');
> +		    let tosButton = me.up('window').lookupReference('queryTos');
>  
> -		    disp.setValue(gettext('Loading'));
> -		    field.setValue(undefined);
> -		    checkbox.setValue(undefined);
> -		    checkbox.setHidden(true);
> +		    let isCustom = combogrid.getSelection().get('name') === gettext("Custom");
> +		    vm.set('customDirectory', isCustom);
>  
> -		    Proxmox.Utils.API2Request({
> -			url: '/cluster/acme/meta',
> -			method: 'GET',
> -			params: {
> -			    directory: value,
> +		    dirField.setValue(value);
> +
> +		    if (!isCustom) {
> +			tosButton.click();
> +		    } else {
> +			me.up('window').clearToSFields();
> +		    }
> +		},
> +	    },
> +	},
> +	{
> +	    xtype: 'fieldcontainer',
> +	    layout: 'hbox',
> +	    fieldLabel: gettext('URL'),
> +	    bind: {
> +		hidden: '{!customDirectory}',
> +	    },
> +	    items: [
> +		{
> +		    xtype: 'proxmoxtextfield',
> +		    name: 'directory',
> +		    reference: 'directoryInput',
> +		    flex: 1,
> +		    allowBlank: false,
> +		    listeners: {
> +			change: function(textbox, value) {
> +			    let me = this;
> +			    me.up('window').clearToSFields();
>  			},
> -			success: function(response, opt) {
> -			    if (response.result.data.termsOfService) {
> -				field.setValue(response.result.data.termsOfService);
> -				disp.setValue(response.result.data.termsOfService);
> -				checkbox.setHidden(false);
> +		    },
> +		},
> +		{
> +		    xtype: 'proxmoxButton',
> +		    margin: '0 0 0 5',
> +		    reference: 'queryTos',
> +		    text: gettext('Query URL'),
> +		    listeners: {
> +			click: function(button) {
> +			    let me = this;
> +
> +			    let w = me.up('window');
> +			    let disp = w.down('#tos_url_display');
> +			    let field = w.down('#tos_url');
> +			    let checkbox = w.down('#tos_checkbox');
> +			    let value = w.lookupReference('directoryInput').getValue();
> +			    w.clearToSFields();
> +
> +			    if (!value) {
> +				return;
>  			    } else {
> -				disp.setValue(undefined);
> +				disp.setValue(gettext("Loading"));
>  			    }
> +
> +			    Proxmox.Utils.API2Request({
> +				url: '/cluster/acme/meta',
> +				method: 'GET',
> +				params: {
> +				    directory: value,
> +				},
> +				success: function(response, opt) {
> +				    if (response.result.data.termsOfService) {
> +					field.setValue(response.result.data.termsOfService);
> +					disp.setValue(response.result.data.termsOfService);
> +					checkbox.setHidden(false);
> +				    } else {
> +					checkbox.setValue(false);
> +					disp.setValue("No terms of service agreement required");
> +				    }
> +				},
> +				failure: function(response, opt) {
> +				    disp.setValue(undefined);
> +				    Ext.Msg.alert(gettext('Error'), response.htmlStatus);
> +				},
> +			    });
>  			},
> -			failure: function(response, opt) {
> -			    Ext.Msg.alert(gettext('Error'), response.htmlStatus);
> -			},
> -		    });
> +		    },
>  		},
> -	    },
> +	    ],
>  	},
>  	{
>  	    xtype: 'displayfield',
> @@ -125,6 +186,19 @@ Ext.define('PVE.node.ACMEAccountCreate', {
>  	},
>      ],
>  
> +    clearToSFields: function() {
> +	let me = this;
> +
> +	let disp = me.down('#tos_url_display');
> +	let field = me.down('#tos_url');
> +	let checkbox = me.down('#tos_checkbox');
> +
> +	disp.setValue("Terms of service not fetched yet");
> +	field.setValue(undefined);
> +	checkbox.setValue(undefined);
> +	checkbox.setHidden(true);
> +    },
> +
>  });
>  
>  Ext.define('PVE.node.ACMEAccountView', {

Tested this patch series in a Debian 12 container with Pebble 2.4
installed via the Debian Bookworm repositories.


The behavior of the combobox changed with this patch. The combobox now
shows an `x` to clear it, but doesn't actually clear the selection.
Instead it always sets it to `Custom`.


Account creation worked like a charm using a custom directory and EAB
(with the 2nd patch).
Other than the combobox issue above, consider this and the 2nd patch:

Tested-by: Mira Limbeck <m.limbeck at proxmox.com>