[pmg-devel] [PATCH pmg-gui 3/5] fix #4238: SpamInfoGrid: enable sorting & add colors for spam score

[Dominik Csapak <d.csapak@proxmox.com>]

sorting the matching spam rules, e.g. by score, makes it easier to see
which rules have more weight in determining spam.

Additionally, color code the scores with colors akin to the rationale
in commit:
365f84c ("quarantines: color code deliver and delete buttons")

(red for positive spam scores, blue for negative ones)

and increase the font-weight for large spamscore contributing rules.

i chose a different blue tone that is more muted than what we use in
'info-blue' but is different from both the 'hover' color and the
'selected' color

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
while the bug mentions that colors are problematic, there are not enough
font-weights to properly convey what we want to show here, so i added
colors with the same rationale we already used for the deliver/delete
buttons

 js/SpamInfoGrid.js | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/js/SpamInfoGrid.js b/js/SpamInfoGrid.js
index f7ee2b2..c9777d7 100644
--- a/js/SpamInfoGrid.js
+++ b/js/SpamInfoGrid.js
@@ -2,8 +2,6 @@ Ext.define('PMG.grid.SpamInfoGrid', {
     extend: 'Ext.grid.GridPanel',
     xtype: 'pmgSpamInfoGrid',
 
-    hideHeaders: true,
-
     store: {
 	autoDestroy: true,
 	fields: ['desc', 'name', { type: 'number', name: 'score' }],
@@ -45,6 +43,12 @@ Ext.define('PMG.grid.SpamInfoGrid', {
 	    text: gettext('Score'),
 	    dataIndex: 'score',
 	    align: 'right',
+	    renderer: function(value, metaData) {
+		let color = value < 0 ? '#d7e9f6' : value > 0 ? '#f3d6d7' : '';
+		let fontWeight = value >= 3 ? '1000' : value >= 1.5 ? '600' : '';
+		metaData.tdStyle = `background-color: ${color}; font-weight: ${fontWeight};`;
+		return value;
+	    },
 	    summaryType: 'sum',
 	    summaryRenderer: function(value, summaryData, dataIndex, metaData) {
 		return Ext.util.Format.round(value, 5);
-- 
2.30.2