Re: [pve-devel] [PATCH manager 2/2] ui: backup: protect button: use dynamic protect/unprotect text

[Thomas Lamprecht <t.lamprecht@proxmox.com>]

On 12.11.21 12:28, Fabian Ebner wrote:
> Suggested-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
> Signed-off-by: Fabian Ebner <f.ebner@proxmox.com>
> ---
>  www/manager6/grid/BackupView.js    | 22 +++++++++++++++++++++-
>  www/manager6/storage/BackupView.js | 24 +++++++++++++++++++++++-
>  2 files changed, 44 insertions(+), 2 deletions(-)
> 
> diff --git a/www/manager6/grid/BackupView.js b/www/manager6/grid/BackupView.js
> index c08fb67d..cbdac02e 100644
> --- a/www/manager6/grid/BackupView.js
> +++ b/www/manager6/grid/BackupView.js
> @@ -12,6 +12,7 @@ Ext.define('PVE.grid.BackupView', {
>  	let me = this;
>  
>  	me.down('#removeButton').updateStatus(record);
> +	me.down('#protectButton').updateStatus(record);
>      },
>  
>      initComponent: function() {
> @@ -314,8 +315,14 @@ Ext.define('PVE.grid.BackupView', {
>  		    },
>  		    {
>  			xtype: 'proxmoxButton',
> -			text: gettext('Change Protection'),
> +			text: gettext('Protect'),
> +			defaultText: gettext('Protect'),
> +			altText: gettext('Unprotect'),
>  			disabled: true,
> +			itemId: 'protectButton',
> +			updateStatus: function(record) {
> +			    this.setText(record?.data.protected ? this.altText : this.defaultText);
> +			},
>  			handler: function(button, event, record) {
>  			    const volid = record.data.volid;
>  			    const storage = storagesel.getValue();
> @@ -330,6 +337,19 @@ Ext.define('PVE.grid.BackupView', {
>  				success: (response) => reload(),
>  			    });
>  			},
> +			listeners: {
> +			    render: function(btn) {
> +				// HACK: calculate the max button width on first render to avoid
> +				// toolbar glitches
> +				let defSize = btn.getSize().width;
> +
> +				btn.setText(btn.altText);
> +				let altSize = btn.getSize().width;
> +
> +				btn.setText(btn.defaultText);
> +				btn.setSize({ width: altSize > defSize ? altSize : defSize });

with this we'd have that behavior three times (ct/vm resource/hw are the existing two),
so maybe we should move it out in a new separate, from proxmoxButton derived, component?