From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id 8FAB1945C0 for ; Wed, 21 Feb 2024 19:31:11 +0100 (CET) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id 704861D0A2 for ; Wed, 21 Feb 2024 19:31:11 +0100 (CET) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [94.136.29.106]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits) server-digest SHA256) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS for ; Wed, 21 Feb 2024 19:31:10 +0100 (CET) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 31D8043FA5 for ; Wed, 21 Feb 2024 19:31:10 +0100 (CET) Message-ID: <8d4b2f87-1075-4e99-9809-b0c3499ab5e5@proxmox.com> Date: Wed, 21 Feb 2024 19:31:08 +0100 MIME-Version: 1.0 User-Agent: Mozilla Thunderbird Beta From: Thomas Lamprecht To: Dominik Csapak , pmg-devel@lists.proxmox.com References: <20240221122439.1281024-1-d.csapak@proxmox.com> <20240221122439.1281024-14-d.csapak@proxmox.com> Content-Language: en-GB, de-AT Autocrypt: addr=t.lamprecht@proxmox.com; keydata= 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 DrEx In-Reply-To: <20240221122439.1281024-14-d.csapak@proxmox.com> Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 7bit X-SPAM-LEVEL: Spam detection results: 0 AWL -0.057 Adjusted score from AWL reputation of From: address BAYES_00 -1.9 Bayes spam probability is 0 to 1% DMARC_MISSING 0.1 Missing DMARC policy KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record T_SCC_BODY_TEXT_LINE -0.01 - URIBL_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to URIBL was blocked. See http://wiki.apache.org/spamassassin/DnsBlocklists#dnsbl-block for more information. [defines.mk] Subject: Re: [pmg-devel] [PATCH pmg-gui v2 2/2] rules/objects: add mode selector dropdown X-BeenThere: pmg-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox Mail Gateway development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Wed, 21 Feb 2024 18:31:11 -0000 Am 21/02/2024 um 13:24 schrieb Dominik Csapak: > for objects and object types in rules. We add a simple dropdown for the > 'and' and 'invert' flags, to be somewhat consistent with the > notification matchers from pve and to make the wording more clear than > simple and/invert. > > For What matches add a special warning hint, since that behaves a bit > special because of the mail parts. > > Signed-off-by: Dominik Csapak > --- > js/Makefile | 1 + > js/ObjectGroup.js | 64 ++++++++++++++++++++++++++++++++-- > js/ObjectGroupConfiguration.js | 4 +++ > js/RuleInfo.js | 44 +++++++++++++++++++++++ > js/form/ModeSelector.js | 11 ++++++ > 5 files changed, 122 insertions(+), 2 deletions(-) > create mode 100644 js/form/ModeSelector.js > > diff --git a/js/Makefile b/js/Makefile > index 78f2b57..4267092 100644 > --- a/js/Makefile > +++ b/js/Makefile > @@ -2,6 +2,7 @@ include ../defines.mk > > JSSRC= \ > Utils.js \ > + form/ModeSelector.js \ Please codify in the file and class name which mode this is for, as of now the name is rather overly generic. Something like "MatchModeSelector" would be already better IMO. > FilterProxy.js \ > LoginView.js \ > RoleSelector.js \ > diff --git a/js/ObjectGroup.js b/js/ObjectGroup.js > index 2223ffa..b91bf97 100644 > --- a/js/ObjectGroup.js > +++ b/js/ObjectGroup.js > @@ -10,6 +10,7 @@ Ext.define('PMG.ObjectGroup', { > showDirection: false, // only important for SMTP Whitelist > > ogdata: undefined, > + oclass: undefined, not a fan of those needlessly abbreviated config keys, this, and the existing one, just makes the code harder to read. > > emptyText: gettext('Please select an object.'), > > @@ -32,10 +33,14 @@ Ext.define('PMG.ObjectGroup', { > setObjectInfo: function(ogdata) { > let me = this; > > + let mode = ogdata.invert ? 'not' : ''; > + mode += ogdata.and ? 'all' : 'any'; > + > me.ogdata = ogdata; > > if (me.ogdata === undefined) { > me.down('#oginfo').update(me.emptyText); > + me.down('#modeBox').setHidden(true); > } else { > let html = '' + Ext.String.htmlEncode(me.ogdata.name) + ''; > html += "

"; > @@ -43,6 +48,12 @@ Ext.define('PMG.ObjectGroup', { > > me.down('#oginfo').update(html); > me.down('#ogdata').setHidden(false); > + let modeSelector = me.down('#modeSelector'); > + modeSelector.suspendEvents(); > + me.down('#modeSelector').setValue(mode); > + modeSelector.resumeEvents(); > + me.down('#modeBox').setHidden(false); > + me.down('#whatWarning').setHidden(me.oclass !== 'what'); > } > }, > > @@ -205,13 +216,62 @@ Ext.define('PMG.ObjectGroup', { > me.dockedItems.push({ > dock: 'top', > border: 1, > - layout: 'anchor', > + layout: 'hbox', > hidden: !!me.hideGroupInfo, > itemId: 'ogdata', > items: [ > + { > + xtype: 'container', > + itemId: 'modeBox', > + hidden: true, > + width: 220, > + padding: 10, > + layout: { > + type: 'vbox', > + align: 'stretch', > + }, > + items: [ > + { > + xtype: 'box', > + html: `${gettext("Match if")}`, > + }, > + { > + xtype: 'pmgModeSelector', > + itemId: 'modeSelector', > + padding: '10 0 0 0', > + listeners: { > + change: function(_field, value) { > + let invert = value.startsWith('not'); > + let and = value.endsWith('all'); > + > + let url = `${me.baseurl}/config`; nit: I'd rather avoid the extra variable here, just an inline: url: `${me.baseurl}/config`, > + > + Proxmox.Utils.API2Request({ > + url, > + method: 'PUT', > + params: { > + and: and ? 1 : 0, > + invert: invert ? 1 : 0, nit: while the separate variables have IMO a value here, the ternary could be used on assignment to and/invert already, then one could just use `param: { and, invert }` here (maybe not in a single line) > + }, > + success: function() { > + me.fireEvent('modeUpdate', me); > + }, tiny nit: could be an arrow fn: success: () => me.fireEvent('modeUpdate', me), > + }); > + }, > + }, > + }, > + { > + xtype: 'displayfield', > + itemId: 'whatWarning', > + hidden: true, > + value: gettext("Caution: What Objects match per mail part, so be careful with any option besides 'Any matches'."), Hmm, this is a bit hard to word better, but maybe something slightly adapted like: "Caution: 'What Objects' match each mail part separately, so be careful with any option besides 'Any matches'." Also, we could hide this is 'Any matches' is selected, and making it span over all columns would make it look better too. Maybe in some bottom docked bar, as otherwise it can flow over the description. btw. why does the left store reloads after every match selection change? Maybe an explicit reload button there (simple icon without text) could be better for that? > + userCls: 'pmx-hint', > + }, > + ], > + }, > { > xtype: 'component', > - anchor: '100%', > + flex: 1, > itemId: 'oginfo', > style: { 'white-space': 'pre' }, > padding: 10, > diff --git a/js/ObjectGroupConfiguration.js b/js/ObjectGroupConfiguration.js > index 1d72851..f59f5ed 100644 > --- a/js/ObjectGroupConfiguration.js > +++ b/js/ObjectGroupConfiguration.js > @@ -30,6 +30,7 @@ Ext.define('PMG.ObjectGroupConfiguration', { > > var right = Ext.create('PMG.ObjectGroup', { > otype_list: me.otype_list, > + oclass: me.ogclass, > border: false, > region: 'center', > listeners: { > @@ -40,6 +41,9 @@ Ext.define('PMG.ObjectGroupConfiguration', { > left.run_editor(); > } > }, > + modeUpdate: function() { > + left.reload(); > + }, nit, could be an arrow fn: modeUpdate: () => left.reload(), > }, > }); > > diff --git a/js/RuleInfo.js b/js/RuleInfo.js > index c29c0ca..d53c1c5 100644 > --- a/js/RuleInfo.js > +++ b/js/RuleInfo.js > @@ -120,6 +120,8 @@ Ext.define('PMG.RuleInfo', { > name: oc, > oclass: oc, > type: true, > + invert: ruledata[`${oc}-invert`], > + and: ruledata[`${oc}-and`], > leaf: false, > expanded: true, > expandable: false, > @@ -162,6 +164,25 @@ Ext.define('PMG.RuleInfo', { > return true; > }, > > + updateMode: function(field, value) { > + let me = this; > + let vm = me.getViewModel(); > + let oclass = field.getWidgetRecord().data.oclass; > + > + let params = {}; > + params[`${oclass}-invert`] = value.startsWith('not') ? 1 : 0; > + params[`${oclass}-and`] = value.endsWith('all') ? 1 : 0; > + > + Proxmox.Utils.API2Request({ > + url: `${vm.get('baseurl')}/config`, > + method: 'PUT', > + params, > + success: function() { > + me.reload(); > + }, nit, could be an arrow fn: success: () => me.reload(), > + }); > + }, > + > control: { > 'treepanel[reference=usedobjects]': { > drop: 'addDrop', > @@ -169,6 +190,9 @@ Ext.define('PMG.RuleInfo', { > 'tabpanel[reference=availobjects] > grid': { > drop: 'removeDrop', > }, > + 'pmgModeSelector': { > + change: 'updateMode', > + }, > }, > }, > > @@ -311,6 +335,26 @@ Ext.define('PMG.RuleInfo', { > }, > flex: 1, > }, > + { > + header: gettext('Match if'), > + xtype: 'widgetcolumn', > + width: 200, > + widget: { > + xtype: 'pmgModeSelector', > + }, > + onWidgetAttach: function(col, widget, rec) { > + if (rec.data.type && rec.data.oclass !== 'action') { > + let mode = rec.data.invert ? 'not' : ''; > + mode += rec.data.and ? 'all' : 'any'; > + widget.suspendEvents(); > + widget.setValue(mode); > + widget.resumeEvents(); > + widget.setHidden(false); > + } else { > + widget.setHidden(true); > + } > + }, > + }, > { > text: '', > xtype: 'actioncolumn',