fix #4238: spam info grid: enable sorting & add colors for spam score

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>

diff --git a/js/SpamInfoGrid.js b/js/SpamInfoGrid.js
index f7ee2b2018cbe903286482e69f95f4768db5f84c..c9777d746ceabc0aa37a0ba0ef9f77faf843f55d 100644 (file)
--- 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);