[pbs-devel] [PATCH proxmox-backup 11/23] ui: add (un)mount button to summary

[Lukas Wagner]

Same nit as in 10/23 regarding the use of `const`

On 9/15/23 08:54, Hannes Laimer wrote:
> And only try to load datastore information if the datastore is
> available.
> 
> Signed-off-by: Hannes Laimer <h.laimer at proxmox.com>
> ---
>   www/datastore/Summary.js | 88 ++++++++++++++++++++++++++++++++++++++--
>   1 file changed, 84 insertions(+), 4 deletions(-)
> 
> diff --git a/www/datastore/Summary.js b/www/datastore/Summary.js
> index d67e81cc..dfff6e7f 100644
> --- a/www/datastore/Summary.js
> +++ b/www/datastore/Summary.js
> @@ -218,8 +218,6 @@ Ext.define('PBS.DataStoreSummary', {
>   	padding: 5,
>       },
>   
> -    tbar: ['->', { xtype: 'proxmoxRRDTypeSelector' }],
> -
>       items: [
>   	{
>   	    xtype: 'container',
> @@ -292,7 +290,76 @@ Ext.define('PBS.DataStoreSummary', {
>   	    model: 'pve-rrd-datastore',
>   	});
>   
> -	me.callParent();
> +	me.statusStore = Ext.create('Proxmox.data.ObjectStore', {
> +	    url: `/api2/json/admin/datastore/${me.datastore}/status`,
> +	    interval: 1000,
> +	});
> +
> +	let unmountBtn = Ext.create('Ext.Button', {
> +	    text: gettext('Unmount'),
> +	    hidden: true,
> +	    handler: () => {
> +		Proxmox.Utils.API2Request({
> +		    url: `/admin/datastore/${me.datastore}/unmount`,
> +		    method: 'POST',
> +		    failure: function(response) {
> +			Ext.Msg.alert(gettext('Error'), response.htmlStatus);
> +		    },
> +		    success: function(response, options) {
> +			Ext.create('Proxmox.window.TaskViewer', {
> +			    upid: response.result.data,
> +			}).show();
> +		    },
> +		});
> +	    },
> +	});
> +
> +	let mountBtn = Ext.create('Ext.Button', {
> +	    text: gettext('Mount'),
> +	    hidden: true,
> +	    handler: () => {
> +		Proxmox.Utils.API2Request({
> +		    url: `/admin/datastore/${me.datastore}/mount`,
> +		    method: 'POST',
> +		    failure: function(response) {
> +			Ext.Msg.alert(gettext('Error'), response.htmlStatus);
> +		    },
> +		    success: function(response, options) {
> +			Ext.create('Proxmox.window.TaskViewer', {
> +			    upid: response.result.data,
> +			}).show();
> +		    },
> +		});
> +	    },
> +	});
> +
> +	Ext.apply(me, {
> +	    tbar: [unmountBtn, mountBtn, '->', { xtype: 'proxmoxRRDTypeSelector' }],
> +	});
> +
> +	me.mon(me.statusStore, 'load', (s, records, success) => {
> +	    if (!success) {
> +		me.down('pbsDataStoreInfo').fireEvent('deactivate');
> +		Proxmox.Utils.API2Request({
> +		    url: `/config/datastore/${me.datastore}`,
> +		    success: response => {
> +			if (!response.result.data['backing-device']) {
> +			    return;
> +			}
> +			const maintenanceString = response.result.data['maintenance-mode'];
> +			const [type, _msg] = PBS.Utils.parseMaintenanceMode(maintenanceString);
> +			const isUnplugged = type === 'unplugged';
> +
> +			unmountBtn.setDisabled(isUnplugged);
> +			mountBtn.setDisabled(!isUnplugged);
> +		    },
> +		});
> +	    } else {
> +		me.down('pbsDataStoreInfo').fireEvent('activate');
> +		unmountBtn.setDisabled(false);
> +		mountBtn.setDisabled(true);
> +	    }
> +	});
>   
>   	let sp = Ext.state.Manager.getProvider();
>   	me.mon(sp, 'statechange', function(provider, key, value) {
> @@ -305,11 +372,17 @@ Ext.define('PBS.DataStoreSummary', {
>   	    Proxmox.Utils.updateColumns(me);
>   	});
>   
> +	me.callParent();
> +
>   	Proxmox.Utils.API2Request({
>   	    url: `/config/datastore/${me.datastore}`,
>   	    waitMsgTarget: me.down('pbsDataStoreInfo'),
>   	    success: function(response) {
> -		let path = Ext.htmlEncode(response.result.data.path);
> +		let data = response.result.data;
> +		let path = Ext.htmlEncode(data.path);
> +		const removable = Object.prototype.hasOwnProperty.call(data, "backing-device");
> +		unmountBtn.setHidden(!removable);
> +		mountBtn.setHidden(!removable);
>   		me.down('pbsDataStoreInfo').setTitle(`${me.datastore} (${path})`);
>   		me.down('pbsDataStoreNotes').setNotes(response.result.data.comment);
>   	    },
> @@ -327,6 +400,13 @@ Ext.define('PBS.DataStoreSummary', {
>   	    let hasIoTicks = records?.some((rec) => rec?.data?.io_ticks !== undefined);
>   	    me.down('#ioDelayChart').setVisible(!success || hasIoTicks);
>   	}, undefined, { single: true });
> +	me.on('afterrender', () => {
> +	    me.statusStore.startUpdate();
> +	});
> +
> +	me.on('destroy', () => {
> +	    me.statusStore.stopUpdate();
> +	});
>   
>   	me.query('proxmoxRRDChart').forEach((chart) => {
>   	    chart.setStore(me.rrdstore);

-- 
- Lukas