From fe290387a6008be9633712230d85699efc8f00c3 Mon Sep 17 00:00:00 2001
From: Stephanie Leary <stephanie.leary@equinoxoli.org>
Date: Fri, 17 Mar 2023 15:55:19 +0000
Subject: [PATCH] Clean up class name callback

Signed-off-by: Stephanie Leary <stephanie.leary@equinoxoli.org>
---
 .../src/app/share/grid/grid-body.component.html    |  2 +-
 .../src/eg2/src/app/share/grid/grid.component.html |  2 +-
 .../src/eg2/src/app/share/grid/grid.component.ts   | 19 +--------
 Open-ILS/src/eg2/src/app/share/grid/grid.ts        | 46 ++++++++++++++++++++++
 4 files changed, 50 insertions(+), 19 deletions(-)

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-body.component.html b/Open-ILS/src/eg2/src/app/share/grid/grid-body.component.html
index fa06fa9d3e..30ccaf6b50 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-body.component.html
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-body.component.html
@@ -45,7 +45,7 @@
     <!-- contextMenu applied to cells instead of rows so the position
          of the popover is close to the mouse.  As of writing, no way
          to position the popover at the mouse -->
-    <td role="cell" class="eg-grid-cell eg-grid-body-cell eg-grid-col-{{col.name}} eg-grid-type-{{col.datatype}}  {{context.cellClassCallback(row, col)}}"
+    <td role="cell" class="eg-grid-cell eg-grid-body-cell {{context.setClassNames(row, col)}}"
       [ngClass]="{'eg-grid-cell-overflow': context.overflowCells}"
       *ngFor="let col of context.columnSet.displayColumns()">
         <div class="eg-grid-cell-contents" (dblclick)="onRowDblClick(row)"
diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.component.html b/Open-ILS/src/eg2/src/app/share/grid/grid.component.html
index f1a7fb5ca0..7f7898e623 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.component.html
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.component.html
@@ -41,7 +41,7 @@
     </colgroup>
     <colgroup class="eg-grid-col-data">
       <col *ngFor="let col of context.columnSet.displayColumns()" 
-        class="eg-grid-col eg-grid-col-{{col.name}} eg-grid-type-{{col.datatype}} eg-grid-class-{{context.idlClass}} {{context.cellClassCallback(row, col)}}">
+        class="eg-grid-col {{context.setClassNames(row, col)}}">
     </colgroup>
     
     <thead class="eg-grid-header" #egGridStickyHeader [context]="context" [ngClass]="{'eg-grid-sticky-header' : context.stickyGridHeader}" role="rowgroup">  </thead>
diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.component.ts b/Open-ILS/src/eg2/src/app/share/grid/grid.component.ts
index 0f8dc55393..01ba30c957 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.component.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.component.ts
@@ -200,27 +200,12 @@ export class GridComponent implements OnInit, AfterViewInit, OnDestroy {
         if (this.pageSize) {
             this.context.pager.limit = this.pageSize;
         }
-
+        
         // TS doesn't seem to like: let foo = bar || () => '';
         this.context.rowClassCallback =
             this.rowClassCallback || function () { return ''; };
         this.context.cellClassCallback =
-            this.cellClassCallback ||
-            function (row: any, col: GridColumn) {
-                if (col.datatype === 'money') {
-                    // get raw value
-                    let val;
-                    if (col.path) {
-                        val = this.nestedItemFieldValue(row, col);
-                    } else if (col.name in row) {
-                        val = this.getObjectFieldValue(row, col.name);
-                    }
-                    if (Number(val) < 0) {
-                        return 'negative-money-amount';
-                    }
-                }
-                return '';
-            }
+            this.cellClassCallback || function () { return ''; };
 
         this.context.rowSelector.selectionChange.subscribe(
             keys => this.rowSelectionChange.emit(keys)
diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.ts b/Open-ILS/src/eg2/src/app/share/grid/grid.ts
index 6aeddab851..b7923047b0 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.ts
@@ -1353,6 +1353,52 @@ export class GridContext {
     columnHasTextGenerator(col: GridColumn): boolean {
         return this.cellTextGenerator && col.name in this.cellTextGenerator;
     }
+
+    setClassNames(row: any, col: GridColumn): string {
+        /* set initial classes from specific grids' callbacks */
+        const classes = [this.cellClassCallback(row, col)];
+
+        /* Base classes */
+        if (col.datatype)
+            classes.push('eg-grid-type-'+col.datatype);
+        if (col.name)
+            classes.push('eg-grid-col-'+col.name);
+        if (col.idlClass)
+            classes.push('eg-grid-class-'+col.idlClass);
+        if (col.path)
+            classes.push('eg-grid-path-'+col.path.replace('.', '-'));
+        if (this.overflowCells)
+            classes.push('eg-grid-cell-overflow');
+        
+        /* Type-based formats */
+        if (col.datatype.endsWith('count'))
+            classes.push('numeric');
+
+        switch (col.datatype) {
+            case 'money':
+                // get raw value
+                let val;
+                if (col.path) {
+                    val = this.nestedItemFieldValue(row, col);
+                } else if (col.name in row) {
+                    val = this.getObjectFieldValue(row, col.name);
+                }
+                if (Number(val) < 0) {
+                    classes.push('negative-money-amount');
+                }
+                // don't break
+            case 'id':
+            case 'number':
+            case 'money':
+                classes.push('numeric');
+                break;
+            case 'callnumber':
+            case 'barcode':
+                classes.push('alphanumeric');
+        }
+
+        return classes.join(' ');
+    }
 }
 
 
-- 
2.11.0