[pve-devel] [PATCH widget-toolkit] node/ServiceView: fix #5611: hiding the non-installed services

[pve-devel] [PATCH widget-toolkit] node/ServiceView: fix #5611: hiding the non-installed services

[Daniel Herzig]

This patch adds a filter to identify services, which are reported as
'not-found' by the api. By default they will not be shown in the UI
anymore, but visibility can still be toggled using a new checkbox.

Signed-off-by: Daniel Herzig <d.herzig@proxmox.com>
---
 src/node/ServiceView.js | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)

diff --git a/src/node/ServiceView.js b/src/node/ServiceView.js
index 19cfc18..f1c2e5f 100644
--- a/src/node/ServiceView.js
+++ b/src/node/ServiceView.js
@@ -29,6 +29,10 @@ Ext.define('Proxmox.node.ServiceView', {
 	    },
 	});
 
+	let hide_not_installed = function(record) {
+	    return record.get('unit-state') !== 'not-found';
+	};
+
 	let store = Ext.create('Proxmox.data.DiffStore', {
 	    rstore: rstore,
 	    sortAfterUpdate: true,
@@ -38,6 +42,24 @@ Ext.define('Proxmox.node.ServiceView', {
 		    direction: 'ASC',
 		},
 	    ],
+	    filters: [
+		hide_not_installed,
+	    ],
+	});
+
+	let unHideCB = Ext.create('Ext.form.field.Checkbox', {
+	    boxLabel: gettext('Show non-installed services'),
+	    value: false,
+	    boxLabelAlign: 'before',
+	    listeners: {
+		change: function(_cb, value) {
+		    if (value) {
+			store.clearFilter();
+		    } else {
+			store.addFilter([hide_not_installed]);
+		    }
+		},
+	    },
 	});
 
 	let view_service_log = function() {
@@ -166,6 +188,8 @@ Ext.define('Proxmox.node.ServiceView', {
 		restart_btn,
 		'-',
 		syslog_btn,
+		'->',
+		unHideCB,
 	    ],
 	    columns: [
 		{
-- 
2.39.5



_______________________________________________
pve-devel mailing list
pve-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel

Re: [pve-devel] [PATCH widget-toolkit] node/ServiceView: fix #5611: hiding the non-installed services

[Thomas Lamprecht]

Am 06/11/2024 um 12:37 schrieb Daniel Herzig:
> This patch adds a filter to identify services, which are reported as
> 'not-found' by the api. By default they will not be shown in the UI
> anymore, but visibility can still be toggled using a new checkbox.
> 
> Signed-off-by: Daniel Herzig <d.herzig@proxmox.com>
> ---
>  src/node/ServiceView.js | 24 ++++++++++++++++++++++++
>  1 file changed, 24 insertions(+)
> 
> diff --git a/src/node/ServiceView.js b/src/node/ServiceView.js
> index 19cfc18..f1c2e5f 100644
> --- a/src/node/ServiceView.js
> +++ b/src/node/ServiceView.js
> @@ -29,6 +29,10 @@ Ext.define('Proxmox.node.ServiceView', {
>  	    },
>  	});
>  
> +	let hide_not_installed = function(record) {
> +	    return record.get('unit-state') !== 'not-found';
> +	};

FWIW, you can use arrow functions for a conciser implementation here. Albeit
they are not always the right choice as `this` inside them refers to the
outer `this`, unlike in functions, but for such filter/map/...  closures they
normally work well and can be often slightly nicer to read.

Also, we favor camelCase for new code in the frontend, e.g.:

let filterInstalledOnly = record => record.get('unit-state') !== 'not-found';

> +
>  	let store = Ext.create('Proxmox.data.DiffStore', {
>  	    rstore: rstore,
>  	    sortAfterUpdate: true,
> @@ -38,6 +42,24 @@ Ext.define('Proxmox.node.ServiceView', {
>  		    direction: 'ASC',
>  		},
>  	    ],
> +	    filters: [
> +		hide_not_installed,
> +	    ],
> +	});
> +
> +	let unHideCB = Ext.create('Ext.form.field.Checkbox', {
> +	    boxLabel: gettext('Show non-installed services'),
> +	    value: false,

Negatives are not ideal for UX, so I'd reverse this, e.g. label it something
like 'Show only installed services' and default to true/checked and switch if/else
branch below.

> +	    boxLabelAlign: 'before',
> +	    listeners: {
> +		change: function(_cb, value) {
> +		    if (value) {
> +			store.clearFilter();
> +		    } else {
> +			store.addFilter([hide_not_installed]);
> +		    }
> +		},
> +	    },
>  	});
>  
>  	let view_service_log = function() {
> @@ -166,6 +188,8 @@ Ext.define('Proxmox.node.ServiceView', {
>  		restart_btn,
>  		'-',
>  		syslog_btn,
> +		'->',
> +		unHideCB,
>  	    ],
>  	    columns: [
>  		{



_______________________________________________
pve-devel mailing list
pve-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel